@bagelink/vue 1.2.75 → 1.2.79

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.
@@ -2,7 +2,7 @@ type Easing = 'ease-in-out' | 'ease-in' | 'ease-out' | 'linear';
2
2
  type AutoplayMode = 'disabled' | 'standard' | 'linear';
3
3
  type AutoplayValue = boolean | AutoplayMode;
4
4
  interface CarouselOptions {
5
- duration?: number;
5
+ speed?: number;
6
6
  easing?: Easing;
7
7
  perPage?: number | {
8
8
  [key: number]: number;
@@ -19,6 +19,7 @@ interface CarouselOptions {
19
19
  pauseOnHover?: boolean;
20
20
  dots?: boolean;
21
21
  slideWidth?: number;
22
+ slideGap?: number;
22
23
  onInit?: () => void;
23
24
  onChange?: () => void;
24
25
  }
@@ -64,7 +65,7 @@ declare const __VLS_component: import('vue').DefineComponent<CarouselOptions, {
64
65
  }>, {
65
66
  autoplay: AutoplayValue;
66
67
  loop: boolean;
67
- duration: number;
68
+ speed: number;
68
69
  rtl: boolean;
69
70
  dots: boolean;
70
71
  draggable: boolean;
@@ -73,9 +74,9 @@ declare const __VLS_component: import('vue').DefineComponent<CarouselOptions, {
73
74
  multipleDrag: boolean;
74
75
  threshold: number;
75
76
  autoplayInterval: number;
76
- autoplaySpeed: number;
77
77
  pauseOnHover: boolean;
78
78
  slideWidth: number;
79
+ slideGap: number;
79
80
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
80
81
  carouselRef: HTMLDivElement;
81
82
  }, HTMLDivElement>;
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.vue.d.ts","sourceRoot":"","sources":["../../src/components/Slider.vue"],"names":[],"mappings":"AAu/BA,KAAK,MAAM,GAAG,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAA;AAC/D,KAAK,YAAY,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,CAAA;AACtD,KAAK,aAAa,GAAG,OAAO,GAAG,YAAY,CAAA;AAE3C,UAAU,eAAe;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,GAAG;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IAC5C,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,GAAG,CAAC,EAAE,OAAO,CAAA;IACb,QAAQ,CAAC,EAAE,aAAa,CAAA;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAkWD,iBAAS,IAAI,CAAC,aAAa,GAAE,MAAU,GAAG,IAAI,CAkC7C;AAED,iBAAS,IAAI,CAAC,aAAa,GAAE,MAAU,GAAG,IAAI,CAkC7C;AAED,iBAAS,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAejC;AA+SD,iBAAS,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAenC;AAED,iBAAS,MAAM,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAkBlD;AAED,iBAAS,OAAO,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAEpC;AAED,iBAAS,MAAM,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAEnC;AAED,iBAAS,OAAO,CAAC,aAAa,GAAE,OAAe,GAAG,IAAI,CAkBrD;AAqGD,iBAAS,aAAa,IAAI,IAAI,CAE7B;AAED,iBAAS,cAAc,IAAI,IAAI,CAI9B;AAgDD,iBAAS,cAAc;WAyDT,OAAO,IAA6B;;yBAXrB,GAAG;;;;;;EAgB/B;AAcD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;cAzhCT,aAAa;UAFjB,OAAO;cAPH,MAAM;SAQX,OAAO;UAKN,OAAO;eATF,OAAO;YAHV,MAAM;gBAEF,MAAM;kBAEJ,OAAO;eACV,MAAM;sBAIC,MAAM;mBACT,MAAM;kBACP,OAAO;gBAET,MAAM;;;kBA+hClB,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"}
1
+ {"version":3,"file":"Slider.vue.d.ts","sourceRoot":"","sources":["../../src/components/Slider.vue"],"names":[],"mappings":"AAy/BA,KAAK,MAAM,GAAG,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAA;AAC/D,KAAK,YAAY,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,CAAA;AACtD,KAAK,aAAa,GAAG,OAAO,GAAG,YAAY,CAAA;AAE3C,UAAU,eAAe;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,GAAG;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IAC5C,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,GAAG,CAAC,EAAE,OAAO,CAAA;IACb,QAAQ,CAAC,EAAE,aAAa,CAAA;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB;AAmWD,iBAAS,IAAI,CAAC,aAAa,GAAE,MAAU,GAAG,IAAI,CAkC7C;AAED,iBAAS,IAAI,CAAC,aAAa,GAAE,MAAU,GAAG,IAAI,CAkC7C;AAED,iBAAS,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAejC;AA+SD,iBAAS,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAenC;AAED,iBAAS,MAAM,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,CAkBlD;AAED,iBAAS,OAAO,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAEpC;AAED,iBAAS,MAAM,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAEnC;AAED,iBAAS,OAAO,CAAC,aAAa,GAAE,OAAe,GAAG,IAAI,CAkBrD;AAqGD,iBAAS,aAAa,IAAI,IAAI,CAE7B;AAED,iBAAS,cAAc,IAAI,IAAI,CAI9B;AAgDD,iBAAS,cAAc;WAyDT,OAAO,IAA6B;;yBAXrB,GAAG;;;;;;EAgB/B;AAcD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;cA3hCT,aAAa;UAFjB,OAAO;WAPN,MAAM;SAQR,OAAO;UAKN,OAAO;eATF,OAAO;YAHV,MAAM;gBAEF,MAAM;kBAEJ,OAAO;eACV,MAAM;sBAIC,MAAM;kBAEV,OAAO;gBAET,MAAM;cACR,MAAM;;;kBAgiChB,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"}
@@ -19,6 +19,7 @@ declare const _default: <ContextObjType extends {
19
19
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onFocus" | "onBlur" | "onChange" | "onUpdate:modelValue" | "onDelete"> & ({
20
20
  modelValue?: any;
21
21
  } & {
22
+ id?: string;
22
23
  groupName?: string;
23
24
  options: RadioOption<ContextObjType>[];
24
25
  deletable?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"RadioGroup.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/RadioGroup.vue"],"names":[],"mappings":"AAuHA,MAAM,WAAW,WAAW,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,UAAU,CAAC,EAAE,CAAC,CAAA;IACd,KAAK,EAAE,GAAG,CAAA;CACV;yBAEgB,cAAc,SAAS;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAC7D,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,eAAe,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EACjE;WA0LO,mBAAmB,CAAC;;;;;;;qBAzIb,GAAG;;oBA/CL,MAAM;iBACT,WAAW,CAAC,cAAc,CAAC,EAAE;oBAC1B,OAAO;mBACR,OAAO;gBACV,MAAM;mBACH,OAAO;oBAmL2E,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;;qBAzMD,MAAM;qBACN,MAAM;uBACJ,MAAM;oBACT,MAAM;iBACT,MAAM;;mBAEJ,GAAG;YA6JoB,GAAG;;UAwC3B,4HAAoC;EAEvC,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AArMzE,wBAqM4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
1
+ {"version":3,"file":"RadioGroup.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/RadioGroup.vue"],"names":[],"mappings":"AA8HA,MAAM,WAAW,WAAW,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,UAAU,CAAC,EAAE,CAAC,CAAA;IACd,KAAK,EAAE,GAAG,CAAA;CACV;yBAEgB,cAAc,SAAS;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAC7D,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,eAAe,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EACjE;WAiMO,mBAAmB,CAAC;;;;;;;qBAzIb,GAAG;;aAtDZ,MAAM;oBACC,MAAM;iBACT,WAAW,CAAC,cAAc,CAAC,EAAE;oBAC1B,OAAO;mBACR,OAAO;gBACV,MAAM;mBACH,OAAO;oBAyL2E,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;;qBAhND,MAAM;qBACN,MAAM;uBACJ,MAAM;oBACT,MAAM;iBACT,MAAM;;mBAEJ,GAAG;YAoKoB,GAAG;;UAwC3B,4HAAoC;EAEvC,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AA5MzE,wBA4M4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
@@ -5,6 +5,7 @@ interface LayoutProrps {
5
5
  mColumns?: string[];
6
6
  mRows?: string[];
7
7
  rows?: string[];
8
+ mGap?: number;
8
9
  }
9
10
  declare function __VLS_template(): {
10
11
  attrs: Partial<{}>;
@@ -22,6 +23,7 @@ declare const __VLS_component: import('vue').DefineComponent<LayoutProrps, {}, {
22
23
  columns: string[];
23
24
  mColumns: string[];
24
25
  mRows: string[];
26
+ mGap: number;
25
27
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
26
28
  declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
27
29
  export default _default;
@@ -1 +1 @@
1
- {"version":3,"file":"Layout.vue.d.ts","sourceRoot":"","sources":["../../../src/components/layout/Layout.vue"],"names":[],"mappings":"AA0DA,UAAU,YAAY;IACrB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAA;CACf;AAoCD,iBAAS,cAAc;WAkCT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAcD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;UA3Fb,MAAM,EAAE;UAJR,OAAO;SADR,MAAM;aAEF,MAAM,EAAE;cACP,MAAM,EAAE;WACX,MAAM,EAAE;wFAoGf,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"}
1
+ {"version":3,"file":"Layout.vue.d.ts","sourceRoot":"","sources":["../../../src/components/layout/Layout.vue"],"names":[],"mappings":"AAgEA,UAAU,YAAY;IACrB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;CACb;AA0CD,iBAAS,cAAc;WAmCT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAeD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;UApGb,MAAM,EAAE;UAJR,OAAO;SADR,MAAM;aAEF,MAAM,EAAE;cACP,MAAM,EAAE;WACX,MAAM,EAAE;UAET,MAAM;wFA2GZ,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/index.cjs CHANGED
@@ -16685,6 +16685,7 @@ const _hoisted_7$8 = {
16685
16685
  const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
16686
16686
  __name: "RadioGroup",
16687
16687
  props: /* @__PURE__ */ vue.mergeModels({
16688
+ id: {},
16688
16689
  groupName: {},
16689
16690
  options: {},
16690
16691
  deletable: { type: Boolean },
@@ -16699,7 +16700,9 @@ const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
16699
16700
  setup(__props, { emit: __emit }) {
16700
16701
  const props2 = __props;
16701
16702
  const emit2 = __emit;
16702
- const name = vue.computed(() => props2.groupName || Math.random().toString(36).substring(2, 15));
16703
+ const name = vue.computed(
16704
+ () => props2.groupName || props2.id || Math.random().toString(36).substring(2, 15)
16705
+ );
16703
16706
  const selectedOption = vue.useModel(__props, "modelValue");
16704
16707
  let isFocused = vue.ref(false);
16705
16708
  const containerClasses = vue.computed(() => ({
@@ -16771,7 +16774,7 @@ const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
16771
16774
  };
16772
16775
  }
16773
16776
  });
16774
- const RadioGroup = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-29cff93d"]]);
16777
+ const RadioGroup = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-adc49780"]]);
16775
16778
  const _hoisted_1$y = { class: "bagel-input" };
16776
16779
  const _hoisted_2$n = { class: "pb-025" };
16777
16780
  const _hoisted_3$k = { class: "flex gap-05 flex-wrap" };
@@ -32783,19 +32786,22 @@ const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
32783
32786
  columns: { default: () => [] },
32784
32787
  mColumns: { default: () => [] },
32785
32788
  mRows: { default: () => [] },
32786
- rows: { default: () => [] }
32789
+ rows: { default: () => [] },
32790
+ mGap: { default: void 0 }
32787
32791
  },
32788
32792
  setup(__props) {
32789
32793
  vue.useCssVars((_ctx) => ({
32790
- "16111f2e": gapSize.value,
32791
- "2c189afc": gridTemplateRows.value,
32792
- "243c3a94": gridTemplateColumns.value,
32793
- "84a9b646": mGridTemplateRows.value,
32794
- "55be334e": mGridTemplateColumns.value
32794
+ "ff4aa016": gapSize.value,
32795
+ "3683119b": gridTemplateRows.value,
32796
+ "f6f04e4a": gridTemplateColumns.value,
32797
+ "fa53dae8": mGapSize.value,
32798
+ "0307a8e4": mGridTemplateRows.value,
32799
+ "7e4910f2": mGridTemplateColumns.value
32795
32800
  }));
32796
32801
  const props2 = __props;
32797
32802
  const gridTemplateRows = vue.computed(() => props2.rows.length > 0 ? props2.rows.join(" ") : "auto");
32798
32803
  const gapSize = vue.computed(() => `${props2.gap}rem`);
32804
+ const mGapSize = vue.computed(() => props2.mGap !== void 0 ? `${props2.mGap}rem` : gapSize.value);
32799
32805
  const mGridTemplateRows = vue.computed(() => {
32800
32806
  var _a;
32801
32807
  if ((_a = props2.mRows) == null ? void 0 : _a.length) return props2.mRows.join(" ");
@@ -32816,7 +32822,7 @@ const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
32816
32822
  };
32817
32823
  }
32818
32824
  });
32819
- const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-1814129a"]]);
32825
+ const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-a0f4895c"]]);
32820
32826
  const _hoisted_1$j = { key: 0 };
32821
32827
  const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
32822
32828
  __name: "SidebarMenu",
@@ -34063,7 +34069,7 @@ const dragThreshold = 10;
34063
34069
  const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
34064
34070
  __name: "Slider",
34065
34071
  props: {
34066
- duration: { default: 200 },
34072
+ speed: { default: 350 },
34067
34073
  easing: { default: "ease-out" },
34068
34074
  perPage: {},
34069
34075
  startIndex: { default: 0 },
@@ -34073,11 +34079,12 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
34073
34079
  loop: { type: Boolean, default: true },
34074
34080
  rtl: { type: Boolean, default: false },
34075
34081
  autoplay: { type: [Boolean, String], default: "disabled" },
34076
- autoplayInterval: { default: 3e3 },
34077
- autoplaySpeed: { default: 50 },
34082
+ autoplayInterval: { default: 5e3 },
34083
+ autoplaySpeed: {},
34078
34084
  pauseOnHover: { type: Boolean, default: true },
34079
34085
  dots: { type: Boolean, default: false },
34080
34086
  slideWidth: { default: 300 },
34087
+ slideGap: { default: 1 },
34081
34088
  onInit: {},
34082
34089
  onChange: {}
34083
34090
  },
@@ -34123,7 +34130,7 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
34123
34130
  }
34124
34131
  const calculatedPerPage = perPage.value;
34125
34132
  return {
34126
- duration: props2.duration,
34133
+ speed: props2.speed,
34127
34134
  easing: props2.easing,
34128
34135
  perPage: calculatedPerPage,
34129
34136
  startIndex: props2.startIndex,
@@ -34134,10 +34141,11 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
34134
34141
  rtl: props2.rtl,
34135
34142
  autoplay: autoplayMode,
34136
34143
  autoplayInterval: props2.autoplayInterval,
34137
- autoplaySpeed: props2.autoplaySpeed,
34144
+ autoplaySpeed: props2.speed / 4,
34138
34145
  pauseOnHover: props2.pauseOnHover,
34139
34146
  dots: props2.dots,
34140
34147
  slideWidth: props2.slideWidth,
34148
+ slideGap: props2.slideGap,
34141
34149
  onInit: () => {
34142
34150
  emit2("init");
34143
34151
  },
@@ -34275,6 +34283,7 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
34275
34283
  const elementContainer = document.createElement("div");
34276
34284
  elementContainer.style.cssFloat = config.value.rtl ? "right" : "left";
34277
34285
  elementContainer.style.float = config.value.rtl ? "right" : "left";
34286
+ elementContainer.style.padding = config.value.slideGap ? `${config.value.slideGap / 2}rem` : "0";
34278
34287
  const percentage = config.value.loop ? 100 / (innerElements.value.length + perPage.value * 2) : 100 / innerElements.value.length;
34279
34288
  elementContainer.style.width = `${percentage}%`;
34280
34289
  elementContainer.appendChild(elm);
@@ -34373,8 +34382,8 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
34373
34382
  }
34374
34383
  function enableTransition() {
34375
34384
  if (sliderFrame.value) {
34376
- sliderFrame.value.style.webkitTransition = `all ${config.value.duration}ms ${config.value.easing}`;
34377
- sliderFrame.value.style.transition = `all ${config.value.duration}ms ${config.value.easing}`;
34385
+ sliderFrame.value.style.webkitTransition = `all ${config.value.speed}ms ${config.value.easing}`;
34386
+ sliderFrame.value.style.transition = `all ${config.value.speed}ms ${config.value.easing}`;
34378
34387
  }
34379
34388
  }
34380
34389
  function updateAfterDrag() {
@@ -34722,7 +34731,7 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
34722
34731
  };
34723
34732
  }
34724
34733
  });
34725
- const Slider = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-705b9c93"]]);
34734
+ const Slider = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-fee6ed49"]]);
34726
34735
  const _hoisted_1$4 = { class: "stickyTop" };
34727
34736
  const _hoisted_2$2 = {
34728
34737
  key: 0,
package/dist/index.mjs CHANGED
@@ -16683,6 +16683,7 @@ const _hoisted_7$8 = {
16683
16683
  const _sfc_main$G = /* @__PURE__ */ defineComponent({
16684
16684
  __name: "RadioGroup",
16685
16685
  props: /* @__PURE__ */ mergeModels({
16686
+ id: {},
16686
16687
  groupName: {},
16687
16688
  options: {},
16688
16689
  deletable: { type: Boolean },
@@ -16697,7 +16698,9 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
16697
16698
  setup(__props, { emit: __emit }) {
16698
16699
  const props2 = __props;
16699
16700
  const emit2 = __emit;
16700
- const name = computed(() => props2.groupName || Math.random().toString(36).substring(2, 15));
16701
+ const name = computed(
16702
+ () => props2.groupName || props2.id || Math.random().toString(36).substring(2, 15)
16703
+ );
16701
16704
  const selectedOption = useModel(__props, "modelValue");
16702
16705
  let isFocused = ref(false);
16703
16706
  const containerClasses = computed(() => ({
@@ -16769,7 +16772,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
16769
16772
  };
16770
16773
  }
16771
16774
  });
16772
- const RadioGroup = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-29cff93d"]]);
16775
+ const RadioGroup = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-adc49780"]]);
16773
16776
  const _hoisted_1$y = { class: "bagel-input" };
16774
16777
  const _hoisted_2$n = { class: "pb-025" };
16775
16778
  const _hoisted_3$k = { class: "flex gap-05 flex-wrap" };
@@ -32781,19 +32784,22 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
32781
32784
  columns: { default: () => [] },
32782
32785
  mColumns: { default: () => [] },
32783
32786
  mRows: { default: () => [] },
32784
- rows: { default: () => [] }
32787
+ rows: { default: () => [] },
32788
+ mGap: { default: void 0 }
32785
32789
  },
32786
32790
  setup(__props) {
32787
32791
  useCssVars((_ctx) => ({
32788
- "16111f2e": gapSize.value,
32789
- "2c189afc": gridTemplateRows.value,
32790
- "243c3a94": gridTemplateColumns.value,
32791
- "84a9b646": mGridTemplateRows.value,
32792
- "55be334e": mGridTemplateColumns.value
32792
+ "ff4aa016": gapSize.value,
32793
+ "3683119b": gridTemplateRows.value,
32794
+ "f6f04e4a": gridTemplateColumns.value,
32795
+ "fa53dae8": mGapSize.value,
32796
+ "0307a8e4": mGridTemplateRows.value,
32797
+ "7e4910f2": mGridTemplateColumns.value
32793
32798
  }));
32794
32799
  const props2 = __props;
32795
32800
  const gridTemplateRows = computed(() => props2.rows.length > 0 ? props2.rows.join(" ") : "auto");
32796
32801
  const gapSize = computed(() => `${props2.gap}rem`);
32802
+ const mGapSize = computed(() => props2.mGap !== void 0 ? `${props2.mGap}rem` : gapSize.value);
32797
32803
  const mGridTemplateRows = computed(() => {
32798
32804
  var _a;
32799
32805
  if ((_a = props2.mRows) == null ? void 0 : _a.length) return props2.mRows.join(" ");
@@ -32814,7 +32820,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
32814
32820
  };
32815
32821
  }
32816
32822
  });
32817
- const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-1814129a"]]);
32823
+ const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-a0f4895c"]]);
32818
32824
  const _hoisted_1$j = { key: 0 };
32819
32825
  const _sfc_main$o = /* @__PURE__ */ defineComponent({
32820
32826
  __name: "SidebarMenu",
@@ -34061,7 +34067,7 @@ const dragThreshold = 10;
34061
34067
  const _sfc_main$7 = /* @__PURE__ */ defineComponent({
34062
34068
  __name: "Slider",
34063
34069
  props: {
34064
- duration: { default: 200 },
34070
+ speed: { default: 350 },
34065
34071
  easing: { default: "ease-out" },
34066
34072
  perPage: {},
34067
34073
  startIndex: { default: 0 },
@@ -34071,11 +34077,12 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
34071
34077
  loop: { type: Boolean, default: true },
34072
34078
  rtl: { type: Boolean, default: false },
34073
34079
  autoplay: { type: [Boolean, String], default: "disabled" },
34074
- autoplayInterval: { default: 3e3 },
34075
- autoplaySpeed: { default: 50 },
34080
+ autoplayInterval: { default: 5e3 },
34081
+ autoplaySpeed: {},
34076
34082
  pauseOnHover: { type: Boolean, default: true },
34077
34083
  dots: { type: Boolean, default: false },
34078
34084
  slideWidth: { default: 300 },
34085
+ slideGap: { default: 1 },
34079
34086
  onInit: {},
34080
34087
  onChange: {}
34081
34088
  },
@@ -34121,7 +34128,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
34121
34128
  }
34122
34129
  const calculatedPerPage = perPage.value;
34123
34130
  return {
34124
- duration: props2.duration,
34131
+ speed: props2.speed,
34125
34132
  easing: props2.easing,
34126
34133
  perPage: calculatedPerPage,
34127
34134
  startIndex: props2.startIndex,
@@ -34132,10 +34139,11 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
34132
34139
  rtl: props2.rtl,
34133
34140
  autoplay: autoplayMode,
34134
34141
  autoplayInterval: props2.autoplayInterval,
34135
- autoplaySpeed: props2.autoplaySpeed,
34142
+ autoplaySpeed: props2.speed / 4,
34136
34143
  pauseOnHover: props2.pauseOnHover,
34137
34144
  dots: props2.dots,
34138
34145
  slideWidth: props2.slideWidth,
34146
+ slideGap: props2.slideGap,
34139
34147
  onInit: () => {
34140
34148
  emit2("init");
34141
34149
  },
@@ -34273,6 +34281,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
34273
34281
  const elementContainer = document.createElement("div");
34274
34282
  elementContainer.style.cssFloat = config.value.rtl ? "right" : "left";
34275
34283
  elementContainer.style.float = config.value.rtl ? "right" : "left";
34284
+ elementContainer.style.padding = config.value.slideGap ? `${config.value.slideGap / 2}rem` : "0";
34276
34285
  const percentage = config.value.loop ? 100 / (innerElements.value.length + perPage.value * 2) : 100 / innerElements.value.length;
34277
34286
  elementContainer.style.width = `${percentage}%`;
34278
34287
  elementContainer.appendChild(elm);
@@ -34371,8 +34380,8 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
34371
34380
  }
34372
34381
  function enableTransition() {
34373
34382
  if (sliderFrame.value) {
34374
- sliderFrame.value.style.webkitTransition = `all ${config.value.duration}ms ${config.value.easing}`;
34375
- sliderFrame.value.style.transition = `all ${config.value.duration}ms ${config.value.easing}`;
34383
+ sliderFrame.value.style.webkitTransition = `all ${config.value.speed}ms ${config.value.easing}`;
34384
+ sliderFrame.value.style.transition = `all ${config.value.speed}ms ${config.value.easing}`;
34376
34385
  }
34377
34386
  }
34378
34387
  function updateAfterDrag() {
@@ -34720,7 +34729,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
34720
34729
  };
34721
34730
  }
34722
34731
  });
34723
- const Slider = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-705b9c93"]]);
34732
+ const Slider = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-fee6ed49"]]);
34724
34733
  const _hoisted_1$4 = { class: "stickyTop" };
34725
34734
  const _hoisted_2$2 = {
34726
34735
  key: 0,
package/dist/style.css CHANGED
@@ -1874,20 +1874,20 @@ pre code.hljs{
1874
1874
  text-align: right;
1875
1875
  }
1876
1876
 
1877
- .radio-input-list[data-v-29cff93d]{
1877
+ .radio-input-list[data-v-adc49780]{
1878
1878
  width: auto;
1879
1879
  transform: scale(1.4);
1880
1880
  margin-inline-end: 0.6rem;
1881
1881
  }
1882
- .active-list-item[data-v-29cff93d]:has(:checked){
1882
+ .active-list-item[data-v-adc49780]:has(:checked){
1883
1883
  background: var(--bgl-primary-light) !important;
1884
1884
  border-color: var(--bgl-primary) !important;
1885
1885
  accent-color: var(--bgl-accent-color);
1886
1886
  }
1887
- .has-error .active-list-item[data-v-29cff93d] {
1887
+ .has-error .active-list-item[data-v-adc49780] {
1888
1888
  border-color: var(--bgl-red) !important;
1889
1889
  }
1890
- .has-error[data-v-29cff93d] :is(input[type="radio"]) {
1890
+ .has-error[data-v-adc49780] :is(input[type="radio"]) {
1891
1891
  accent-color: var(--bgl-red);
1892
1892
  }
1893
1893
 
@@ -2777,17 +2777,18 @@ input[type="range"][data-v-46e22f3e]:active::-webkit-slider-thumb {
2777
2777
  color: var(--bgl-primary) !important;
2778
2778
  }
2779
2779
 
2780
- .layout[data-v-1814129a] {
2780
+ .layout[data-v-a0f4895c] {
2781
2781
  min-height: 100px;
2782
2782
  display: grid;
2783
- gap: var(--16111f2e);
2784
- grid-template-rows: var(--2c189afc);
2785
- grid-template-columns: var(--243c3a94);
2783
+ gap: var(--ff4aa016);
2784
+ grid-template-rows: var(--3683119b);
2785
+ grid-template-columns: var(--f6f04e4a);
2786
2786
  }
2787
2787
  @media screen and (max-width: 910px) {
2788
- .layout[data-v-1814129a] {
2789
- grid-template-rows: var(--84a9b646);
2790
- grid-template-columns: var(--55be334e);
2788
+ .layout[data-v-a0f4895c] {
2789
+ gap: var(--fa53dae8);
2790
+ grid-template-rows: var(--0307a8e4);
2791
+ grid-template-columns: var(--7e4910f2);
2791
2792
  }
2792
2793
  }
2793
2794
 
@@ -4398,32 +4399,32 @@ body:has(.bg-dark.is-active) {
4398
4399
  background: transparent;
4399
4400
  }
4400
4401
 
4401
- .carousel-wrapper[data-v-705b9c93] {
4402
+ .carousel-wrapper[data-v-fee6ed49] {
4402
4403
  position: relative;
4403
4404
  width: 100%;
4404
4405
  }
4405
- .carousel-container[data-v-705b9c93] {
4406
+ .carousel-container[data-v-fee6ed49] {
4406
4407
  margin: 0 auto;
4407
4408
  overflow: hidden;
4408
4409
  }
4409
- .carousel-dots[data-v-705b9c93] {
4410
+ .carousel-dots[data-v-fee6ed49] {
4410
4411
  display: flex;
4411
4412
  justify-content: center;
4412
4413
  gap: 8px;
4413
4414
  margin-top: 16px;
4414
4415
  }
4415
- .carousel-dot[data-v-705b9c93] {
4416
+ .carousel-dot[data-v-fee6ed49] {
4416
4417
  width: 12px;
4417
4418
  height: 12px;
4418
4419
  border-radius: 50px;
4419
- background-color: #ccc;
4420
+ background-color: var(--bgl-gray-light);
4420
4421
  border: none;
4421
4422
  padding: 0;
4422
4423
  cursor: pointer;
4423
4424
  transition: all 0.3s ease-in-out;
4424
4425
  }
4425
- .carousel-dot.active[data-v-705b9c93] {
4426
- background-color: #333;
4426
+ .carousel-dot.active[data-v-fee6ed49] {
4427
+ background-color: var(--bgl-primary);
4427
4428
  width: 26px;
4428
4429
  }
4429
4430
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bagelink/vue",
3
3
  "type": "module",
4
- "version": "1.2.75",
4
+ "version": "1.2.79",
5
5
  "description": "Bagel core sdk packages",
6
6
  "author": {
7
7
  "name": "Neveh Allon",
@@ -7,7 +7,7 @@ type AutoplayMode = 'disabled' | 'standard' | 'linear'
7
7
  type AutoplayValue = boolean | AutoplayMode
8
8
 
9
9
  interface CarouselOptions {
10
- duration?: number
10
+ speed?: number
11
11
  easing?: Easing
12
12
  perPage?: number | { [key: number]: number }
13
13
  startIndex?: number
@@ -22,6 +22,7 @@ interface CarouselOptions {
22
22
  pauseOnHover?: boolean
23
23
  dots?: boolean
24
24
  slideWidth?: number
25
+ slideGap?: number
25
26
  onInit?: () => void
26
27
  onChange?: () => void
27
28
  }
@@ -35,7 +36,7 @@ interface DragState {
35
36
  }
36
37
 
37
38
  const props = withDefaults(defineProps<CarouselOptions>(), {
38
- duration: 200,
39
+ speed: 350,
39
40
  easing: 'ease-out',
40
41
  startIndex: 0,
41
42
  draggable: true,
@@ -44,11 +45,11 @@ const props = withDefaults(defineProps<CarouselOptions>(), {
44
45
  loop: true,
45
46
  rtl: false,
46
47
  autoplay: 'disabled',
47
- autoplayInterval: 3000,
48
- autoplaySpeed: 50,
48
+ autoplayInterval: 5000,
49
49
  pauseOnHover: true,
50
50
  dots: false,
51
51
  slideWidth: 300,
52
+ slideGap: 1
52
53
  })
53
54
 
54
55
  const emit = defineEmits<{
@@ -118,7 +119,7 @@ const config = computed<ComputedConfig>(() => {
118
119
  const calculatedPerPage = perPage.value
119
120
 
120
121
  return {
121
- duration: props.duration,
122
+ speed: props.speed,
122
123
  easing: props.easing,
123
124
  perPage: calculatedPerPage,
124
125
  startIndex: props.startIndex,
@@ -129,10 +130,11 @@ const config = computed<ComputedConfig>(() => {
129
130
  rtl: props.rtl,
130
131
  autoplay: autoplayMode,
131
132
  autoplayInterval: props.autoplayInterval,
132
- autoplaySpeed: props.autoplaySpeed,
133
+ autoplaySpeed: props.speed / 4,
133
134
  pauseOnHover: props.pauseOnHover,
134
135
  dots: props.dots,
135
136
  slideWidth: props.slideWidth,
137
+ slideGap: props.slideGap,
136
138
  onInit: () => { emit('init') },
137
139
  onChange: () => { emit('change') }
138
140
  }
@@ -343,7 +345,7 @@ function buildSliderFrameItem(elm: Element): HTMLElement {
343
345
  const elementContainer = document.createElement('div')
344
346
  elementContainer.style.cssFloat = config.value.rtl ? 'right' : 'left'
345
347
  elementContainer.style.float = config.value.rtl ? 'right' : 'left'
346
-
348
+ elementContainer.style.padding = config.value.slideGap ? `${config.value.slideGap / 2}rem` : '0'
347
349
  const percentage = config.value.loop
348
350
  ? 100 / (innerElements.value.length + (perPage.value * 2))
349
351
  : 100 / innerElements.value.length
@@ -474,8 +476,8 @@ function disableTransition(): void {
474
476
 
475
477
  function enableTransition(): void {
476
478
  if (sliderFrame.value) {
477
- sliderFrame.value.style.webkitTransition = `all ${config.value.duration}ms ${config.value.easing}`
478
- sliderFrame.value.style.transition = `all ${config.value.duration}ms ${config.value.easing}`
479
+ sliderFrame.value.style.webkitTransition = `all ${config.value.speed}ms ${config.value.easing}`
480
+ sliderFrame.value.style.transition = `all ${config.value.speed}ms ${config.value.easing}`
479
481
  }
480
482
  }
481
483
 
@@ -996,7 +998,7 @@ defineExpose({
996
998
  width: 12px;
997
999
  height: 12px;
998
1000
  border-radius: 50px;
999
- background-color: #ccc;
1001
+ background-color: var(--bgl-gray-light);
1000
1002
  border: none;
1001
1003
  padding: 0;
1002
1004
  cursor: pointer;
@@ -1004,7 +1006,7 @@ defineExpose({
1004
1006
  }
1005
1007
 
1006
1008
  .carousel-dot.active {
1007
- background-color: #333;
1009
+ background-color: var(--bgl-primary);
1008
1010
  width: 26px;
1009
1011
  }
1010
1012
  </style>
@@ -12,6 +12,7 @@ export interface RadioOption<T> {
12
12
  }
13
13
 
14
14
  const props = defineProps<{
15
+ id?: string
15
16
  groupName?: string
16
17
  options: RadioOption<ContextObjType>[]
17
18
  deletable?: boolean
@@ -22,7 +23,13 @@ const props = defineProps<{
22
23
 
23
24
  const emit = defineEmits(['delete', 'focus', 'blur', 'change'])
24
25
 
25
- const name = $computed(() => props.groupName || Math.random().toString(36).substring(2, 15))
26
+ const name = $computed(
27
+ () => (
28
+ props.groupName
29
+ || props.id
30
+ || Math.random().toString(36).substring(2, 15)
31
+ )
32
+ )
26
33
  const selectedOption = defineModel('modelValue')
27
34
  let isFocused = $ref(false)
28
35
 
@@ -58,10 +65,10 @@ function handleChange() {
58
65
  <input
59
66
  :id="opt.id || `${name}-${index}`"
60
67
  v-model="selectedOption"
61
- :disabled="disabled"
68
+ :disabled
62
69
  class="radio-input-list"
63
70
  type="radio"
64
- :name="name"
71
+ :name
65
72
  :value="opt.value"
66
73
  :required="required"
67
74
  @focus="handleFocus"
@@ -6,6 +6,7 @@ interface LayoutProrps {
6
6
  mColumns?: string[]
7
7
  mRows?: string[]
8
8
  rows?: string[]
9
+ mGap?: number
9
10
  }
10
11
 
11
12
  const props = withDefaults(defineProps<LayoutProrps>(), {
@@ -15,10 +16,14 @@ const props = withDefaults(defineProps<LayoutProrps>(), {
15
16
  rows: () => ([]),
16
17
  mColumns: () => ([]),
17
18
  mRows: () => ([]),
19
+ mGap: undefined,
20
+
18
21
  })
19
22
 
20
23
  const gridTemplateRows = $computed(() => (props.rows.length > 0 ? props.rows.join(' ') : 'auto'))
21
24
  const gapSize = $computed(() => `${props.gap}rem`)
25
+ const mGapSize = $computed(() => props.mGap !== undefined ? `${props.mGap}rem` : gapSize)
26
+
22
27
  const mGridTemplateRows = $computed(() => {
23
28
  if (props.mRows?.length) return props.mRows.join(' ')
24
29
  return gridTemplateRows
@@ -49,6 +54,7 @@ const mGridTemplateColumns = $computed(() => {
49
54
 
50
55
  @media screen and (max-width: 910px) {
51
56
  .layout {
57
+ gap: v-bind(mGapSize);
52
58
  grid-template-rows: v-bind(mGridTemplateRows);
53
59
  grid-template-columns: v-bind(mGridTemplateColumns);
54
60
  }