@speckle/ui-components 2.26.1 → 2.26.3

package/dist/{AvatarEditor-fc5c4df2.js → AvatarEditor-b3722ced.js}

@@ -4,11 +4,11 @@ import { Cropper as K } from "vue-advanced-cropper";
 import "vue-advanced-cropper/dist/style.css";
 import { FormButton as i, FormFileUploadZone as Q } from "./lib.js";
 import { directive as s } from "vue-tippy";
+import "lucide-vue-next";
 import "@heroicons/vue/20/solid";
 import "@speckle/shared";
 import "vee-validate";
 import "nanoid";
-import "lucide-vue-next";
 import "@vueuse/core";
 import "@headlessui/vue";
 import "@heroicons/vue/24/solid";
@@ -196,4 +196,4 @@ const W = { class: "flex flex-col space-y-2" }, Y = { class: "flex" }, ee = { cl
 export {
   he as default
 };
-//# sourceMappingURL=AvatarEditor-fc5c4df2.js.map
+//# sourceMappingURL=AvatarEditor-b3722ced.js.map

package/dist/{AvatarEditor-fc5c4df2.js.map → AvatarEditor-b3722ced.js.map}

@@ -1 +1 @@
-{"version":3,"file":"AvatarEditor-fc5c4df2.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","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_normalizeClass","_createVNode","FormButton","_unref","ArrowUturnLeftIcon","ArrowUturnRightIcon","ArrowUpOnSquareIcon","ArrowLeftOnRectangleIcon","_createBlock","Cropper","FormFileUploadZone","activatorOn","_mergeProps","_toHandlers","PhotoIcon","XMarkIcon","_hoisted_3","$emit","_cache","disabled"],"mappings":"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"}
+{"version":3,"file":"AvatarEditor-b3722ced.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","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_normalizeClass","_createVNode","FormButton","_unref","ArrowUturnLeftIcon","ArrowUturnRightIcon","ArrowUpOnSquareIcon","ArrowLeftOnRectangleIcon","_createBlock","Cropper","FormFileUploadZone","activatorOn","_mergeProps","_toHandlers","PhotoIcon","XMarkIcon","_hoisted_3","$emit","_cache","disabled"],"mappings":"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"}

package/dist/{AvatarEditor-00037f6e.cjs → AvatarEditor-c520e3d6.cjs}

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),n=require("@heroicons/vue/24/outline"),R=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("lucide-vue-next");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(R.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:q})=>[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(q,!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)])]),_:1}),e.createVNode(o.FormButton,{disabled:t.disabled,onClick:y},{default:e.withCtx(()=>[...r[2]||(r[2]=[e.createTextVNode("Save",-1)])]),_:1},8,["disabled"])])]))}});exports.default=D;
-//# sourceMappingURL=AvatarEditor-00037f6e.cjs.map
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),n=require("@heroicons/vue/24/outline"),R=require("vue-advanced-cropper");require("vue-advanced-cropper/dist/style.css");const o=require("./lib.cjs"),c=require("vue-tippy");require("lucide-vue-next");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(R.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:q})=>[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(q,!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)])]),_:1}),e.createVNode(o.FormButton,{disabled:t.disabled,onClick:y},{default:e.withCtx(()=>[...r[2]||(r[2]=[e.createTextVNode("Save",-1)])]),_:1},8,["disabled"])])]))}});exports.default=D;
+//# sourceMappingURL=AvatarEditor-c520e3d6.cjs.map

package/dist/{AvatarEditor-00037f6e.cjs.map → AvatarEditor-c520e3d6.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"AvatarEditor-00037f6e.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","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_normalizeClass","_createVNode","FormButton","_unref","ArrowUturnLeftIcon","ArrowUturnRightIcon","ArrowUpOnSquareIcon","ArrowLeftOnRectangleIcon","_createBlock","Cropper","FormFileUploadZone","activatorOn","_mergeProps","_toHandlers","PhotoIcon","XMarkIcon","_hoisted_3","$emit","_cache","disabled"],"mappings":"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"}
+{"version":3,"file":"AvatarEditor-c520e3d6.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","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_normalizeClass","_createVNode","FormButton","_unref","ArrowUturnLeftIcon","ArrowUturnRightIcon","ArrowUpOnSquareIcon","ArrowLeftOnRectangleIcon","_createBlock","Cropper","FormFileUploadZone","activatorOn","_mergeProps","_toHandlers","PhotoIcon","XMarkIcon","_hoisted_3","$emit","_cache","disabled"],"mappings":"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"}

