vft 0.0.48 → 0.0.50

package/es/packages/components/virtual-list/components/fixed-size-grid.js

@@ -0,0 +1,125 @@
+import { isNumber as E } from "@vft/utils";
+import "vue";
+import { throwError as N } from "../../../utils/error.js";
+import "lodash";
+import "@vueuse/core";
+import "../../../utils/ns-cover.js";
+import S from "../builders/build-grid.js";
+import { AUTO_ALIGNMENT as M, CENTERED_ALIGNMENT as c, END_ALIGNMENT as x, START_ALIGNMENT as O, SMART_ALIGNMENT as l } from "../defaults.js";
+const p = "ElFixedSizeGrid", T = S({
+  name: "ElFixedSizeGrid",
+  getColumnPosition: ({ columnWidth: t }, e) => [
+    t,
+    e * t
+  ],
+  getRowPosition: ({ rowHeight: t }, e) => [
+    t,
+    e * t
+  ],
+  getEstimatedTotalHeight: ({ totalRow: t, rowHeight: e }) => e * t,
+  getEstimatedTotalWidth: ({ totalColumn: t, columnWidth: e }) => e * t,
+  getColumnOffset: ({ totalColumn: t, columnWidth: e, width: a }, o, n, s, u, d) => {
+    a = Number(a);
+    const i = Math.max(
+      0,
+      t * e - a
+    ), f = Math.min(
+      i,
+      o * e
+    ), r = Math.max(
+      0,
+      o * e - a + d + e
+    );
+    switch (n === "smart" && (s >= r - a && s <= f + a ? n = M : n = c), n) {
+      case O:
+        return f;
+      case x:
+        return r;
+      case c: {
+        const m = Math.round(r + (f - r) / 2);
+        return m < Math.ceil(a / 2) ? 0 : m > i + Math.floor(a / 2) ? i : m;
+      }
+      case M:
+      default:
+        return s >= r && s <= f ? s : r > f || s < r ? r : f;
+    }
+  },
+  getRowOffset: ({ rowHeight: t, height: e, totalRow: a }, o, n, s, u, d) => {
+    e = Number(e);
+    const i = Math.max(0, a * t - e), f = Math.min(i, o * t), r = Math.max(
+      0,
+      o * t - e + d + t
+    );
+    switch (n === l && (s >= r - e && s <= f + e ? n = M : n = c), n) {
+      case O:
+        return f;
+      case x:
+        return r;
+      case c: {
+        const m = Math.round(r + (f - r) / 2);
+        return m < Math.ceil(e / 2) ? 0 : m > i + Math.floor(e / 2) ? i : m;
+      }
+      case M:
+      default:
+        return s >= r && s <= f ? s : r > f || s < r ? r : f;
+    }
+  },
+  getColumnStartIndexForOffset: ({ columnWidth: t, totalColumn: e }, a) => Math.max(
+    0,
+    Math.min(
+      e - 1,
+      Math.floor(a / t)
+    )
+  ),
+  getColumnStopIndexForStartIndex: ({ columnWidth: t, totalColumn: e, width: a }, o, n) => {
+    const s = o * t, u = Math.ceil(
+      (a + n - s) / t
+    );
+    return Math.max(
+      0,
+      Math.min(e - 1, o + u - 1)
+    );
+  },
+  getRowStartIndexForOffset: ({ rowHeight: t, totalRow: e }, a) => Math.max(
+    0,
+    Math.min(e - 1, Math.floor(a / t))
+  ),
+  getRowStopIndexForStartIndex: ({ rowHeight: t, totalRow: e, height: a }, o, n) => {
+    const s = o * t, u = Math.ceil(
+      (a + n - s) / t
+    );
+    return Math.max(
+      0,
+      Math.min(
+        e - 1,
+        o + u - 1
+        // -1 is because stop index is inclusive
+      )
+    );
+  },
+  /**
+   * Fixed size grid does not need this cache
+   * Using any to bypass it, TODO: Using type inference to fix this.
+   */
+  initCache: () => {
+  },
+  clearCache: !0,
+  validateProps: ({ columnWidth: t, rowHeight: e }) => {
+    process.env.NODE_ENV !== "production" && (E(t) || N(
+      p,
+      `
+          "columnWidth" must be passed as number,
+            instead ${typeof t} was given.
+        `
+    ), E(e) || N(
+      p,
+      `
+          "columnWidth" must be passed as number,
+            instead ${typeof e} was given.
+        `
+    ));
+  }
+});
+export {
+  T as default
+};

