@bagelink/vue 1.15.15 → 1.15.26

package/src/components/DataPreview.vue

@@ -70,33 +70,35 @@ const { renderField } = useSchemaField<T>({
 </template>
 
 <style scoped>
+
 .data-preview {
-	display: flex;
-	flex-direction: column;
-	gap: 0.5rem;
+display: flex;
+flex-direction: column;
+gap: 0.5rem;
 }
 
 .preview-field {
-	display: flex;
-	flex-direction: row;
-	align-items: center;
-	gap: 0.5rem;
+display: flex;
+flex-direction: row;
+align-items: center;
+gap: 0.5rem;
 }
 
 .field-label {
-	font-size: 0.8rem;
-	color: var(--bgl-black-tint);
-	font-weight: 500;
+font-size: 0.8rem;
+color: var(--bgl-black-tint);
+font-weight: 500;
 }
 
 .field-value {
-	font-size: 0.95rem;
+font-size: 0.95rem;
 }
 
 .empty-preview {
-	font-size: 0.9rem;
-	color: var(--bgl-black-tint);
-	padding: 1rem 0;
-	text-align: center;
+font-size: 0.9rem;
+color: var(--bgl-black-tint);
+padding: 1rem 0;
+text-align: center;
 }
+
 </style>

package/src/components/DragOver.vue

@@ -92,6 +92,7 @@ function handleDrop(e: DragEvent) {
 </template>
 
 <style scoped>
+
 .drag-over-container {
   position: relative;
 }
@@ -126,4 +127,5 @@ function handleDrop(e: DragEvent) {
   opacity: 0.6;
   cursor: not-allowed;
 }
+
 </style>

package/src/components/Dropdown.vue

@@ -298,73 +298,75 @@ defineExpose({ show, hide, shown })
 </template>
 
 <style>
+
 /* Reset browser UA popover styles */
 .bgl-dropdown {
-	margin: 0;
-	padding: 0;
-	border: none;
-	background: transparent;
-	overflow: visible;
-	position: fixed;
-	inset: unset;
-	top: 0;
-	left: 0;
+margin: 0;
+padding: 0;
+border: none;
+background: transparent;
+overflow: visible;
+position: fixed;
+inset: unset;
+top: 0;
+left: 0;
 }
 
 /* Mobile full-screen slide-up mode */
 .bgl-dropdown.bgl-dropdown--no-positioning {
-	inset: 0;
-	width: 100%;
-	height: 100%;
-	display: flex;
-	align-items: flex-end;
-	overflow: hidden;
+inset: 0;
+width: 100%;
+height: 100%;
+display: flex;
+align-items: flex-end;
+overflow: hidden;
 }
 
 .bgl-dropdown.bgl-dropdown--no-positioning .bgl-dropdown__backdrop {
-	position: absolute;
-	inset: 0;
-	background: rgba(0 0 0 / 90%);
+position: absolute;
+inset: 0;
+background: rgba(0 0 0 / 90%);
 }
 
 .bgl-dropdown.bgl-dropdown--no-positioning .bgl-dropdown__content {
-	width: 100%;
-	position: relative;
-	transform: translateY(0);
+width: 100%;
+position: relative;
+transform: translateY(0);
 }
 
 @starting-style {
-	.bgl-dropdown.bgl-dropdown--no-positioning:popover-open .bgl-dropdown__content {
-		transform: translateY(100%);
-	}
+.bgl-dropdown.bgl-dropdown--no-positioning:popover-open .bgl-dropdown__content {
+	transform: translateY(100%);
+}
 }
 
 .bgl-dropdown.bgl-dropdown--no-positioning .bgl-dropdown__content {
-	transition: transform 0.15s ease-out;
+transition: transform 0.15s ease-out;
 }
 
 /* Hide backdrop in normal mode */
 .bgl-dropdown:not(.bgl-dropdown--no-positioning) .bgl-dropdown__backdrop {
-	display: none;
+display: none;
 }
 
 /* Desktop open animation */
 @keyframes bgl-dropdown-enter {
-	from {
-		opacity: 0;
-		transform: translateY(-4px) scaleY(0.95);
-	}
+from {
+	opacity: 0;
+	transform: translateY(-4px) scaleY(0.95);
+}
 
-	to {
-		opacity: 1;
-		transform: translateY(0) scaleY(1);
-	}
+to {
+	opacity: 1;
+	transform: translateY(0) scaleY(1);
+}
 }
 
 .bgl-dropdown:not(.bgl-dropdown--no-positioning):popover-open {
-	animation: bgl-dropdown-enter 0.18s ease 0.04s both;
-	transform-origin: top left;
+animation: bgl-dropdown-enter 0.18s ease 0.04s both;
+transform-origin: top left;
 }
+
 </style>
 <!-- prettier-ignore-end -->
 <!-- eslint-enable -->

package/src/components/FieldSetVue.vue

@@ -15,9 +15,11 @@ defineProps<{
 </template>
 
 <style scoped>
-	fieldset {
-		border: 1px solid var(--bgl-border-color);
-		border-radius: var(--bgl-card-border-radius);
-		padding: var(--space-md);
-	}
+
+fieldset {
+	border: 1px solid var(--bgl-border-color);
+	border-radius: var(--bgl-card-border-radius);
+	padding: var(--space-md);
+}
+
 </style>

package/src/components/FilterQuery.vue

@@ -512,68 +512,72 @@ function onConnectorChange(id: string, connector: LogicalOperator) {
 </template>
 
 <style>
+
 .and-or-select {
-	--bgl-input-font-size: 12px !important;
-	--input-background-color: transparent !important;
+--bgl-input-font-size: 12px !important;
+--input-background-color: transparent !important;
 }
 
 .and-or-select .selectinput-btn {
-	border: none;
-	width: 100%;
-	box-shadow: none;
-	padding: 0 0.5rem !important;
-	font-size: 12px !important;
-	width: 100%;
+border: none;
+width: 100%;
+box-shadow: none;
+padding: 0 0.5rem !important;
+font-size: 12px !important;
+width: 100%;
 }
 
 .first-filter-row {
-	grid-template-columns: minmax(calc(140px + 0.25rem), 0.5fr) minmax(170px, 0.75fr) minmax(120px, 0.5fr) auto;
-	padding-top: 0 !important;
+grid-template-columns: minmax(calc(140px + 0.25rem), 0.5fr) minmax(170px, 0.75fr) minmax(120px, 0.5fr) auto;
+padding-top: 0 !important;
 }
 
 .filter-row {
-	grid-template-columns: 50px minmax(90px, 0.5fr) minmax(170px, 0.75fr) minmax(120px, 0.5fr) auto;
+grid-template-columns: 50px minmax(90px, 0.5fr) minmax(170px, 0.75fr) minmax(120px, 0.5fr) auto;
 }
 
 /* Transition animations */
 .condition-enter-active,
 .condition-leave-active {
-	transition: all 0.25s ease;
+transition: all 0.25s ease;
 }
 
 .condition-enter-from {
-	opacity: 0;
-	transform: translateX(-10px);
+opacity: 0;
+transform: translateX(-10px);
 }
 
 .condition-leave-to {
-	opacity: 0;
-	transform: translateX(10px);
+opacity: 0;
+transform: translateX(10px);
 }
 
 :dir(rtl) .condition-enter-from {
-	transform: translateX(10px);
+transform: translateX(10px);
 }
 
 :dir(rtl) .condition-leave-to {
-	transform: translateX(-10px);
+transform: translateX(-10px);
 }
 
 @media (max-width: 910px) {
 
-	.filter-row,
-	.first-filter-row {
-		grid-template-columns: auto;
-	}
+.filter-row,
+.first-filter-row {
+	grid-template-columns: auto;
+}
 }
+
 </style>
 
 <style>
+
 .borderHover * {
-	transition: all 0.2s ease-in-out !important;
+transition: all 0.2s ease-in-out !important;
 }
 
 .borderHover:hover {
-	--bgl-border-color: var(--bgl-primary);
+--bgl-border-color: var(--bgl-primary);
 }
+
 </style>

package/src/components/Image.vue

@@ -139,13 +139,15 @@ watch(() => [props.src, props.pathKey, props.modelValue], loadImage, { immediate
 </template>
 
 <style scoped>
+
 .img-web-kit {
-	max-width: 100%;
-	vertical-align: middle;
-	border: 0;
-	width: 100%;
+max-width: 100%;
+vertical-align: middle;
+border: 0;
+width: 100%;
 }
 .error-image {
-	background-color: var(--bgl-skeleton-bg);
+background-color: var(--bgl-skeleton-bg);
 }
+
 </style>

package/src/components/JSONSchema.vue

@@ -456,46 +456,47 @@ watch(() => props.modelValue, (newValue) => {
 </template>
 
 <style>
+
 .JSONSchema{
-	--bgl-input-height: 38px;
-	--bgl-accent-color: var(--bgl-purple);
-	container-type: inline-size;
-	container-name: json-schema;
+--bgl-input-height: 38px;
+--bgl-accent-color: var(--bgl-purple);
+container-type: inline-size;
+container-name: json-schema;
 }
 .jsonCheckbox{
-		--bgl-input-height: 44px;
+	--bgl-input-height: 44px;
 }
 .jsonFormat {
-	gap: 0.25rem !important;
-	display: grid !important;
-	grid-template-columns: repeat(auto-fit, minmax(50px, 1fr)) !important;
+gap: 0.25rem !important;
+display: grid !important;
+grid-template-columns: repeat(auto-fit, minmax(50px, 1fr)) !important;
 }
 .jsonFormat .bgl_btn-flex{
-	flex-direction: column;
+flex-direction: column;
 }
 .jsonFormat .bgl_btn{
-	height: auto !important;
-	font-size: 9px !important;
-	line-height: 0.75 !important;
-	border-radius: 0.5rem !important;
-	padding: 0.5rem !important;
-	background: var(--bgl-purple);
+height: auto !important;
+font-size: 9px !important;
+line-height: 0.75 !important;
+border-radius: 0.5rem !important;
+padding: 0.5rem !important;
+background: var(--bgl-purple);
 }
 .jsonFormat .bgl_icon-font{
-	font-size: 1.6rem !important;
+font-size: 1.6rem !important;
 }
 .arrayJsonSchema .txt-18{
-	font-size: 14px !important;
+font-size: 14px !important;
 }
 
 @container json-schema (max-width: 400px) {
-	.JSONSchema .grid-wrap-3 {
-		grid-template-columns: 1fr !important;
-	}
+.JSONSchema .grid-wrap-3 {
+	grid-template-columns: 1fr !important;
+}
 
-	.JSONSchema .grid-span-3 {
-		grid-column: 1 !important;
-	}
+.JSONSchema .grid-span-3 {
+	grid-column: 1 !important;
+}
 }
 
 /* transtion animations */
@@ -503,54 +504,55 @@ watch(() => props.modelValue, (newValue) => {
 /* Schema transition animations */
 .schema-transition-enter-active,
 .schema-transition-leave-active {
-	transition: all 0.4s ease;
-	position: relative;
+transition: all 0.4s ease;
+position: relative;
 }
 
 .schema-transition-enter-from {
-	opacity: 0;
-	transform: translateX(30px);
+opacity: 0;
+transform: translateX(30px);
 }
 
 .schema-transition-leave-to {
-	opacity: 0;
-	transform: translateX(-30px);
+opacity: 0;
+transform: translateX(-30px);
 }
 
 .schema-transition-leave-active {
-	position: absolute;
-	width: 100%;
-	z-index: 0;
+position: absolute;
+width: 100%;
+z-index: 0;
 }
 
 .schema-transition-enter-active {
-	z-index: 1;
+z-index: 1;
 }
 
 /* Number section transition for number/integer switch */
 .number-section-enter-active,
 .number-section-leave-active {
-	transition: all 0.25s ease;
-	position: relative;
+transition: all 0.25s ease;
+position: relative;
 }
 
 .number-section-enter-from {
-	opacity: 0;
-	transform: translateX(20px);
+opacity: 0;
+transform: translateX(20px);
 }
 
 .number-section-leave-to {
-	opacity: 0;
-	transform: translateX(-20px);
+opacity: 0;
+transform: translateX(-20px);
 }
 
 .number-section-leave-active {
-	position: absolute;
-	width: 100%;
-	z-index: 0;
+position: absolute;
+width: 100%;
+z-index: 0;
 }
 
 .number-section-enter-active {
-	z-index: 1;
+z-index: 1;
 }
+
 </style>

package/src/components/JsonBuilder.vue

@@ -214,19 +214,21 @@ watch(() => props.modelValue, () => {
 </template>
 
 <style scoped>
+
 .json-builder {
-	/* Add any custom styles here */
-	--bgl-input-height: 27px;
-	--bgl-input-font-size: 12px;
+/* Add any custom styles here */
+--bgl-input-height: 27px;
+--bgl-input-font-size: 12px;
 }
 .grid-json-builder-row{
-	grid-template-columns: 2fr 1fr 2fr auto;
-	grid-template-columns: 2fr 90px 2fr auto;
+grid-template-columns: 2fr 1fr 2fr auto;
+grid-template-columns: 2fr 90px 2fr auto;
 
-	gap: 0.5rem;
+gap: 0.5rem;
 }
 .grid-json-builder-row-basic{
-	grid-template-columns: 1fr 1fr auto;
-	gap: 0.5rem;
+grid-template-columns: 1fr 1fr auto;
+gap: 0.5rem;
 }
+
 </style>

package/src/components/ListItem.vue

@@ -100,77 +100,79 @@ const bind = computed(() => {
 </template>
 
 <style>
+
 button.list-item {
-	cursor: pointer;
-	display: flex;
-	gap: 0.5rem;
-	border: none;
-	background-color: unset;
-	width: 100%;
+cursor: pointer;
+display: flex;
+gap: 0.5rem;
+border: none;
+background-color: unset;
+width: 100%;
 
 }
 
 .list-item:disabled {
-	opacity: 0.5;
-	pointer-events: none;
+opacity: 0.5;
+pointer-events: none;
 }
 
 .list-item {
-	min-height: -webkit-fit-content;
-	min-height: -moz-fit-content;
-	min-height: fit-content;
-	margin: 0rem 0;
-	cursor: pointer;
-	transition: var(--bgl-transition);
-	color: var(--bgl-text-color);
-	text-decoration: none;
-	position: relative;
+min-height: -webkit-fit-content;
+min-height: -moz-fit-content;
+min-height: fit-content;
+margin: 0rem 0;
+cursor: pointer;
+transition: var(--bgl-transition);
+color: var(--bgl-text-color);
+text-decoration: none;
+position: relative;
 }
 
 .list-item>* {
-	margin-bottom: 0;
+margin-bottom: 0;
 }
 
 .list-item::after {
-	content: '';
-	position: absolute;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	border-bottom: 1px solid var(--bgl-border-color);
+content: '';
+position: absolute;
+left: 0;
+right: 0;
+bottom: 0;
+border-bottom: 1px solid var(--bgl-border-color);
 }
 
 .list-item:last-child::after {
-	content: '';
-	position: absolute;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	border-bottom: none;
+content: '';
+position: absolute;
+left: 0;
+right: 0;
+bottom: 0;
+border-bottom: none;
 }
 
 .list-item:hover,
 .list-item.router-link-exact-active {
-	background-color: var(--bgl-primary-tint);
+background-color: var(--bgl-primary-tint);
 }
 
 .notClickable:hover {
-	background-color: unset;
-	cursor: default;
+background-color: unset;
+cursor: default;
 }
 
 .list-item:active {
-	-webkit-filter: var(--bgl-hover-filter);
-	filter: var(--bgl-hover-filter);
+-webkit-filter: var(--bgl-hover-filter);
+filter: var(--bgl-hover-filter);
 }
 
 .no-border-list.list-item::after {
-	border-bottom: none;
+border-bottom: none;
 }
 
 @media screen and (max-width: 910px) {
-	.list-item {
-		padding: 0.5rem;
-	}
+.list-item {
+	padding: 0.5rem;
 }
+}
+
 </style>

package/src/components/ListView.vue

@@ -13,7 +13,9 @@
 </template>
 
 <style>
+
 .list-wrap {
-	grid-template-rows: auto 1fr;
+grid-template-rows: auto 1fr;
 }
+
 </style>

package/src/components/MapEmbed/Index.vue

@@ -119,6 +119,7 @@ onUnmounted(() => {
 </template>
 
 <style>
+
 .leaflet-map {
   height: 100%;
   border-radius: var(--bgl-input-border-radius);
@@ -178,7 +179,7 @@ onUnmounted(() => {
   padding-bottom: 2px;
 }
 .leaflet-bar a:last-child {
-	border-bottom: none !important;
+border-bottom: none !important;
 }
 
 .leaflet-bar a:hover {
@@ -190,6 +191,7 @@ onUnmounted(() => {
 }
 
 .leaflet-marker-icon {
-	cursor: pointer;
+cursor: pointer;
 }
+
 </style>