@bagelink/vue 0.0.689 → 0.0.694

package/dist/plugins/bagel.d.ts

@@ -1,6 +1,5 @@
 import { InjectionKey, Plugin } from 'vue';
 import { Bagel } from '../../../sdk/src/index.ts';
-
 export declare const bagelInjectionKey: InjectionKey<Bagel>;
 export declare const i18nTInjectionKey: InjectionKey<(key: string) => string>;
 export declare function useBagel(): Bagel;

package/dist/plugins/modal.d.ts

@@ -1,6 +1,5 @@
 import { InjectionKey, Plugin } from 'vue';
 import { BglFormSchemaT, BtnOptions } from '..';
-
 export interface ModalOptions {
     title?: string;
     dismissable?: boolean;

package/dist/style.css

@@ -1283,10 +1283,10 @@ display: block;
 }
 .resize-observer[data-v-b329ee4c]{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;border:none;background-color:transparent;pointer-events:none;display:block;overflow:hidden;opacity:0}.resize-observer[data-v-b329ee4c] object{display:block;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}.v-popper__popper{z-index:10000;top:0;left:0;outline:none}.v-popper__popper.v-popper__popper--hidden{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s;pointer-events:none}.v-popper__popper.v-popper__popper--shown{visibility:visible;opacity:1;transition:opacity .15s}.v-popper__popper.v-popper__popper--skip-transition,.v-popper__popper.v-popper__popper--skip-transition>.v-popper__wrapper{transition:none!important}.v-popper__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;display:none}.v-popper__inner{position:relative;box-sizing:border-box;overflow-y:auto}.v-popper__inner>div{position:relative;z-index:1;max-width:inherit;max-height:inherit}.v-popper__arrow-container{position:absolute;width:10px;height:10px}.v-popper__popper--arrow-overflow .v-popper__arrow-container,.v-popper__popper--no-positioning .v-popper__arrow-container{display:none}.v-popper__arrow-inner,.v-popper__arrow-outer{border-style:solid;position:absolute;top:0;left:0;width:0;height:0}.v-popper__arrow-inner{visibility:hidden;border-width:7px}.v-popper__arrow-outer{border-width:6px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{left:-2px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{left:-1px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer{border-bottom-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container{top:0}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{border-top-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{top:-4px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{top:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{top:-1px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{border-left-width:0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{left:-4px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{left:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container{right:-10px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer{border-right-width:0;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner{left:-2px}.v-popper--theme-tooltip .v-popper__inner{background:rgba(0,0,0,.8);color:#fff;border-radius:6px;padding:7px 12px 6px}.v-popper--theme-tooltip .v-popper__arrow-outer{border-color:#000c}.v-popper--theme-dropdown .v-popper__inner{background:#fff;color:#000;border-radius:6px;border:1px solid #ddd;box-shadow:0 6px 30px #0000001a}.v-popper--theme-dropdown .v-popper__arrow-inner{visibility:visible;border-color:#fff}.v-popper--theme-dropdown .v-popper__arrow-outer{border-color:#ddd}
 
-.selectinput[data-v-6747635a] {
+.selectinput[data-v-b33955d5] {
 	width: 100%;
 }
-.selectinput-option[data-v-6747635a] {
+.selectinput-option[data-v-b33955d5] {
 	padding: 6px 12px;
 	cursor: pointer;
 	border-radius: 5px;
@@ -1297,14 +1297,14 @@ display: block;
 	width: 100%;
 	font-size: var(--input-font-size);
 }
-.selectinput-options[data-v-6747635a] {
+.selectinput-options[data-v-b33955d5] {
 	max-height: 300px;
 	overflow-y: auto;
 }
-.selectinput-option[data-v-6747635a]:hover {
+.selectinput-option[data-v-b33955d5]:hover {
 	background: var(--bgl-gray-20);
 }
-.isEmpty p[data-v-6747635a] {
+.isEmpty p[data-v-b33955d5] {
 	opacity: 0.3;
 }
 
@@ -1497,58 +1497,59 @@ display: block;
 	font-size: var(--label-font-size);
 }
 
-.bagel-input textarea[data-v-edac341b] {
+
+.bagel-input textarea[data-v-5193fa33] {
 	min-height: unset;
 	font-size: var(--input-font-size);
 }
-.bagel-input.text-input textarea[data-v-edac341b] {
+.bagel-input.text-input textarea[data-v-5193fa33] {
 	resize: none;
 }
-.code textarea[data-v-edac341b] {
+.code textarea[data-v-5193fa33] {
 	font-family: 'Inconsolata', monospace;
 	background: var(--bgl-black) !important;
 	color: var(--bgl-white) !important;
 }
-.code textarea[data-v-edac341b]::placeholder {
+.code textarea[data-v-5193fa33]::placeholder {
 	color: var(--bgl-white) !important;
 	opacity: 0.3;
 }
-.bagel-input.small[data-v-edac341b] {
+.bagel-input.small[data-v-5193fa33] {
 	margin-bottom: 0;
 	height: 30px;
 }
-.bagel-input.dense label[data-v-edac341b] {
+.bagel-input.dense label[data-v-5193fa33] {
 	display: flex;
 	align-items: center;
 	gap: 0.5rem;
 }
-.bagel-input input[data-v-edac341b]:disabled {
+.bagel-input input[data-v-5193fa33]:disabled {
 	background: #f5f5f5;
 }
-.bagel-input label[data-v-edac341b] {
+.bagel-input label[data-v-5193fa33] {
 	font-size: var(--label-font-size);
 }
-.textInputIconWrap[data-v-edac341b] {
+.textInputIconWrap[data-v-5193fa33] {
 	position: relative;
 }
-.textInputIconWrap .bgl_icon-font[data-v-edac341b] {
+.textInputIconWrap .bgl_icon-font[data-v-5193fa33] {
 	position: absolute;
 	inset-inline-end: 0.7rem;
 	bottom: 50%;
 	line-height: 0;
 	color: var(--bgl-gray);
 }
-.txtInputIconStart .iconStart[data-v-edac341b] {
+.txtInputIconStart .iconStart[data-v-5193fa33] {
 	position: absolute;
 	inset-inline-start: 0.7rem;
 	top: 50%;
 	line-height: 0;
 	color: var(--bgl-gray);
 }
-.txtInputIconStart textarea[data-v-edac341b] {
+.txtInputIconStart textarea[data-v-5193fa33] {
 	padding-inline-start: 2rem;
 }
-.bagel-input.small textarea[data-v-edac341b] {
+.bagel-input.small textarea[data-v-5193fa33] {
 	height: 30px;
 }
 
@@ -2053,7 +2054,7 @@ p {
 	border-radius: var(--input-border-radius);
 }
 
-.tel-input[data-v-4c2ef2c5] {
+.tel-input[data-v-f94249b5] {
 	direction: ltr;
 	text-align: left;
 	background: var(--input-bg);
@@ -2064,21 +2065,21 @@ p {
 	min-width: calc(var(--input-height) * 3);
 	width: 100%;
 }
-.tel-input[data-v-4c2ef2c5]:focus-within {
+.tel-input[data-v-f94249b5]:focus-within {
 	outline: none;
 	box-shadow: inset 0 0 10px #00000012;
 }
-.tel-input input[data-v-4c2ef2c5] {
+.tel-input input[data-v-f94249b5] {
 	background: transparent;
 }
-.tel-input input[data-v-4c2ef2c5]:focus-visible {
+.tel-input input[data-v-f94249b5]:focus-visible {
 	box-shadow: none;
 }
-.input_country-code[data-v-4c2ef2c5] {
+.input_country-code[data-v-f94249b5] {
 	font-size: var(--input-font-size);
 	color: var(--input-color);
 }
-.tel-country[data-v-4c2ef2c5] {
+.tel-country[data-v-f94249b5] {
 	font-size: var(--input-font-size);
 	max-width: 200px;
 	white-space: nowrap;
@@ -2087,7 +2088,7 @@ p {
 	margin-top: 0;
 	margin-bottom: 0;
 }
-.tel-countryp-dropdown[data-v-4c2ef2c5] {
+.tel-countryp-dropdown[data-v-f94249b5] {
 	direction: ltr;
 	text-align: left;
 }
@@ -6309,6 +6310,11 @@ select {
     font-family: inherit;
     width: 100%;
 }
+.bagel-input-error input,
+.bagel-input-error button,
+.bagel-input-error textarea {
+	outline: 1px solid var(--bgl-red);
+}
 .bagel-input {
     position: relative;
     display: flex;
@@ -6318,12 +6324,48 @@ select {
     width: 100%;
     color: var(--bgl-black);
 }
+.bagel-input::-webkit-input-placeholder .bagel-input label {
+    display: block;
+    font-size: var(--label-font-size);
+    margin-bottom: 2px;
+    line-height: 1.3;
+}
+.bagel-input::-moz-placeholder .bagel-input label {
+    display: block;
+    font-size: var(--label-font-size);
+    margin-bottom: 2px;
+    line-height: 1.3;
+}
+.bagel-input:-ms-input-placeholder .bagel-input label {
+    display: block;
+    font-size: var(--label-font-size);
+    margin-bottom: 2px;
+    line-height: 1.3;
+}
+.bagel-input::-ms-input-placeholder .bagel-input label {
+    display: block;
+    font-size: var(--label-font-size);
+    margin-bottom: 2px;
+    line-height: 1.3;
+}
 .bagel-input::placeholder .bagel-input label {
     display: block;
     font-size: var(--label-font-size);
     margin-bottom: 2px;
     line-height: 1.3;
 }
+.bagel-input::-webkit-input-placeholder {
+    color: var(--placeholder-color);
+}
+.bagel-input::-moz-placeholder {
+    color: var(--placeholder-color);
+}
+.bagel-input:-ms-input-placeholder {
+    color: var(--placeholder-color);
+}
+.bagel-input::-ms-input-placeholder {
+    color: var(--placeholder-color);
+}
 .bagel-input::placeholder {
     color: var(--placeholder-color);
 }
@@ -6348,6 +6390,18 @@ select {
     min-width: calc(var(--input-height) * 3);
     width: 100%;
 }
+.bagel-input input::-webkit-input-placeholder, .bagel-input textarea::-webkit-input-placeholder, .bagel-input select::-webkit-input-placeholder, .custom-select .input::-webkit-input-placeholder {
+    color: var(--placeholder-color);
+}
+.bagel-input input::-moz-placeholder, .bagel-input textarea::-moz-placeholder, .bagel-input select::-moz-placeholder, .custom-select .input::-moz-placeholder {
+    color: var(--placeholder-color);
+}
+.bagel-input input:-ms-input-placeholder, .bagel-input textarea:-ms-input-placeholder, .bagel-input select:-ms-input-placeholder, .custom-select .input:-ms-input-placeholder {
+    color: var(--placeholder-color);
+}
+.bagel-input input::-ms-input-placeholder, .bagel-input textarea::-ms-input-placeholder, .bagel-input select::-ms-input-placeholder, .custom-select .input::-ms-input-placeholder {
+    color: var(--placeholder-color);
+}
 .bagel-input input::placeholder,
 .bagel-input textarea::placeholder,
 .bagel-input select::placeholder,
@@ -6360,10 +6414,12 @@ select {
     align-items: center;
 }
 .bagel-input.search-wrap input {
-    padding-inline-end: 2rem;
+    -webkit-padding-end: 2rem;
+            padding-inline-end: 2rem;
 }
 .bagel-input.search-wrap .bgl_icon-font {
-    margin-inline-start: -1.75rem;
+    -webkit-margin-start: -1.75rem;
+            margin-inline-start: -1.75rem;
 }
 .bagel-input select {
     height: var(--input-height);
@@ -6378,6 +6434,8 @@ select {
 }
 .bagel-input input[type="radio"] {
     padding: 0;
+    width: -webkit-fit-content;
+    width: -moz-fit-content;
     width: fit-content;
 }
 .bagel-input:focus-within label {
@@ -6481,11 +6539,13 @@ select {
 .bagel-input input[type="color"]::-webkit-color-swatch {
     border-radius: var(--input-border-radius);
     border: none;
+    -webkit-transition: box-shadow 200ms ease;
     transition: box-shadow 200ms ease;
 }
 .bagel-input input[type="color"]::-moz-color-swatch {
     border-radius: var(--input-border-radius);
     border: none;
+    -moz-transition: box-shadow 200ms ease;
     transition: box-shadow 200ms ease;
 }
 .bagel-input input[type="color"]::-webkit-color-swatch:hover {

package/dist/types/BagelForm.d.ts

@@ -1,5 +1,4 @@
 import { SelectInput, TextInput } from '..';
-
 export type AttributeValue = string | number | boolean | null | undefined | Record<string, any>;
 export type AttributeFn<T = Record<string, any>> = (field: any, row: T) => AttributeValue;
 export interface Attributes<T = any> {

package/dist/types/BtnOptions.d.ts

@@ -1,5 +1,4 @@
 import { MaterialIcons, ThemeType } from '.';
-
 export interface BtnOptions {
     onClick?: () => void;
     color?: ThemeType;

package/dist/types/NavLink.d.ts

@@ -1,5 +1,4 @@
 import { MaterialIcons } from './materialIcons';
-
 export interface NavLink {
     label: string;
     to?: string;

package/dist/utils/BagelFormUtils.d.ts

@@ -1,5 +1,4 @@
-import { Field, Option } from '..';
-
+import { BglFormSchemaT, Field, Option } from '..';
 interface InputOptions {
     required?: boolean;
     placeholder?: string;
@@ -44,5 +43,6 @@ export declare function frmRow(...children: Field[]): {
     class: string;
     children: Field[];
 };
+export declare function findBglFieldById(id: string, _schema: BglFormSchemaT): Field | undefined;
 export {};
 //# sourceMappingURL=BagelFormUtils.d.ts.map

package/dist/utils/BagelFormUtils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BagelFormUtils.d.ts","sourceRoot":"","sources":["../../src/utils/BagelFormUtils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAElD,UAAU,YAAY;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,KAAK,WAAW,GAAG,YAAY,CAAA;AAE/B,UAAU,gBAAiB,SAAQ,YAAY;IAC9C,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,OAAO,CAAA;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,UAAU,gBAAiB,SAAQ,YAAY;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,UAAU,eAAgB,SAAQ,YAAY;IAC7C,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;CACb;AAED,KAAK,eAAe,GAAG,YAAY,CAAA;AAEnC,wBAAgB,YAAY,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,MAAM,EAAE,WAAW,GAAE,MAAM,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAM,EAAE,IAAI,GAAE,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAM,GAAG,KAAK,CAAC,CAAC,CAAC,CAIjI;AAED,wBAAgB,QAAQ,CACvB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,eAAe;;;;;;;;EAWzB;AAED,wBAAgB,QAAQ,CACvB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,gBAAgB,GACxB,KAAK,CAgBP;AAED,wBAAgB,SAAS,CACxB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,MAAM,MAAM,EAAE,CAAC,EACrC,MAAM,CAAC,EAAE,gBAAgB,GACvB,KAAK,CAgBP;AAED,wBAAgB,UAAU,CACzB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,eAAe,GACvB,KAAK,CAQP;AAED,wBAAgB,SAAS,CACxB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,WAAW,GACnB,KAAK,CAaP;AAED,wBAAgB,QAAQ,CACvB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,eAAe,GACvB,KAAK,CAoBP;AAED,wBAAgB,MAAM,CAAC,GAAG,QAAQ,EAAE,KAAK,EAAE;;;;EAM1C"}
+{"version":3,"file":"BagelFormUtils.d.ts","sourceRoot":"","sources":["../../src/utils/BagelFormUtils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAA;AAElE,UAAU,YAAY;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,KAAK,WAAW,GAAG,YAAY,CAAA;AAE/B,UAAU,gBAAiB,SAAQ,YAAY;IAC9C,IAAI,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,OAAO,CAAA;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,UAAU,gBAAiB,SAAQ,YAAY;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,UAAU,eAAgB,SAAQ,YAAY;IAC7C,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;CACb;AAED,KAAK,eAAe,GAAG,YAAY,CAAA;AAEnC,wBAAgB,YAAY,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,MAAM,EAAE,WAAW,GAAE,MAAM,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAM,EAAE,IAAI,GAAE,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAM,GAAG,KAAK,CAAC,CAAC,CAAC,CAIjI;AAED,wBAAgB,QAAQ,CACvB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,eAAe;;;;;;;;EAWzB;AAED,wBAAgB,QAAQ,CACvB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,gBAAgB,GACxB,KAAK,CAgBP;AAED,wBAAgB,SAAS,CACxB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,MAAM,MAAM,EAAE,CAAC,EACrC,MAAM,CAAC,EAAE,gBAAgB,GACvB,KAAK,CAgBP;AAED,wBAAgB,UAAU,CACzB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,eAAe,GACvB,KAAK,CAQP;AAED,wBAAgB,SAAS,CACxB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,WAAW,GACnB,KAAK,CAaP;AAED,wBAAgB,QAAQ,CACvB,EAAE,EAAE,MAAM,EACV,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,eAAe,GACvB,KAAK,CAoBP;AAED,wBAAgB,MAAM,CAAC,GAAG,QAAQ,EAAE,KAAK,EAAE;;;;EAM1C;AAED,wBAAgB,gBAAgB,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,GAAG,KAAK,GAAG,SAAS,CASvF"}

package/dist/utils/allCountries.d.ts

@@ -1,5 +1,4 @@
 import { CountryCode } from 'libphonenumber-js';
-
 export interface Country {
     name: string;
     iso2: CountryCode;

package/dist/utils/clickOutside.d.ts

@@ -1,5 +1,4 @@
 import { DirectiveBinding } from 'vue';
-
 declare const _default: {
     beforeMount(el: any, binding: DirectiveBinding): void;
     unmounted(el: any): void;

package/dist/utils/index.d.ts

@@ -1,5 +1,4 @@
 import { Attributes, BglFormSchemaT } from '..';
-
 export declare function debounce(fn: () => void, delay?: number): void;
 export declare function keyToLabel(key?: string): string | undefined;
 export declare function copyText(text: string, cb?: (msg: string) => void): Promise<void>;

package/dist/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAG/D,wBAAgB,QAAQ,CAAC,EAAE,EAAE,MAAM,IAAI,EAAE,KAAK,SAAM,QAGnD;AAED,wBAAgB,UAAU,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAK3D;AAED,wBAAsB,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,iBAGtE;AAED,wBAAgB,QAAQ,CAAC,GAAG,MAAM,EAAE,MAAM,EAAE,UAG3C;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,IAAI,QAIrE;AAED,wBAAgB,QAAQ,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,OAAO,EAAE,GAAG,EAAE,UAKpE;AAED,wBAAgB,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,KAAK,CAAC,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,OAU7F;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,OAM9C;AAED,wBAAgB,SAAS,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,OAAO,CAAC,EAAE,MAAM,OAGzE;AAED,eAAO,MAAM,MAAM,eAAgB,GAAG,YAA0C,CAAA;AAEhF,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAExC,OAAO,KAAK,cAAc,MAAM,kBAAkB,CAAA;AAElD,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAEhC,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,GAAG,EAAE,EAAE,UAAU,CAAC,EAAE,MAAM,EAAE,GAAG,cAAc,CAAC,CAAC,CAAC,CAe3F"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAG/D,wBAAgB,QAAQ,CAAC,EAAE,EAAE,MAAM,IAAI,EAAE,KAAK,SAAM,QAGnD;AAED,wBAAgB,UAAU,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAK3D;AAED,wBAAsB,QAAQ,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,iBAGtE;AAED,wBAAgB,QAAQ,CAAC,GAAG,MAAM,EAAE,MAAM,EAAE,UAG3C;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,IAAI,QAIrE;AAED,wBAAgB,QAAQ,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,OAAO,EAAE,GAAG,EAAE,UAKpE;AAED,wBAAgB,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,KAAK,CAAC,EAAE,UAAU,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,OAU7F;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,GAAG,OAM9C;AAED,wBAAgB,SAAS,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,OAAO,CAAC,EAAE,MAAM,OAGzE;AAED,eAAO,MAAM,MAAM,eAAgB,GAAG,YAA0C,CAAA;AAEhF,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAExC,OAAO,KAAK,cAAc,MAAM,kBAAkB,CAAA;AAElD,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAEhC,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,GAAG,EAAE,EAAE,UAAU,CAAC,EAAE,MAAM,EAAE,GAAG,cAAc,CAAC,CAAC,CAAC,CAa3F"}

package/dist/utils/lang.d.ts

@@ -1,7 +1,9 @@
+declare function $tdb<T extends Record<string, string>>(langEl?: T): string;
 export declare function useLang(): {
     lang: import('vue').WritableComputedRef<string>;
-    $tdb: (langEl: Record<string, any>) => any;
+    $tdb: typeof $tdb;
     availableLangs: import('vue').WritableComputedRef<string[]>;
     defaultLang: import('vue').WritableComputedRef<string>;
 };
+export {};
 //# sourceMappingURL=lang.d.ts.map

package/dist/utils/lang.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lang.d.ts","sourceRoot":"","sources":["../../src/utils/lang.ts"],"names":[],"mappings":"AAcA,wBAAgB,OAAO;;mBAMA,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;;;EAkBzC"}
+{"version":3,"file":"lang.d.ts","sourceRoot":"","sources":["../../src/utils/lang.ts"],"names":[],"mappings":"AAcA,iBAAS,IAAI,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,CAAC,EAAE,CAAC,GAAG,MAAM,CAOlE;AAED,wBAAgB,OAAO;;;;;EAsBtB"}

package/dist/utils/objects.d.ts

@@ -1,4 +1,5 @@
 import { BagelField } from '..';
+
 export declare function getPropByPath(obj: Record<string, any>, propPath?: string, bagelField?: BagelField): {};
 export declare function setPropByPath(obj: Record<string, any>, path?: string, value?: any): void;
 //# sourceMappingURL=objects.d.ts.map

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bagelink/vue",
   "type": "module",
-  "version": "0.0.689",
+  "version": "0.0.694",
   "description": "Bagel core sdk packages",
   "author": {
     "name": "Neveh Allon",
@@ -53,7 +53,7 @@
   "devDependencies": {
     "@types/signature_pad": "^2.3.6",
     "@vue-macros/reactivity-transform": "^1.0.3",
-    "vue": "^3.4.35"
+    "vue": "^3.4.38"
   },
   "peerDependencies": {
     "@bagelink/sdk": "*",
@@ -104,22 +104,22 @@
     "access": "public"
   },
   "dependencies": {
-    "@tiptap/extension-image": "^2.5.8",
-    "@tiptap/extension-table": "^2.5.8",
-    "@tiptap/extension-table-cell": "^2.5.8",
-    "@tiptap/extension-table-header": "^2.5.8",
-    "@tiptap/extension-table-row": "^2.5.8",
-    "@tiptap/extension-youtube": "^2.5.8",
-    "@tiptap/pm": "^2.5.8",
-    "@tiptap/starter-kit": "^2.5.8",
-    "@tiptap/vue-3": "^2.5.8",
+    "@tiptap/extension-image": "^2.6.3",
+    "@tiptap/extension-table": "^2.6.3",
+    "@tiptap/extension-table-cell": "^2.6.3",
+    "@tiptap/extension-table-header": "^2.6.3",
+    "@tiptap/extension-table-row": "^2.6.3",
+    "@tiptap/extension-youtube": "^2.6.3",
+    "@tiptap/pm": "^2.6.3",
+    "@tiptap/starter-kit": "^2.6.3",
+    "@tiptap/vue-3": "^2.6.3",
     "@vuepic/vue-datepicker": "^8.8.1",
-    "@vueuse/core": "^10.11.0",
-    "axios": "^1.7.3",
+    "@vueuse/core": "^10.11.1",
+    "axios": "^1.7.4",
     "floating-vue": "^5.2.2",
     "libphonenumber-js": "1.11.5",
     "signature_pad": "^5.0.2",
-    "type-fest": "^4.23.0"
+    "type-fest": "^4.24.0"
   },
   "scripts": {
     "dev": "tsx watch src/index.ts",

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

@@ -244,7 +244,11 @@ onMounted(() => {
 						:key="`${option}${i}`"
 						class="selectinput-option hover gap-1"
 						:class="{ selected: isSelected(option) }"
+						role="option"
+						tabindex="0"
+						:aria-selected="isSelected(option)"
 						@click="select(option)"
+						@keydown.enter="select(option)"
 					>
 						<Icon v-if="isSelected(option)" icon="check" />
 						<Icon

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

@@ -16,6 +16,31 @@ import {
 } from 'libphonenumber-js'
 import axios from 'axios'
 
+export interface Props {
+	label?: string
+	id?: string
+	class?: string
+	autocomplete?: 'on' | 'off' | 'tel'
+	placeholder?: string
+	required?: boolean
+	modelValue: string
+	allCountries?: Country[]
+	autoFormat?: boolean
+	customValidate?: boolean | RegExp
+	defaultCountry?: string | number
+	disabled?: boolean
+	searchable?: boolean
+	autoDefaultCountry?: boolean
+	inputOptions?: Partial<typeof defaultInputOptions>
+	dropdownOptions?: Partial<typeof defaultDropdownOptions>
+	excludeCountries?: string[]
+	mode?: NumberFormat
+	onlyCountries?: string[]
+	preferredCountries?: string[]
+	parseArg?: { extract?: boolean }
+	debounceDelay?: number
+}
+
 const props = withDefaults(defineProps<Props>(), {
 	modelValue: '',
 	autocomplete: 'on',
@@ -80,30 +105,6 @@ const defaultInputOptions = {
 	'placeholder': 'Enter a phone number',
 }
 
-interface Props {
-	label?: string
-	id?: string
-	autocomplete?: 'on' | 'off' | 'tel'
-	placeholder?: string
-	required?: boolean
-	modelValue: string
-	allCountries?: Country[]
-	autoFormat?: boolean
-	customValidate?: boolean | RegExp
-	defaultCountry?: string | number
-	disabled?: boolean
-	searchable?: boolean
-	autoDefaultCountry?: boolean
-	inputOptions?: Partial<typeof defaultInputOptions>
-	dropdownOptions?: Partial<typeof defaultDropdownOptions>
-	excludeCountries?: string[]
-	mode?: NumberFormat
-	onlyCountries?: string[]
-	preferredCountries?: string[]
-	parseArg?: { extract?: boolean }
-	debounceDelay?: number
-}
-
 const computedDropDownOptions = $computed(() => ({
 	...defaultDropdownOptions,
 	...props.dropdownOptions,
@@ -309,7 +310,7 @@ function handleInput(e: KeyboardEvent) {
 <template>
 	<div
 		class="bagel-input"
-		:class="{ disabled }"
+		:class="{ disabled, [props.class || '']: true }"
 	>
 		<label>
 			{{ label }}

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

@@ -144,6 +144,7 @@ onMounted(() => {
 .bagel-input label {
 	font-size: var(--label-font-size);
 }
+
 </style>
 
 <style scoped>

package/src/styles/inputs.css

@@ -5,6 +5,13 @@ select {
     width: 100%;
 }
 
+
+.bagel-input-error input,
+.bagel-input-error button,
+.bagel-input-error textarea {
+	outline: 1px solid var(--bgl-red);
+}
+
 .bagel-input {
     position: relative;
     display: flex;
@@ -15,6 +22,34 @@ select {
     color: var(--bgl-black);
 }
 
+.bagel-input::-webkit-input-placeholder .bagel-input label {
+    display: block;
+    font-size: var(--label-font-size);
+    margin-bottom: 2px;
+    line-height: 1.3;
+}
+
+.bagel-input::-moz-placeholder .bagel-input label {
+    display: block;
+    font-size: var(--label-font-size);
+    margin-bottom: 2px;
+    line-height: 1.3;
+}
+
+.bagel-input:-ms-input-placeholder .bagel-input label {
+    display: block;
+    font-size: var(--label-font-size);
+    margin-bottom: 2px;
+    line-height: 1.3;
+}
+
+.bagel-input::-ms-input-placeholder .bagel-input label {
+    display: block;
+    font-size: var(--label-font-size);
+    margin-bottom: 2px;
+    line-height: 1.3;
+}
+
 .bagel-input::placeholder .bagel-input label {
     display: block;
     font-size: var(--label-font-size);
@@ -22,6 +57,22 @@ select {
     line-height: 1.3;
 }
 
+.bagel-input::-webkit-input-placeholder {
+    color: var(--placeholder-color);
+}
+
+.bagel-input::-moz-placeholder {
+    color: var(--placeholder-color);
+}
+
+.bagel-input:-ms-input-placeholder {
+    color: var(--placeholder-color);
+}
+
+.bagel-input::-ms-input-placeholder {
+    color: var(--placeholder-color);
+}
+
 .bagel-input::placeholder {
     color: var(--placeholder-color);
 }
@@ -51,6 +102,26 @@ select {
 }
 
 
+.bagel-input input::-webkit-input-placeholder, .bagel-input textarea::-webkit-input-placeholder, .bagel-input select::-webkit-input-placeholder, .custom-select .input::-webkit-input-placeholder {
+    color: var(--placeholder-color);
+}
+
+
+.bagel-input input::-moz-placeholder, .bagel-input textarea::-moz-placeholder, .bagel-input select::-moz-placeholder, .custom-select .input::-moz-placeholder {
+    color: var(--placeholder-color);
+}
+
+
+.bagel-input input:-ms-input-placeholder, .bagel-input textarea:-ms-input-placeholder, .bagel-input select:-ms-input-placeholder, .custom-select .input:-ms-input-placeholder {
+    color: var(--placeholder-color);
+}
+
+
+.bagel-input input::-ms-input-placeholder, .bagel-input textarea::-ms-input-placeholder, .bagel-input select::-ms-input-placeholder, .custom-select .input::-ms-input-placeholder {
+    color: var(--placeholder-color);
+}
+
+
 .bagel-input input::placeholder,
 .bagel-input textarea::placeholder,
 .bagel-input select::placeholder,
@@ -65,11 +136,13 @@ select {
 }
 
 .bagel-input.search-wrap input {
-    padding-inline-end: 2rem;
+    -webkit-padding-end: 2rem;
+            padding-inline-end: 2rem;
 }
 
 .bagel-input.search-wrap .bgl_icon-font {
-    margin-inline-start: -1.75rem;
+    -webkit-margin-start: -1.75rem;
+            margin-inline-start: -1.75rem;
 }
 
 .bagel-input select {
@@ -88,6 +161,8 @@ select {
 
 .bagel-input input[type="radio"] {
     padding: 0;
+    width: -webkit-fit-content;
+    width: -moz-fit-content;
     width: fit-content;
 }
 
@@ -209,12 +284,14 @@ select {
 .bagel-input input[type="color"]::-webkit-color-swatch {
     border-radius: var(--input-border-radius);
     border: none;
+    -webkit-transition: box-shadow 200ms ease;
     transition: box-shadow 200ms ease;
 }
 
 .bagel-input input[type="color"]::-moz-color-swatch {
     border-radius: var(--input-border-radius);
     border: none;
+    -moz-transition: box-shadow 200ms ease;
     transition: box-shadow 200ms ease;
 }