package/es/packages/components/virtual-list/components/fixed-size-list.js

@@ -0,0 +1,68 @@
+import { isString as p } from "@vft/utils";
+import "vue";
+import { throwError as N } from "../../../utils/error.js";
+import "lodash";
+import "@vueuse/core";
+import "../../../utils/ns-cover.js";
+import l from "../builders/build-list.js";
+import { isHorizontal as M } from "../utils.js";
+import { AUTO_ALIGNMENT as E, CENTERED_ALIGNMENT as d, END_ALIGNMENT as I, START_ALIGNMENT as T, SMART_ALIGNMENT as x } from "../defaults.js";
+const F = l({
+  name: "ElFixedSizeList",
+  getItemOffset: ({ itemSize: t }, e) => e * t,
+  getItemSize: ({ itemSize: t }) => t,
+  getEstimatedTotalSize: ({ total: t, itemSize: e }) => e * t,
+  getOffset: ({ height: t, total: e, itemSize: o, layout: h, width: u }, n, s, i) => {
+    const r = M(h) ? u : t;
+    process.env.NODE_ENV !== "production" && p(r) && N(
+      "[ElVirtualList]",
+      `
+        You should set
+          width/height
+        to number when your layout is
+          horizontal/vertical
+      `
+    );
+    const m = Math.max(0, e * o - r), f = Math.min(m, n * o), a = Math.max(0, (n + 1) * o - r);
+    switch (s === x && (i >= a - r && i <= f + r ? s = E : s = d), s) {
+      case T:
+        return f;
+      case I:
+        return a;
+      case d: {
+        const c = Math.round(a + (f - a) / 2);
+        return c < Math.ceil(r / 2) ? 0 : c > m + Math.floor(r / 2) ? m : c;
+      }
+      case E:
+      default:
+        return i >= a && i <= f ? i : i < a ? a : f;
+    }
+  },
+  getStartIndexForOffset: ({ total: t, itemSize: e }, o) => Math.max(0, Math.min(t - 1, Math.floor(o / e))),
+  getStopIndexForStartIndex: ({ height: t, total: e, itemSize: o, layout: h, width: u }, n, s) => {
+    const i = n * o, r = M(h) ? u : t, m = Math.ceil(
+      (r + s - i) / o
+    );
+    return Math.max(
+      0,
+      Math.min(
+        e - 1,
+        // because startIndex is inclusive, so in order to prevent array outbound indexing
+        // we need to - 1 to prevent outbound behavior
+        n + m - 1
+      )
+    );
+  },
+  /**
+   * Fixed size list does not need this cache
+   * Using any to bypass it, TODO: Using type inference to fix this.
+   */
+  initCache() {
+  },
+  clearCache: !0,
+  validateProps() {
+  }
+});
+export {
+  F as default
+};

package/es/packages/components/virtual-list/components/scrollbar.js

