@bagelink/vue 1.4.32 → 1.4.34

package/dist/components/Modal.vue.d.ts

@@ -7,6 +7,7 @@ interface ModalProps {
     dismissable?: boolean;
     actions?: BtnOptions[];
     visible?: boolean;
+    zIndex?: number;
 }
 declare function closeModal(): void;
 declare function __VLS_template(): {
@@ -30,6 +31,7 @@ declare const __VLS_component: import('vue').DefineComponent<ModalProps, {
     thin: boolean;
     dismissable: boolean;
     visible: boolean;
+    zIndex: number;
     side: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;

package/dist/components/Modal.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.vue.d.ts","sourceRoot":"","sources":["../../src/components/Modal.vue"],"names":[],"mappings":"AAsKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAc/C,OAAO,qBAAqB,CAAA;AAE5B,UAAU,UAAU;IACnB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,OAAO,CAAC,EAAE,UAAU,EAAE,CAAA;IACtB,OAAO,CAAC,EAAE,OAAO,CAAA;CACjB;AAgCD,iBAAS,UAAU,SAGlB;AAyBD,iBAAS,cAAc;WAkKT,OAAO,IAA6B;;yBAZrB,GAAG;yBACF,GAAG;wBACJ,GAAG;;;;EAe/B;AAiBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;UA5Pb,OAAO;iBAIA,OAAO;aAEX,OAAO;UALV,OAAO;wFAqQb,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"Modal.vue.d.ts","sourceRoot":"","sources":["../../src/components/Modal.vue"],"names":[],"mappings":"AAyKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAc/C,OAAO,qBAAqB,CAAA;AAE5B,UAAU,UAAU;IACnB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,OAAO,CAAC,EAAE,UAAU,EAAE,CAAA;IACtB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,CAAA;CACf;AAiCD,iBAAS,UAAU,SAGlB;AA0BD,iBAAS,cAAc;WAmKT,OAAO,IAA6B;;yBAZrB,GAAG;yBACF,GAAG;wBACJ,GAAG;;;;EAe/B;AAiBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;UAhQb,OAAO;iBAIA,OAAO;aAEX,OAAO;YACR,MAAM;UANR,OAAO;wFAyQb,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/ModalConfirm.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalConfirm.vue.d.ts","sourceRoot":"","sources":["../../src/components/ModalConfirm.vue"],"names":[],"mappings":"AA0CA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAG9C,KAAK,WAAW,GAAG;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,SAAS,CAAA;IAC3B,cAAc,CAAC,EAAE,SAAS,CAAA;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;CACjC,CAAC;;;;;;AAiIF,wBAQG"}
+{"version":3,"file":"ModalConfirm.vue.d.ts","sourceRoot":"","sources":["../../src/components/ModalConfirm.vue"],"names":[],"mappings":"AA0CA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAG9C,KAAK,WAAW,GAAG;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,SAAS,CAAA;IAC3B,cAAc,CAAC,EAAE,SAAS,CAAA;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;CACjC,CAAC;;;;;;AAmIF,wBAQG"}

package/dist/components/form/inputs/RichText/composables/useEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useEditor.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/inputs/RichText/composables/useEditor.ts"],"names":[],"mappings":"AAmCA,wBAAgB,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mEAzBC,CAAC;;;;;8FAIJ,CAAC;;;6BAErB,CAAC;;;;;;;;;;;;;;qDAJ6B,CAAA;;+CAG/B,CAAA;;;;2CAKD,CADD;;;gBAiSoB,QAAQ;;;0BAhOR,MAAM,GAAG,MAAM;;;;;;;;;EAuTlC"}
+{"version":3,"file":"useEditor.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/inputs/RichText/composables/useEditor.ts"],"names":[],"mappings":"AAmCA,wBAAgB,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mEAzBC,CAAC;;;;;8FAIJ,CAAC;;;6BAErB,CAAC;;;;;;;;;;;;;;qDAJ+B,CAAC;;+CAGhC,CAAC;;;;2CAKJ,CAAC;;;gBAgSkB,QAAQ;;;0BAhOR,MAAM,GAAG,MAAM;;;;;;;;;EAuTlC"}

package/dist/components/form/inputs/RichText/richTextTypes.d.ts

