@bagelink/vue 0.0.211 → 0.0.214

package/dist/style.css

@@ -57,10 +57,10 @@
   background-color: var(--bgl-bg);
 }
 
-[dir="rtl"] .top-arrow {
+[dir="rtl"] .top-arrow[data-v-fddb4764] {
   transform: rotate(180deg);
 }
-.nav-expend {
+.nav-expend[data-v-fddb4764] {
   text-align: center;
   cursor: pointer;
   background: var(--bgl-white);
@@ -86,17 +86,17 @@
 	margin-bottom: 30px;
 }
 */
-.nav-expend {
+.nav-expend[data-v-fddb4764] {
   background: var(--bgl-white);
 }
-.nav-expend:hover {
+.nav-expend[data-v-fddb4764]:hover {
   filter: brightness(95%);
   box-shadow: 0 0 20px 0 var(--bgl-primary-tint);
 }
-.nav-expend:active {
+.nav-expend[data-v-fddb4764]:active {
   filter: var(--bgl-active-filter);
 }
-.nav {
+.nav[data-v-fddb4764] {
   color: var(--bgl-white);
   background: var(--bgl-primary);
   z-index: 100;
@@ -105,10 +105,10 @@
   display: flex;
   flex-direction: column;
 }
-.nav * {
+.nav *[data-v-fddb4764] {
   user-select: none;
 }
-.nav-button {
+.nav-button[data-v-fddb4764] {
   text-decoration: none;
   cursor: pointer;
   display: flex;
@@ -119,11 +119,11 @@
   transition: all 0.2s ease;
   pointer-events: none;
 }
-.nav-button:hover {
+.nav-button[data-v-fddb4764]:hover {
   width: fit-content;
   pointer-events: all;
 }
-.nav-button .icon-font {
+.nav-button .icon-font[data-v-fddb4764] {
   font-size: 22px;
   margin: 0.25rem 10px;
   padding: 10px;
@@ -136,16 +136,16 @@
   transition: all 0.2s ease;
   pointer-events: all;
 }
-.nav-button:hover .icon-font,
-.nav-button.router-link-active .icon-font {
+.nav-button:hover .icon-font[data-v-fddb4764],
+.nav-button.router-link-active .icon-font[data-v-fddb4764] {
   background: var(--bgl-white);
   color: var(--bgl-primary);
 }
-.nav-button:hover .tooltip {
+.nav-button:hover .tooltip[data-v-fddb4764] {
   opacity: 1;
   pointer-events: all;
 }
-.tooltip {
+.tooltip[data-v-fddb4764] {
   background-color: var(--bgl-white);
   color: var(--bgl-primary);
   line-height: 1;
@@ -159,23 +159,23 @@
   opacity: 0;
   margin-inline-start: 1rem;
 }
-.tooltip:hover {
+.tooltip[data-v-fddb4764]:hover {
   filter: brightness(95%);
 }
-.tooltip:active {
+.tooltip[data-v-fddb4764]:active {
   filter: brightness(90%);
 }
-.bot-buttons-wrapper {
+.bot-buttons-wrapper[data-v-fddb4764] {
   margin-top: auto;
   width: 100%;
 }
-.nav-links-wrapper {
+.nav-links-wrapper[data-v-fddb4764] {
   direction: ltr;
 }
-[dir="rtl"] .nav-links-wrapper {
+[dir="rtl"] .nav-links-wrapper[data-v-fddb4764] {
   direction: rtl;
 }
-.nav-scroll {
+.nav-scroll[data-v-fddb4764] {
   overflow-y: scroll;
   width: 50vw;
   direction: rtl;
@@ -185,30 +185,30 @@
   display: flex;
   flex-direction: column;
 }
-.nav::-webkit-scrollbar-thumb {
+.nav[data-v-fddb4764]::-webkit-scrollbar-thumb {
   background-color: transparent;
 }
-.nav:hover::-webkit-scrollbar-thumb {
+.nav[data-v-fddb4764]:hover::-webkit-scrollbar-thumb {
   background-color: var(--bgl-gray);
 }
-[dir="rtl"] .nav-scroll {
+[dir="rtl"] .nav-scroll[data-v-fddb4764] {
   direction: ltr;
 }
-.full-nav {
+.full-nav[data-v-fddb4764] {
   height: 100%;
   display: flex;
   flex-direction: column;
 }
 @media screen and (min-width: 910px) {
-.nav.open .nav-expend {
+.nav.open .nav-expend[data-v-fddb4764] {
     margin-inline-start: 189px;
     transform: rotate(180deg);
 }
-.nav.open {
+.nav.open[data-v-fddb4764] {
     width: 200px;
     text-align: start;
 }
-.nav.open .tooltip {
+.nav.open .tooltip[data-v-fddb4764] {
     background-color: transparent;
     color: var(--bgl-white);
     padding: 0;
@@ -217,30 +217,30 @@
     opacity: 1;
     margin-inline-start: 0rem;
 }
-.nav.open .nav-button .icon-font {
+.nav.open .nav-button .icon-font[data-v-fddb4764] {
     margin: 0;
     background: transparent;
 }
-.nav.open .nav-button {
+.nav.open .nav-button[data-v-fddb4764] {
     width: 180px;
     border-radius: 10px;
     margin-inline-start: 10px;
     margin-top: 10px;
     margin-bottom: 10px;
 }
-.nav.open .nav-button:hover,
-  .nav.open .nav-button.router-link-active {
+.nav.open .nav-button[data-v-fddb4764]:hover,
+  .nav.open .nav-button.router-link-active[data-v-fddb4764] {
     background: var(--bgl-white);
     color: var(--bgl-primary);
 }
-.nav.open .nav-button:hover,
-  .nav.open .nav-button:hover .tooltip,
-  .nav.open .nav-button.router-link-active .tooltip {
+.nav.open .nav-button[data-v-fddb4764]:hover,
+  .nav.open .nav-button:hover .tooltip[data-v-fddb4764],
+  .nav.open .nav-button.router-link-active .tooltip[data-v-fddb4764] {
     color: var(--bgl-primary);
 }
 }
 @media screen and (max-width: 910px) {
-.full-nav {
+.full-nav[data-v-fddb4764] {
     height: auto;
     display: flex;
     flex-direction: row;
@@ -249,10 +249,10 @@
     inset-inline-end: 0;
     overflow-x: auto;
 }
-.nav.open {
+.nav.open[data-v-fddb4764] {
     width: initial;
 }
-.nav {
+.nav[data-v-fddb4764] {
     width: auto;
     display: flex;
     flex-direction: row;
@@ -260,7 +260,7 @@
     overflow-x: auto;
     justify-content: flex-start;
 }
-.tooltip {
+.tooltip[data-v-fddb4764] {
     opacity: 1;
     background: transparent;
     color: var(--bgl-white);
@@ -269,25 +269,25 @@
     padding: 0;
     margin: 0;
 }
-.nav-button {
+.nav-button[data-v-fddb4764] {
     flex-direction: column;
     margin: 12px 0.25rem;
 }
-.nav-button .icon-font {
+.nav-button .icon-font[data-v-fddb4764] {
     padding: 2px 0 0 0;
     margin: 0;
     height: 30px;
     width: 30px;
 }
-.nav-links-wrapper {
+.nav-links-wrapper[data-v-fddb4764] {
     display: flex;
 }
-.bot-buttons-wrapper {
+.bot-buttons-wrapper[data-v-fddb4764] {
     margin-top: 0;
     width: auto;
     display: flex;
 }
-.nav-scroll {
+.nav-scroll[data-v-fddb4764] {
     overflow-y: visible;
     width: auto;
     direction: auto;
@@ -298,10 +298,10 @@
     flex-direction: row;
     margin-inline-end: auto;
 }
-.nav::-webkit-scrollbar {
+.nav[data-v-fddb4764]::-webkit-scrollbar {
     display: none;
 }
-.nav-expend {
+.nav-expend[data-v-fddb4764] {
     display: none;
 }
 }
@@ -517,11 +517,11 @@
 			inset-inline-end: 5%;
 	}
 }
-.modal-title[data-v-93c9eab1] {
+.modal-title[data-v-bd719890] {
 	margin-top: 0.5rem;
 }
 @media screen and (max-width: 910px) {
-.modal-title[data-v-93c9eab1] {
+.modal-title[data-v-bd719890] {
 		margin-top: 1rem;
 }
 }
@@ -1400,16 +1400,16 @@ th[data-v-f3a410c2] {
   cursor: pointer;
 }
 
-.no-edit[data-v-d0543d4b] {
+.no-edit[data-v-dee6bdf5] {
   pointer-events: none;
 }
-.radio-wrap p[data-v-d0543d4b] {
+.radio-wrap p[data-v-dee6bdf5] {
   display: inline-block;
   color: var(--input-bg);
   font-size: var(--input-font-size);
   margin-inline-end: 10px;
 }
-.radio-wrap label[data-v-d0543d4b] {
+.radio-wrap label[data-v-dee6bdf5] {
   padding: 3px 5px;
   display: inline-block;
   border-radius: var(--input-border-radius);
@@ -1421,40 +1421,40 @@ th[data-v-f3a410c2] {
   cursor: pointer;
   user-select: none;
 }
-.bagel-input .radio-wrap label[data-v-d0543d4b]::after {
+.bagel-input .radio-wrap label[data-v-dee6bdf5]::after {
   background: transparent;
 }
-.radio-wrap input[data-v-d0543d4b] {
+.radio-wrap input[data-v-dee6bdf5] {
   display: none;
 }
-.radio-wrap input:checked:checked + label[data-v-d0543d4b] {
+.radio-wrap input:checked:checked + label[data-v-dee6bdf5] {
   background: var(--bgl-primary);
   color: var(--bgl-white);
 }
-.checkbox[data-v-d0543d4b] {
+.checkbox[data-v-dee6bdf5] {
   position: relative;
 }
-.switch[data-v-d0543d4b] {
+.switch[data-v-dee6bdf5] {
   position: relative;
   display: inline-block;
   height: calc(var(--input-height) / 2);
   width: var(--input-height);
   border-radius: var(--input-height);
 }
-.switch input[data-v-d0543d4b] {
+.switch input[data-v-dee6bdf5] {
   opacity: 0;
   width: 0;
   height: 0;
 }
-.bagel-input.checkbox.check[data-v-d0543d4b] {
+.bagel-input.checkbox.check[data-v-dee6bdf5] {
   margin: 0;
 }
-.bagel-input.checkbox.check .switch[data-v-d0543d4b] {
+.bagel-input.checkbox.check .switch[data-v-dee6bdf5] {
   width: calc(var(--input-height) / 2);
   height: calc(var(--input-height) / 2);
   transition: 0.2s;
 }
-.bagel-input.checkbox.check .slider[data-v-d0543d4b]:before {
+.bagel-input.checkbox.check .slider[data-v-dee6bdf5]:before {
   position: absolute;
   font-family: "Material Symbols Outlined", serif;
   content: "";
@@ -1464,11 +1464,11 @@ th[data-v-f3a410c2] {
   align-items: center;
   justify-content: center;
 }
-.bagel-input.checkbox.check input:checked + .slider[data-v-d0543d4b]:before {
+.bagel-input.checkbox.check input:checked + .slider[data-v-dee6bdf5]:before {
   transform: none;
   content: "check";
 }
-.slider[data-v-d0543d4b] {
+.slider[data-v-dee6bdf5] {
   position: absolute;
   cursor: pointer;
   top: 0;
@@ -1481,7 +1481,7 @@ th[data-v-f3a410c2] {
   border-radius: calc(var(--input-height) / 2);
   box-shadow: inset 0 0 10px #00000020;
 }
-.slider[data-v-d0543d4b]:before {
+.slider[data-v-dee6bdf5]:before {
   position: absolute;
   content: "";
   height: calc(var(--input-height) / 2 - 4px);
@@ -1493,10 +1493,10 @@ th[data-v-f3a410c2] {
   -webkit-transition: 0.4s;
   transition: 0.4s;
 }
-input:checked + .slider[data-v-d0543d4b] {
+input:checked + .slider[data-v-dee6bdf5] {
   background: var(--bgl-primary);
 }
-input:checked + .slider[data-v-d0543d4b]:before {
+input:checked + .slider[data-v-dee6bdf5]:before {
   transform: translateX(calc(var(--input-height) / 2));
 }
 
@@ -1730,82 +1730,60 @@ input:checked + .slider[data-v-d0543d4b]:before {
 	transform: translateY(-2.6rem);
 }
 
-.no-edit[data-v-0dacba34] {
-  pointer-events: none;
-}
-.radio-wrap p[data-v-0dacba34] {
-  display: inline-block;
-  color: var(--input-bg);
-  font-size: var(--input-font-size);
-  margin-inline-end: 10px;
-}
-.radio-wrap label[data-v-0dacba34] {
-  padding: 3px 5px;
-  display: inline-block;
-  border-radius: var(--input-border-radius);
-  font-size: var(--input-font-size);
-  background: var(--input-bg);
-  color: var(--bgl-black);
-  text-align: center;
-  margin: 8px 5px;
-  cursor: pointer;
-  user-select: none;
+:root {
+  --bgl-white: #fff;
+  --input-height: 40px;
+  --input-border-radius: 7px;
+  --bgl-transition: all 200ms ease;
+  --bgl-primary: #19b8ea;
 }
-.bagel-input .radio-wrap label[data-v-0dacba34]::after {
-  background: transparent;
+
+.bgl-checkbox[data-v-4594626f]{
+position: relative;
 }
-.radio-wrap input[data-v-0dacba34] {
+.bgl-checkbox input[type=checkbox][data-v-4594626f]{
   display: none;
 }
-.radio-wrap input:checked:checked + label[data-v-0dacba34] {
-  background: var(--bgl-primary);
-  color: var(--bgl-white);
-}
-.checkbox[data-v-0dacba34] {
-  position: relative;
-}
-.switch[data-v-0dacba34] {
-  position: relative;
-  display: inline-block;
-  height: calc(var(--input-height) / 2);
-  width: var(--input-height);
-  border-radius: var(--input-height);
+.bgl-checkbox label[data-v-4594626f]{
+  padding-inline-start: calc(var(--input-height) / 2 + 0.25rem);
+  transition: var(--bgl-transition);
+  cursor: pointer;
+  user-select: none;
 }
-.switch input[data-v-0dacba34] {
-  opacity: 0;
-  width: 0;
-  height: 0;
+.bgl-checkbox[data-v-4594626f]:hover{
+  filter: brightness(90%);
 }
-.slider[data-v-0dacba34] {
-  position: absolute;
-  cursor: pointer;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: var(--input-bg);
-  -webkit-transition: 0.4s;
-  transition: 0.4s;
-  border-radius: calc(var(--input-height) / 2);
-  box-shadow: inset 0 0 10px #00000020;
+.bgl-checkbox[data-v-4594626f]:active{
+  filter: var(--bgl-active-filter);
 }
-.slider[data-v-0dacba34]:before {
-  position: absolute;
+.bgl-checkbox label[data-v-4594626f]::before{
   content: "";
-  height: calc(var(--input-height) / 2 - 4px);
-  width: calc(var(--input-height) / 2 - 4px);
-  left: 2px;
-  bottom: 2px;
-  border-radius: 50%;
+  width: calc(var(--input-height) / 2.5);
+  height: calc(var(--input-height) / 2.5);
   background: var(--bgl-white);
-  -webkit-transition: 0.4s;
-  transition: 0.4s;
+  display: inline-block;
+  position: absolute;
+  margin-top: 0.25rem;
+  inset-inline-start: 0;
+  border-radius: calc(var(--input-border-radius) / 2) ;
+  border: var(--bgl-primary) 1px solid;
 }
-input:checked + .slider[data-v-0dacba34] {
+input:checked ~ label[data-v-4594626f]::before{
   background: var(--bgl-primary);
 }
-input:checked + .slider[data-v-0dacba34]:before {
-  transform: translateX(calc(var(--input-height) / 2));
+.bgl-checkbox svg[data-v-4594626f]{
+  width: calc(var(--input-height) / 2.5);
+  height: calc(var(--input-height) / 2.5);
+  position: absolute;
+  inset-inline-start: 0.05rem;
+  margin-top: 0.3rem;
+  z-index: 2;
+  fill: var(--bgl-white);
+  opacity: 0;
+  pointer-events: none;
+}
+input:checked ~ svg[data-v-4594626f]{
+  opacity: 1;
 }
 
 .currency[data-v-17a56a3f] {
@@ -2403,52 +2381,53 @@ input[type='email'][data-v-ed81a514] {
   color: var(--bgl-white);
 }
 
-.bagel-input .fileUploadWrap[data-v-352399c0] {
-  outline: 1px solid var(--border-color);
-  border-radius: var(--input-border-radius);
-  text-align: center;
-  cursor: pointer;
-  transition: var(--bgl-transition);
-  position: relative;
-  height: 132px;
-  font-size: var(--input-font-size);
+.bagel-input .fileUploadWrap[data-v-c44f8c0d] {
+	outline: 1px solid var(--border-color);
+	border-radius: var(--input-border-radius);
+	text-align: center;
+	cursor: pointer;
+	transition: var(--bgl-transition);
+	position: relative;
+	height: 132px;
+	font-size: var(--input-font-size);
 }
-.previewName[data-v-352399c0]{
-  padding: 0.5rem;
-  text-align: start;
-  color: var(--input-color);
-  display: grid;
-  grid-template-columns: 1fr 22px;
-  align-items: center;
+.previewName[data-v-c44f8c0d] {
+	padding: 0.5rem;
+	text-align: start;
+	color: var(--input-color);
+	display: grid;
+	grid-template-columns: 1fr 22px;
+	align-items: center;
 }
-.previewName p[data-v-352399c0]{
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
+.previewName p[data-v-c44f8c0d] {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
 }
-.imagePreviewWrap[data-v-352399c0]{
-  background: var(--input-bg);
-  border-radius: var(--input-border-radius);
-  height: 90px;
-  padding: 5px;
+.imagePreviewWrap[data-v-c44f8c0d] {
+	background: var(--input-bg);
+	border-radius: var(--input-border-radius);
+	height: 90px;
+	padding: 5px;
 }
-img.preview[data-v-352399c0] {
-  height: 80px;
-  border-radius: var(--input-border-radius);
-  object-fit: contain;
+img.preview[data-v-c44f8c0d] {
+	height: 80px;
+	border-radius: var(--input-border-radius);
+	object-fit: contain;
 }
-.fileUploadWrap.dragover[data-v-352399c0], .fileUploadWrap[data-v-352399c0]:hover{
-  box-shadow: inset 0 0 10px #00000012;
+.fileUploadWrap.dragover[data-v-c44f8c0d],
+.fileUploadWrap[data-v-c44f8c0d]:hover {
+	box-shadow: inset 0 0 10px #00000012;
 }
-.bagel-input .fileUploadWrap.fileDropZone[data-v-352399c0]{
-  background: var(--input-bg);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color:var(--bgl-gray);
+.bagel-input .fileUploadWrap.fileDropZone[data-v-c44f8c0d] {
+	background: var(--input-bg);
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	color: var(--bgl-gray);
 }
-.bagel-input .fileUploadWrap.fileDropZone[data-v-352399c0]:after {
-  content: "Drop files here or click to upload";
+.bagel-input .fileUploadWrap.fileDropZone[data-v-c44f8c0d]:after {
+	content: "Drop files here or click to upload";
 }
 
 .chart-line {
@@ -3315,7 +3294,6 @@ h6 {}
   --bgl-primary: #2E5BFF;
   --bgl-primary-tint: #2E5BFF80;
   --bgl-primary-light: #eef6ff;
-
   --bgl-blue-20: rgba(46, 91, 255, 20%);
   --bgl-blue-dark: #191c30;
   --bgl-blue-light: #eef6ff;
@@ -3402,12 +3380,6 @@ h6 {}
   display: flex;
   justify-content: flex-end;
 }
-body {
-  background-color: var(--bgl-bg);
-  color: var(--bgl-black);
-  font-family: var(--bgl-font);
-  overflow: hidden;
-}
 * {
   box-sizing: border-box;
 }

package/package.json

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

package/src/components/ModalBglForm.vue

@@ -35,10 +35,9 @@
 <script lang="ts" setup>
 import { onMounted, onUnmounted } from 'vue';
 import {
-	Btn, BtnOptions, useEscape, BagelForm,
+	Btn, BtnOptions, useEscape, BagelForm, type BglFormSchemaT,
 } from '@bagelink/vue';
 import '../styles/modal.css';
-import { BglFormSchemaT } from 'dist';
 
 const props = defineProps<{
 	side?: boolean;