@@ -0,0 +1,135 @@
+import { defineComponent as C, computed as a, ref as p, reactive as N, unref as d, watch as k, onBeforeUnmount as O, h as x, withModifiers as _ } from "vue";
+import "../../scrollbar/index.js";
+import "@vft/utils";
+import "lodash";
+import { cAF as F, rAF as G } from "../../../utils/vue/raf.js";
+import "../../../utils/ns-cover.js";
+import "@vueuse/core";
+import { useNamespace as L } from "../../../hooks/use-namespace/index.js";
+import "@popperjs/core";
+import "../../../hooks/use-z-index/index.js";
+import { HORIZONTAL as R, ScrollbarDirKey as H, SCROLLBAR_MIN_SIZE as V } from "../defaults.js";
+import { virtualizedScrollbarProps as Z } from "../props.js";
+import { renderThumbStyle as $ } from "../utils.js";
+import { BAR_MAP as K } from "../../scrollbar/util.js";
+const lt = C({
+  name: "ElVirtualScrollBar",
+  props: Z,
+  emits: ["scroll", "start-move", "stop-move"],
+  setup(e, { emit: u }) {
+    const b = a(() => e.startGap + e.endGap), z = L("virtual-scrollbar"), I = L("scrollbar"), f = p(), l = p();
+    let S = null, h = null;
+    const n = N({
+      isDragging: !1,
+      traveled: 0
+    }), o = a(() => K[e.layout]), M = a(() => e.clientSize - d(b)), A = a(() => ({
+      position: "absolute",
+      width: `${R === e.layout ? M.value : e.scrollbarSize}px`,
+      height: `${R === e.layout ? e.scrollbarSize : M.value}px`,
+      [H[e.layout]]: "2px",
+      right: "2px",
+      bottom: "2px",
+      borderRadius: "4px"
+    })), g = a(() => {
+      const t = e.ratio, r = e.clientSize;
+      if (t >= 100)
+        return Number.POSITIVE_INFINITY;
+      if (t >= 50)
+        return t * r / 100;
+      const i = r / 3;
+      return Math.floor(
+        Math.min(
+          Math.max(t * r, V),
+          i
+        )
+      );
+    }), B = a(() => {
+      if (!Number.isFinite(g.value))
+        return {
+          display: "none"
+        };
+      const t = `${g.value}px`;
+      return $(
+        {
+          bar: o.value,
+          size: t,
+          move: n.traveled
+        },
+        e.layout
+      );
+    }), s = a(
+      () => Math.floor(e.clientSize - g.value - d(b))
+    ), T = () => {
+      window.addEventListener("mousemove", m), window.addEventListener("mouseup", c);
+      const t = d(l);
+      t && (h = document.onselectstart, document.onselectstart = () => !1, t.addEventListener("touchmove", m), t.addEventListener("touchend", c));
+    }, y = () => {
+      window.removeEventListener("mousemove", m), window.removeEventListener("mouseup", c), document.onselectstart = h, h = null;
+      const t = d(l);
+      t && (t.removeEventListener("touchmove", m), t.removeEventListener("touchend", c));
+    }, w = (t) => {
+      t.stopImmediatePropagation(), !(t.ctrlKey || [1, 2].includes(t.button)) && (n.isDragging = !0, n[o.value.axis] = t.currentTarget[o.value.offset] - (t[o.value.client] - t.currentTarget.getBoundingClientRect()[o.value.direction]), u("start-move"), T());
+    }, c = () => {
+      n.isDragging = !1, n[o.value.axis] = 0, u("stop-move"), y();
+    }, m = (t) => {
+      const { isDragging: r } = n;
+      if (!r || !l.value || !f.value)
+        return;
+      const i = n[o.value.axis];
+      if (!i)
+        return;
+      F(S);
+      const v = (f.value.getBoundingClientRect()[o.value.direction] - t[o.value.client]) * -1, P = l.value[o.value.offset] - i, E = v - P;
+      S = G(() => {
+        n.traveled = Math.max(
+          e.startGap,
+          Math.min(
+            E,
+            s.value
+            // 2 is the top value
+          )
+        ), u("scroll", E, s.value);
+      });
+    }, D = (t) => {
+      const r = Math.abs(
+        t.target.getBoundingClientRect()[o.value.direction] - t[o.value.client]
+      ), i = l.value[o.value.offset] / 2, v = r - i;
+      n.traveled = Math.max(0, Math.min(v, s.value)), u("scroll", v, s.value);
+    };
+    return k(
+      () => e.scrollFrom,
+      (t) => {
+        n.isDragging || (n.traveled = Math.ceil(t * s.value));
+      }
+    ), O(() => {
+      y();
+    }), () => x(
+      "div",
+      {
+        role: "presentation",
+        ref: f,
+        class: [
+          z.b(),
+          e.class,
+          (e.alwaysOn || n.isDragging) && "always-on"
+        ],
+        style: A.value,
+        onMousedown: _(D, ["stop", "prevent"]),
+        onTouchstartPrevent: w
+      },
+      x(
+        "div",
+        {
+          ref: l,
+          class: I.e("thumb"),
+          style: B.value,
+          onMousedown: w
+        },
+        []
+      )
+    );
+  }
+});
+export {
+  lt as default
+};

package/es/packages/components/virtual-list/defaults.js