@@ -1,4 +1,4 @@
-import { ModalApi } from '../../../../plugins/modal';
+import { ModalApi } from '../../../../plugins/useModal';
 export interface EditorDebuggerInstance {
     logCommand: (command: string, value: string | undefined, state: any) => void;
     logPaste: (data: DataTransfer, state: any) => void;

package/dist/components/form/inputs/RichText/richTextTypes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"richTextTypes.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/inputs/RichText/richTextTypes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAA;AAEzD,MAAM,WAAW,sBAAsB;IACtC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAC5E,QAAQ,EAAE,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IACvD,YAAY,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAClC,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IACtE,UAAU,EAAE,MAAM,GAAG,CAAA;IACrB,YAAY,EAAE,MAAM,IAAI,CAAA;IACxB,eAAe,EAAE,MAAM,IAAI,CAAA;IAC3B,aAAa,EAAE,MAAM,MAAM,CAAA;IAC3B,uBAAuB,EAAE,CAAC,WAAW,CAAC,EAAE,MAAM,KAAK,MAAM,CAAA;CACzD;AAED,MAAM,WAAW,oBAAoB;IACpC,QAAQ,EAAE,sBAAsB,CAAA;IAChC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IACrD,UAAU,EAAE,MAAM,GAAG,CAAA;IACrB,YAAY,EAAE,MAAM,IAAI,CAAA;IACxB,eAAe,EAAE,MAAM,IAAI,CAAA;IAC3B,qBAAqB,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;CAC/D;AAED,MAAM,WAAW,WAAW;IAC3B,OAAO,EAAE,MAAM,CAAA;IACf,GAAG,CAAC,EAAE,QAAQ,CAAA;IACd,SAAS,EAAE,SAAS,GAAG,IAAI,CAAA;IAC3B,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IAC3B,YAAY,EAAE,OAAO,CAAA;IACrB,WAAW,EAAE,OAAO,CAAA;IACpB,UAAU,EAAE,OAAO,CAAA;IACnB,OAAO,EAAE,OAAO,CAAA;IAChB,SAAS,EAAE,MAAM,EAAE,CAAA;IACnB,SAAS,EAAE,MAAM,EAAE,CAAA;IACnB,UAAU,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;IACnB,KAAK,EAAE,QAAQ,CAAA;IACf,KAAK,CAAC,EAAE,oBAAoB,CAAA;CAC5B;AAED,MAAM,MAAM,iBAAiB,GAC1B,MAAM,GACN,QAAQ,GACR,WAAW,GACX,aAAa,GACb,aAAa,GACb,eAAe,GACf,MAAM,GACN,OAAO,GACP,OAAO,GACP,OAAO,GACP,WAAW,GACX,UAAU,CAAA;AAEb,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAElE,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAA;AAExC,MAAM,MAAM,aAAa,GAAG,mBAAmB,EAAE,CAAA;AAEjD,MAAM,WAAW,aAAa;IAC7B,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;CACd"}
+{"version":3,"file":"richTextTypes.d.ts","sourceRoot":"","sources":["../../../../../src/components/form/inputs/RichText/richTextTypes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAA;AAE5D,MAAM,WAAW,sBAAsB;IACtC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAC5E,QAAQ,EAAE,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IACvD,YAAY,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAClC,QAAQ,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IACtE,UAAU,EAAE,MAAM,GAAG,CAAA;IACrB,YAAY,EAAE,MAAM,IAAI,CAAA;IACxB,eAAe,EAAE,MAAM,IAAI,CAAA;IAC3B,aAAa,EAAE,MAAM,MAAM,CAAA;IAC3B,uBAAuB,EAAE,CAAC,WAAW,CAAC,EAAE,MAAM,KAAK,MAAM,CAAA;CACzD;AAED,MAAM,WAAW,oBAAoB;IACpC,QAAQ,EAAE,sBAAsB,CAAA;IAChC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IACrD,UAAU,EAAE,MAAM,GAAG,CAAA;IACrB,YAAY,EAAE,MAAM,IAAI,CAAA;IACxB,eAAe,EAAE,MAAM,IAAI,CAAA;IAC3B,qBAAqB,EAAE,CAAC,OAAO,CAAC,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAA;CAC/D;AAED,MAAM,WAAW,WAAW;IAC3B,OAAO,EAAE,MAAM,CAAA;IACf,GAAG,CAAC,EAAE,QAAQ,CAAA;IACd,SAAS,EAAE,SAAS,GAAG,IAAI,CAAA;IAC3B,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IAC3B,YAAY,EAAE,OAAO,CAAA;IACrB,WAAW,EAAE,OAAO,CAAA;IACpB,UAAU,EAAE,OAAO,CAAA;IACnB,OAAO,EAAE,OAAO,CAAA;IAChB,SAAS,EAAE,MAAM,EAAE,CAAA;IACnB,SAAS,EAAE,MAAM,EAAE,CAAA;IACnB,UAAU,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAA;IACnB,KAAK,EAAE,QAAQ,CAAA;IACf,KAAK,CAAC,EAAE,oBAAoB,CAAA;CAC5B;AAED,MAAM,MAAM,iBAAiB,GAC1B,MAAM,GACN,QAAQ,GACR,WAAW,GACX,aAAa,GACb,aAAa,GACb,eAAe,GACf,MAAM,GACN,OAAO,GACP,OAAO,GACP,OAAO,GACP,WAAW,GACX,UAAU,CAAA;AAEb,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAElE,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAA;AAExC,MAAM,MAAM,aAAa,GAAG,mBAAmB,EAAE,CAAA;AAEjD,MAAM,WAAW,aAAa;IAC7B,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;CACd"}

package/dist/components/form/inputs/RichText/utils/media.d.ts

@@ -1,4 +1,4 @@
-import { ModalApi } from '../../../../../plugins/modal';
+import { ModalApi } from '../../../../../plugins/useModal';
 import { EditorState } from '../richTextTypes';
 export declare function insertImage(modal: ModalApi, state: EditorState): void;
 export declare function insertLink(modal: ModalApi, state: EditorState): void;

package/dist/components/form/inputs/RichText/utils/media.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"media.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/inputs/RichText/utils/media.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAA;AAE5D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAGnD,wBAAgB,WAAW,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,QA+C9D;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,QAoB7D;AAED,MAAM,WAAW,oBAAoB;IAAG,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,eAAe,CAAC,EAAE,OAAO,CAAA;CAAE;AAEjH,wBAAgB,WAAW,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,QA4D9D"}
+{"version":3,"file":"media.d.ts","sourceRoot":"","sources":["../../../../../../src/components/form/inputs/RichText/utils/media.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAE/D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAGnD,wBAAgB,WAAW,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,QA+C9D;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,QAoB7D;AAED,MAAM,WAAW,oBAAoB;IAAG,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,eAAe,CAAC,EAAE,OAAO,CAAA;CAAE;AAEjH,wBAAgB,WAAW,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,QA4D9D"}

package/dist/index.cjs

@@ -34948,7 +34948,8 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
     width: {},
     dismissable: { type: Boolean, default: true },
     actions: {},
-    visible: { type: Boolean, default: false }
+    visible: { type: Boolean, default: false },
+    zIndex: { default: 99 }
   },
   emits: ["update:visible"],
   setup(__props, { expose: __expose, emit: __emit }) {
@@ -34993,6 +34994,7 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", {
         class: vue.normalizeClass(["bg-dark", { "is-side": _ctx.side, "is-active": vue.unref(isVisible), "bg-lignt": false }]),
+        style: vue.normalizeStyle({ zIndex: _ctx.zIndex }),
         onClick: _cache[1] || (_cache[1] = () => _ctx.dismissable ? closeModal() : ""),
         onKeydown: vue.withKeys(closeModal, ["esc"])
       }, [
@@ -35047,7 +35049,7 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
           }),
           _: 3
         }, 8, ["style", "thin"])