package/dist/components/form/Checkbox.vue.d.ts

@@ -213,8 +213,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     "onUpdate:modelValue"?: ((val: ValueType) => any) | undefined;
 }>, {
     disabled: boolean;
-    description: Optional<string>;
     label: Optional<string>;
+    description: Optional<string>;
+    id: Optional<string>;
     modelValue: false | ValueType;
     value: Optional<string | true>;
     labelClasses: Optional<string>;
@@ -222,7 +223,6 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     rules: RuleExpression<ValueType>;
     validateOnMount: boolean;
     showRequired: boolean;
-    id: Optional<string>;
     hideLabel: boolean;
     labelPosition: LabelPosition;
     indeterminate: boolean;

package/dist/components/form/ClipboardInput.vue.d.ts

@@ -1,8 +1,11 @@
+import { FormButtonStyle } from '../../helpers/form/button';
 type Props = {
     value: string;
     isMultiline?: boolean;
     isIconButton?: boolean;
     rows?: number;
+    ctaColor?: FormButtonStyle;
+    ctaText?: string;
 };
 declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
     copy: (val: string) => any;
@@ -10,5 +13,7 @@ declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, imp
     onCopy?: ((val: string) => any) | undefined;
 }>, {
     isMultiline: boolean;
+    ctaColor: FormButtonStyle;
+    ctaText: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/dist/components/form/Radio.vue.d.ts

@@ -220,8 +220,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
 }>, {
     size: Optional<Size>;
     disabled: boolean;
-    description: Optional<string>;
     label: Optional<string>;
+    description: Optional<string>;
+    id: Optional<string>;
     modelValue: false | ValueType;
     value: Optional<string | true>;
     labelClasses: Optional<string>;
@@ -230,7 +231,6 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     rules: RuleExpression<ValueType>;
     validateOnMount: boolean;
     showRequired: boolean;
-    id: Optional<string>;
     hideLabel: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export default _default;

package/dist/components/form/select/Base.vue.d.ts

@@ -67,6 +67,7 @@ declare const _default: <SingleItem extends Record<string, unknown> | string | n
         readonly menuOpenDirection: "left" | "right";
         readonly size?: Optional<"sm" | "base" | "lg" | "xl">;
         readonly placeholder?: string | undefined;
+        readonly by?: string | undefined;
         readonly modelValue?: ([{
             type: PropType<SingleItem | SingleItem[] | undefined>;
             default: undefined;
@@ -75,7 +76,6 @@ declare const _default: <SingleItem extends Record<string, unknown> | string | n
             default: undefined;
         }) | undefined;
         readonly rules?: RuleExpression<SingleItem | SingleItem[] | undefined>;
-        readonly by?: string | undefined;
         readonly help?: Optional<string>;
         readonly tooltipText?: string | undefined;
         readonly filterPredicate?: Optional<(item: SingleItem, searchString: string) => boolean>;
@@ -87,7 +87,7 @@ declare const _default: <SingleItem extends Record<string, unknown> | string | n
         readonly menuMaxWidth?: number | undefined;
         readonly menuMaxHeightClasses?: string | undefined;
         readonly "onUpdate:modelValue"?: ((v: SingleItem | SingleItem[] | undefined) => any) | undefined;
-    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "size" | "disabled" | "search" | "modelValue" | "rules" | "validateOnMount" | "showRequired" | "labelPosition" | "validateOnValueUpdate" | "help" | "showLabel" | "useLabelInErrors" | "showOptional" | "tooltipText" | "multiple" | "items" | "filterPredicate" | "disabledItemPredicate" | "getSearchResults" | "searchPlaceholder" | "buttonStyle" | "hideCheckmarks" | "allowUnset" | "clearable" | "fixedHeight" | "fullyControlValue" | "mountMenuOnBody" | "labelId" | "buttonId" | "menuMaxWidth" | "menuOpenDirection" | "menuMaxHeightClasses">, "placeholder" | "label" | "name" | "onUpdate:modelValue" | "by" | "disabledItemTooltip" | ("size" | "disabled" | "search" | "modelValue" | "rules" | "validateOnMount" | "showRequired" | "labelPosition" | "validateOnValueUpdate" | "help" | "showLabel" | "useLabelInErrors" | "showOptional" | "tooltipText" | "multiple" | "items" | "filterPredicate" | "disabledItemPredicate" | "getSearchResults" | "searchPlaceholder" | "buttonStyle" | "hideCheckmarks" | "allowUnset" | "clearable" | "fixedHeight" | "fullyControlValue" | "mountMenuOnBody" | "labelId" | "buttonId" | "menuMaxWidth" | "menuOpenDirection" | "menuMaxHeightClasses")> & {} & Partial<{}>> & import('vue').PublicProps;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "size" | "disabled" | "search" | "modelValue" | "rules" | "validateOnMount" | "showRequired" | "labelPosition" | "validateOnValueUpdate" | "help" | "showLabel" | "useLabelInErrors" | "showOptional" | "tooltipText" | "multiple" | "items" | "filterPredicate" | "disabledItemPredicate" | "getSearchResults" | "searchPlaceholder" | "buttonStyle" | "hideCheckmarks" | "allowUnset" | "clearable" | "fixedHeight" | "fullyControlValue" | "mountMenuOnBody" | "labelId" | "buttonId" | "menuMaxWidth" | "menuOpenDirection" | "menuMaxHeightClasses">, "placeholder" | "label" | "name" | "by" | "onUpdate:modelValue" | "disabledItemTooltip" | ("size" | "disabled" | "search" | "modelValue" | "rules" | "validateOnMount" | "showRequired" | "labelPosition" | "validateOnValueUpdate" | "help" | "showLabel" | "useLabelInErrors" | "showOptional" | "tooltipText" | "multiple" | "items" | "filterPredicate" | "disabledItemPredicate" | "getSearchResults" | "searchPlaceholder" | "buttonStyle" | "hideCheckmarks" | "allowUnset" | "clearable" | "fixedHeight" | "fullyControlValue" | "mountMenuOnBody" | "labelId" | "buttonId" | "menuMaxWidth" | "menuOpenDirection" | "menuMaxHeightClasses")> & {} & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{
         triggerSearch: () => Promise<void>;
     }>): void;

package/dist/components/form/select/Multi.vue.d.ts

@@ -61,6 +61,7 @@ declare const _default: <SingleItem extends Record<string, unknown> | string | n
         readonly mountMenuOnBody: boolean;
         readonly size?: Optional<"sm" | "base" | "lg" | "xl">;
         readonly placeholder?: string | undefined;
+        readonly by?: string | undefined;
         readonly modelValue?: ([{
             type: PropType<SingleItem | SingleItem[] | undefined>;
             default: undefined;
@@ -69,7 +70,6 @@ declare const _default: <SingleItem extends Record<string, unknown> | string | n
             default: undefined;
         }) | undefined;
         readonly rules?: RuleExpression<SingleItem | SingleItem[] | undefined>;
-        readonly by?: string | undefined;
         readonly help?: Optional<string>;
         readonly tooltipText?: string | undefined;
         readonly filterPredicate?: Optional<(item: SingleItem, searchString: string) => boolean>;
@@ -79,7 +79,7 @@ declare const _default: <SingleItem extends Record<string, unknown> | string | n
         readonly buttonId?: string | undefined;
         readonly disabledItemTooltip?: string | undefined;
         readonly "onUpdate:modelValue"?: ((v: SingleItem | SingleItem[] | undefined) => any) | undefined;
-    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "size" | "disabled" | "search" | "modelValue" | "rules" | "validateOnMount" | "showRequired" | "labelPosition" | "validateOnValueUpdate" | "help" | "showLabel" | "useLabelInErrors" | "showOptional" | "tooltipText" | "items" | "filterPredicate" | "disabledItemPredicate" | "getSearchResults" | "searchPlaceholder" | "buttonStyle" | "hideCheckmarks" | "allowUnset" | "clearable" | "fixedHeight" | "fullyControlValue" | "mountMenuOnBody" | "labelId" | "buttonId">, "placeholder" | "label" | "name" | "onUpdate:modelValue" | "by" | "disabledItemTooltip" | ("size" | "disabled" | "search" | "modelValue" | "rules" | "validateOnMount" | "showRequired" | "labelPosition" | "validateOnValueUpdate" | "help" | "showLabel" | "useLabelInErrors" | "showOptional" | "tooltipText" | "items" | "filterPredicate" | "disabledItemPredicate" | "getSearchResults" | "searchPlaceholder" | "buttonStyle" | "hideCheckmarks" | "allowUnset" | "clearable" | "fixedHeight" | "fullyControlValue" | "mountMenuOnBody" | "labelId" | "buttonId")> & {} & Partial<{}>> & import('vue').PublicProps;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "size" | "disabled" | "search" | "modelValue" | "rules" | "validateOnMount" | "showRequired" | "labelPosition" | "validateOnValueUpdate" | "help" | "showLabel" | "useLabelInErrors" | "showOptional" | "tooltipText" | "items" | "filterPredicate" | "disabledItemPredicate" | "getSearchResults" | "searchPlaceholder" | "buttonStyle" | "hideCheckmarks" | "allowUnset" | "clearable" | "fixedHeight" | "fullyControlValue" | "mountMenuOnBody" | "labelId" | "buttonId">, "placeholder" | "label" | "name" | "by" | "onUpdate:modelValue" | "disabledItemTooltip" | ("size" | "disabled" | "search" | "modelValue" | "rules" | "validateOnMount" | "showRequired" | "labelPosition" | "validateOnValueUpdate" | "help" | "showLabel" | "useLabelInErrors" | "showOptional" | "tooltipText" | "items" | "filterPredicate" | "disabledItemPredicate" | "getSearchResults" | "searchPlaceholder" | "buttonStyle" | "hideCheckmarks" | "allowUnset" | "clearable" | "fixedHeight" | "fullyControlValue" | "mountMenuOnBody" | "labelId" | "buttonId")> & {} & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{
         triggerSearch: () => Promise<void>;
     }>): void;

package/dist/components/layout/DialogSection.vue.d.ts

@@ -41,7 +41,12 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         type: PropType<PropAnyComponent>;
         default: undefined;
     };