@@ -0,0 +1,33 @@
+const n = 50, c = "itemRendered", s = "scroll", T = "forward", e = "backward", E = "auto", _ = "smart", R = "start", r = "center", A = "end", t = "horizontal", o = "vertical", L = "ltr", N = "rtl", S = "negative", a = "positive-ascending", i = "positive-descending", I = {
+  [t]: "pageX",
+  [o]: "pageY"
+}, l = {
+  [t]: "height",
+  [o]: "width"
+}, O = {
+  [t]: "left",
+  [o]: "top"
+}, M = 20;
+export {
+  E as AUTO_ALIGNMENT,
+  e as BACKWARD,
+  r as CENTERED_ALIGNMENT,
+  n as DEFAULT_DYNAMIC_LIST_ITEM_SIZE,
+  A as END_ALIGNMENT,
+  T as FORWARD,
+  t as HORIZONTAL,
+  c as ITEM_RENDER_EVT,
+  L as LTR,
+  I as PageKey,
+  N as RTL,
+  S as RTL_OFFSET_NAG,
+  a as RTL_OFFSET_POS_ASC,
+  i as RTL_OFFSET_POS_DESC,
+  M as SCROLLBAR_MIN_SIZE,
+  s as SCROLL_EVT,
+  _ as SMART_ALIGNMENT,
+  R as START_ALIGNMENT,
+  O as ScrollbarDirKey,
+  l as ScrollbarSizeKey,
+  o as VERTICAL
+};

package/es/packages/components/virtual-list/hooks/use-cache.js

@@ -0,0 +1,13 @@
+import { getCurrentInstance as r, computed as t } from "vue";
+import { memoize as m } from "lodash";
+import p from "memoize-one";
+const a = () => {
+  const o = r().proxy.$props;
+  return t(() => {
+    const e = (c, s, _) => ({});
+    return o.perfMode ? m(e) : p(e);
+  });
+};
+export {
+  a as useCache
+};

package/es/packages/components/virtual-list/hooks/use-grid-wheel.js

@@ -0,0 +1,26 @@
+import "@vft/utils";
+import "vue";
+import "lodash";
+import { cAF as c, rAF as m } from "../../../utils/vue/raf.js";
+import "../../../utils/ns-cover.js";
+import "@vueuse/core";
+const W = ({ atXEndEdge: s, atXStartEdge: f, atYEndEdge: i, atYStartEdge: d }, h) => {
+  let n = null, r = 0, a = 0;
+  const o = (l, t) => {
+    const e = l <= 0 && f.value || l >= 0 && s.value, u = t <= 0 && d.value || t >= 0 && i.value;
+    return e && u;
+  };
+  return {
+    hasReachedEdge: o,
+    onWheel: (l) => {
+      c(n);
+      let t = l.deltaX, e = l.deltaY;
+      Math.abs(t) > Math.abs(e) ? e = 0 : t = 0, l.shiftKey && e !== 0 && (t = e, e = 0), !(o(r, a) && o(r + t, a + e)) && (r += t, a += e, l.preventDefault(), n = m(() => {
+        h(r, a), r = 0, a = 0;
+      }));
+    }
+  };
+};
+export {
+  W as useGridWheel
+};

package/es/packages/components/virtual-list/hooks/use-wheel.js

@@ -0,0 +1,27 @@
+import { isFirefox as i } from "@vft/utils";
+import "vue";
+import "lodash";
+import { cAF as m, rAF as c } from "../../../utils/vue/raf.js";
+import "../../../utils/ns-cover.js";
+import "@vueuse/core";
+import { HORIZONTAL as d, VERTICAL as u } from "../defaults.js";
+const p = {
+  [d]: "deltaX",
+  [u]: "deltaY"
+}, W = ({ atEndEdge: n, atStartEdge: l, layout: s }, f) => {
+  let a, e = 0;
+  const o = (t) => t < 0 && l.value || t > 0 && n.value;
+  return {
+    hasReachedEdge: o,
+    onWheel: (t) => {
+      m(a);
+      const r = t[p[s.value]];
+      o(e) && o(e + r) || (e += r, i() || t.preventDefault(), a = c(() => {
+        f(e), e = 0;
+      }));
+    }
+  };
+};
+export {
+  W as default
+};

package/es/packages/components/virtual-list/index.js

