frappe-ui 0.1.167 → 0.1.168

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "frappe-ui",
-  "version": "0.1.167",
+  "version": "0.1.168",
   "description": "A set of components and utilities for rapid UI development",
   "main": "./src/index.ts",
   "type": "module",
@@ -8,7 +8,8 @@
     "test": "vitest --run",
     "type-check": "tsc --noEmit",
     "prettier": "yarn prettier -w ./src",
-    "bump-and-release": "yarn test && git pull --rebase origin main && yarn version --patch && git push && git push --tags",
+    "bump-and-release": "yarn test && git pull --rebase origin main && yarn run release-patch",
+    "release-patch": "yarn version --patch && git push && git push --tags",
     "dev": "vite",
     "build": "vite build",
     "preview": "vite preview",

package/src/components/Combobox/Combobox.vue

@@ -44,7 +44,12 @@ interface ComboboxProps {
 }
 
 const props = defineProps<ComboboxProps>()
-const emit = defineEmits(['update:modelValue', 'update:selectedOption'])
+const emit = defineEmits([
+  'update:modelValue',
+  'update:selectedOption',
+  'focus',
+  'blur',
+])
 
 const searchTerm = ref(getDisplayValue(props.modelValue))
 const internalModelValue = ref(props.modelValue)
@@ -196,6 +201,14 @@ const handleOpenChange = (open: boolean) => {
     userHasTyped.value = false
   }
 }
+
+const handleFocus = (event: FocusEvent) => {
+  emit('focus', event)
+}
+
+const handleBlur = (event: FocusEvent) => {
+  emit('blur', event)
+}
 </script>
 
 <template>
@@ -215,6 +228,8 @@ const handleOpenChange = (open: boolean) => {
           <ComboboxInput
             :value="searchTerm"
             @input="handleInputChange"
+            @focus="handleFocus"
+            @blur="handleBlur"
             class="bg-transparent p-0 focus:outline-0 border-0 focus:border-0 focus:ring-0 text-base text-ink-gray-8 h-full placeholder:text-ink-gray-4 w-full"
             :placeholder="placeholder || ''"
             :disabled="disabled"

package/src/components/TextEditor/InsertVideo.vue

@@ -1,97 +1,14 @@
 <template>
-  <slot v-bind="{ onClick: openDialog }"></slot>
-  <Dialog
-    :options="{ title: 'Add Video' }"
-    v-model="addVideoDialog.show"
-    @after-leave="reset"
-  >
-    <template #body-content>
-      <FileUploader
-        file-types="video/*"
-        @success="(file) => (addVideoDialog.url = file.file_url)"
-      >
-        <template v-slot="{ file, progress, uploading, openFileSelector }">
-          <div class="flex items-center space-x-2">
-            <Button @click="openFileSelector">
-              {{
-                uploading
-                  ? `Uploading ${progress}%`
-                  : addVideoDialog.url
-                    ? 'Change Video'
-                    : 'Upload Video'
-              }}
-            </Button>
-            <Button
-              v-if="addVideoDialog.url"
-              @click="
-                () => {
-                  addVideoDialog.url = null
-                  addVideoDialog.file = null
-                }
-              "
-            >
-              Remove
-            </Button>
-          </div>
-        </template>
-      </FileUploader>
-      <video
-        v-if="addVideoDialog.url"
-        :src="addVideoDialog.url"
-        class="mt-2 w-full rounded-lg"
-        type="video/mp4"
-        controls
-      />
-    </template>
-    <template #actions>
-      <div class="flex gap-2">
-        <Button variant="solid" @click="addVideo(addVideoDialog.url)">
-          Insert Video
-        </Button>
-        <Button @click="reset">Cancel</Button>
-      </div>
-    </template>
-  </Dialog>
+  <slot v-bind="{ onClick: selectAndUploadVideo }"></slot>
 </template>
-<script>
-import { Button } from '../Button'
-import { Dialog } from '../Dialog'
-import { FileUploader } from '../FileUploader'
+<script setup lang="ts">
+import { Editor } from '@tiptap/vue-3'
 
-export default {
-  name: 'InsertImage',
-  props: ['editor'],
-  expose: ['openDialog'],
-  data() {
-    return {
-      addVideoDialog: { url: '', file: null, show: false },
-    }
-  },
-  components: { Button, Dialog, FileUploader },
-  methods: {
-    openDialog() {
-      this.addVideoDialog.show = true
-    },
-    onVideoSelect(e) {
-      let file = e.target.files[0]
-      if (!file) {
-        return
-      }
-      this.addVideoDialog.file = file
-    },
+const props = defineProps<{
+  editor: Editor
+}>()
 
-    addVideo(src) {
-      if (!src) return
-      this.editor
-        .chain()
-        .focus()
-        .insertContent(`<video src="${src}"></video>`)
-        .run()
-      this.reset()
-    },
-    reset() {
-      this.addVideoDialog = this.$options.data().addVideoDialog
-    },
-  },
+function selectAndUploadVideo() {
+  props.editor.chain().focus().selectAndUploadVideo().run()
 }
 </script>

package/src/index.ts

@@ -90,6 +90,7 @@ export { default as fileToBase64 } from './utils/file-to-base64'
 export { default as FileUploadHandler } from './utils/fileUploadHandler'
 export { usePageMeta } from './utils/pageMeta'
 export { dayjsLocal, dayjs } from './utils/dayjs'
+export * from './utils/useFileUpload'
 
 // data-fetching, resources
 export {