@bagelink/vue 0.0.1064 → 0.0.1068

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bagelink/vue",
   "type": "module",
-  "version": "0.0.1064",
+  "version": "0.0.1068",
   "description": "Bagel core sdk packages",
   "author": {
     "name": "Neveh Allon",

package/src/components/Image.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Skeleton, normalizeDimension, appendScript, useBagel } from '@bagelink/vue'
+import { Skeleton, normalizeDimension, appendScript } from '@bagelink/vue'
 import { watch } from 'vue'
 
 declare global {
@@ -19,8 +19,7 @@ const { height, width, alt = '', src, pathKey } = defineProps<{
 
 let imageSrc = $ref<string | null>(null)
 
-const bagel = useBagel()
-const fileBaseUrl = $computed(() => (bagel.fileBaseUrl || 'https://files.bagel.design').replace(/\/$/, ''))
+const fileBaseUrl = $computed(() => ('https://files.bagel.design').replace(/\/$/, ''))
 const pathToUrl = () => `${fileBaseUrl}/${pathKey}`
 
 async function loadImage() {

package/src/components/form/BglField.vue

@@ -16,7 +16,7 @@ import {
 	type BagelFormState,
 	BglForm
 } from '@bagelink/vue'
-import { inject, ref } from 'vue'
+import { inject } from 'vue'
 import TabsNav from '../layout/TabsNav.vue'
 import { FORM_STATE_KEY, provideBagelFormState } from './useBagelFormState'
 
@@ -84,9 +84,9 @@ const vIf = $computed(() => {
 	return true
 })
 
-const computedFieldData = $computed(
-	() => props.field.transform?.(fieldData, formState.data.value as T) ?? fieldData
-)
+// const computedFieldData = $computed(
+// 	() => props.field.transform?.(fieldData, formState.data.value as T) ?? fieldData
+// )
 
 const computedOptions = $computed(
 	() => bindAttrs({ options: props.field.options }, fieldData, formState.data.value).options

package/src/components/form/inputs/NumberInput.vue

@@ -133,7 +133,7 @@ watch(() => modelValue, (newVal) => {
 				<Btn v-if="layout && btnLayouts.includes(layout)" flat icon="remove" class="radius" :class="[{ 'bgl-big-ctrl-num-btn': layout === 'vertical' }]" @click="decrement" />
 
 				<div v-if="spinner && (!layout || !btnLayouts.includes(layout))" class="flex column spinner">
-					<Btn icon="add" flat thin class="bgl-ctrl-num-btn ctrl-add color-gray" @click="increment" />
+					<Btn icon="add" flat thin class="bgl-ctrl-num-btn ctrl-add color-gray top-bgl-ctrl-num-btn" @click="increment" />
 					<Btn icon="remove" flat thin class="bgl-ctrl-num-btn ctrl-remove color-gray" @click="decrement" />
 				</div>
 			</div>
@@ -157,9 +157,13 @@ watch(() => modelValue, (newVal) => {
 	margin-top: calc(var(--input-height) / -1);
 	line-height: 0;
 }
+.top-bgl-ctrl-num-btn{
+	margin-top: calc(var(--input-height) / 10) !important;
+}
 .bgl-ctrl-num-btn{
-	height: calc(var(--input-height) / 2) !important;
+	height: calc(var(--input-height) / 2.5) !important;
 }
+
 .bgl-big-ctrl-num-btn{
 	width: 100% !important;
 }

package/src/components/form/inputs/PasswordInput.vue

@@ -32,7 +32,6 @@ const props = withDefaults(
 		label: ''
 	}
 )
-const hasLabel = $computed(() => props.label && props.label.trim() !== '')
 
 const password = defineModel<string>('modelValue')
 const showPwd = defineModel<boolean>('showPwd', { default: false })
@@ -43,32 +42,27 @@ const inputType = $computed(() => (showPwd.value ? 'text' : 'password'))
 </script>
 
 <template>
-	<div class="relative" :class="{ 'has-label': hasLabel }">
+	<div class="relative">
 		<TextInput
 			v-model="password"
 			v-bind="props"
 			:type="inputType"
 			class="mb-0"
 		/>
-		<Btn
-			flat
-			thin
-			class="mx-05 m-password position-bottom-end"
-			:icon="toggleShowPwdIcon"
-			@click="showPwd = !showPwd"
-		/>
+		<div class="m-password position-bottom-end flex column justify-content-center">
+			<Btn
+				flat
+				thin
+				class="mx-05"
+				:icon="toggleShowPwdIcon"
+				@click="showPwd = !showPwd"
+			/>
+		</div>
 	</div>
 </template>
 
 <style>
 .m-password {
-	position: absolute;
-	inset-block: 0;
-	margin-top: calc(var(--input-height) / 2 - 0.75rem);
-
-}
-
-.relative.has-label .m-password {
-	margin-top: calc(var(--input-height) / 2 + 0.25rem);
+	height: var(--input-height) !important;
 }
 </style>

package/src/components/form/inputs/RichText/index.vue

@@ -51,7 +51,7 @@ async function initEditor() {
 		const walker = doc.createTreeWalker(doc.body, NodeFilter.SHOW_TEXT)
 		const textNodes: Text[] = []
 		let node: Node | null
-		while (node = walker.nextNode()) {
+		while ((node = walker.nextNode())) {
 			if (node.parentElement === doc.body) {
 				textNodes.push(node as Text)
 			}

package/src/styles/layout.css

@@ -5352,7 +5352,7 @@
 }
 
 .block {
-    display: block;
+    display: block !important;
     width: 100% !important;
 }