@@ -0,0 +1,15 @@
+import { default as e } from "./components/fixed-size-list.js";
+import { default as a } from "./components/dynamic-size-list.js";
+import { default as d } from "./components/fixed-size-grid.js";
+import { default as l } from "./components/dynamic-size-grid.js";
+import { virtualizedGridProps as p, virtualizedListProps as u, virtualizedProps as z, virtualizedScrollbarProps as m } from "./props.js";
+export {
+  l as DynamicSizeGrid,
+  a as DynamicSizeList,
+  d as FixedSizeGrid,
+  e as FixedSizeList,
+  p as virtualizedGridProps,
+  u as virtualizedListProps,
+  z as virtualizedProps,
+  m as virtualizedScrollbarProps
+};

package/es/packages/components/virtual-list/props.js

@@ -0,0 +1,147 @@
+import "@vft/utils";
+import "vue";
+import { buildProp as e, buildProps as l, definePropType as t } from "../../utils/vue/props/runtime.js";
+import "@vueuse/core";
+import { mutable as b } from "../../utils/typescript.js";
+import "../../utils/ns-cover.js";
+import "lodash";
+import { VERTICAL as f } from "./defaults.js";
+const o = e({
+  type: t([Number, Function]),
+  required: !0
+}), i = e({
+  type: Number
+}), a = e({
+  type: Number,
+  default: 2
+}), S = e({
+  type: String,
+  values: ["ltr", "rtl"],
+  default: "ltr"
+}), u = e({
+  type: Number,
+  default: 0
+}), r = e({
+  type: Number,
+  required: !0
+}), p = e({
+  type: String,
+  values: ["horizontal", "vertical"],
+  default: f
+}), s = l({
+  className: {
+    type: String,
+    default: ""
+  },
+  containerElement: {
+    type: t([String, Object]),
+    default: "div"
+  },
+  data: {
+    type: t(Array),
+    default: () => b([])
+  },
+  /**
+   * @description controls the horizontal direction.
+   */
+  direction: S,
+  height: {
+    type: [String, Number],
+    required: !0
+  },
+  innerElement: {
+    type: [String, Object],
+    default: "div"
+  },
+  style: {
+    type: t([Object, String, Array])
+  },
+  useIsScrolling: {
+    type: Boolean,
+    default: !1
+  },
+  width: {
+    type: [Number, String],
+    required: !1
+  },
+  perfMode: {
+    type: Boolean,
+    default: !0
+  },
+  scrollbarAlwaysOn: {
+    type: Boolean,
+    default: !1
+  }
+}), O = l({
+  /**
+   * @description describes how many items should be pre rendered to the head
+   * and the tail of the window
+   */
+  cache: a,
+  estimatedItemSize: i,
+  /**
+   * @description controls the list's orientation
+   */
+  layout: p,
+  initScrollOffset: u,
+  /**
+   * @description describes the total number of the list.
+   */
+  total: r,
+  itemSize: o,
+  ...s
+}), n = {
+  type: Number,
+  default: 6
+}, c = { type: Number, default: 0 }, d = { type: Number, default: 2 }, B = l({
+  columnCache: a,
+  columnWidth: o,
+  estimatedColumnWidth: i,
+  estimatedRowHeight: i,
+  initScrollLeft: u,
+  initScrollTop: u,
+  itemKey: {
+    type: t(Function),
+    default: ({
+      columnIndex: m,
+      rowIndex: y
+    }) => `${y}:${m}`
+  },
+  rowCache: a,
+  rowHeight: o,
+  totalColumn: r,
+  totalRow: r,
+  hScrollbarSize: n,
+  vScrollbarSize: n,
+  scrollbarStartGap: c,
+  scrollbarEndGap: d,
+  role: String,
+  ...s
+}), C = l({
+  alwaysOn: Boolean,
+  class: String,
+  layout: p,
+  total: r,
+  ratio: {
+    type: Number,
+    required: !0
+  },
+  clientSize: {
+    type: Number,
+    required: !0
+  },
+  scrollFrom: {
+    type: Number,
+    required: !0
+  },
+  scrollbarSize: n,
+  startGap: c,
+  endGap: d,
+  visible: Boolean
+});
+export {
+  B as virtualizedGridProps,
+  O as virtualizedListProps,
+  s as virtualizedProps,
+  C as virtualizedScrollbarProps
+};

package/es/packages/components/virtual-list/style/css.js

@@ -0,0 +1,3 @@
+import "vft/theme-style/base.css";
+import "vft/theme-style/vft-virtual-list.css";
+import "vft/theme-style/vft-scrollbar.css";