-      ], 34);
+      ], 38);
     };
   }
 });
@@ -35082,7 +35084,8 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
         title: vue.unref(title),
         width: "380px",
         dismissable: false,
-        class: "txt-center"
+        class: "txt-center",
+        zIndex: 9999
       }, {
         footer: vue.withCtx(() => [
           vue.createVNode(vue.unref(Btn), {

package/dist/index.d.ts

@@ -2,7 +2,7 @@ export * from './components';
 export * from './components/form/useBagelFormState';
 export * from './composables';
 export { bagelInjectionKey, type BagelOptions, BagelVue, i18nTInjectionKey, useBagel, useI18nT, } from './plugins/bagel';
-export { ModalPlugin, useModal } from './plugins/modal';
+export { ModalPlugin, useModal } from './plugins/useModal';
 export * from './types';
 export * from './utils';
 export * from './utils/allCountries';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,qCAAqC,CAAA;AACnD,cAAc,eAAe,CAAA;AAC7B,OAAO,EACN,iBAAiB,EACjB,KAAK,YAAY,EACjB,QAAQ,EACR,iBAAiB,EACjB,QAAQ,EACR,QAAQ,GACR,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AACvD,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,sBAAsB,CAAA;AACpC,cAAc,wBAAwB,CAAA;AACtC,OAAO,oBAAoB,CAAA;AAE3B,cAAc,4BAA4B,CAAA;AAC1C,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,qCAAqC,CAAA;AACnD,cAAc,eAAe,CAAA;AAC7B,OAAO,EACN,iBAAiB,EACjB,KAAK,YAAY,EACjB,QAAQ,EACR,iBAAiB,EACjB,QAAQ,EACR,QAAQ,GACR,MAAM,iBAAiB,CAAA;AACxB,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAC1D,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,sBAAsB,CAAA;AACpC,cAAc,wBAAwB,CAAA;AACtC,OAAO,oBAAoB,CAAA;AAE3B,cAAc,4BAA4B,CAAA;AAC1C,cAAc,mBAAmB,CAAA;AACjC,cAAc,mBAAmB,CAAA"}

package/dist/index.mjs

@@ -34946,7 +34946,8 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
     width: {},
     dismissable: { type: Boolean, default: true },
     actions: {},
-    visible: { type: Boolean, default: false }
+    visible: { type: Boolean, default: false },
+    zIndex: { default: 99 }
   },
   emits: ["update:visible"],
   setup(__props, { expose: __expose, emit: __emit }) {
@@ -34991,6 +34992,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["bg-dark", { "is-side": _ctx.side, "is-active": unref(isVisible), "bg-lignt": false }]),
+        style: normalizeStyle({ zIndex: _ctx.zIndex }),
         onClick: _cache[1] || (_cache[1] = () => _ctx.dismissable ? closeModal() : ""),
         onKeydown: withKeys(closeModal, ["esc"])
       }, [
@@ -35045,7 +35047,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
           }),
           _: 3
         }, 8, ["style", "thin"])
