@bagelink/vue 0.0.1062 → 0.0.1064
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Zoomer.vue.d.ts.map +1 -1
- package/dist/components/dialog/index.d.ts +19 -0
- package/dist/components/dialog/index.d.ts.map +1 -0
- package/dist/components/form/inputs/TelInput.vue.d.ts.map +1 -1
- package/dist/components/form/inputs/TextInput.vue.d.ts.map +1 -1
- package/dist/index.cjs +16 -17
- package/dist/index.mjs +16 -17
- package/dist/style.css +23 -23
- package/package.json +1 -1
- package/src/components/Zoomer.vue +5 -7
- package/src/components/dialog/index.ts +192 -0
- package/src/components/form/inputs/TelInput.vue +6 -2
- package/src/components/form/inputs/TextInput.vue +4 -6
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Zoomer.vue.d.ts","sourceRoot":"","sources":["../../src/components/Zoomer.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Zoomer.vue.d.ts","sourceRoot":"","sources":["../../src/components/Zoomer.vue"],"names":[],"mappings":"AA+XA,UAAU,KAAK;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;CAClB;AAsED,iBAAS,KAAK,SAKb;AAyPD,iBAAS,cAAc;WA6CT,OAAO,IAA6B;;yBATrB,GAAG;;;;;;EAc/B;AAgBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;6FASnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAWpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { Component, Plugin } from 'vue';
|
|
2
|
+
export interface DialogOptions {
|
|
3
|
+
title?: string;
|
|
4
|
+
content?: string | Component;
|
|
5
|
+
dismissable?: boolean;
|
|
6
|
+
width?: string;
|
|
7
|
+
actions?: Array<{
|
|
8
|
+
label: string;
|
|
9
|
+
onClick: () => void;
|
|
10
|
+
variant?: 'primary' | 'secondary' | 'danger';
|
|
11
|
+
}>;
|
|
12
|
+
}
|
|
13
|
+
export interface DialogApi {
|
|
14
|
+
show: (options: DialogOptions) => void;
|
|
15
|
+
hide: () => void;
|
|
16
|
+
}
|
|
17
|
+
export declare function useDialog(): DialogApi;
|
|
18
|
+
export declare const DialogPlugin: Plugin;
|
|
19
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAO,SAAS,EAAgB,MAAM,EAAY,MAAM,KAAK,CAAA;AAGzE,MAAM,WAAW,aAAa;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,KAAK,CAAC;QACf,KAAK,EAAE,MAAM,CAAA;QACb,OAAO,EAAE,MAAM,IAAI,CAAA;QACnB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,CAAA;KAC5C,CAAC,CAAA;CACF;AAED,MAAM,WAAW,SAAS;IACzB,IAAI,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAA;IACtC,IAAI,EAAE,MAAM,IAAI,CAAA;CAChB;AAID,wBAAgB,SAAS,IAAI,SAAS,CAIrC;AAkDD,eAAO,MAAM,YAAY,EAAE,MAkC1B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TelInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/TelInput.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TelInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/TelInput.vue"],"names":[],"mappings":"AAmdA,OAAO,EACN,KAAK,OAAO,EAOZ,MAAM,eAAe,CAAA;AAEtB,OAAO,EAEN,KAAK,YAAY,EAEjB,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,UAAU,EAAoB,MAAM,KAAK,CAAA;AAEjE,MAAM,WAAW,KAAK;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,IAAI,GAAG,KAAK,GAAG,KAAK,CAAA;IACnC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,EAAE,MAAM,CAAA;IAClB,YAAY,CAAC,EAAE,OAAO,EAAE,CAAA;IACxB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IACjC,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,YAAY,CAAC,EAAE,OAAO,CAAC,OAAO,mBAAmB,CAAC,CAAA;IAClD,eAAe,CAAC,EAAE,OAAO,CAAC,OAAO,sBAAsB,CAAC,CAAA;IACxD,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAA;IAC3B,IAAI,CAAC,EAAE,YAAY,CAAA;IACnB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAA;IACxB,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAA;IAC7B,QAAQ,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,OAAO,CAAA;KAAE,CAAA;IAChC,aAAa,CAAC,EAAE,MAAM,CAAA;CACtB;AAID,KAAK,WAAW,GAAG,KAAK,CAAC;AAyCzB,QAAA,MAAM,sBAAsB;;;;;;;CAO3B,CAAA;AAED,QAAA,MAAM,mBAAmB;;;;;;;aAOA,MAAM,GAAG,SAAS;;;;WAI3B,GAAG,CAAC,UAAU,CAAC;CAE9B,CAAA;AA+OD,KAAK,iBAAiB,GAAG;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;CACrB,GAAG,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;UAzTR,YAAY;cANR,OAAO;iBAPJ,MAAM;gBAqUN,MAAM;cApUT,OAAO;kBAFH,IAAI,GAAG,KAAK,GAAG,KAAK;gBAStB,OAAO;mBASJ,MAAM;kBAdP,OAAO,EAAE;gBACX,OAAO;oBACH,OAAO,GAAG,MAAM;oBAChB,MAAM,GAAG,MAAM;wBAGX,OAAO;sBAGT,MAAM,EAAE;mBAEX,MAAM,EAAE;wBACH,MAAM,EAAE;;AAsf9B,wBAYG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/TextInput.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TextInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/TextInput.vue"],"names":[],"mappings":"AA2NA,OAAO,EAGN,KAAK,aAAa,EAClB,MAAM,eAAe,CAAA;AAKtB,KAAK,WAAW,GAAG;IACjB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,gBAAgB,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;IACzC,IAAI,CAAC,EAAE,aAAa,CAAA;IACpB,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,YAAY,CAAC,EAAE,aAAa,CAAA;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;CACpC,CAAC;;;;;;;;;;;UAXM,MAAM;gBARA,MAAM,GAAG,MAAM;;AAqM9B,wBAUG"}
|
package/dist/index.cjs
CHANGED
|
@@ -30186,6 +30186,9 @@ const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
|
|
|
30186
30186
|
...props2.parseArg,
|
|
30187
30187
|
defaultCountry: activeCountryCode.value
|
|
30188
30188
|
}));
|
|
30189
|
+
const debouncedEmit = useDebounceFn((maybeFormatted) => {
|
|
30190
|
+
emit2("debounce", maybeFormatted);
|
|
30191
|
+
}, props2.debounceDelay);
|
|
30189
30192
|
const phone = vue.useModel(__props, "modelValue", {
|
|
30190
30193
|
set: (value) => {
|
|
30191
30194
|
let maybeFormatted = value;
|
|
@@ -30197,9 +30200,7 @@ const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
|
|
|
30197
30200
|
}
|
|
30198
30201
|
}
|
|
30199
30202
|
emit2("update:modelValue", maybeFormatted);
|
|
30200
|
-
|
|
30201
|
-
emit2("debounce", maybeFormatted);
|
|
30202
|
-
}, props2.debounceDelay);
|
|
30203
|
+
debouncedEmit(maybeFormatted);
|
|
30203
30204
|
return maybeFormatted;
|
|
30204
30205
|
},
|
|
30205
30206
|
get: (value) => value
|
|
@@ -30415,7 +30416,7 @@ const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
|
|
|
30415
30416
|
};
|
|
30416
30417
|
}
|
|
30417
30418
|
});
|
|
30418
|
-
const TelInput = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["__scopeId", "data-v-
|
|
30419
|
+
const TelInput = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["__scopeId", "data-v-cfcf054d"]]);
|
|
30419
30420
|
const _hoisted_1$k = ["title"];
|
|
30420
30421
|
const _hoisted_2$b = ["for"];
|
|
30421
30422
|
const _hoisted_3$9 = ["id", "title", "autocomplete", "type", "placeholder", "disabled", "required", "pattern"];
|
|
@@ -30460,13 +30461,13 @@ const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
|
|
|
30460
30461
|
if (props2.multiline || props2.code) return 4;
|
|
30461
30462
|
return 1;
|
|
30462
30463
|
});
|
|
30463
|
-
|
|
30464
|
-
emit2("
|
|
30465
|
-
}
|
|
30464
|
+
const debouncedEmit = useDebounceFn(() => {
|
|
30465
|
+
emit2("debounce", inputVal.value);
|
|
30466
|
+
}, 700);
|
|
30466
30467
|
function updateInputVal() {
|
|
30467
30468
|
if (props2.disabled) return;
|
|
30468
|
-
|
|
30469
|
-
|
|
30469
|
+
emit2("update:modelValue", inputVal.value);
|
|
30470
|
+
debouncedEmit();
|
|
30470
30471
|
}
|
|
30471
30472
|
vue.watch(
|
|
30472
30473
|
() => props2.modelValue,
|
|
@@ -30561,7 +30562,7 @@ const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
|
|
|
30561
30562
|
};
|
|
30562
30563
|
}
|
|
30563
30564
|
});
|
|
30564
|
-
const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["__scopeId", "data-v-
|
|
30565
|
+
const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["__scopeId", "data-v-52ac6dc3"]]);
|
|
30565
30566
|
const _hoisted_1$j = ["title"];
|
|
30566
30567
|
const _hoisted_2$a = ["id", "required"];
|
|
30567
30568
|
const _hoisted_3$8 = ["for"];
|
|
@@ -33291,12 +33292,10 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
|
|
|
33291
33292
|
pointerPosX.value = newMousePosX;
|
|
33292
33293
|
pointerPosY.value = newMousePosY;
|
|
33293
33294
|
}
|
|
33294
|
-
|
|
33295
|
-
|
|
33296
|
-
|
|
33297
|
-
|
|
33298
|
-
}, 100);
|
|
33299
|
-
}
|
|
33295
|
+
const onInteractionEnd = useDebounceFn(() => {
|
|
33296
|
+
limit();
|
|
33297
|
+
panLocked.value = scale.value === 1;
|
|
33298
|
+
}, 100);
|
|
33300
33299
|
function limit() {
|
|
33301
33300
|
if (scale.value < __props.minScale) {
|
|
33302
33301
|
scale.value = __props.minScale;
|
|
@@ -33486,7 +33485,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
|
|
|
33486
33485
|
};
|
|
33487
33486
|
}
|
|
33488
33487
|
});
|
|
33489
|
-
const Zoomer = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-
|
|
33488
|
+
const Zoomer = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-6035bdcf"]]);
|
|
33490
33489
|
function useBglSchema({ schema, showFields, data: data2 } = {}) {
|
|
33491
33490
|
let _schema = schema;
|
|
33492
33491
|
if (typeof _schema === "function") {
|
package/dist/index.mjs
CHANGED
|
@@ -30184,6 +30184,9 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
|
|
|
30184
30184
|
...props2.parseArg,
|
|
30185
30185
|
defaultCountry: activeCountryCode.value
|
|
30186
30186
|
}));
|
|
30187
|
+
const debouncedEmit = useDebounceFn((maybeFormatted) => {
|
|
30188
|
+
emit2("debounce", maybeFormatted);
|
|
30189
|
+
}, props2.debounceDelay);
|
|
30187
30190
|
const phone = useModel(__props, "modelValue", {
|
|
30188
30191
|
set: (value) => {
|
|
30189
30192
|
let maybeFormatted = value;
|
|
@@ -30195,9 +30198,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
|
|
|
30195
30198
|
}
|
|
30196
30199
|
}
|
|
30197
30200
|
emit2("update:modelValue", maybeFormatted);
|
|
30198
|
-
|
|
30199
|
-
emit2("debounce", maybeFormatted);
|
|
30200
|
-
}, props2.debounceDelay);
|
|
30201
|
+
debouncedEmit(maybeFormatted);
|
|
30201
30202
|
return maybeFormatted;
|
|
30202
30203
|
},
|
|
30203
30204
|
get: (value) => value
|
|
@@ -30413,7 +30414,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
|
|
|
30413
30414
|
};
|
|
30414
30415
|
}
|
|
30415
30416
|
});
|
|
30416
|
-
const TelInput = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["__scopeId", "data-v-
|
|
30417
|
+
const TelInput = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["__scopeId", "data-v-cfcf054d"]]);
|
|
30417
30418
|
const _hoisted_1$k = ["title"];
|
|
30418
30419
|
const _hoisted_2$b = ["for"];
|
|
30419
30420
|
const _hoisted_3$9 = ["id", "title", "autocomplete", "type", "placeholder", "disabled", "required", "pattern"];
|
|
@@ -30458,13 +30459,13 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
|
|
|
30458
30459
|
if (props2.multiline || props2.code) return 4;
|
|
30459
30460
|
return 1;
|
|
30460
30461
|
});
|
|
30461
|
-
|
|
30462
|
-
emit2("
|
|
30463
|
-
}
|
|
30462
|
+
const debouncedEmit = useDebounceFn(() => {
|
|
30463
|
+
emit2("debounce", inputVal.value);
|
|
30464
|
+
}, 700);
|
|
30464
30465
|
function updateInputVal() {
|
|
30465
30466
|
if (props2.disabled) return;
|
|
30466
|
-
|
|
30467
|
-
|
|
30467
|
+
emit2("update:modelValue", inputVal.value);
|
|
30468
|
+
debouncedEmit();
|
|
30468
30469
|
}
|
|
30469
30470
|
watch(
|
|
30470
30471
|
() => props2.modelValue,
|
|
@@ -30559,7 +30560,7 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
|
|
|
30559
30560
|
};
|
|
30560
30561
|
}
|
|
30561
30562
|
});
|
|
30562
|
-
const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["__scopeId", "data-v-
|
|
30563
|
+
const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["__scopeId", "data-v-52ac6dc3"]]);
|
|
30563
30564
|
const _hoisted_1$j = ["title"];
|
|
30564
30565
|
const _hoisted_2$a = ["id", "required"];
|
|
30565
30566
|
const _hoisted_3$8 = ["for"];
|
|
@@ -33289,12 +33290,10 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
|
33289
33290
|
pointerPosX.value = newMousePosX;
|
|
33290
33291
|
pointerPosY.value = newMousePosY;
|
|
33291
33292
|
}
|
|
33292
|
-
|
|
33293
|
-
|
|
33294
|
-
|
|
33295
|
-
|
|
33296
|
-
}, 100);
|
|
33297
|
-
}
|
|
33293
|
+
const onInteractionEnd = useDebounceFn(() => {
|
|
33294
|
+
limit();
|
|
33295
|
+
panLocked.value = scale.value === 1;
|
|
33296
|
+
}, 100);
|
|
33298
33297
|
function limit() {
|
|
33299
33298
|
if (scale.value < __props.minScale) {
|
|
33300
33299
|
scale.value = __props.minScale;
|
|
@@ -33484,7 +33483,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
|
33484
33483
|
};
|
|
33485
33484
|
}
|
|
33486
33485
|
});
|
|
33487
|
-
const Zoomer = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-
|
|
33486
|
+
const Zoomer = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-6035bdcf"]]);
|
|
33488
33487
|
function useBglSchema({ schema, showFields, data: data2 } = {}) {
|
|
33489
33488
|
let _schema = schema;
|
|
33490
33489
|
if (typeof _schema === "function") {
|
package/dist/style.css
CHANGED
|
@@ -1567,7 +1567,7 @@ line-height: 1.65;
|
|
|
1567
1567
|
box-shadow: 0 0 10px 0 rgb(0 0 0 /20%);
|
|
1568
1568
|
}
|
|
1569
1569
|
|
|
1570
|
-
.tel-input[data-v-
|
|
1570
|
+
.tel-input[data-v-cfcf054d] {
|
|
1571
1571
|
direction: ltr;
|
|
1572
1572
|
text-align: left;
|
|
1573
1573
|
background: var(--input-bg);
|
|
@@ -1578,21 +1578,21 @@ line-height: 1.65;
|
|
|
1578
1578
|
min-width: calc(var(--input-height) * 3);
|
|
1579
1579
|
width: 100%;
|
|
1580
1580
|
}
|
|
1581
|
-
.tel-input[data-v-
|
|
1581
|
+
.tel-input[data-v-cfcf054d]:focus-within {
|
|
1582
1582
|
outline: none;
|
|
1583
1583
|
box-shadow: inset 0 0 10px #00000012;
|
|
1584
1584
|
}
|
|
1585
|
-
.tel-input input[data-v-
|
|
1585
|
+
.tel-input input[data-v-cfcf054d] {
|
|
1586
1586
|
background: transparent;
|
|
1587
1587
|
}
|
|
1588
|
-
.tel-input input[data-v-
|
|
1588
|
+
.tel-input input[data-v-cfcf054d]:focus-visible {
|
|
1589
1589
|
box-shadow: none;
|
|
1590
1590
|
}
|
|
1591
|
-
.input_country-code[data-v-
|
|
1591
|
+
.input_country-code[data-v-cfcf054d] {
|
|
1592
1592
|
font-size: var(--input-font-size);
|
|
1593
1593
|
color: var(--input-color);
|
|
1594
1594
|
}
|
|
1595
|
-
.tel-country[data-v-
|
|
1595
|
+
.tel-country[data-v-cfcf054d] {
|
|
1596
1596
|
font-size: var(--input-font-size);
|
|
1597
1597
|
max-width: 200px;
|
|
1598
1598
|
white-space: nowrap;
|
|
@@ -1601,7 +1601,7 @@ line-height: 1.65;
|
|
|
1601
1601
|
margin-top: 0;
|
|
1602
1602
|
margin-bottom: 0;
|
|
1603
1603
|
}
|
|
1604
|
-
.tel-countryp-dropdown[data-v-
|
|
1604
|
+
.tel-countryp-dropdown[data-v-cfcf054d] {
|
|
1605
1605
|
direction: ltr;
|
|
1606
1606
|
text-align: left;
|
|
1607
1607
|
}
|
|
@@ -1615,58 +1615,58 @@ line-height: 1.65;
|
|
|
1615
1615
|
font-size: var(--label-font-size);
|
|
1616
1616
|
}
|
|
1617
1617
|
|
|
1618
|
-
.bagel-input textarea[data-v-
|
|
1618
|
+
.bagel-input textarea[data-v-52ac6dc3] {
|
|
1619
1619
|
min-height: unset;
|
|
1620
1620
|
font-size: var(--input-font-size);
|
|
1621
1621
|
}
|
|
1622
|
-
.bagel-input.text-input textarea[data-v-
|
|
1622
|
+
.bagel-input.text-input textarea[data-v-52ac6dc3] {
|
|
1623
1623
|
resize: none;
|
|
1624
1624
|
}
|
|
1625
|
-
.code textarea[data-v-
|
|
1625
|
+
.code textarea[data-v-52ac6dc3] {
|
|
1626
1626
|
font-family: 'Inconsolata', monospace;
|
|
1627
1627
|
background: var(--bgl-code-bg) !important;
|
|
1628
1628
|
color: var(--bgl-light-text) !important;
|
|
1629
1629
|
}
|
|
1630
|
-
.code textarea[data-v-
|
|
1630
|
+
.code textarea[data-v-52ac6dc3]::placeholder {
|
|
1631
1631
|
color: var(--bgl-light-text) !important;
|
|
1632
1632
|
opacity: 0.3;
|
|
1633
1633
|
}
|
|
1634
|
-
.bagel-input.small[data-v-
|
|
1634
|
+
.bagel-input.small[data-v-52ac6dc3] {
|
|
1635
1635
|
margin-bottom: 0;
|
|
1636
1636
|
height: 30px;
|
|
1637
1637
|
}
|
|
1638
|
-
.bagel-input.dense label[data-v-
|
|
1638
|
+
.bagel-input.dense label[data-v-52ac6dc3] {
|
|
1639
1639
|
display: flex;
|
|
1640
1640
|
align-items: center;
|
|
1641
1641
|
gap: 0.5rem;
|
|
1642
1642
|
}
|
|
1643
|
-
.bagel-input input[data-v-
|
|
1643
|
+
.bagel-input input[data-v-52ac6dc3]:disabled {
|
|
1644
1644
|
background: #f5f5f5;
|
|
1645
1645
|
}
|
|
1646
|
-
.bagel-input label[data-v-
|
|
1646
|
+
.bagel-input label[data-v-52ac6dc3] {
|
|
1647
1647
|
font-size: var(--label-font-size);
|
|
1648
1648
|
}
|
|
1649
|
-
.textInputIconWrap .bgl_icon-font[data-v-
|
|
1649
|
+
.textInputIconWrap .bgl_icon-font[data-v-52ac6dc3] {
|
|
1650
1650
|
color: var(--input-color);
|
|
1651
1651
|
position: absolute;
|
|
1652
1652
|
inset-inline-end:calc(var(--input-height) / 3 - 0.25rem);
|
|
1653
1653
|
margin-top: calc(var(--input-height) / 2 + 0.1rem);
|
|
1654
1654
|
line-height: 0;
|
|
1655
1655
|
}
|
|
1656
|
-
.textInputIconWrap input[data-v-
|
|
1656
|
+
.textInputIconWrap input[data-v-52ac6dc3]{
|
|
1657
1657
|
padding-inline-end: calc(var(--input-height) / 3 + 1.5rem);
|
|
1658
1658
|
}
|
|
1659
|
-
.txtInputIconStart .iconStart[data-v-
|
|
1659
|
+
.txtInputIconStart .iconStart[data-v-52ac6dc3] {
|
|
1660
1660
|
color: var(--input-color);
|
|
1661
1661
|
position: absolute;
|
|
1662
1662
|
inset-inline-start:calc(var(--input-height) / 3 - 0.25rem);
|
|
1663
1663
|
margin-top: calc(var(--input-height) / 2 );
|
|
1664
1664
|
line-height: 0;
|
|
1665
1665
|
}
|
|
1666
|
-
.txtInputIconStart input[data-v-
|
|
1666
|
+
.txtInputIconStart input[data-v-52ac6dc3], .txtInputIconStart textarea[data-v-52ac6dc3]{
|
|
1667
1667
|
padding-inline-start: calc(var(--input-height) / 3 + 1.5rem);
|
|
1668
1668
|
}
|
|
1669
|
-
.bagel-input.small textarea[data-v-
|
|
1669
|
+
.bagel-input.small textarea[data-v-52ac6dc3] {
|
|
1670
1670
|
height: 30px;
|
|
1671
1671
|
}
|
|
1672
1672
|
|
|
@@ -3709,15 +3709,15 @@ tbody tr[data-v-4c462da5]:hover {
|
|
|
3709
3709
|
background: var(--bgl-gray-light);
|
|
3710
3710
|
}
|
|
3711
3711
|
|
|
3712
|
-
.vue-zoomer[data-v-
|
|
3712
|
+
.vue-zoomer[data-v-6035bdcf] {
|
|
3713
3713
|
overflow: hidden;
|
|
3714
3714
|
}
|
|
3715
|
-
.zoomer[data-v-
|
|
3715
|
+
.zoomer[data-v-6035bdcf] {
|
|
3716
3716
|
transform-origin: 50% 50%;
|
|
3717
3717
|
width: 100%;
|
|
3718
3718
|
height: 100%;
|
|
3719
3719
|
}
|
|
3720
|
-
.zoomer > img[data-v-
|
|
3720
|
+
.zoomer > img[data-v-6035bdcf] {
|
|
3721
3721
|
vertical-align: top;
|
|
3722
3722
|
user-select: none;
|
|
3723
3723
|
-moz-user-drag: none;
|
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<script lang="ts" setup>
|
|
2
|
-
import {
|
|
2
|
+
import { useDebounceFn } from '@bagelink/vue'
|
|
3
3
|
import { onMounted, onUnmounted, watch } from 'vue'
|
|
4
4
|
import TapDetector from '../utils/tapDetector'
|
|
5
5
|
|
|
@@ -141,12 +141,10 @@ function onPointerMove(newMousePosX: number, newMousePosY: number) {
|
|
|
141
141
|
pointerPosY = newMousePosY
|
|
142
142
|
}
|
|
143
143
|
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
}, 100)
|
|
149
|
-
}
|
|
144
|
+
const onInteractionEnd = useDebounceFn(() => {
|
|
145
|
+
limit()
|
|
146
|
+
panLocked = scale === 1
|
|
147
|
+
}, 100)
|
|
150
148
|
|
|
151
149
|
function limit() {
|
|
152
150
|
if (scale < minScale!) {
|
|
@@ -0,0 +1,192 @@
|
|
|
1
|
+
import type { App, Component, InjectionKey, Plugin, PropType } from 'vue'
|
|
2
|
+
import { createApp, defineComponent, h, inject } from 'vue'
|
|
3
|
+
|
|
4
|
+
export interface DialogOptions {
|
|
5
|
+
title?: string
|
|
6
|
+
content?: string | Component
|
|
7
|
+
dismissable?: boolean
|
|
8
|
+
width?: string
|
|
9
|
+
actions?: Array<{
|
|
10
|
+
label: string
|
|
11
|
+
onClick: () => void
|
|
12
|
+
variant?: 'primary' | 'secondary' | 'danger'
|
|
13
|
+
}>
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
export interface DialogApi {
|
|
17
|
+
show: (options: DialogOptions) => void
|
|
18
|
+
hide: () => void
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
const DialogSymbol: InjectionKey<DialogApi> = Symbol('dialog')
|
|
22
|
+
|
|
23
|
+
export function useDialog(): DialogApi {
|
|
24
|
+
const api = inject(DialogSymbol)
|
|
25
|
+
if (!api) throw new Error('Dialog plugin not installed')
|
|
26
|
+
return api
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
const Dialog = defineComponent({
|
|
30
|
+
props: {
|
|
31
|
+
options: {
|
|
32
|
+
type: Object as () => DialogOptions,
|
|
33
|
+
required: true
|
|
34
|
+
},
|
|
35
|
+
onClose: {
|
|
36
|
+
type: Function as PropType<(event?: MouseEvent) => void>,
|
|
37
|
+
required: true
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
setup(props) {
|
|
41
|
+
return () => h('div', {
|
|
42
|
+
class: 'dialog-overlay',
|
|
43
|
+
onClick: (e: MouseEvent) => {
|
|
44
|
+
if (props.options.dismissable && e.target === e.currentTarget) {
|
|
45
|
+
props.onClose()
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
}, [
|
|
49
|
+
h('div', {
|
|
50
|
+
class: ['dialog', props.options.width ? `w-${props.options.width}` : 'w-96']
|
|
51
|
+
}, [
|
|
52
|
+
h('div', { class: 'dialog-header' }, [
|
|
53
|
+
h('h3', { class: 'dialog-title' }, props.options.title),
|
|
54
|
+
props.options.dismissable && h('button', {
|
|
55
|
+
class: 'dialog-close',
|
|
56
|
+
onClick: props.onClose
|
|
57
|
+
}, '×')
|
|
58
|
+
]),
|
|
59
|
+
h('div', { class: 'dialog-content' }, [
|
|
60
|
+
typeof props.options.content === 'string'
|
|
61
|
+
? props.options.content
|
|
62
|
+
: h(props.options.content as any)
|
|
63
|
+
]),
|
|
64
|
+
props.options.actions && h('div', { class: 'dialog-actions' }, props.options.actions.map(action => h('button', {
|
|
65
|
+
class: ['dialog-btn', action.variant],
|
|
66
|
+
onClick: () => {
|
|
67
|
+
action.onClick()
|
|
68
|
+
props.onClose()
|
|
69
|
+
}
|
|
70
|
+
}, action.label)
|
|
71
|
+
))
|
|
72
|
+
])
|
|
73
|
+
])
|
|
74
|
+
}
|
|
75
|
+
})
|
|
76
|
+
|
|
77
|
+
export const DialogPlugin: Plugin = {
|
|
78
|
+
install: (app: App) => {
|
|
79
|
+
// Create a div to mount our dialog
|
|
80
|
+
const dialogContainer = document.createElement('div')
|
|
81
|
+
document.body.appendChild(dialogContainer)
|
|
82
|
+
|
|
83
|
+
let currentDialog: any = null
|
|
84
|
+
|
|
85
|
+
const api: DialogApi = {
|
|
86
|
+
show: (options: DialogOptions) => {
|
|
87
|
+
// Remove existing dialog if any
|
|
88
|
+
if (currentDialog) {
|
|
89
|
+
currentDialog.unmount()
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
// Create new dialog instance
|
|
93
|
+
const dialogApp = createApp(Dialog, {
|
|
94
|
+
options,
|
|
95
|
+
onClose: () => { api.hide() }
|
|
96
|
+
})
|
|
97
|
+
|
|
98
|
+
// Mount it
|
|
99
|
+
currentDialog = dialogApp.mount(dialogContainer)
|
|
100
|
+
},
|
|
101
|
+
hide: () => {
|
|
102
|
+
if (currentDialog) {
|
|
103
|
+
currentDialog.unmount()
|
|
104
|
+
currentDialog = null
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
app.provide(DialogSymbol, api)
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
// Add some basic styles
|
|
114
|
+
const style = document.createElement('style')
|
|
115
|
+
style.textContent = `
|
|
116
|
+
.dialog-overlay {
|
|
117
|
+
position: fixed;
|
|
118
|
+
top: 0;
|
|
119
|
+
left: 0;
|
|
120
|
+
right: 0;
|
|
121
|
+
bottom: 0;
|
|
122
|
+
background: rgba(0, 0, 0, 0.5);
|
|
123
|
+
display: flex;
|
|
124
|
+
align-items: center;
|
|
125
|
+
justify-content: center;
|
|
126
|
+
z-index: 1000;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
.dialog {
|
|
130
|
+
background: white;
|
|
131
|
+
border-radius: 0.5rem;
|
|
132
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
|
133
|
+
max-width: 90vw;
|
|
134
|
+
max-height: 90vh;
|
|
135
|
+
overflow: auto;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
.dialog-header {
|
|
139
|
+
padding: 1rem;
|
|
140
|
+
border-bottom: 1px solid #e5e7eb;
|
|
141
|
+
display: flex;
|
|
142
|
+
justify-content: space-between;
|
|
143
|
+
align-items: center;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
.dialog-title {
|
|
147
|
+
margin: 0;
|
|
148
|
+
font-size: 1.25rem;
|
|
149
|
+
font-weight: 600;
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
.dialog-close {
|
|
153
|
+
background: none;
|
|
154
|
+
border: none;
|
|
155
|
+
font-size: 1.5rem;
|
|
156
|
+
cursor: pointer;
|
|
157
|
+
padding: 0.25rem;
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
.dialog-content {
|
|
161
|
+
padding: 1rem;
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
.dialog-actions {
|
|
165
|
+
padding: 1rem;
|
|
166
|
+
border-top: 1px solid #e5e7eb;
|
|
167
|
+
display: flex;
|
|
168
|
+
justify-content: flex-end;
|
|
169
|
+
gap: 0.5rem;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
.dialog-btn {
|
|
173
|
+
padding: 0.5rem 1rem;
|
|
174
|
+
border-radius: 0.375rem;
|
|
175
|
+
border: 1px solid #e5e7eb;
|
|
176
|
+
background: white;
|
|
177
|
+
cursor: pointer;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
.dialog-btn.primary {
|
|
181
|
+
background: #3b82f6;
|
|
182
|
+
color: white;
|
|
183
|
+
border-color: #3b82f6;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.dialog-btn.danger {
|
|
187
|
+
background: #ef4444;
|
|
188
|
+
color: white;
|
|
189
|
+
border-color: #ef4444;
|
|
190
|
+
}
|
|
191
|
+
`
|
|
192
|
+
document.head.appendChild(style)
|
|
@@ -6,7 +6,7 @@ import {
|
|
|
6
6
|
Icon,
|
|
7
7
|
TextInput,
|
|
8
8
|
allCountries,
|
|
9
|
-
|
|
9
|
+
useDebounceFn,
|
|
10
10
|
} from '@bagelink/vue'
|
|
11
11
|
import axios from 'axios'
|
|
12
12
|
import {
|
|
@@ -168,6 +168,10 @@ const parseArgs = $computed(() => ({
|
|
|
168
168
|
defaultCountry: activeCountryCode,
|
|
169
169
|
}))
|
|
170
170
|
|
|
171
|
+
const debouncedEmit = useDebounceFn((maybeFormatted: string) => {
|
|
172
|
+
emit('debounce', maybeFormatted)
|
|
173
|
+
}, props.debounceDelay)
|
|
174
|
+
|
|
171
175
|
const phone = defineModel<string>('modelValue', {
|
|
172
176
|
default: '',
|
|
173
177
|
set: (value) => {
|
|
@@ -179,7 +183,7 @@ const phone = defineModel<string>('modelValue', {
|
|
|
179
183
|
}
|
|
180
184
|
|
|
181
185
|
emit('update:modelValue', maybeFormatted)
|
|
182
|
-
|
|
186
|
+
debouncedEmit(maybeFormatted)
|
|
183
187
|
return maybeFormatted
|
|
184
188
|
},
|
|
185
189
|
get: value => value,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
2
|
import {
|
|
3
|
-
debounce,
|
|
4
3
|
MaterialIcon,
|
|
4
|
+
useDebounceFn,
|
|
5
5
|
type MaterialIcons,
|
|
6
6
|
} from '@bagelink/vue'
|
|
7
7
|
import { onMounted, watch } from 'vue'
|
|
@@ -49,14 +49,12 @@ const rows = $computed(() => {
|
|
|
49
49
|
return 1
|
|
50
50
|
})
|
|
51
51
|
|
|
52
|
-
|
|
53
|
-
emit('update:modelValue', inputVal as string)
|
|
54
|
-
}
|
|
52
|
+
const debouncedEmit = useDebounceFn(() => { emit('debounce', inputVal as string) }, 700)
|
|
55
53
|
|
|
56
54
|
function updateInputVal() {
|
|
57
55
|
if (props.disabled) return
|
|
58
|
-
|
|
59
|
-
|
|
56
|
+
emit('update:modelValue', inputVal as string)
|
|
57
|
+
debouncedEmit()
|
|
60
58
|
}
|
|
61
59
|
|
|
62
60
|
watch(
|