@bagelink/vue 0.0.1262 → 0.0.1270

package/dist/style.css

@@ -1015,22 +1015,22 @@ display: block;
 	font-size: 0.95rem;
 }
 
-.table-list-wrap[data-v-8e14fc71] {
+.table-list-wrap[data-v-89f6838b] {
 	min-height: 150px;
 }
-.selected[data-v-8e14fc71] {
+.selected[data-v-89f6838b] {
 	background: var(--bgl-primary-tint);
 }
-tbody tr.selected[data-v-8e14fc71]:hover {
+tbody tr.selected[data-v-89f6838b]:hover {
 	background: var(--bgl-primary-light);
 }
-.loading-table[data-v-8e14fc71] {
+.loading-table[data-v-89f6838b] {
 	position: relative;
 }
-.inset[data-v-8e14fc71] {
+.inset[data-v-89f6838b] {
 	inset: 0;
 }
-.loading-table-animation[data-v-8e14fc71] {
+.loading-table-animation[data-v-89f6838b] {
 	--size: 60px;
 	top: 30vh;
 	inset-inline-start: calc(50% - var(--size));
@@ -1038,9 +1038,9 @@ tbody tr.selected[data-v-8e14fc71]:hover {
 	border-top: 4px solid var(--bgl-primary);
 	width: var(--size);
 	height: var(--size);
-	animation: loading-table-8e14fc71 1s linear infinite;
+	animation: loading-table-89f6838b 1s linear infinite;
 }
-@keyframes loading-table-8e14fc71 {
+@keyframes loading-table-89f6838b {
 0% {
 		transform: translate(-50%, -50%) rotate(0deg);
 }
@@ -1048,55 +1048,55 @@ tbody tr.selected[data-v-8e14fc71]:hover {
 		transform: translate(-50%, -50%) rotate(360deg);
 }
 }
-.list-arrows[data-v-8e14fc71] {
+.list-arrows[data-v-89f6838b] {
 	opacity: 0;
 }
-.list-arrows .bgl_icon-font[data-v-8e14fc71] {
+.list-arrows .bgl_icon-font[data-v-89f6838b] {
 	transition: all ease-in-out 0.2s;
 }
-.list-arrows.sorted[data-v-8e14fc71] {
+.list-arrows.sorted[data-v-89f6838b] {
 	opacity: 1;
 }
-.col img[data-v-8e14fc71] {
+.col img[data-v-89f6838b] {
 	height: 35px;
 	margin-top: -14px;
 	margin-bottom: -14px;
 	border-radius: 5px;
 	object-fit: cover;
 }
-.col[data-v-8e14fc71]:has(img) {
+.col[data-v-89f6838b]:has(img) {
 	padding-inline-end: 0.5rem;
 }
-.list-arrows.sorted .desc[data-v-8e14fc71] {
+.list-arrows.sorted .desc[data-v-89f6838b] {
 	transform: rotate(180deg);
 	display: inline-block;
 }
-table[data-v-8e14fc71] {
+table[data-v-89f6838b] {
 	border-spacing: 0 15px;
 	border-collapse: collapse;
 	width: 100%;
 }
-th[data-v-8e14fc71] {
+th[data-v-89f6838b] {
 	font-size: 0.8rem;
 	color: var(--bgl-black-tint);
 	position: sticky;
 	top: 0;
 	z-index: 2;
 	background: var(--bgl-box-bg);
-	height: var(--1ab0cc24);
+	height: var(--40bb5b9a);
 	vertical-align: bottom;
 	font-weight: 400;
 	text-align: start;
 }
-.embedded-field[data-v-8e14fc71] {
+.embedded-field[data-v-89f6838b] {
 	margin-bottom: -0.2rem;
 	margin-top: -0.2rem;
 }
-.row[data-v-8e14fc71] {
+.row[data-v-89f6838b] {
 	border-bottom: 1px solid var(--border-color);
 	cursor: pointer;
 }
-.row.first-row[data-v-8e14fc71] {
+.row.first-row[data-v-89f6838b] {
 	font-size: 0.8rem;
 	color: var(--bgl-black-tint);
 	position: sticky;
@@ -1105,7 +1105,7 @@ th[data-v-8e14fc71] {
 	background: var(--bgl-box-bg);
 	vertical-align: bottom;
 }
-.row.first-row[data-v-8e14fc71]::after {
+.row.first-row[data-v-89f6838b]::after {
 	content: '';
 	border-bottom: 1px solid var(--border-color);
 	position: absolute;
@@ -1113,11 +1113,11 @@ th[data-v-8e14fc71] {
 	right: 0;
 	bottom: -1px;
 }
-.first-row .col[data-v-8e14fc71] {
+.first-row .col[data-v-89f6838b] {
 	cursor: pointer;
 	background: var(--bgl-box-bg);
 }
-.col[data-v-8e14fc71] {
+.col[data-v-89f6838b] {
 	white-space: nowrap;
 	padding: 0.75rem 1rem;
 	transition: var(--bgl-transition);
@@ -1127,19 +1127,19 @@ th[data-v-8e14fc71] {
 	overflow: hidden;
 	max-width: 30vw;
 }
-.col[data-v-8e14fc71]:has(.bagel-input) {
+.col[data-v-89f6838b]:has(.bagel-input) {
 	padding: 0rem 0.25rem;
 }
-.col > div[data-v-8e14fc71] {
+.col > div[data-v-89f6838b] {
 	display: flex;
 	gap: 0.5rem;
 }
-.max-col-width[data-v-8e14fc71] {
+.max-col-width[data-v-89f6838b] {
 	max-width: 30vw;
 	overflow: hidden;
 	text-overflow: ellipsis;
 }
-.col.check .bgl_icon-font[data-v-8e14fc71] {
+.col.check .bgl_icon-font[data-v-89f6838b] {
 	border-radius: 100%;
 	background: var(--bgl-blue-20);
 	color: var(--bgl-primary);
@@ -1150,35 +1150,35 @@ th[data-v-8e14fc71] {
 	justify-content: center;
 	margin-top: -2px;
 }
-.rows[data-v-8e14fc71] {
+.rows[data-v-89f6838b] {
 	font-size: 0.88em;
 }
-.table-list[data-v-8e14fc71] {
+.table-list[data-v-89f6838b] {
 	height: 100%;
 	position: relative;
 	padding-left: 0 !important;
 	padding-right: 0 !important;
 	overflow: auto;
 }
-.BagelTable .table-list[data-v-8e14fc71] {
+.BagelTable .table-list[data-v-89f6838b] {
 	overflow: unset;
 }
-.row-item[data-v-8e14fc71] {
-	height: var(--1ab0cc24);
+.row-item[data-v-89f6838b] {
+	height: var(--40bb5b9a);
 	transition: all 200ms ease;
 }
-.row-item[data-v-8e14fc71]:hover {
+.row-item[data-v-89f6838b]:hover {
 	background: var(--bgl-gray-light);
 }
-.row-item input[type='checkbox'][data-v-8e14fc71] {
+.row-item input[type='checkbox'][data-v-89f6838b] {
 	margin-top: 0.45rem !important;
 	accent-color: var(--bgl-accent-color);
 }
-.infinite-wrapper[data-v-8e14fc71] {
+.infinite-wrapper[data-v-89f6838b] {
 	overflow-y: auto;
 	width: 100%;
 }
-input[type='checkbox'][data-v-8e14fc71] {
+input[type='checkbox'][data-v-89f6838b] {
 	margin-top: 0.3rem !important;
 	accent-color: var(--bgl-accent-color);
 	transform: scale(1.2);
@@ -1190,7 +1190,7 @@ input[type='checkbox'][data-v-8e14fc71] {
 	height: 0.85rem;
 	width: 0.85rem;
 }
-input[type='checkbox'][data-v-8e14fc71]::before {
+input[type='checkbox'][data-v-89f6838b]::before {
 	content: '';
 	height: 0.85rem;
 	width: 0.85rem;
@@ -1203,18 +1203,18 @@ input[type='checkbox'][data-v-8e14fc71]::before {
 	transform: scale(1);
 	position: absolute;
 }
-input[type='checkbox'][data-v-8e14fc71]:hover::before {
+input[type='checkbox'][data-v-89f6838b]:hover::before {
 	opacity: 0.2;
 	transform: scale(2);
 }
-[lang='he'] [dir='ltr'][data-v-8e14fc71] {
+[lang='he'] [dir='ltr'][data-v-89f6838b] {
 	text-align: right;
 }
-th input[type='checkbox'][data-v-8e14fc71] {
+th input[type='checkbox'][data-v-89f6838b] {
 	transform: translateY(0.2rem) scale(1.2);
 	accent-color: var(--bgl-accent-color);
 }
-th[data-v-8e14fc71]::after {
+th[data-v-89f6838b]::after {
 	content: '';
 	border-bottom: 1px solid var(--border-color);
 	position: absolute;
@@ -1222,24 +1222,24 @@ th[data-v-8e14fc71]::after {
 	right: 0;
 	bottom: -1px;
 }
-tr[data-v-8e14fc71] {
+tr[data-v-89f6838b] {
 	border-bottom: 1px solid var(--border-color);
 	cursor: pointer;
 	align-items: center;
 }
-td[data-v-8e14fc71],
-th[data-v-8e14fc71] {
+td[data-v-89f6838b],
+th[data-v-89f6838b] {
 	white-space: nowrap;
 	padding: 0.75rem 0.65rem;
 	transition: var(--bgl-transition);
 	line-height: 1;
 }
-tbody tr[data-v-8e14fc71] {
+tbody tr[data-v-89f6838b] {
 	font-size: 0.88em;
-	height: var(--1ab0cc24);
+	height: var(--40bb5b9a);
 	transition: all 200ms ease;
 }
-tbody tr[data-v-8e14fc71]:hover {
+tbody tr[data-v-89f6838b]:hover {
 	background: var(--bgl-gray-light);
 }
 
@@ -1285,6 +1285,9 @@ fieldset[data-v-f7e758e5] {
 .itemBox .custom-select .input {
 	background: var(--bgl-white) !important;
 }
+.itemBox .code-editor-wrap textarea{
+	background: transparent !important;
+}
 .itemBox .bagel-input{
 	margin-bottom: 0.15rem !important;
 }
@@ -1397,69 +1400,69 @@ pre code.hljs{
   outline: none;
 }
 
-.calendar-container[data-v-a2f98d6e] {
+.calendar-container[data-v-5d1b6a15] {
 	max-width: 90vw;
 }
-.calendar-section[data-v-a2f98d6e] {
+.calendar-section[data-v-5d1b6a15] {
 	min-width: 280px;
 }
-.calendar-grid[data-v-a2f98d6e] {
+.calendar-grid[data-v-5d1b6a15] {
 	grid-template-columns: repeat(7, 1fr);
 }
-.month-grid[data-v-a2f98d6e] {
+.month-grid[data-v-5d1b6a15] {
 	grid-template-columns: repeat(3, 1fr);
 	grid-template-rows: repeat(4, 1fr);
 }
-.year-grid[data-v-a2f98d6e] {
+.year-grid[data-v-5d1b6a15] {
 	grid-template-columns: repeat(3, 1fr);
 	grid-template-rows: repeat(7, 1fr);
 }
-.month-item[data-v-a2f98d6e],
-.year-item[data-v-a2f98d6e] {
+.month-item[data-v-5d1b6a15],
+.year-item[data-v-5d1b6a15] {
 	background: none;
 	color: var(--bgl-text-color);
 }
-.month-item[data-v-a2f98d6e]:hover:not(.disabled),
-.year-item[data-v-a2f98d6e]:hover:not(.disabled) {
+.month-item[data-v-5d1b6a15]:hover:not(.disabled),
+.year-item[data-v-5d1b6a15]:hover:not(.disabled) {
 	background: var(--bgl-box-bg);
 	filter: var(--bgl-hover-filter);
 }
-.month-item[data-v-a2f98d6e]:active:not(.disabled),
-.year-item[data-v-a2f98d6e]:active:not(.disabled) {
+.month-item[data-v-5d1b6a15]:active:not(.disabled),
+.year-item[data-v-5d1b6a15]:active:not(.disabled) {
 	background: var(--bgl-box-bg);
 	filter: var(--bgl-active-filter);
 }
-.month-item.selected[data-v-a2f98d6e],
-.year-item.selected[data-v-a2f98d6e] {
+.month-item.selected[data-v-5d1b6a15],
+.year-item.selected[data-v-5d1b6a15] {
 	background-color: var(--bgl-primary);
 	color: white;
 }
-.month-item.disabled[data-v-a2f98d6e],
-.year-item.disabled[data-v-a2f98d6e] {
+.month-item.disabled[data-v-5d1b6a15],
+.year-item.disabled[data-v-5d1b6a15] {
 	opacity: 0.6;
 	filter: grayscale(0.3);
 }
-.day[data-v-a2f98d6e] {
+.day[data-v-5d1b6a15] {
 	border: none;
 	background: none;
 	color: var(--bgl-text-color);
 }
-.day[data-v-a2f98d6e]:hover:not(.disabled) {
+.day[data-v-5d1b6a15]:hover:not(.disabled) {
 	background-color: var(--input-bg);
 }
-.day.selected[data-v-a2f98d6e] {
+.day.selected[data-v-5d1b6a15] {
 	background-color: var(--bgl-primary);
 	color: var(--bgl-white);
 }
-.day.today[data-v-a2f98d6e]:not(.selected) {
+.day.today[data-v-5d1b6a15]:not(.selected) {
 	border: 1px solid var(--bgl-primary);
 }
-.day.disabled[data-v-a2f98d6e] {
+.day.disabled[data-v-5d1b6a15] {
 	opacity: 0.6;
 	filter: grayscale(0.3);
 	cursor: not-allowed;
 }
-.day.not-in-month[data-v-a2f98d6e] {
+.day.not-in-month[data-v-5d1b6a15] {
 	opacity: 0.4;
 }
 
@@ -1915,6 +1918,10 @@ pre code.hljs{
 .m-password {
 	height: var(--input-height) !important;
 }
+[dir='rtl'] .passwordInput input {
+    direction: ltr;
+    text-align: right;
+}
 
 .radio-input-list[data-v-a692c596]{
 	width: auto;
@@ -2040,7 +2047,7 @@ input[type="range"][data-v-25d991e5]:active::-webkit-slider-thumb {
 	background: var(--bgl-primary-light);
 }
 
-.toolbar[data-v-bcd681b9] .active {
+.toolbar[data-v-9d8a6eb6] .active {
 	background: var(--bgl-primary);
 	color: white;
 }
@@ -2051,26 +2058,26 @@ input[type="range"][data-v-25d991e5]:active::-webkit-slider-thumb {
 line-height: 1.65;
 }
 
-.rich-text-editor[data-v-08117333] {
+.rich-text-editor[data-v-b58de58d] {
 	background: var(--input-bg);
 	border: 1px solid var(--border-color);
 	transition: all 0.3s ease;
 }
-.editor-container[data-v-08117333] {
+.editor-container[data-v-b58de58d] {
 	display: flex;
 	gap: 1rem;
 }
-.content-area[data-v-08117333],
-.preview-area[data-v-08117333] {
+.content-area[data-v-b58de58d],
+.preview-area[data-v-b58de58d] {
 	flex: 1;
 	min-height: 200px;
 	background: var(--bgl-richtext-color);
 }
-.split-view[data-v-08117333] {
+.split-view[data-v-b58de58d] {
 	display: grid;
 	grid-template-columns: 1fr 1fr;
 }
-.editableContent[data-v-08117333] {
+.editableContent[data-v-b58de58d] {
 	width: 100%;
 	min-height: 240px;
 	height: 100%;
@@ -2078,7 +2085,7 @@ line-height: 1.65;
 	outline: none;
 	background: transparent;
 }
-.html-editor[data-v-08117333] {
+.html-editor[data-v-b58de58d] {
 	width: 100%;
 	height: 100%;
 	min-height: 200px;
@@ -2089,12 +2096,12 @@ line-height: 1.65;
 	color: white;
 	background-color: var(--bgl-black);
 }
-.preview-area[data-v-08117333] {
+.preview-area[data-v-b58de58d] {
 	font-family: monospace;
 	white-space: pre-wrap;
 	overflow-x: auto;
 }
-.fullscreen-mode[data-v-08117333] {
+.fullscreen-mode[data-v-b58de58d] {
 	position: fixed;
 	top: 0;
 	left: 0;
@@ -2103,18 +2110,18 @@ line-height: 1.65;
 	z-index: 9999;
 	padding: 2rem;
 }
-.fullscreen-mode .editor-container[data-v-08117333] {
+.fullscreen-mode .editor-container[data-v-b58de58d] {
 	height: calc(100vh - 4rem);
 }
-.fullscreen-mode .content-area[data-v-08117333],
-.fullscreen-mode .preview-area[data-v-08117333] {
+.fullscreen-mode .content-area[data-v-b58de58d],
+.fullscreen-mode .preview-area[data-v-b58de58d] {
 	height: 100%;
 	overflow-y: auto;
 }
-.fullscreen-mode .code-editor[data-v-08117333]{
+.fullscreen-mode .code-editor[data-v-b58de58d]{
 	height: 100% !important;
 }
-.debug-controls[data-v-08117333] {
+.debug-controls[data-v-b58de58d] {
 	display: flex;
 	gap: 0.5rem;
 	justify-content: flex-end;
@@ -2736,6 +2743,16 @@ line-height: 1.65;
 	transform: rotateY(180deg) !important;
 }
 
+.bgl_icon-font[data-v-b28cd148] {
+	font-family: 'Material Symbols Outlined', serif !important;
+}
+.bgl_icon-font.fa[data-v-b28cd148] {
+	font-family: 'Font Awesome 6 Free', serif !important;
+}
+.bgl_icon-font.fa-brands[data-v-b28cd148] {
+	font-family: 'Font Awesome 6 Brands', serif !important;
+}
+
 .img-web-kit[data-v-2f5e271c] {
 	max-width: 100%;
 	vertical-align: middle;
@@ -14603,10 +14620,6 @@ select {
 	text-transform: lowercase;
 }.capitalize {
 	text-transform: capitalize;
-}.bgl_icon-font {
-	font-family: 'Material Symbols Outlined', serif !important;
-}.bgl_icon-font.fa {
-	font-family: 'Font Awesome 6 Free', serif !important;
 }.nowrap {
 	white-space: nowrap;
 }.balance {

package/package.json

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

package/src/components/DataTable/DataTable.vue

@@ -89,7 +89,7 @@ function renderFieldForRow(field: BaseBagelField<T>, row: T) {
 		mode: 'table',
 		getRowData: () => {
 			if (field.id) {
-				return { [field.id]: getNestedValue(row, field.id) }
+				return { [field.id]: getNestedValue(row, field.id) } as T
 			}
 			return row
 		}

package/src/components/Dropdown.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { IconType } from '@bagelink/vue'
+import type { TriggerEvent } from 'floating-vue'
 import { Btn } from '@bagelink/vue'
 import { Dropdown as DDown } from 'floating-vue'
 
@@ -21,6 +22,8 @@ defineProps<{
 	placement?: AlignedPlacement
 	noAutoFocus?: boolean
 	positioningDisabled?: boolean
+	autoHide?: boolean
+	triggers?: TriggerEvent[]
 	// theme
 	// referenceNode
 	// shown
@@ -31,7 +34,6 @@ defineProps<{
 	// delay
 	// distance
 	// skidding
-	// triggers
 	// showTriggers
 	// hideTriggers
 	// popperTriggers
@@ -40,7 +42,6 @@ defineProps<{
 	// container
 	// boundary
 	// strategy
-	// autoHide
 	// handleResize
 	// instantMove
 	// eagerMount
@@ -79,6 +80,8 @@ defineExpose({ show, hide, shown })
 		v-model:shown="shown"
 		:disabled="disabled"
 		:noAutoFocus :placement
+		:autoHide="autoHide"
+		:triggers="triggers"
 		@hide="emit('hide')"
 		@show="emit('show')"
 	>

package/src/components/Icon/Icon.vue

@@ -46,4 +46,18 @@ const isFaBrand = $computed(() => FONT_AWESOME_BRANDS_ICONS.includes(iconRender)
 }
 </style>
 
+<style scoped>
+.bgl_icon-font {
+	font-family: 'Material Symbols Outlined', serif !important;
+}
+
+.bgl_icon-font.fa {
+	font-family: 'Font Awesome 6 Free', serif !important;
+}
+
+.bgl_icon-font.fa-brands {
+	font-family: 'Font Awesome 6 Brands', serif !important;
+}
+</style>
+
 <!-- <style src="./font-awesome.css" /> -->

package/src/components/form/FieldArray.vue

@@ -139,6 +139,9 @@ const { renderField } = useSchemaField<Record<string, any>>({
 .itemBox .custom-select .input {
 	background: var(--bgl-white) !important;
 }
+.itemBox .code-editor-wrap textarea{
+	background: transparent !important;
+}
 .itemBox .bagel-input{
 	margin-bottom: 0.15rem !important;
 }