package/es/packages/components/virtual-list/style/index.js

@@ -0,0 +1,3 @@
+import "vft/theme-style/src/base.scss";
+import "vft/theme-style/src/virtual-list.scss";
+import "vft/theme-style/src/scrollbar.scss";

package/es/packages/components/virtual-list/types.js

@@ -0,0 +1 @@
+

package/es/packages/components/virtual-list/utils.js

@@ -0,0 +1,25 @@
+import { FORWARD as d, BACKWARD as f, LTR as h, RTL as c, HORIZONTAL as u, PageKey as i, RTL_OFFSET_POS_DESC as a, RTL_OFFSET_NAG as T, RTL_OFFSET_POS_ASC as m } from "./defaults.js";
+const p = (e, t) => e < t ? d : f, L = (e) => e === h || e === c || e === u, S = (e) => e === c;
+let l = null;
+function y(e = !1) {
+  if (l === null || e) {
+    const t = document.createElement("div"), o = t.style;
+    o.width = "50px", o.height = "50px", o.overflow = "scroll", o.direction = "rtl";
+    const r = document.createElement("div"), n = r.style;
+    return n.width = "100px", n.height = "100px", t.appendChild(r), document.body.appendChild(t), t.scrollLeft > 0 ? l = a : (t.scrollLeft = 1, t.scrollLeft === 0 ? l = T : l = m), document.body.removeChild(t), l;
+  }
+  return l;
+}
+const O = (e, t) => "touches" in e ? e.touches[0][i[t]] : e[i[t]];
+function _({ move: e, size: t, bar: o }, r) {
+  const n = {}, s = `translate${o.axis}(${e}px)`;
+  return n[o.size] = t, n.transform = s, n.msTransform = s, n.webkitTransform = s, r === "horizontal" ? n.height = "100%" : n.width = "100%", n;
+}
+export {
+  y as getRTLOffsetType,
+  O as getRelativePos,
+  p as getScrollDir,
+  L as isHorizontal,
+  S as isRTL,
+  _ as renderThumbStyle
+};

package/es/packages/hooks/use-id/index.js

@@ -0,0 +1,30 @@
+import { getCurrentInstance as n, inject as i, computed as c, unref as s } from "vue";
+import { isClient as u } from "@vueuse/core";
+import "@vft/utils";
+import { debugWarn as d } from "../../utils/error.js";
+import "lodash";
+import "../../utils/ns-cover.js";
+import { useGetDerivedNamespace as p } from "../use-namespace/index.js";
+const r = {
+  prefix: Math.floor(Math.random() * 1e4),
+  current: 0
+}, m = Symbol("elIdInjection"), I = () => n() ? i(m, r) : r, h = (o) => {
+  const e = I();
+  !u && e === r && d(
+    "IdInjection",
+    `Looks like you are using server rendering, you must provide a id provider to ensure the hydration process to be succeed
+usage: app.provide(ID_INJECTION_KEY, {
+  prefix: number,
+  current: number,
+})`
+  );
+  const t = p();
+  return c(
+    () => s(o) || `${t.value}-id-${e.prefix}-${e.current++}`
+  );
+};
+export {
+  m as ID_INJECTION_KEY,
+  h as useId,
+  I as useIdInjection
+};

package/es/packages/hooks/use-ordered-children/index.js

@@ -0,0 +1,28 @@
+import { shallowRef as s, isVNode as m } from "vue";
+import "@vft/utils";
+import { flattedChildren as p } from "../../utils/vue/vnode.js";
+import "lodash";
+import "@vueuse/core";
+import "../../utils/ns-cover.js";
+const c = (t, i, d) => p(t.subTree).filter(
+  (e) => {
+    var r;
+    return m(e) && ((r = e.type) == null ? void 0 : r.name) === i && !!e.component;
+  }
+).map((e) => e.component.uid).map((e) => d[e]).filter((e) => !!e), O = (t, i) => {
+  const d = {}, o = s([]);
+  return {
+    children: o,
+    addChild: (r) => {
+      d[r.uid] = r, o.value = c(t, i, d);
+    },
+    removeChild: (r) => {
+      delete d[r], o.value = o.value.filter(
+        (l) => l.uid !== r
+      );
+    }
+  };
+};
+export {
+  O as useOrderedChildren
+};