scroll-slides 0.0.0 → 0.1.0

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

@@ -9,6 +9,7 @@ declare const itemStates: {
 declare const isVertical: import("vue").ComputedRef<boolean>;
 declare const transformProperty: import("vue").ComputedRef<"translateY" | "translateX">;
 declare const itemIndices: import("vue").ComputedRef<number[]>;
+declare const spacerSize: import("vue").ComputedRef<number>;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_2: `item-${number}`, __VLS_3: {
     index: number;
@@ -26,10 +27,6 @@ declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPro
         default: string;
         validator: (value: string) => boolean;
     };
-    itemGap: {
-        type: NumberConstructor;
-        default: number;
-    };
     itemCount: {
         type: NumberConstructor;
         default: number;
@@ -46,22 +43,27 @@ declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPro
         type: NumberConstructor;
         default: number;
     };
+    allowScrollToFirst: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    spacerEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {
     sliderRef: typeof sliderRef;
     itemStates: typeof itemStates;
     isVertical: typeof isVertical;
     transformProperty: typeof transformProperty;
     itemIndices: typeof itemIndices;
+    spacerSize: typeof spacerSize;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     direction: {
         type: StringConstructor;
         default: string;
         validator: (value: string) => boolean;
     };
-    itemGap: {
-        type: NumberConstructor;
-        default: number;
-    };
     itemCount: {
         type: NumberConstructor;
         default: number;
@@ -78,13 +80,22 @@ declare const __VLS_self: import("vue").DefineComponent<import("vue").ExtractPro
         type: NumberConstructor;
         default: number;
     };
+    allowScrollToFirst: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    spacerEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{}>, {
     direction: string;
-    itemGap: number;
     itemCount: number;
     scaleRatio: number;
     scaleStartPercent: number;
     translateFactor: number;
+    allowScrollToFirst: boolean;
+    spacerEnabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     direction: {
@@ -92,10 +103,6 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         default: string;
         validator: (value: string) => boolean;
     };
-    itemGap: {
-        type: NumberConstructor;
-        default: number;
-    };
     itemCount: {
         type: NumberConstructor;
         default: number;
@@ -112,16 +119,20 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         type: NumberConstructor;
         default: number;
     };
+    allowScrollToFirst: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    spacerEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     direction: {
         type: StringConstructor;
         default: string;
         validator: (value: string) => boolean;
     };
-    itemGap: {
-        type: NumberConstructor;
-        default: number;
-    };
     itemCount: {
         type: NumberConstructor;
         default: number;
@@ -138,13 +149,22 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         type: NumberConstructor;
         default: number;
     };
+    allowScrollToFirst: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    spacerEnabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{}>, {
     direction: string;
-    itemGap: number;
     itemCount: number;
     scaleRatio: number;
     scaleStartPercent: number;
     translateFactor: number;
+    allowScrollToFirst: boolean;
+    spacerEnabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/scroll-slides.css

@@ -1 +1 @@
-.slider[data-v-11b44448]{position:relative;width:100%;height:100%;overflow-y:auto;overflow-x:hidden;padding:20px;box-sizing:border-box}.slider.horizontal[data-v-11b44448]{overflow-x:auto;overflow-y:hidden;white-space:nowrap}.slider-item[data-v-11b44448]{position:relative;background-color:#fff0;padding:0}.slider-item .slider-slot[data-v-11b44448]{display:flex;justify-content:center;align-items:center;box-shadow:0 2px 10px #0000001a;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:12px;transition:transform .04s}.horizontal .slider-item[data-v-11b44448]{display:inline-block;vertical-align:middle;transform-origin:center right}
+.slider[data-v-55bb67bd]{position:relative;width:100%;height:100%;overflow-y:auto;overflow-x:hidden;box-sizing:border-box}.slider.horizontal[data-v-55bb67bd]{overflow-x:auto;overflow-y:hidden;white-space:nowrap}.slider-item[data-v-55bb67bd]{position:relative}.slider-item .slider-slot[data-v-55bb67bd]{position:relative;transition:transform .04s}.horizontal .slider-item[data-v-55bb67bd]{display:inline-block;vertical-align:middle;transform-origin:center right}.slider-spacer[data-v-55bb67bd]{pointer-events:none}

package/dist/scroll-slides.js

@@ -1,16 +1,12 @@
-import { defineComponent as w, ref as R, reactive as L, computed as y, onMounted as A, createElementBlock as h, openBlock as g, normalizeClass as F, Fragment as G, renderList as I, normalizeStyle as _, createElementVNode as V, renderSlot as $ } from "vue";
-const q = /* @__PURE__ */ w({
+import { defineComponent as I, ref as C, reactive as F, computed as p, watch as x, onMounted as A, onUnmounted as H, createElementBlock as h, openBlock as y, normalizeClass as T, createCommentVNode as V, normalizeStyle as E, Fragment as W, renderList as O, createElementVNode as j, renderSlot as _ } from "vue";
+const q = /* @__PURE__ */ I({
   __name: "ScrollSlide",
   props: {
     direction: {
       type: String,
       default: "vertical",
       // 'vertical' or 'horizontal'
-      validator: (l) => ["vertical", "horizontal"].includes(l)
-    },
-    itemGap: {
-      type: Number,
-      default: 20
+      validator: (s) => ["vertical", "horizontal"].includes(s)
     },
     itemCount: {
       type: Number,
@@ -27,71 +23,108 @@ const q = /* @__PURE__ */ w({
     translateFactor: {
       type: Number,
       default: 100
+    },
+    allowScrollToFirst: {
+      type: Boolean,
+      default: !1
+    },
+    // Updating prop name to be clearer
+    spacerEnabled: {
+      type: Boolean,
+      default: !1
     }
   },
-  setup(l) {
-    const n = l, t = R(null), c = R([]), o = L({}), s = y(() => n.direction === "vertical"), b = y(() => s.value ? "translateY" : "translateX"), z = (e, r) => Math.min(Math.max(e / r, 0), 1), E = (e) => e * e * (3 - 2 * e), S = y(() => Array.from({ length: n.itemCount }, (e, r) => r)), u = () => {
+  setup(s) {
+    const r = s, t = C(null), u = C([]), n = F({}), o = p(() => r.direction === "vertical"), P = p(() => o.value ? "translateY" : "translateX"), R = (e, a) => Math.min(Math.max(e / a, 0), 1), $ = (e) => e * e * (3 - 2 * e), g = p(() => Array.from({ length: r.itemCount }, (e, a) => a)), i = () => {
       if (!t.value) return;
-      const e = t.value, r = e[s.value ? "clientHeight" : "clientWidth"];
-      c.value.forEach((a, m) => {
-        const i = a.getBoundingClientRect(), v = s.value ? i.top : i.left, P = e.getBoundingClientRect(), M = v - (s.value ? P.top : P.left), C = Math.min(
-          Math.max(0, (r - M) / r),
+      const e = t.value, a = e[o.value ? "clientHeight" : "clientWidth"];
+      u.value.forEach((l, c) => {
+        const v = l.getBoundingClientRect(), d = o.value ? v.top : v.left, z = e.getBoundingClientRect(), k = d - (o.value ? z.top : z.left), M = Math.min(
+          Math.max(0, (a - k) / a),
           1
-        ), N = z(1 - C - n.scaleStartPercent, 1 - n.scaleStartPercent), f = E(N), k = 1 + (n.scaleRatio - 1) * f, B = f * n.translateFactor;
-        let d;
-        const p = Math.min(Math.max(f || 0, 0), 1);
-        p > 0.6 ? d = 0 : p < 0.4 ? d = 1 : d = (0.6 - p) / 0.2, o[m] = {
-          scale: k,
-          translate: B,
-          opacity: d
+        ), B = R(1 - M - r.scaleStartPercent, 1 - r.scaleStartPercent), S = $(B), L = 1 + (r.scaleRatio - 1) * S, N = S * r.translateFactor;
+        let f;
+        const b = Math.min(Math.max(S || 0, 0), 1);
+        b > 0.6 ? f = 0 : b < 0.4 ? f = 1 : f = (0.6 - b) / 0.2, n[c] = {
+          scale: L,
+          translate: N,
+          opacity: f
         };
       });
-    };
-    return A(() => {
-      t.value && (c.value = Array.from(t.value.querySelectorAll(".slider-item")), c.value.forEach((e, r) => {
-        o[r] = {
+    }, w = () => {
+      t.value && (u.value = Array.from(t.value.querySelectorAll(".slider-item")), g.value.forEach((e) => {
+        n[e] || (n[e] = {
           scale: 1,
           translate: 0,
           opacity: 1
-        };
-      }), t.value.addEventListener("scroll", u), window.addEventListener("resize", u), t.value.addEventListener("touchmove", u, { passive: !0 }), u());
-    }), (e, r) => (g(), h("div", {
-      class: F(["slider", { horizontal: !s.value }]),
+        });
+      }), Object.keys(n).forEach((e) => {
+        const a = Number(e);
+        a >= r.itemCount && delete n[a];
+      }), i());
+    };
+    x(() => r.itemCount, (e, a) => {
+      setTimeout(() => {
+        w();
+      }, 0);
+    }, { immediate: !1 });
+    const m = p(() => {
+      if (!t.value) return 0;
+      const e = t.value[o.value ? "clientHeight" : "clientWidth"];
+      let a = 0;
+      if (u.value.length > 0) {
+        const l = u.value[0];
+        if (l) {
+          const c = l.getBoundingClientRect();
+          a = o.value ? c.height : c.width;
+        }
+      }
+      return Math.max(0, e - a);
+    });
+    return A(() => {
+      t.value && (t.value.addEventListener("scroll", i), window.addEventListener("resize", i), t.value.addEventListener("touchmove", i, { passive: !0 }), w());
+    }), H(() => {
+      t.value && (t.value.removeEventListener("scroll", i), t.value.removeEventListener("touchmove", i)), window.removeEventListener("resize", i);
+    }), (e, a) => (y(), h("div", {
+      class: T(["slider", { horizontal: !o.value }]),
       ref_key: "sliderRef",
       ref: t
     }, [
-      (g(!0), h(G, null, I(S.value, (a) => {
-        var m, i, v;
-        return g(), h("div", {
-          key: a,
+      s.spacerEnabled ? (y(), h("div", {
+        key: 0,
+        class: "slider-spacer",
+        style: E(o.value ? { height: `${m.value}px`, minHeight: `${m.value}px` } : { width: `${m.value}px`, minWidth: `${m.value}px`, display: "inline-block" })
+      }, null, 4)) : V("", !0),
+      (y(!0), h(W, null, O(g.value, (l) => {
+        var c, v, d;
+        return y(), h("div", {
+          key: l,
           class: "slider-item",
-          style: _({
-            marginBottom: s.value ? `${l.itemGap}px` : "0",
-            marginRight: s.value ? "0" : `${l.itemGap}px`,
-            zIndex: S.value.length - a
+          style: E({
+            zIndex: g.value.length - l
           })
         }, [
-          V("div", {
+          j("div", {
             class: "slider-slot",
-            style: _({
-              transform: `${b.value}(${-((m = o[a]) == null ? void 0 : m.translate) || 0}%) scale(${((i = o[a]) == null ? void 0 : i.scale) || 1})`,
-              opacity: (v = o[a]) == null ? void 0 : v.opacity
+            style: E({
+              transform: `${P.value}(${-((c = n[l]) == null ? void 0 : c.translate) || 0}%) scale(${((v = n[l]) == null ? void 0 : v.scale) || 1})`,
+              opacity: (d = n[l]) == null ? void 0 : d.opacity
             })
           }, [
-            $(e.$slots, `item-${a}`, { index: a }, () => [
-              $(e.$slots, "item", { index: a }, void 0, !0)
+            _(e.$slots, `item-${l}`, { index: l }, () => [
+              _(e.$slots, "item", { index: l }, void 0, !0)
             ], !0)
           ], 4)
         ], 4);
       }), 128))
     ], 2));
   }
-}), H = (l, n) => {
-  const t = l.__vccOpts || l;
-  for (const [c, o] of n)
-    t[c] = o;
+}), U = (s, r) => {
+  const t = s.__vccOpts || s;
+  for (const [u, n] of r)
+    t[u] = n;
   return t;
-}, T = /* @__PURE__ */ H(q, [["__scopeId", "data-v-11b44448"]]);
+}, Y = /* @__PURE__ */ U(q, [["__scopeId", "data-v-55bb67bd"]]);
 export {
-  T as ScrollSlide
+  Y as ScrollSlide
 };

package/dist/scroll-slides.umd.cjs

@@ -1 +1 @@
-(function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c.ScrollSlide={},c.Vue))})(this,function(c,e){"use strict";const _=((n,o)=>{const r=n.__vccOpts||n;for(const[m,s]of o)r[m]=s;return r})(e.defineComponent({__name:"ScrollSlide",props:{direction:{type:String,default:"vertical",validator:n=>["vertical","horizontal"].includes(n)},itemGap:{type:Number,default:20},itemCount:{type:Number,default:0},scaleRatio:{type:Number,default:.7},scaleStartPercent:{type:Number,default:.8},translateFactor:{type:Number,default:100}},setup(n){const o=n,r=e.ref(null),m=e.ref([]),s=e.reactive({}),i=e.computed(()=>o.direction==="vertical"),P=e.computed(()=>i.value?"translateY":"translateX"),R=(t,l)=>Math.min(Math.max(t/l,0),1),b=t=>t*t*(3-2*t),v=e.computed(()=>Array.from({length:o.itemCount},(t,l)=>l)),u=()=>{if(!r.value)return;const t=r.value,l=t[i.value?"clientHeight":"clientWidth"];m.value.forEach((a,f)=>{const d=a.getBoundingClientRect(),p=i.value?d.top:d.left,g=t.getBoundingClientRect(),k=p-(i.value?g.top:g.left),B=Math.min(Math.max(0,(l-k)/l),1),E=R(1-B-o.scaleStartPercent,1-o.scaleStartPercent),S=b(E),z=1+(o.scaleRatio-1)*S,M=S*o.translateFactor;let y;const h=Math.min(Math.max(S||0,0),1);h>.6?y=0:h<.4?y=1:y=(.6-h)/.2,s[f]={scale:z,translate:M,opacity:y}})};return e.onMounted(()=>{r.value&&(m.value=Array.from(r.value.querySelectorAll(".slider-item")),m.value.forEach((t,l)=>{s[l]={scale:1,translate:0,opacity:1}}),r.value.addEventListener("scroll",u),window.addEventListener("resize",u),r.value.addEventListener("touchmove",u,{passive:!0}),u())}),(t,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["slider",{horizontal:!i.value}]),ref_key:"sliderRef",ref:r},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,a=>{var f,d,p;return e.openBlock(),e.createElementBlock("div",{key:a,class:"slider-item",style:e.normalizeStyle({marginBottom:i.value?`${n.itemGap}px`:"0",marginRight:i.value?"0":`${n.itemGap}px`,zIndex:v.value.length-a})},[e.createElementVNode("div",{class:"slider-slot",style:e.normalizeStyle({transform:`${P.value}(${-((f=s[a])==null?void 0:f.translate)||0}%) scale(${((d=s[a])==null?void 0:d.scale)||1})`,opacity:(p=s[a])==null?void 0:p.opacity})},[e.renderSlot(t.$slots,`item-${a}`,{index:a},()=>[e.renderSlot(t.$slots,"item",{index:a},void 0,!0)],!0)],4)],4)}),128))],2))}}),[["__scopeId","data-v-11b44448"]]);c.ScrollSlide=_,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})});
+(function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s.ScrollSlide={},s.Vue))})(this,function(s,e){"use strict";const b=((c,a)=>{const l=c.__vccOpts||c;for(const[u,r]of a)l[u]=r;return l})(e.defineComponent({__name:"ScrollSlide",props:{direction:{type:String,default:"vertical",validator:c=>["vertical","horizontal"].includes(c)},itemCount:{type:Number,default:0},scaleRatio:{type:Number,default:.7},scaleStartPercent:{type:Number,default:.8},translateFactor:{type:Number,default:100},allowScrollToFirst:{type:Boolean,default:!1},spacerEnabled:{type:Boolean,default:!1}},setup(c){const a=c,l=e.ref(null),u=e.ref([]),r=e.reactive({}),i=e.computed(()=>a.direction==="vertical"),k=e.computed(()=>i.value?"translateY":"translateX"),z=(t,n)=>Math.min(Math.max(t/n,0),1),B=t=>t*t*(3-2*t),y=e.computed(()=>Array.from({length:a.itemCount},(t,n)=>n)),d=()=>{if(!l.value)return;const t=l.value,n=t[i.value?"clientHeight":"clientWidth"];u.value.forEach((o,m)=>{const f=o.getBoundingClientRect(),v=i.value?f.top:f.left,_=t.getBoundingClientRect(),w=v-(i.value?_.top:_.left),C=Math.min(Math.max(0,(n-w)/n),1),P=z(1-C-a.scaleStartPercent,1-a.scaleStartPercent),S=B(P),R=1+(a.scaleRatio-1)*S,$=S*a.translateFactor;let h;const g=Math.min(Math.max(S||0,0),1);g>.6?h=0:g<.4?h=1:h=(.6-g)/.2,r[m]={scale:R,translate:$,opacity:h}})},E=()=>{l.value&&(u.value=Array.from(l.value.querySelectorAll(".slider-item")),y.value.forEach(t=>{r[t]||(r[t]={scale:1,translate:0,opacity:1})}),Object.keys(r).forEach(t=>{const n=Number(t);n>=a.itemCount&&delete r[n]}),d())};e.watch(()=>a.itemCount,(t,n)=>{setTimeout(()=>{E()},0)},{immediate:!1});const p=e.computed(()=>{if(!l.value)return 0;const t=l.value[i.value?"clientHeight":"clientWidth"];let n=0;if(u.value.length>0){const o=u.value[0];if(o){const m=o.getBoundingClientRect();n=i.value?m.height:m.width}}return Math.max(0,t-n)});return e.onMounted(()=>{l.value&&(l.value.addEventListener("scroll",d),window.addEventListener("resize",d),l.value.addEventListener("touchmove",d,{passive:!0}),E())}),e.onUnmounted(()=>{l.value&&(l.value.removeEventListener("scroll",d),l.value.removeEventListener("touchmove",d)),window.removeEventListener("resize",d)}),(t,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["slider",{horizontal:!i.value}]),ref_key:"sliderRef",ref:l},[c.spacerEnabled?(e.openBlock(),e.createElementBlock("div",{key:0,class:"slider-spacer",style:e.normalizeStyle(i.value?{height:`${p.value}px`,minHeight:`${p.value}px`}:{width:`${p.value}px`,minWidth:`${p.value}px`,display:"inline-block"})},null,4)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(y.value,o=>{var m,f,v;return e.openBlock(),e.createElementBlock("div",{key:o,class:"slider-item",style:e.normalizeStyle({zIndex:y.value.length-o})},[e.createElementVNode("div",{class:"slider-slot",style:e.normalizeStyle({transform:`${k.value}(${-((m=r[o])==null?void 0:m.translate)||0}%) scale(${((f=r[o])==null?void 0:f.scale)||1})`,opacity:(v=r[o])==null?void 0:v.opacity})},[e.renderSlot(t.$slots,`item-${o}`,{index:o},()=>[e.renderSlot(t.$slots,"item",{index:o},void 0,!0)],!0)],4)],4)}),128))],2))}}),[["__scopeId","data-v-55bb67bd"]]);s.ScrollSlide=b,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});

package/dist/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "scroll-slides",
-  "version": "0.0.0",
+  "version": "0.1.0",
   "type": "module",
   "types": "./dist/index.d.ts",
   "files": [