-      ], 34);
+      ], 38);
     };
   }
 });
@@ -35080,7 +35082,8 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
         title: unref(title),
         width: "380px",
         dismissable: false,
-        class: "txt-center"
+        class: "txt-center",
+        zIndex: 9999
       }, {
         footer: withCtx(() => [
           createVNode(unref(Btn), {

package/dist/plugins/modalTypes.d.ts

@@ -8,6 +8,7 @@ export interface ModalOptions {
     actions?: BtnOptions[];
     class?: string;
     visible?: boolean;
+    zIndex?: number;
 }
 export interface ModalConfirmOptions {
     'title': string;

package/dist/plugins/modalTypes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"modalTypes.d.ts","sourceRoot":"","sources":["../../src/plugins/modalTypes.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"modalTypes.d.ts","sourceRoot":"","sources":["../../src/plugins/modalTypes.ts"],"names":[],"mappings":"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"}

package/dist/plugins/useModal.d.ts

@@ -0,0 +1,20 @@
+import { InjectionKey, Plugin } from 'vue';
+import { ConfirmModalUserOptions, ModalComponentProps, ModalFormComponentProps, ModalFormOptions, ModalOptions } from './modalTypes';
+export interface ModalApi {
+    showModal: <T extends {
+        [key: string]: any;
+    }>(options: ModalOptions, slots?: {
+        [key: string]: any;
+    }) => ModalComponentProps<T> | undefined;
+    showModalForm: <T extends {
+        [key: string]: any;
+    }>(options: ModalFormOptions<T>, slots?: {
+        [key: string]: any;
+    }) => ModalFormComponentProps<T> | undefined;
+    hideModal: (index?: number) => void;
+    confirmModal: (options: ConfirmModalUserOptions) => Promise<boolean>;
+}
+export declare const ModalSymbol: InjectionKey<ModalApi>;
+export declare function useModal(): ModalApi;
+export declare const ModalPlugin: Plugin;
+//# sourceMappingURL=useModal.d.ts.map

package/dist/plugins/useModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useModal.d.ts","sourceRoot":"","sources":["../../src/plugins/useModal.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,KAAK,CAAA;AAE/C,OAAO,KAAK,EAAE,uBAAuB,EAAE,mBAAmB,EAAuB,uBAAuB,EAAE,gBAAgB,EAAE,YAAY,EAAa,MAAM,cAAc,CAAA;AAIzK,MAAM,WAAW,QAAQ;IACxB,SAAS,EAAE,CAAC,CAAC,SAAS;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,EAAE,OAAO,EAAE,YAAY,EAAE,KAAK,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,KAAK,mBAAmB,CAAC,CAAC,CAAC,GAAG,SAAS,CAAA;IAC1I,aAAa,EAAE,CAAC,CAAC,SAAS;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,EAAE,OAAO,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,KAAK,uBAAuB,CAAC,CAAC,CAAC,GAAG,SAAS,CAAA;IACzJ,SAAS,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,YAAY,EAAE,CAAC,OAAO,EAAE,uBAAuB,KAAK,OAAO,CAAC,OAAO,CAAC,CAAA;CACpE;AAED,eAAO,MAAM,WAAW,EAAE,YAAY,CAAC,QAAQ,CAAmB,CAAA;AAElE,wBAAgB,QAAQ,IAAI,QAAQ,CAInC;AAED,eAAO,MAAM,WAAW,EAAE,MAuEzB,CAAA"}

package/dist/style.css

@@ -3760,145 +3760,140 @@ svg.leaflet-image-layer.leaflet-interactive path {
 	cursor: pointer;
 }
 .bg-dark {
-    position: fixed;
-    top: 0;
-    right: 0;
-    left: 0;
-    bottom: 0;
-    background-color: var(--bgl-dark-bg);
-    z-index: 999;
-    pointer-events: none;
-    opacity: 0;
-    transition: all ease-in-out 0.3s;
-    max-height: 100vh;
-    overflow: scroll;
-    margin: 0 auto;
-    width: 100%;
-    display: grid;
-    align-items: center;
-    overflow-x: hidden;
+	position: fixed;
+	top: 0;
+	right: 0;
+	left: 0;
+	bottom: 0;
+	background-color: var(--bgl-dark-bg);
+	pointer-events: none;
+	opacity: 0;
+	transition: all ease-in-out 0.3s;
+	max-height: 100vh;
+	overflow: scroll;
+	margin: 0 auto;
+	width: 100%;
+	display: grid;
+	align-items: center;
+	overflow-x: hidden;
 }
 
-
 .bg-lignt {
-    background-color: var(--bgl-white);
+	background-color: var(--bgl-white);
 }
 
 .modal {
-    width: 96%;
-    max-width: 720px;
-    /* transform: scale(0.5); */
-    /* opacity: 0; */
-    transition: all ease-in-out 0.18s;
-    margin-left: auto;
-    margin-right: auto;
-    height: fit-content;
+	width: 96%;
+	max-width: 720px;
+	/* transform: scale(0.5); */
+	/* opacity: 0; */
+	transition: all ease-in-out 0.18s;
+	margin-left: auto;
+	margin-right: auto;
+	height: fit-content;
 }
 
 .is-active .modal {
-    animation: 200ms ease bgl-modal-animation;
-
+	animation: 200ms ease bgl-modal-animation;
 }
 
 @keyframes bgl-modal-animation {
-    from {
-        scale: 0.7;
-        transform: translateY(2rem);
-    }
-
-    to {
-        scale: 1;
-        transform: translateY(0);
+	from {
+		scale: 0.7;
+		transform: translateY(2rem);
+	}
 
-    }
+	to {
+		scale: 1;
+		transform: translateY(0);
+	}
 }
 
 .small-modal .modal {
-    max-width: 300px;
-    text-align: center;
+	max-width: 300px;
+	text-align: center;
 }
 
 .tool-bar {
-    margin: -1rem -1rem 1rem;
-    display: flex;
-    justify-content: space-between;
-    position: -webkit-sticky;
-    position: sticky;
-    padding-top: 0rem;
-    top: 0rem;
-    z-index: 3;
-    background: var(--bgl-popup-bg);
-    border-radius: var(--card-border-radius);
+	margin: -1rem -1rem 1rem;
+	display: flex;
+	justify-content: space-between;
+	position: -webkit-sticky;
+	position: sticky;
+	padding-top: 0rem;
+	top: 0rem;
+	z-index: 3;
+	background: var(--bgl-popup-bg);
+	border-radius: var(--card-border-radius);
 }
 
 .modal-size {
-    cursor: pointer;
+	cursor: pointer;
 }
 
 .is-side .modal {
-    inset-inline-end: -1720px;
-    opacity: 1;
-    max-width: 600px;
-    width: 90%;
-    margin-top: 1rem;
-    margin-bottom: 1rem;
-    margin-inline-start: auto;
-    margin-inline-end: 20px;
-    min-height: calc(100vh - 40px);
-    transform: translateX(100%);
+	inset-inline-end: -1720px;
+	opacity: 1;
+	max-width: 600px;
+	width: 90%;
+	margin-top: 1rem;
+	margin-bottom: 1rem;
+	margin-inline-start: auto;
+	margin-inline-end: 20px;
+	min-height: calc(100vh - 40px);
+	transform: translateX(100%);
 }
 
 .is-active .modal {
-    opacity: 1;
-    box-shadow: 6px 6px 20px 20px #0000001c;
+	opacity: 1;
+	box-shadow: 6px 6px 20px 20px #0000001c;
 }
 
 .bg-lignt .modal {
-    border: 1px solid var(--border-color);
+	border: 1px solid var(--border-color);
 }
 
 .bg-lignt.is-active .modal {
-    box-shadow: none;
+	box-shadow: none;
 }
 
 .is-active.is-side .modal {
-    inset-inline-end: 0px;
-    transform: translateX(0%);
+	inset-inline-end: 0px;
+	transform: translateX(0%);
 }
 
 .bg-dark.is-active {
-    opacity: 1;
-    pointer-events: all;
+	opacity: 1;
+	pointer-events: all;
 }
 
 body:has(.bg-dark.is-active) {
-    overflow: hidden;
+	overflow: hidden;
 }
 
 .is-side.bg-dark.is-active {
-    opacity: 1;
-    align-items: stretch;
+	opacity: 1;
+	align-items: stretch;
 }
 
 .is-side.is-active .modal {
-    pointer-events: all;
+	pointer-events: all;
 }
 
 @media screen and (max-width: 910px) {
-    .tool-bar {
-        margin: -1rem 0rem 1rem;
-        padding-bottom: 1rem;
-        align-items: center;
-    }
-
-    .is-active.is-side .modal {
-        margin-inline-end: 2%;
-        margin-inline-start: 2%;
-        width: 98%;
-
-    }
+	.tool-bar {
+		margin: -1rem 0rem 1rem;
+		padding-bottom: 1rem;
+		align-items: center;
+	}
 
+	.is-active.is-side .modal {
+		margin-inline-end: 2%;
+		margin-inline-start: 2%;
+		width: 98%;
+	}
 }
+
 .modal{
 	color: var(--bgl-popup-text);
 	/* display: flex;
@@ -15367,31 +15362,6 @@ select {
     margin-bottom: 0.5rem;
     width: 100%;
     color: var(--bgl-text-color);
-}.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 {
@@ -15546,7 +15516,7 @@ select {
 .bagel-input.light-input select:focus-visible,
 .bagel-input.light-input textarea:focus-visible {
     box-shadow: inset 0 0 2px var(--bgl-popup-text) !important;
-}.bagel-input input[type='number']-webkit-inner-spin-button,
+}.bagel-input input[type='number']::-webkit-inner-spin-button,
 .bagel-input input[type='number']::-webkit-outer-spin-button {
     -webkit-appearance: none;
 }.label-count-0 label {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bagelink/vue",
   "type": "module",
-  "version": "1.4.32",
+  "version": "1.4.34",
   "description": "Bagel core sdk packages",
   "author": {
     "name": "Neveh Allon",
@@ -89,8 +89,8 @@
     "@vueuse/core": "^13.3.0",
     "axios": "^1.9.0",
     "floating-vue": "^5.2.2",
-    "libphonenumber-js": "1.12.8",
-    "signature_pad": "^5.0.7"
+    "libphonenumber-js": "1.12.9",
+    "signature_pad": "^5.0.8"
   },
   "scripts": {
     "dev": "tsx watch src/index.ts",

package/src/components/Modal.vue

@@ -23,12 +23,14 @@ interface ModalProps {
 	dismissable?: boolean
 	actions?: BtnOptions[]
 	visible?: boolean
+	zIndex?: number
 }
 const props = withDefaults(defineProps<ModalProps>(), {
 	thin: false,
 	side: false,
 	dismissable: true,
 	visible: false,
+	zIndex: 99,
 })
 
 const emit = defineEmits(['update:visible'])
@@ -77,6 +79,7 @@ onUnmounted(() => {
 <template>
 	<div
 		class="bg-dark"
+		:style="{ zIndex }"
 		:class="{ 'is-side': side, 'is-active': isVisible, 'bg-lignt': false }"
 		@click="() => (dismissable ? closeModal() : '')"
 		@keydown.esc="closeModal"

package/src/components/ModalConfirm.vue

@@ -28,7 +28,7 @@ const cancelBtnColor: ThemeType = props.cancelBtnColor || 'gray'
 </script>
 
 <template>
-	<Modal :title="title" width="380px" :dismissable="false" class="txt-center">
+	<Modal :title="title" width="380px" :dismissable="false" class="txt-center" :zIndex="9999">
 		<p class="pb-05 pretty">
 			{{ message }}
 		</p>

package/src/components/form/inputs/RichText/richTextTypes.ts

@@ -1,4 +1,4 @@
-import type { ModalApi } from '../../../../plugins/modal'
+import type { ModalApi } from '../../../../plugins/useModal'
 
 export interface EditorDebuggerInstance {
 	logCommand: (command: string, value: string | undefined, state: any) => void

package/src/components/form/inputs/RichText/utils/media.ts

@@ -1,5 +1,5 @@
 import type { BaseBagelField } from '@bagelink/vue'
-import type { ModalApi } from '../../../../../plugins/modal'
+import type { ModalApi } from '../../../../../plugins/useModal'
 
 import type { EditorState } from '../richTextTypes'
 import { bagelFormUtils as bglFrmUtil } from '@bagelink/vue'

package/src/index.ts

@@ -9,7 +9,7 @@ export {
 	useBagel,
 	useI18nT,
 } from './plugins/bagel'
-export { ModalPlugin, useModal } from './plugins/modal'
+export { ModalPlugin, useModal } from './plugins/useModal'
 export * from './types'
 export * from './utils'
 export * from './utils/allCountries'

package/src/plugins/modalTypes.ts

@@ -9,6 +9,7 @@ export interface ModalOptions {
 	actions?: BtnOptions[]
 	class?: string
 	visible?: boolean
+	zIndex?: number
 }
 
 export interface ModalConfirmOptions {

package/src/styles/inputs.css

@@ -21,41 +21,6 @@ select {
     color: var(--bgl-text-color);
 }
 
-.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);
 }
@@ -284,7 +249,7 @@ select {
     box-shadow: inset 0 0 2px var(--bgl-popup-text) !important;
 }
 
-.bagel-input input[type='number']-webkit-inner-spin-button,
+.bagel-input input[type='number']::-webkit-inner-spin-button,
 .bagel-input input[type='number']::-webkit-outer-spin-button {
     -webkit-appearance: none;
 }

package/src/styles/modal.css

@@ -1,140 +1,134 @@
 .bg-dark {
-    position: fixed;
-    top: 0;
-    right: 0;
-    left: 0;
-    bottom: 0;
-    background-color: var(--bgl-dark-bg);
-    z-index: 999;
-    pointer-events: none;
-    opacity: 0;
-    transition: all ease-in-out 0.3s;
-    max-height: 100vh;
-    overflow: scroll;
-    margin: 0 auto;
-    width: 100%;
-    display: grid;
-    align-items: center;
-    overflow-x: hidden;
+	position: fixed;
+	top: 0;
+	right: 0;
+	left: 0;
+	bottom: 0;
+	background-color: var(--bgl-dark-bg);
+	pointer-events: none;
+	opacity: 0;
+	transition: all ease-in-out 0.3s;
+	max-height: 100vh;
+	overflow: scroll;
+	margin: 0 auto;
+	width: 100%;
+	display: grid;
+	align-items: center;
+	overflow-x: hidden;
 }
 
-
 .bg-lignt {
-    background-color: var(--bgl-white);
+	background-color: var(--bgl-white);
 }
 
 .modal {
-    width: 96%;
-    max-width: 720px;
-    /* transform: scale(0.5); */
-    /* opacity: 0; */
-    transition: all ease-in-out 0.18s;
-    margin-left: auto;
-    margin-right: auto;
-    height: fit-content;
+	width: 96%;
+	max-width: 720px;
+	/* transform: scale(0.5); */
+	/* opacity: 0; */
+	transition: all ease-in-out 0.18s;
+	margin-left: auto;
+	margin-right: auto;
+	height: fit-content;
 }
 
 .is-active .modal {
-    animation: 200ms ease bgl-modal-animation;
-
+	animation: 200ms ease bgl-modal-animation;
 }
 
 @keyframes bgl-modal-animation {
-    from {
-        scale: 0.7;
-        transform: translateY(2rem);
-    }
+	from {
+		scale: 0.7;
+		transform: translateY(2rem);
+	}
 
-    to {
-        scale: 1;
-        transform: translateY(0);
-
-    }
+	to {
+		scale: 1;
+		transform: translateY(0);
+	}
 }
 
 .small-modal .modal {
-    max-width: 300px;
-    text-align: center;
+	max-width: 300px;
+	text-align: center;
 }
 
 .tool-bar {
-    margin: -1rem -1rem 1rem;
-    display: flex;
-    justify-content: space-between;
-    position: -webkit-sticky;
-    position: sticky;
-    padding-top: 0rem;
-    top: 0rem;
-    z-index: 3;
-    background: var(--bgl-popup-bg);
-    border-radius: var(--card-border-radius);
+	margin: -1rem -1rem 1rem;
+	display: flex;
+	justify-content: space-between;
+	position: -webkit-sticky;
+	position: sticky;
+	padding-top: 0rem;
+	top: 0rem;
+	z-index: 3;
+	background: var(--bgl-popup-bg);
+	border-radius: var(--card-border-radius);
 }
 
 .modal-size {
-    cursor: pointer;
+	cursor: pointer;
 }
 
 .is-side .modal {
-    inset-inline-end: -1720px;
-    opacity: 1;
-    max-width: 600px;
-    width: 90%;
-    margin-top: 1rem;
-    margin-bottom: 1rem;
-    margin-inline-start: auto;
-    margin-inline-end: 20px;
-    min-height: calc(100vh - 40px);
-    transform: translateX(100%);
+	inset-inline-end: -1720px;
+	opacity: 1;
+	max-width: 600px;
+	width: 90%;
+	margin-top: 1rem;
+	margin-bottom: 1rem;
+	margin-inline-start: auto;
+	margin-inline-end: 20px;
+	min-height: calc(100vh - 40px);
+	transform: translateX(100%);
 }
 
 .is-active .modal {
-    opacity: 1;
-    box-shadow: 6px 6px 20px 20px #0000001c;
+	opacity: 1;
+	box-shadow: 6px 6px 20px 20px #0000001c;
 }
 
 .bg-lignt .modal {
-    border: 1px solid var(--border-color);
+	border: 1px solid var(--border-color);
 }
 
 .bg-lignt.is-active .modal {
-    box-shadow: none;
+	box-shadow: none;
 }
 
 .is-active.is-side .modal {
-    inset-inline-end: 0px;
-    transform: translateX(0%);
+	inset-inline-end: 0px;
+	transform: translateX(0%);
 }
 
 .bg-dark.is-active {
-    opacity: 1;
-    pointer-events: all;
+	opacity: 1;
+	pointer-events: all;
 }
 
 body:has(.bg-dark.is-active) {
-    overflow: hidden;
+	overflow: hidden;
 }
 
 .is-side.bg-dark.is-active {
-    opacity: 1;
-    align-items: stretch;
+	opacity: 1;
+	align-items: stretch;
 }
 
 .is-side.is-active .modal {
-    pointer-events: all;
+	pointer-events: all;
 }
 
 @media screen and (max-width: 910px) {
-    .tool-bar {
-        margin: -1rem 0rem 1rem;
-        padding-bottom: 1rem;
-        align-items: center;
-    }
-
-    .is-active.is-side .modal {
-        margin-inline-end: 2%;
-        margin-inline-start: 2%;
-        width: 98%;
-
-    }
-
-}
+	.tool-bar {
+		margin: -1rem 0rem 1rem;
+		padding-bottom: 1rem;
+		align-items: center;
+	}
+
+	.is-active.is-side .modal {
+		margin-inline-end: 2%;
+		margin-inline-start: 2%;
+		width: 98%;
+	}
+}