@speckle/ui-components 2.25.8 → 2.25.9
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/AvatarEditor-504f96fb.cjs +2 -0
- package/dist/{AvatarEditor-0f54d404.cjs.map → AvatarEditor-504f96fb.cjs.map} +1 -1
- package/dist/{AvatarEditor-9f1741f8.js → AvatarEditor-edb34575.js} +3 -5
- package/dist/{AvatarEditor-9f1741f8.js.map → AvatarEditor-edb34575.js.map} +1 -1
- package/dist/components/form/RadioGroup.vue.d.ts +9 -15
- package/dist/components/form/Range.vue.d.ts +19 -0
- package/dist/components/global/icon/Check.vue.d.ts +2 -0
- package/dist/components/layout/Disclosure.vue.d.ts +24 -2
- package/dist/components/layout/Menu.vue.d.ts +37 -262
- package/dist/composables/form/textInput.d.ts +15 -1
- package/dist/composables/layout/menu.d.ts +6 -0
- package/dist/helpers/common/components.d.ts +9 -0
- package/dist/helpers/layout/components.d.ts +4 -2
- package/dist/lib.cjs +1 -1
- package/dist/lib.cjs.map +1 -1
- package/dist/lib.d.ts +4 -3
- package/dist/lib.js +3644 -2917
- package/dist/lib.js.map +1 -1
- package/dist/style.css +1 -1
- package/eslint.config.mjs +1 -1
- package/package.json +3 -3
- package/dist/AvatarEditor-0f54d404.cjs +0 -2
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),n=require("@heroicons/vue/24/outline"),q=require("vue-advanced-cropper");require("vue-advanced-cropper/dist/style.css");const o=require("./lib.cjs"),c=require("vue-tippy");require("@heroicons/vue/20/solid");require("@speckle/shared");require("vee-validate");require("nanoid");require("@vueuse/core");require("@headlessui/vue");require("@heroicons/vue/24/solid");require("v3-infinite-loading");const B={class:"flex flex-col space-y-2"},F={class:"flex"},z={class:"flex mx-14 space-x-2"},D=e.defineComponent({__name:"AvatarEditor",props:{user:{},disabled:{type:Boolean},size:{}},emits:["cancel","save"],setup(v,{emit:p}){const m=p,u=v,i=e.ref(null),d=e.ref(null),a=e.ref(null),l=e.ref(null),s=e.computed(()=>{switch(u.size){case"xs":case"sm":case"lg":case"xl":return{width:64,height:64};case"xxl":case"3xl":return{width:140,height:140};case"editable":return{width:240,height:240};case"base":default:return{width:32,height:32}}}),h=t=>{l.value&&URL.revokeObjectURL(l.value),l.value=t},x=t=>{const r=t.files[0];r&&(a.value=r)},g=t=>{var r;return t?"border-primary":(r=a.value)!=null&&r.error?"border-danger":"border-outline-2"},C=()=>{var t;return(t=i.value)==null?void 0:t.rotate(-90)},w=()=>{var t;return(t=i.value)==null?void 0:t.rotate(90)},k=()=>{var t;return(t=i.value)==null?void 0:t.flip(1,0)},N=()=>{var t;return(t=i.value)==null?void 0:t.flip(0,1)},V=()=>{var t;return(t=d.value)==null?void 0:t.triggerPicker()},b=()=>{a.value=null,l.value=null},y=()=>{var r;const t=((r=i.value)==null?void 0:r.getResult().canvas.toDataURL("image/jpeg",.85))||null;m("save",t)};return e.onUnmounted(()=>{h(null)}),e.watch(()=>u.user.avatar,t=>{l.value=t||null},{immediate:!0}),e.watch(a,t=>{l.value=t!=null&&t.file&&!t.error?URL.createObjectURL(t.file):null},{deep:!0}),(t,r)=>(e.openBlock(),e.createElementBlock("div",B,[e.createElementVNode("div",F,[e.createElementVNode("div",{class:e.normalizeClass(["flex flex-col px-2 space-y-1",{invisible:!l.value}])},[e.withDirectives(e.createVNode(o.FormButton,{"icon-left":e.unref(n.ArrowUturnLeftIcon),"hide-text":"",color:"outline",onClick:C},null,8,["icon-left"]),[[e.unref(c.directive),"Rotate left"]]),e.withDirectives(e.createVNode(o.FormButton,{"icon-left":e.unref(n.ArrowUturnRightIcon),"hide-text":"",color:"outline",onClick:w},null,8,["icon-left"]),[[e.unref(c.directive),"Rotate right"]]),e.withDirectives(e.createVNode(o.FormButton,{"icon-left":e.unref(n.ArrowUpOnSquareIcon),"hide-text":"",color:"outline",onClick:N},null,8,["icon-left"]),[[e.unref(c.directive),"Flip vertically"]]),e.withDirectives(e.createVNode(o.FormButton,{"icon-left":e.unref(n.ArrowLeftOnRectangleIcon),"hide-text":"",color:"outline",onClick:k},null,8,["icon-left"]),[[e.unref(c.directive),"Flip horizontally"]])],2),l.value?(e.openBlock(),e.createBlock(e.unref(q.Cropper),{key:0,ref_key:"cropper",ref:i,class:"cropper",src:l.value,"stencil-props":{aspectRatio:1/1},canvas:s.value,style:e.normalizeStyle(`width: ${s.value.width}px; height: ${s.value.height}px`)},null,8,["src","canvas","style"])):e.createCommentVNode("",!0),e.createVNode(o.FormFileUploadZone,{ref_key:"uploadZone",ref:d,class:e.normalizeClass(["cropper flex items-center justify-center",{hidden:l.value}]),accept:"image/*","size-limit":5*1024*1024,onFilesSelected:x},{default:e.withCtx(({isDraggingFiles:f,activatorOn:R})=>[e.createElementVNode("div",e.mergeProps({class:["cursor-pointer text-center w-full h-full border-dashed border-2 rounded-md p-4 flex items-center justify-center text-sm text-foreground-2",[g(f)]]},e.toHandlers(R,!0))," Click here or drag and drop an image ",16)]),_:1},8,["class"]),e.createElementVNode("div",{class:e.normalizeClass(["flex flex-col px-2 space-y-1",{invisible:!l.value}])},[e.withDirectives(e.createVNode(o.FormButton,{"icon-left":e.unref(n.PhotoIcon),"hide-text":"",onClick:V},null,8,["icon-left"]),[[e.unref(c.directive),"Replace image"]]),e.withDirectives(e.createVNode(o.FormButton,{"icon-left":e.unref(n.XMarkIcon),"hide-text":"",color:"danger",onClick:b},null,8,["icon-left"]),[[e.unref(c.directive),"Remove"]])],2)]),e.createElementVNode("div",z,[r[3]||(r[3]=e.createElementVNode("div",{class:"grow"},null,-1)),e.createVNode(o.FormButton,{color:"outline",onClick:r[0]||(r[0]=f=>t.$emit("cancel"))},{default:e.withCtx(()=>r[1]||(r[1]=[e.createTextVNode("Close")])),_:1}),e.createVNode(o.FormButton,{disabled:t.disabled,onClick:y},{default:e.withCtx(()=>r[2]||(r[2]=[e.createTextVNode("Save")])),_:1},8,["disabled"])])]))}});exports.default=D;
|
|
2
|
+
//# sourceMappingURL=AvatarEditor-504f96fb.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarEditor-
|
|
1
|
+
{"version":3,"file":"AvatarEditor-504f96fb.cjs","sources":["../src/components/user/AvatarEditor.vue"],"sourcesContent":["<template>\n <div class=\"flex flex-col space-y-2\">\n <div class=\"flex\">\n <div class=\"flex flex-col px-2 space-y-1\" :class=\"{ invisible: !activeImageUrl }\">\n <FormButton\n v-tippy=\"'Rotate left'\"\n :icon-left=\"ArrowUturnLeftIcon\"\n hide-text\n color=\"outline\"\n @click=\"rotateLeft\"\n />\n <FormButton\n v-tippy=\"'Rotate right'\"\n :icon-left=\"ArrowUturnRightIcon\"\n hide-text\n color=\"outline\"\n @click=\"rotateRight\"\n />\n <FormButton\n v-tippy=\"'Flip vertically'\"\n :icon-left=\"ArrowUpOnSquareIcon\"\n hide-text\n color=\"outline\"\n @click=\"flipVertical\"\n />\n <FormButton\n v-tippy=\"'Flip horizontally'\"\n :icon-left=\"ArrowLeftOnRectangleIcon\"\n hide-text\n color=\"outline\"\n @click=\"flipHorizontal\"\n />\n </div>\n <Cropper\n v-if=\"activeImageUrl\"\n ref=\"cropper\"\n class=\"cropper\"\n :src=\"activeImageUrl\"\n :stencil-props=\"{\n aspectRatio: 1 / 1\n }\"\n :canvas=\"canvasSize\"\n :style=\"`width: ${canvasSize.width}px; height: ${canvasSize.height}px`\"\n />\n <FormFileUploadZone\n ref=\"uploadZone\"\n v-slot=\"{ isDraggingFiles, activatorOn }\"\n class=\"cropper flex items-center justify-center\"\n :class=\"{ hidden: activeImageUrl }\"\n accept=\"image/*\"\n :size-limit=\"5 * 1024 * 1024\"\n @files-selected=\"onFilesSelected\"\n >\n <div\n class=\"cursor-pointer text-center w-full h-full border-dashed border-2 rounded-md p-4 flex items-center justify-center text-sm text-foreground-2\"\n :class=\"[getDashedBorderClasses(isDraggingFiles)]\"\n v-on=\"activatorOn\"\n >\n Click here or drag and drop an image\n </div>\n </FormFileUploadZone>\n <div class=\"flex flex-col px-2 space-y-1\" :class=\"{ invisible: !activeImageUrl }\">\n <FormButton\n v-tippy=\"'Replace image'\"\n :icon-left=\"PhotoIcon\"\n hide-text\n @click=\"onReplace\"\n />\n <FormButton\n v-tippy=\"'Remove'\"\n :icon-left=\"XMarkIcon\"\n hide-text\n color=\"danger\"\n @click=\"onRemove\"\n />\n </div>\n </div>\n <div class=\"flex mx-14 space-x-2\">\n <div class=\"grow\" />\n <FormButton color=\"outline\" @click=\"$emit('cancel')\">Close</FormButton>\n <FormButton :disabled=\"disabled\" @click=\"onSave\">Save</FormButton>\n </div>\n </div>\n</template>\n<script setup lang=\"ts\">\nimport {\n ArrowUturnLeftIcon,\n ArrowUturnRightIcon,\n ArrowLeftOnRectangleIcon,\n ArrowUpOnSquareIcon,\n XMarkIcon,\n PhotoIcon\n} from '@heroicons/vue/24/outline'\nimport type { Nullable } from '@speckle/shared'\nimport { onUnmounted, ref, watch, computed } from 'vue'\nimport { Cropper } from 'vue-advanced-cropper'\nimport 'vue-advanced-cropper/dist/style.css'\nimport FormButton from '~~/src/components/form/Button.vue'\nimport FormFileUploadZone from '~~/src/components/form/file-upload/Zone.vue'\nimport type { UploadableFileItem } from '~~/src/composables/form/fileUpload'\nimport type { AvatarUser, UserAvatarSize } from '~~/src/composables/user/avatar'\nimport { directive as vTippy } from 'vue-tippy'\n\n/**\n * Always try to lazy load this, as it's quite heavy\n */\n\nconst emit = defineEmits<{\n (e: 'cancel'): void\n (e: 'save', val: Nullable<string>): void\n}>()\n\nconst props = defineProps<{\n user: AvatarUser\n disabled?: boolean\n size?: UserAvatarSize\n}>()\n\nconst cropper = ref(\n null as Nullable<{\n flip: (x: number, y: number) => void\n rotate: (angle: number) => void\n getResult: () => { canvas: HTMLCanvasElement }\n }>\n)\nconst uploadZone = ref(null as Nullable<{ triggerPicker: () => void }>)\nconst selectedUpload = ref(null as Nullable<UploadableFileItem>)\nconst activeImageUrl = ref(null as Nullable<string>)\n\nconst canvasSize = computed(() => {\n switch (props.size) {\n case 'xs':\n case 'sm':\n case 'lg':\n case 'xl':\n return { width: 64, height: 64 }\n case 'xxl':\n case '3xl':\n return { width: 140, height: 140 }\n case 'editable':\n return { width: 240, height: 240 }\n case 'base':\n default:\n return { width: 32, height: 32 }\n }\n})\n\nconst setNewActiveUrl = (url: Nullable<string>) => {\n if (activeImageUrl.value) {\n URL.revokeObjectURL(activeImageUrl.value)\n }\n\n activeImageUrl.value = url\n}\n\nconst onFilesSelected = (params: { files: UploadableFileItem[] }) => {\n const file = params.files[0]\n if (!file) return\n selectedUpload.value = file\n}\n\nconst getDashedBorderClasses = (isDraggingFiles: boolean) => {\n if (isDraggingFiles) return 'border-primary'\n if (selectedUpload.value?.error) return 'border-danger'\n\n return 'border-outline-2'\n}\n\nconst rotateLeft = () => cropper.value?.rotate(-90)\nconst rotateRight = () => cropper.value?.rotate(90)\nconst flipHorizontal = () => cropper.value?.flip(1, 0)\nconst flipVertical = () => cropper.value?.flip(0, 1)\n\nconst onReplace = () => uploadZone.value?.triggerPicker()\nconst onRemove = () => {\n selectedUpload.value = null\n activeImageUrl.value = null\n}\nconst onSave = () => {\n const newUrl = cropper.value?.getResult().canvas.toDataURL('image/jpeg', 0.85) || null\n emit('save', newUrl)\n}\n\nonUnmounted(() => {\n setNewActiveUrl(null)\n})\n\nwatch(\n () => props.user.avatar,\n (newAvatar) => {\n activeImageUrl.value = newAvatar || null\n },\n { immediate: true }\n)\n\nwatch(\n selectedUpload,\n (newUpload) => {\n activeImageUrl.value =\n newUpload?.file && !newUpload.error ? URL.createObjectURL(newUpload.file) : null\n },\n { deep: true }\n)\n</script>\n"],"names":["emit","__emit","props","__props","cropper","ref","uploadZone","selectedUpload","activeImageUrl","canvasSize","computed","setNewActiveUrl","url","onFilesSelected","params","file","getDashedBorderClasses","isDraggingFiles","_a","rotateLeft","rotateRight","flipHorizontal","flipVertical","onReplace","onRemove","onSave","newUrl","onUnmounted","watch","newAvatar","newUpload"],"mappings":"itBA2GA,MAAMA,EAAOC,EAKPC,EAAQC,EAMRC,EAAUC,EAAA,IACd,IAAA,EAMIC,EAAaD,MAAI,IAA+C,EAChEE,EAAiBF,MAAI,IAAoC,EACzDG,EAAiBH,MAAI,IAAwB,EAE7CI,EAAaC,EAAAA,SAAS,IAAM,CAChC,OAAQR,EAAM,KAAM,CAClB,IAAK,KACL,IAAK,KACL,IAAK,KACL,IAAK,KACH,MAAO,CAAE,MAAO,GAAI,OAAQ,EAAG,EACjC,IAAK,MACL,IAAK,MACH,MAAO,CAAE,MAAO,IAAK,OAAQ,GAAI,EACnC,IAAK,WACH,MAAO,CAAE,MAAO,IAAK,OAAQ,GAAI,EACnC,IAAK,OACL,QACE,MAAO,CAAE,MAAO,GAAI,OAAQ,EAAG,CACnC,CAAA,CACD,EAEKS,EAAmBC,GAA0B,CAC7CJ,EAAe,OACb,IAAA,gBAAgBA,EAAe,KAAK,EAG1CA,EAAe,MAAQI,CAAA,EAGnBC,EAAmBC,GAA4C,CAC7D,MAAAC,EAAOD,EAAO,MAAM,CAAC,EACtBC,IACLR,EAAe,MAAQQ,EAAA,EAGnBC,EAA0BC,GAA6B,OACvD,OAAAA,EAAwB,kBACxBC,EAAAX,EAAe,QAAf,MAAAW,EAAsB,MAAc,gBAEjC,kBAAA,EAGHC,EAAa,IAAA,OAAM,OAAAD,EAAAd,EAAQ,QAAR,YAAAc,EAAe,OAAO,MACzCE,EAAc,IAAA,OAAM,OAAAF,EAAAd,EAAQ,QAAR,YAAAc,EAAe,OAAO,KAC1CG,EAAiB,IAAA,OAAM,OAAAH,EAAAd,EAAQ,QAAR,YAAAc,EAAe,KAAK,EAAG,IAC9CI,EAAe,IAAA,OAAM,OAAAJ,EAAAd,EAAQ,QAAR,YAAAc,EAAe,KAAK,EAAG,IAE5CK,EAAY,IAAM,OAAA,OAAAL,EAAAZ,EAAW,QAAX,YAAAY,EAAkB,iBACpCM,EAAW,IAAM,CACrBjB,EAAe,MAAQ,KACvBC,EAAe,MAAQ,IAAA,EAEnBiB,EAAS,IAAM,OACb,MAAAC,IAASR,EAAAd,EAAQ,QAAR,YAAAc,EAAe,YAAY,OAAO,UAAU,aAAc,OAAS,KAClFlB,EAAK,OAAQ0B,CAAM,CAAA,EAGrBC,OAAAA,EAAAA,YAAY,IAAM,CAChBhB,EAAgB,IAAI,CAAA,CACrB,EAEDiB,EAAA,MACE,IAAM1B,EAAM,KAAK,OAChB2B,GAAc,CACbrB,EAAe,MAAQqB,GAAa,IACtC,EACA,CAAE,UAAW,EAAK,CAAA,EAGpBD,EAAA,MACErB,EACCuB,GAAc,CACEtB,EAAA,MACbsB,GAAA,MAAAA,EAAW,MAAQ,CAACA,EAAU,MAAQ,IAAI,gBAAgBA,EAAU,IAAI,EAAI,IAChF,EACA,CAAE,KAAM,EAAK,CAAA"}
|
|
@@ -4,17 +4,15 @@ import { Cropper as K } from "vue-advanced-cropper";
|
|
|
4
4
|
import "vue-advanced-cropper/dist/style.css";
|
|
5
5
|
import { FormButton as i, FormFileUploadZone as Q } from "./lib.js";
|
|
6
6
|
import { directive as s } from "vue-tippy";
|
|
7
|
-
import "lodash";
|
|
8
7
|
import "@heroicons/vue/20/solid";
|
|
9
8
|
import "@speckle/shared";
|
|
10
9
|
import "vee-validate";
|
|
11
10
|
import "nanoid";
|
|
12
11
|
import "@vueuse/core";
|
|
13
12
|
import "@headlessui/vue";
|
|
14
|
-
import "lodash-es";
|
|
15
13
|
import "@heroicons/vue/24/solid";
|
|
16
14
|
import "v3-infinite-loading";
|
|
17
|
-
const W = { class: "flex flex-col space-y-2" }, Y = { class: "flex" }, ee = { class: "flex mx-14 space-x-2" },
|
|
15
|
+
const W = { class: "flex flex-col space-y-2" }, Y = { class: "flex" }, ee = { class: "flex mx-14 space-x-2" }, ve = /* @__PURE__ */ j({
|
|
18
16
|
__name: "AvatarEditor",
|
|
19
17
|
props: {
|
|
20
18
|
user: {},
|
|
@@ -195,6 +193,6 @@ const W = { class: "flex flex-col space-y-2" }, Y = { class: "flex" }, ee = { cl
|
|
|
195
193
|
}
|
|
196
194
|
});
|
|
197
195
|
export {
|
|
198
|
-
|
|
196
|
+
ve as default
|
|
199
197
|
};
|
|
200
|
-
//# sourceMappingURL=AvatarEditor-
|
|
198
|
+
//# sourceMappingURL=AvatarEditor-edb34575.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarEditor-
|
|
1
|
+
{"version":3,"file":"AvatarEditor-edb34575.js","sources":["../src/components/user/AvatarEditor.vue"],"sourcesContent":["<template>\n <div class=\"flex flex-col space-y-2\">\n <div class=\"flex\">\n <div class=\"flex flex-col px-2 space-y-1\" :class=\"{ invisible: !activeImageUrl }\">\n <FormButton\n v-tippy=\"'Rotate left'\"\n :icon-left=\"ArrowUturnLeftIcon\"\n hide-text\n color=\"outline\"\n @click=\"rotateLeft\"\n />\n <FormButton\n v-tippy=\"'Rotate right'\"\n :icon-left=\"ArrowUturnRightIcon\"\n hide-text\n color=\"outline\"\n @click=\"rotateRight\"\n />\n <FormButton\n v-tippy=\"'Flip vertically'\"\n :icon-left=\"ArrowUpOnSquareIcon\"\n hide-text\n color=\"outline\"\n @click=\"flipVertical\"\n />\n <FormButton\n v-tippy=\"'Flip horizontally'\"\n :icon-left=\"ArrowLeftOnRectangleIcon\"\n hide-text\n color=\"outline\"\n @click=\"flipHorizontal\"\n />\n </div>\n <Cropper\n v-if=\"activeImageUrl\"\n ref=\"cropper\"\n class=\"cropper\"\n :src=\"activeImageUrl\"\n :stencil-props=\"{\n aspectRatio: 1 / 1\n }\"\n :canvas=\"canvasSize\"\n :style=\"`width: ${canvasSize.width}px; height: ${canvasSize.height}px`\"\n />\n <FormFileUploadZone\n ref=\"uploadZone\"\n v-slot=\"{ isDraggingFiles, activatorOn }\"\n class=\"cropper flex items-center justify-center\"\n :class=\"{ hidden: activeImageUrl }\"\n accept=\"image/*\"\n :size-limit=\"5 * 1024 * 1024\"\n @files-selected=\"onFilesSelected\"\n >\n <div\n class=\"cursor-pointer text-center w-full h-full border-dashed border-2 rounded-md p-4 flex items-center justify-center text-sm text-foreground-2\"\n :class=\"[getDashedBorderClasses(isDraggingFiles)]\"\n v-on=\"activatorOn\"\n >\n Click here or drag and drop an image\n </div>\n </FormFileUploadZone>\n <div class=\"flex flex-col px-2 space-y-1\" :class=\"{ invisible: !activeImageUrl }\">\n <FormButton\n v-tippy=\"'Replace image'\"\n :icon-left=\"PhotoIcon\"\n hide-text\n @click=\"onReplace\"\n />\n <FormButton\n v-tippy=\"'Remove'\"\n :icon-left=\"XMarkIcon\"\n hide-text\n color=\"danger\"\n @click=\"onRemove\"\n />\n </div>\n </div>\n <div class=\"flex mx-14 space-x-2\">\n <div class=\"grow\" />\n <FormButton color=\"outline\" @click=\"$emit('cancel')\">Close</FormButton>\n <FormButton :disabled=\"disabled\" @click=\"onSave\">Save</FormButton>\n </div>\n </div>\n</template>\n<script setup lang=\"ts\">\nimport {\n ArrowUturnLeftIcon,\n ArrowUturnRightIcon,\n ArrowLeftOnRectangleIcon,\n ArrowUpOnSquareIcon,\n XMarkIcon,\n PhotoIcon\n} from '@heroicons/vue/24/outline'\nimport type { Nullable } from '@speckle/shared'\nimport { onUnmounted, ref, watch, computed } from 'vue'\nimport { Cropper } from 'vue-advanced-cropper'\nimport 'vue-advanced-cropper/dist/style.css'\nimport FormButton from '~~/src/components/form/Button.vue'\nimport FormFileUploadZone from '~~/src/components/form/file-upload/Zone.vue'\nimport type { UploadableFileItem } from '~~/src/composables/form/fileUpload'\nimport type { AvatarUser, UserAvatarSize } from '~~/src/composables/user/avatar'\nimport { directive as vTippy } from 'vue-tippy'\n\n/**\n * Always try to lazy load this, as it's quite heavy\n */\n\nconst emit = defineEmits<{\n (e: 'cancel'): void\n (e: 'save', val: Nullable<string>): void\n}>()\n\nconst props = defineProps<{\n user: AvatarUser\n disabled?: boolean\n size?: UserAvatarSize\n}>()\n\nconst cropper = ref(\n null as Nullable<{\n flip: (x: number, y: number) => void\n rotate: (angle: number) => void\n getResult: () => { canvas: HTMLCanvasElement }\n }>\n)\nconst uploadZone = ref(null as Nullable<{ triggerPicker: () => void }>)\nconst selectedUpload = ref(null as Nullable<UploadableFileItem>)\nconst activeImageUrl = ref(null as Nullable<string>)\n\nconst canvasSize = computed(() => {\n switch (props.size) {\n case 'xs':\n case 'sm':\n case 'lg':\n case 'xl':\n return { width: 64, height: 64 }\n case 'xxl':\n case '3xl':\n return { width: 140, height: 140 }\n case 'editable':\n return { width: 240, height: 240 }\n case 'base':\n default:\n return { width: 32, height: 32 }\n }\n})\n\nconst setNewActiveUrl = (url: Nullable<string>) => {\n if (activeImageUrl.value) {\n URL.revokeObjectURL(activeImageUrl.value)\n }\n\n activeImageUrl.value = url\n}\n\nconst onFilesSelected = (params: { files: UploadableFileItem[] }) => {\n const file = params.files[0]\n if (!file) return\n selectedUpload.value = file\n}\n\nconst getDashedBorderClasses = (isDraggingFiles: boolean) => {\n if (isDraggingFiles) return 'border-primary'\n if (selectedUpload.value?.error) return 'border-danger'\n\n return 'border-outline-2'\n}\n\nconst rotateLeft = () => cropper.value?.rotate(-90)\nconst rotateRight = () => cropper.value?.rotate(90)\nconst flipHorizontal = () => cropper.value?.flip(1, 0)\nconst flipVertical = () => cropper.value?.flip(0, 1)\n\nconst onReplace = () => uploadZone.value?.triggerPicker()\nconst onRemove = () => {\n selectedUpload.value = null\n activeImageUrl.value = null\n}\nconst onSave = () => {\n const newUrl = cropper.value?.getResult().canvas.toDataURL('image/jpeg', 0.85) || null\n emit('save', newUrl)\n}\n\nonUnmounted(() => {\n setNewActiveUrl(null)\n})\n\nwatch(\n () => props.user.avatar,\n (newAvatar) => {\n activeImageUrl.value = newAvatar || null\n },\n { immediate: true }\n)\n\nwatch(\n selectedUpload,\n (newUpload) => {\n activeImageUrl.value =\n newUpload?.file && !newUpload.error ? URL.createObjectURL(newUpload.file) : null\n },\n { deep: true }\n)\n</script>\n"],"names":["emit","__emit","props","__props","cropper","ref","uploadZone","selectedUpload","activeImageUrl","canvasSize","computed","setNewActiveUrl","url","onFilesSelected","params","file","getDashedBorderClasses","isDraggingFiles","_a","rotateLeft","rotateRight","flipHorizontal","flipVertical","onReplace","onRemove","onSave","newUrl","onUnmounted","watch","newAvatar","newUpload"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA2GA,UAAMA,IAAOC,GAKPC,IAAQC,GAMRC,IAAUC;AAAA,MACd;AAAA,IAAA,GAMIC,IAAaD,EAAI,IAA+C,GAChEE,IAAiBF,EAAI,IAAoC,GACzDG,IAAiBH,EAAI,IAAwB,GAE7CI,IAAaC,EAAS,MAAM;AAChC,cAAQR,EAAM,MAAM;AAAA,QAClB,KAAK;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AACH,iBAAO,EAAE,OAAO,IAAI,QAAQ,GAAG;AAAA,QACjC,KAAK;AAAA,QACL,KAAK;AACH,iBAAO,EAAE,OAAO,KAAK,QAAQ,IAAI;AAAA,QACnC,KAAK;AACH,iBAAO,EAAE,OAAO,KAAK,QAAQ,IAAI;AAAA,QACnC,KAAK;AAAA,QACL;AACE,iBAAO,EAAE,OAAO,IAAI,QAAQ,GAAG;AAAA,MACnC;AAAA,IAAA,CACD,GAEKS,IAAkB,CAACC,MAA0B;AACjD,MAAIJ,EAAe,SACb,IAAA,gBAAgBA,EAAe,KAAK,GAG1CA,EAAe,QAAQI;AAAA,IAAA,GAGnBC,IAAkB,CAACC,MAA4C;AAC7D,YAAAC,IAAOD,EAAO,MAAM,CAAC;AAC3B,MAAKC,MACLR,EAAe,QAAQQ;AAAA,IAAA,GAGnBC,IAAyB,CAACC,MAA6B;;AACvD,aAAAA,IAAwB,oBACxBC,IAAAX,EAAe,UAAf,QAAAW,EAAsB,QAAc,kBAEjC;AAAA,IAAA,GAGHC,IAAa,MAAA;;AAAM,cAAAD,IAAAd,EAAQ,UAAR,gBAAAc,EAAe,OAAO;AAAA,OACzCE,IAAc,MAAA;;AAAM,cAAAF,IAAAd,EAAQ,UAAR,gBAAAc,EAAe,OAAO;AAAA,OAC1CG,IAAiB,MAAA;;AAAM,cAAAH,IAAAd,EAAQ,UAAR,gBAAAc,EAAe,KAAK,GAAG;AAAA,OAC9CI,IAAe,MAAA;;AAAM,cAAAJ,IAAAd,EAAQ,UAAR,gBAAAc,EAAe,KAAK,GAAG;AAAA,OAE5CK,IAAY,MAAM;;AAAA,cAAAL,IAAAZ,EAAW,UAAX,gBAAAY,EAAkB;AAAA,OACpCM,IAAW,MAAM;AACrB,MAAAjB,EAAe,QAAQ,MACvBC,EAAe,QAAQ;AAAA,IAAA,GAEnBiB,IAAS,MAAM;;AACb,YAAAC,MAASR,IAAAd,EAAQ,UAAR,gBAAAc,EAAe,YAAY,OAAO,UAAU,cAAc,UAAS;AAClF,MAAAlB,EAAK,QAAQ0B,CAAM;AAAA,IAAA;AAGrB,WAAAC,EAAY,MAAM;AAChB,MAAAhB,EAAgB,IAAI;AAAA,IAAA,CACrB,GAEDiB;AAAA,MACE,MAAM1B,EAAM,KAAK;AAAA,MACjB,CAAC2B,MAAc;AACb,QAAArB,EAAe,QAAQqB,KAAa;AAAA,MACtC;AAAA,MACA,EAAE,WAAW,GAAK;AAAA,IAAA,GAGpBD;AAAA,MACErB;AAAA,MACA,CAACuB,MAAc;AACE,QAAAtB,EAAA,QACbsB,KAAA,QAAAA,EAAW,QAAQ,CAACA,EAAU,QAAQ,IAAI,gBAAgBA,EAAU,IAAI,IAAI;AAAA,MAChF;AAAA,MACA,EAAE,MAAM,GAAK;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,27 +1,21 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { RuleExpression } from 'vee-validate';
|
|
2
|
+
import { FormRadioGroupItem } from '../../helpers/common/components';
|
|
2
3
|
declare const _default: <Value extends string>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
3
4
|
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
|
|
4
|
-
readonly "onUpdate:modelValue"?: ((
|
|
5
|
-
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue"> &
|
|
5
|
+
readonly "onUpdate:modelValue"?: ((v: Value) => any) | undefined;
|
|
6
|
+
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:modelValue"> & {
|
|
7
|
+
name?: string;
|
|
6
8
|
modelValue?: Value;
|
|
7
|
-
|
|
8
|
-
options: {
|
|
9
|
-
value: Value;
|
|
10
|
-
title: string;
|
|
11
|
-
subtitle?: string;
|
|
12
|
-
introduction?: string;
|
|
13
|
-
icon?: ConcreteComponent;
|
|
14
|
-
help?: string;
|
|
15
|
-
disabled?: boolean;
|
|
16
|
-
}[];
|
|
9
|
+
options: FormRadioGroupItem<Value>[];
|
|
17
10
|
disabled?: boolean;
|
|
18
11
|
isStacked?: boolean;
|
|
19
12
|
size?: "sm" | "base";
|
|
20
|
-
|
|
13
|
+
rules?: RuleExpression<Value>;
|
|
14
|
+
} & Partial<{}>> & import('vue').PublicProps;
|
|
21
15
|
expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
|
|
22
16
|
attrs: any;
|
|
23
17
|
slots: Partial<Record<Value, (_: {}) => any>>;
|
|
24
|
-
emit: (
|
|
18
|
+
emit: (e: "update:modelValue", v: Value) => void;
|
|
25
19
|
}>) => import('vue').VNode & {
|
|
26
20
|
__ctx?: Awaited<typeof __VLS_setup>;
|
|
27
21
|
};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
min: number;
|
|
3
|
+
max: number;
|
|
4
|
+
step: number;
|
|
5
|
+
name: string;
|
|
6
|
+
label: string;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
hideHeader?: boolean;
|
|
9
|
+
};
|
|
10
|
+
declare const currentValue: import('vue').ModelRef<number, string, number, number>;
|
|
11
|
+
type __VLS_PublicProps = {
|
|
12
|
+
modelValue?: typeof currentValue['value'];
|
|
13
|
+
} & __VLS_Props;
|
|
14
|
+
declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
15
|
+
"update:modelValue": (...args: any[]) => void;
|
|
16
|
+
}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
17
|
+
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
18
|
+
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
19
|
+
export default _default;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
|
|
2
|
+
export default _default;
|
|
@@ -1,24 +1,46 @@
|
|
|
1
1
|
import { PropAnyComponent } from '../../helpers/common/components';
|
|
2
2
|
type DisclosureColor = 'default' | 'danger' | 'success' | 'warning';
|
|
3
3
|
type __VLS_Props = {
|
|
4
|
-
title: string;
|
|
5
4
|
/**
|
|
6
5
|
* HeadlessUI icon component to use
|
|
7
6
|
*/
|
|
8
7
|
icon?: PropAnyComponent;
|
|
9
8
|
color?: DisclosureColor;
|
|
9
|
+
/**
|
|
10
|
+
* Whether to lazy load the panel contents only upon opening
|
|
11
|
+
*/
|
|
12
|
+
lazyLoad?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* If edit mode enabled - it will exit mode when user unfocuses
|
|
15
|
+
*/
|
|
16
|
+
exitEditModeOnBlur?: boolean;
|
|
10
17
|
};
|
|
18
|
+
type __VLS_PublicProps = {
|
|
19
|
+
'editTitle'?: boolean;
|
|
20
|
+
'title'?: string;
|
|
21
|
+
'open'?: boolean;
|
|
22
|
+
} & __VLS_Props;
|
|
11
23
|
declare function __VLS_template(): {
|
|
12
24
|
attrs: Partial<{}>;
|
|
13
25
|
slots: {
|
|
26
|
+
'title-actions'?(_: {}): any;
|
|
14
27
|
default?(_: {}): any;
|
|
15
28
|
};
|
|
16
29
|
refs: {};
|
|
17
30
|
rootEl: HTMLDivElement;
|
|
18
31
|
};
|
|
19
32
|
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
20
|
-
declare const __VLS_component: import('vue').DefineComponent<
|
|
33
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
34
|
+
"update:open": (value: boolean) => any;
|
|
35
|
+
"update:editTitle": (value: boolean) => any;
|
|
36
|
+
"update:title": (value: string) => any;
|
|
37
|
+
}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
38
|
+
"onUpdate:open"?: ((value: boolean) => any) | undefined;
|
|
39
|
+
"onUpdate:editTitle"?: ((value: boolean) => any) | undefined;
|
|
40
|
+
"onUpdate:title"?: ((value: string) => any) | undefined;
|
|
41
|
+
}>, {
|
|
21
42
|
color: DisclosureColor;
|
|
43
|
+
exitEditModeOnBlur: boolean;
|
|
22
44
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
23
45
|
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
24
46
|
export default _default;
|
|
@@ -1,275 +1,50 @@
|
|
|
1
1
|
import { HorizontalDirection } from '../../composables/common/window';
|
|
2
2
|
import { LayoutMenuItem } from '../../helpers/layout/components';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
3
|
+
declare const _default: <MenuIds extends string = string>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
4
|
+
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
|
|
5
|
+
readonly "onUpdate:open"?: ((val: boolean) => any) | undefined;
|
|
6
|
+
readonly onChosen?: ((val: {
|
|
7
|
+
event: MouseEvent;
|
|
8
|
+
item: LayoutMenuItem<MenuIds>;
|
|
9
|
+
}) => any) | undefined;
|
|
10
|
+
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onUpdate:open" | "onChosen"> & {
|
|
11
|
+
open?: boolean;
|
|
12
|
+
/**
|
|
13
|
+
* 2D array so that items can be grouped with dividers between them
|
|
14
|
+
*/
|
|
15
|
+
items: LayoutMenuItem<MenuIds>[][];
|
|
16
|
+
size?: "base" | "lg" | number;
|
|
17
|
+
menuId?: string;
|
|
18
|
+
/**
|
|
19
|
+
* Preferable menu position/directed. This can change depending on available space.
|
|
20
|
+
*/
|
|
21
|
+
menuPosition?: HorizontalDirection;
|
|
22
|
+
mountMenuOnBody?: boolean;
|
|
23
|
+
customMenuItemsClasses?: string[];
|
|
24
|
+
showTicks?: boolean | "right";
|
|
25
|
+
} & Partial<{}>> & import('vue').PublicProps;
|
|
26
|
+
expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
|
|
27
|
+
attrs: any;
|
|
19
28
|
slots: {
|
|
20
29
|
default?(_: {
|
|
21
30
|
toggle: () => void;
|
|
22
31
|
open: boolean;
|
|
23
32
|
}): any;
|
|
24
33
|
item?(_: {
|
|
25
|
-
item: LayoutMenuItem
|
|
34
|
+
item: LayoutMenuItem<MenuIds>;
|
|
26
35
|
}): any;
|
|
27
36
|
};
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
as: {
|
|
35
|
-
type: (ObjectConstructor | StringConstructor)[];
|
|
36
|
-
default: string;
|
|
37
|
-
};
|
|
38
|
-
id: {
|
|
39
|
-
type: StringConstructor;
|
|
40
|
-
default: () => string;
|
|
41
|
-
};
|
|
42
|
-
}>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
43
|
-
[key: string]: any;
|
|
44
|
-
}> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
45
|
-
[key: string]: any;
|
|
46
|
-
}>[] | null, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, Record<string, any>, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, {
|
|
47
|
-
id: string;
|
|
48
|
-
as: string | Record<string, any>;
|
|
49
|
-
disabled: boolean;
|
|
50
|
-
}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
|
|
51
|
-
P: {};
|
|
52
|
-
B: {};
|
|
53
|
-
D: {};
|
|
54
|
-
C: {};
|
|
55
|
-
M: {};
|
|
56
|
-
Defaults: {};
|
|
57
|
-
}, Readonly<import('vue').ExtractPropTypes<{
|
|
58
|
-
disabled: {
|
|
59
|
-
type: BooleanConstructor;
|
|
60
|
-
default: boolean;
|
|
61
|
-
};
|
|
62
|
-
as: {
|
|
63
|
-
type: (ObjectConstructor | StringConstructor)[];
|
|
64
|
-
default: string;
|
|
65
|
-
};
|
|
66
|
-
id: {
|
|
67
|
-
type: StringConstructor;
|
|
68
|
-
default: () => string;
|
|
69
|
-
};
|
|
70
|
-
}>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
71
|
-
[key: string]: any;
|
|
72
|
-
}> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
73
|
-
[key: string]: any;
|
|
74
|
-
}>[] | null, {}, {}, {}, {
|
|
75
|
-
id: string;
|
|
76
|
-
as: string | Record<string, any>;
|
|
77
|
-
disabled: boolean;
|
|
78
|
-
}> | null;
|
|
79
|
-
menuButtonWrapper: HTMLDivElement;
|
|
80
|
-
menuItems: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
|
|
81
|
-
as: {
|
|
82
|
-
type: (ObjectConstructor | StringConstructor)[];
|
|
83
|
-
default: string;
|
|
84
|
-
};
|
|
85
|
-
static: {
|
|
86
|
-
type: BooleanConstructor;
|
|
87
|
-
default: boolean;
|
|
88
|
-
};
|
|
89
|
-
unmount: {
|
|
90
|
-
type: BooleanConstructor;
|
|
91
|
-
default: boolean;
|
|
92
|
-
};
|
|
93
|
-
id: {
|
|
94
|
-
type: StringConstructor;
|
|
95
|
-
default: () => string;
|
|
96
|
-
};
|
|
97
|
-
}>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
98
|
-
[key: string]: any;
|
|
99
|
-
}> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
100
|
-
[key: string]: any;
|
|
101
|
-
}>[] | null, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, Record<string, any>, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, {
|
|
102
|
-
id: string;
|
|
103
|
-
as: string | Record<string, any>;
|
|
104
|
-
unmount: boolean;
|
|
105
|
-
static: boolean;
|
|
106
|
-
}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
|
|
107
|
-
P: {};
|
|
108
|
-
B: {};
|
|
109
|
-
D: {};
|
|
110
|
-
C: {};
|
|
111
|
-
M: {};
|
|
112
|
-
Defaults: {};
|
|
113
|
-
}, Readonly<import('vue').ExtractPropTypes<{
|
|
114
|
-
as: {
|
|
115
|
-
type: (ObjectConstructor | StringConstructor)[];
|
|
116
|
-
default: string;
|
|
117
|
-
};
|
|
118
|
-
static: {
|
|
119
|
-
type: BooleanConstructor;
|
|
120
|
-
default: boolean;
|
|
121
|
-
};
|
|
122
|
-
unmount: {
|
|
123
|
-
type: BooleanConstructor;
|
|
124
|
-
default: boolean;
|
|
125
|
-
};
|
|
126
|
-
id: {
|
|
127
|
-
type: StringConstructor;
|
|
128
|
-
default: () => string;
|
|
129
|
-
};
|
|
130
|
-
}>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
131
|
-
[key: string]: any;
|
|
132
|
-
}> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
133
|
-
[key: string]: any;
|
|
134
|
-
}>[] | null, {}, {}, {}, {
|
|
135
|
-
id: string;
|
|
136
|
-
as: string | Record<string, any>;
|
|
137
|
-
unmount: boolean;
|
|
138
|
-
static: boolean;
|
|
139
|
-
}> | null;
|
|
37
|
+
emit: {
|
|
38
|
+
(e: "update:open", val: boolean): void;
|
|
39
|
+
(e: "chosen", val: {
|
|
40
|
+
event: MouseEvent;
|
|
41
|
+
item: LayoutMenuItem<MenuIds>;
|
|
42
|
+
}): void;
|
|
140
43
|
};
|
|
141
|
-
|
|
44
|
+
}>) => import('vue').VNode & {
|
|
45
|
+
__ctx?: Awaited<typeof __VLS_setup>;
|
|
142
46
|
};
|
|
143
|
-
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
144
|
-
declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
145
|
-
"update:open": (val: boolean) => any;
|
|
146
|
-
chosen: (val: {
|
|
147
|
-
event: MouseEvent;
|
|
148
|
-
item: LayoutMenuItem<any>;
|
|
149
|
-
}) => any;
|
|
150
|
-
}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
151
|
-
"onUpdate:open"?: ((val: boolean) => any) | undefined;
|
|
152
|
-
onChosen?: ((val: {
|
|
153
|
-
event: MouseEvent;
|
|
154
|
-
item: LayoutMenuItem<any>;
|
|
155
|
-
}) => any) | undefined;
|
|
156
|
-
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
157
|
-
menuButton: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
|
|
158
|
-
disabled: {
|
|
159
|
-
type: BooleanConstructor;
|
|
160
|
-
default: boolean;
|
|
161
|
-
};
|
|
162
|
-
as: {
|
|
163
|
-
type: (ObjectConstructor | StringConstructor)[];
|
|
164
|
-
default: string;
|
|
165
|
-
};
|
|
166
|
-
id: {
|
|
167
|
-
type: StringConstructor;
|
|
168
|
-
default: () => string;
|
|
169
|
-
};
|
|
170
|
-
}>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
171
|
-
[key: string]: any;
|
|
172
|
-
}> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
173
|
-
[key: string]: any;
|
|
174
|
-
}>[] | null, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, Record<string, any>, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, {
|
|
175
|
-
id: string;
|
|
176
|
-
as: string | Record<string, any>;
|
|
177
|
-
disabled: boolean;
|
|
178
|
-
}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
|
|
179
|
-
P: {};
|
|
180
|
-
B: {};
|
|
181
|
-
D: {};
|
|
182
|
-
C: {};
|
|
183
|
-
M: {};
|
|
184
|
-
Defaults: {};
|
|
185
|
-
}, Readonly<import('vue').ExtractPropTypes<{
|
|
186
|
-
disabled: {
|
|
187
|
-
type: BooleanConstructor;
|
|
188
|
-
default: boolean;
|
|
189
|
-
};
|
|
190
|
-
as: {
|
|
191
|
-
type: (ObjectConstructor | StringConstructor)[];
|
|
192
|
-
default: string;
|
|
193
|
-
};
|
|
194
|
-
id: {
|
|
195
|
-
type: StringConstructor;
|
|
196
|
-
default: () => string;
|
|
197
|
-
};
|
|
198
|
-
}>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
199
|
-
[key: string]: any;
|
|
200
|
-
}> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
201
|
-
[key: string]: any;
|
|
202
|
-
}>[] | null, {}, {}, {}, {
|
|
203
|
-
id: string;
|
|
204
|
-
as: string | Record<string, any>;
|
|
205
|
-
disabled: boolean;
|
|
206
|
-
}> | null;
|
|
207
|
-
menuButtonWrapper: HTMLDivElement;
|
|
208
|
-
menuItems: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
|
|
209
|
-
as: {
|
|
210
|
-
type: (ObjectConstructor | StringConstructor)[];
|
|
211
|
-
default: string;
|
|
212
|
-
};
|
|
213
|
-
static: {
|
|
214
|
-
type: BooleanConstructor;
|
|
215
|
-
default: boolean;
|
|
216
|
-
};
|
|
217
|
-
unmount: {
|
|
218
|
-
type: BooleanConstructor;
|
|
219
|
-
default: boolean;
|
|
220
|
-
};
|
|
221
|
-
id: {
|
|
222
|
-
type: StringConstructor;
|
|
223
|
-
default: () => string;
|
|
224
|
-
};
|
|
225
|
-
}>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
226
|
-
[key: string]: any;
|
|
227
|
-
}> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
228
|
-
[key: string]: any;
|
|
229
|
-
}>[] | null, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, Record<string, any>, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, {
|
|
230
|
-
id: string;
|
|
231
|
-
as: string | Record<string, any>;
|
|
232
|
-
unmount: boolean;
|
|
233
|
-
static: boolean;
|
|
234
|
-
}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
|
|
235
|
-
P: {};
|
|
236
|
-
B: {};
|
|
237
|
-
D: {};
|
|
238
|
-
C: {};
|
|
239
|
-
M: {};
|
|
240
|
-
Defaults: {};
|
|
241
|
-
}, Readonly<import('vue').ExtractPropTypes<{
|
|
242
|
-
as: {
|
|
243
|
-
type: (ObjectConstructor | StringConstructor)[];
|
|
244
|
-
default: string;
|
|
245
|
-
};
|
|
246
|
-
static: {
|
|
247
|
-
type: BooleanConstructor;
|
|
248
|
-
default: boolean;
|
|
249
|
-
};
|
|
250
|
-
unmount: {
|
|
251
|
-
type: BooleanConstructor;
|
|
252
|
-
default: boolean;
|
|
253
|
-
};
|
|
254
|
-
id: {
|
|
255
|
-
type: StringConstructor;
|
|
256
|
-
default: () => string;
|
|
257
|
-
};
|
|
258
|
-
}>>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
259
|
-
[key: string]: any;
|
|
260
|
-
}> | import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
|
|
261
|
-
[key: string]: any;
|
|
262
|
-
}>[] | null, {}, {}, {}, {
|
|
263
|
-
id: string;
|
|
264
|
-
as: string | Record<string, any>;
|
|
265
|
-
unmount: boolean;
|
|
266
|
-
static: boolean;
|
|
267
|
-
}> | null;
|
|
268
|
-
}, any>;
|
|
269
|
-
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
270
47
|
export default _default;
|
|
271
|
-
type
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
};
|
|
275
|
-
};
|
|
48
|
+
type __VLS_PrettifyLocal<T> = {
|
|
49
|
+
[K in keyof T]: T[K];
|
|
50
|
+
} & {};
|
|
@@ -2,7 +2,7 @@ import { RuleExpression } from 'vee-validate';
|
|
|
2
2
|
import { Ref, ToRefs } from 'vue';
|
|
3
3
|
import { MaybeNullOrUndefined, Nullable } from '../../../../shared/dist/esm/index';
|
|
4
4
|
import { LabelPosition } from './input';
|
|
5
|
-
export type InputColor = 'page' | 'foundation' | 'transparent';
|
|
5
|
+
export type InputColor = 'page' | 'foundation' | 'transparent' | 'fully-transparent';
|
|
6
6
|
/**
|
|
7
7
|
* Common setup for text input & textarea fields
|
|
8
8
|
*/
|
|
@@ -69,6 +69,12 @@ export declare function useDebouncedTextInput(params?: {
|
|
|
69
69
|
* Default: 1000 (ms)
|
|
70
70
|
*/
|
|
71
71
|
debouncedBy?: number;
|
|
72
|
+
/**
|
|
73
|
+
* If enabled, value will only change on submit/enter, and just typing in values will never
|
|
74
|
+
* register.
|
|
75
|
+
* Default: false
|
|
76
|
+
*/
|
|
77
|
+
disableDebouncedInput?: boolean;
|
|
72
78
|
/**
|
|
73
79
|
* Optionally pass in the model ref that should be used as the source of truth
|
|
74
80
|
*/
|
|
@@ -91,6 +97,10 @@ export declare function useDebouncedTextInput(params?: {
|
|
|
91
97
|
* Set to true if you want to see debug output for how events fire and are handled
|
|
92
98
|
*/
|
|
93
99
|
debug?: boolean | ((...logArgs: unknown[]) => void);
|
|
100
|
+
/**
|
|
101
|
+
* Callback function that gets called when a new value is actually written to the model
|
|
102
|
+
*/
|
|
103
|
+
onWrite?: (val: string) => void;
|
|
94
104
|
}): {
|
|
95
105
|
on: {
|
|
96
106
|
[x: string]: ((val: string | InputEvent) => void) | ((e: KeyboardEvent) => void);
|
|
@@ -102,5 +112,9 @@ export declare function useDebouncedTextInput(params?: {
|
|
|
102
112
|
modelValue: string;
|
|
103
113
|
}>;
|
|
104
114
|
value: Ref<MaybeNullOrUndefined<string>, MaybeNullOrUndefined<string>>;
|
|
115
|
+
/**
|
|
116
|
+
* Force sync internal state from the source of truth
|
|
117
|
+
*/
|
|
118
|
+
syncFromValue: () => void;
|
|
105
119
|
};
|
|
106
120
|
export {};
|
|
@@ -5,6 +5,8 @@ import { HorizontalDirection } from '../common/window';
|
|
|
5
5
|
* Simplifies correctly and responsively positioning (dropdown/right-click/etc) menus so that they open
|
|
6
6
|
* to the correct direction, can change directions if there's not enough space or even go full screen
|
|
7
7
|
* if there's no space in either direction.
|
|
8
|
+
*
|
|
9
|
+
* Also supports updating vertical position, incase the menu would clip w/ the bottom of the screen
|
|
8
10
|
*/
|
|
9
11
|
export declare const useBodyMountedMenuPositioning: (params: {
|
|
10
12
|
/**
|
|
@@ -20,6 +22,10 @@ export declare const useBodyMountedMenuPositioning: (params: {
|
|
|
20
22
|
* that just uses the button width.
|
|
21
23
|
*/
|
|
22
24
|
menuWidth: ComputedRef<number | undefined>;
|
|
25
|
+
/**
|
|
26
|
+
* Optionally also control target menu height.
|
|
27
|
+
*/
|
|
28
|
+
menuHeight?: ComputedRef<number | undefined>;
|
|
23
29
|
}) => {
|
|
24
30
|
menuStyle: ComputedRef<CSSProperties>;
|
|
25
31
|
};
|
|
@@ -19,3 +19,12 @@ export type AlertAction = {
|
|
|
19
19
|
externalUrl?: boolean;
|
|
20
20
|
disabled?: boolean;
|
|
21
21
|
};
|
|
22
|
+
export type FormRadioGroupItem<V extends string = string> = {
|
|
23
|
+
value: V;
|
|
24
|
+
title: string;
|
|
25
|
+
subtitle?: string;
|
|
26
|
+
introduction?: string;
|
|
27
|
+
icon?: ConcreteComponent;
|
|
28
|
+
help?: string;
|
|
29
|
+
disabled?: boolean;
|
|
30
|
+
};
|