-}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    open: {
+        type: PropType<boolean>;
+    };
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     title: StringConstructor;
     borderT: BooleanConstructor;
     borderB: BooleanConstructor;
@@ -67,7 +72,12 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
         type: PropType<PropAnyComponent>;
         default: undefined;
     };
-}>> & Readonly<{}>, {
+    open: {
+        type: PropType<boolean>;
+    };
+}>> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {
     icon: PropAnyComponent;
     borderT: boolean;
     borderB: boolean;

package/dist/components/user/AvatarEditor.vue.d.ts

@@ -66,7 +66,7 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
         $forceUpdate: () => void;
         $nextTick: typeof import('vue').nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
-    } & Readonly<{}> & Omit<Readonly<any>, "reset" | "rotate" | "move" | "flip" | "zoom" | "getResult" | "setCoordinates" | "refresh"> & import('vue').ShallowUnwrapRef<{
+    } & Readonly<{}> & Omit<Readonly<any>, "rotate" | "reset" | "move" | "flip" | "zoom" | "getResult" | "setCoordinates" | "refresh"> & import('vue').ShallowUnwrapRef<{
         getResult: () => import('vue-advanced-cropper').CropperResult;
         setCoordinates: (transform: import('vue-advanced-cropper').Transform | import('vue-advanced-cropper').Transform[]) => void;
         refresh: () => void;
@@ -132,7 +132,7 @@ declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
     } & Readonly<{
         [x: string]: any;
-    }> & Omit<Readonly<any>, "reset" | "rotate" | "move" | "flip" | "zoom" | "getResult" | "setCoordinates" | "refresh"> & import('vue').ShallowUnwrapRef<{
+    }> & Omit<Readonly<any>, "rotate" | "reset" | "move" | "flip" | "zoom" | "getResult" | "setCoordinates" | "refresh"> & import('vue').ShallowUnwrapRef<{
         getResult: () => import('vue-advanced-cropper').CropperResult;
         setCoordinates: (transform: import('vue-advanced-cropper').Transform | import('vue-advanced-cropper').Transform[]) => void;
         refresh: () => void;

package/dist/composables/form/input.d.ts

@@ -1,6 +1,6 @@
 import { ModifierKeys } from '../../helpers/form/input';
 import { Ref } from 'vue';
-export type LabelPosition = 'top' | 'left';
+export type LabelPosition = 'top' | 'left' | 'right';
 /**
  * onKeyDown wrapper that also checks for modifier keys being pressed
  */