@tachybase/schema 0.23.41 → 0.23.48

package/lib/grid/index.js

@@ -0,0 +1,378 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var grid_exports = {};
+__export(grid_exports, {
+  Grid: () => Grid
+});
+module.exports = __toCommonJS(grid_exports);
+var import_reactive = require("../reactive");
+var import_observer = require("./observer");
+const SpanRegExp = /span\s*(\d+)/;
+const isValid = /* @__PURE__ */ __name((value) => value !== void 0 && value !== null, "isValid");
+const calcBreakpointIndex = /* @__PURE__ */ __name((breakpoints, width) => {
+  if (Array.isArray(breakpoints)) {
+    for (let i = 0; i < breakpoints.length; i++) {
+      if (width <= breakpoints[i]) {
+        return i;
+      }
+    }
+  }
+  return -1;
+}, "calcBreakpointIndex");
+const calcFactor = /* @__PURE__ */ __name((value, breakpointIndex) => {
+  if (Array.isArray(value)) {
+    if (breakpointIndex === -1) return value[0];
+    return value[breakpointIndex] ?? value[value.length - 1];
+  } else {
+    return value;
+  }
+}, "calcFactor");
+const parseGridNode = /* @__PURE__ */ __name((elements) => {
+  return Array.from(elements).reduce((buf, element, index) => {
+    const style = getComputedStyle(element);
+    const visible = !(style.display === "none");
+    const origin = element.getAttribute("data-grid-span");
+    const span = parseSpan(style.gridColumnStart) ?? 1;
+    const originSpan = Number(origin ?? span);
+    const node = {
+      index,
+      span,
+      visible,
+      originSpan,
+      element
+    };
+    if (!origin) {
+      element.setAttribute("data-grid-span", String(span));
+    }
+    return buf.concat(node);
+  }, []);
+}, "parseGridNode");
+const calcChildTotalColumns = /* @__PURE__ */ __name((nodes, shadow = false) => nodes.reduce((buf, node) => {
+  if (!shadow) {
+    if (!node.visible) return buf;
+  }
+  if (node.originSpan === -1) return buf + (node.span ?? 1);
+  return buf + node.span;
+}, 0), "calcChildTotalColumns");
+const calcChildOriginTotalColumns = /* @__PURE__ */ __name((nodes, shadow = false) => nodes.reduce((buf, node) => {
+  if (!shadow) {
+    if (!node.visible) return buf;
+  }
+  if (node.originSpan === -1) return buf + (node.span ?? 1);
+  return buf + node.originSpan;
+}, 0), "calcChildOriginTotalColumns");
+const calcSatisfyColumns = /* @__PURE__ */ __name((width, maxColumns, minColumns, maxWidth, minWidth, gap) => {
+  const results = [];
+  for (let columns = minColumns; columns <= maxColumns; columns++) {
+    const innerWidth = width - (columns - 1) * gap;
+    const columnWidth = innerWidth / columns;
+    if (columnWidth >= minWidth && columnWidth <= maxWidth) {
+      results.push(columns);
+    } else if (columnWidth < minWidth) {
+      results.push(Math.min(Math.floor(innerWidth / minWidth), maxColumns));
+    } else if (columnWidth > maxWidth) {
+      results.push(Math.min(Math.floor(innerWidth / maxWidth), maxColumns));
+    }
+  }
+  return Math.max(...results);
+}, "calcSatisfyColumns");
+const parseSpan = /* @__PURE__ */ __name((gridColumnStart) => {
+  var _a;
+  return Number(((_a = String(gridColumnStart).match(SpanRegExp)) == null ? void 0 : _a[1]) ?? 1);
+}, "parseSpan");
+const factor = /* @__PURE__ */ __name((value, grid) => isValid(value) ? calcFactor(value, grid.breakpoint) : value, "factor");
+const resolveChildren = /* @__PURE__ */ __name((grid) => {
+  let walked = 0, shadowWalked = 0, rowIndex = 0, shadowRowIndex = 0;
+  if (!grid.ready) return;
+  grid.children = grid.children.map((node) => {
+    var _a;
+    const columnIndex = walked % grid.columns;
+    const shadowColumnIndex = shadowWalked % grid.columns;
+    const remainColumns = grid.columns - columnIndex;
+    const originSpan = node.originSpan;
+    const targetSpan = originSpan > grid.columns ? grid.columns : originSpan;
+    const span = grid.options.strictAutoFit ? targetSpan : targetSpan > remainColumns ? remainColumns : targetSpan;
+    const gridColumn = originSpan === -1 ? `span ${remainColumns} / -1` : `span ${span} / auto`;
+    if (node.element.style.gridColumn !== gridColumn) {
+      node.element.style.gridColumn = gridColumn;
+    }
+    if (node.visible) {
+      walked += span;
+    }
+    shadowWalked += span;
+    if (columnIndex === 0) {
+      rowIndex++;
+    }
+    if (shadowColumnIndex === 0) {
+      shadowRowIndex++;
+    }
+    node.shadowRow = shadowRowIndex;
+    node.shadowColumn = shadowColumnIndex + 1;
+    if (node.visible) {
+      node.row = rowIndex;
+      node.column = columnIndex + 1;
+    }
+    if ((_a = grid.options) == null ? void 0 : _a.shouldVisible) {
+      if (!grid.options.shouldVisible(node, grid)) {
+        if (node.visible) {
+          node.element.style.display = "none";
+        }
+        node.visible = false;
+      } else {
+        if (!node.visible) {
+          node.element.style.display = "";
+        }
+        node.visible = true;
+      }
+    }
+    return node;
+  });
+}, "resolveChildren");
+const nextTick = /* @__PURE__ */ __name((callback) => Promise.resolve(0).then(callback), "nextTick");
+const _Grid = class _Grid {
+  constructor(options) {
+    this.width = 0;
+    this.height = 0;
+    this.children = [];
+    this.childTotalColumns = 0;
+    this.shadowChildTotalColumns = 0;
+    this.childOriginTotalColumns = 0;
+    this.shadowChildOriginTotalColumns = 0;
+    this.ready = false;
+    this.connect = /* @__PURE__ */ __name((container) => {
+      if (container) {
+        this.container = container;
+        const initialize = import_reactive.batch.bound(() => {
+          digest();
+          this.ready = true;
+        });
+        const digest = import_reactive.batch.bound(() => {
+          this.children = parseGridNode(this.container.children);
+          this.childTotalColumns = calcChildTotalColumns(this.children);
+          this.shadowChildTotalColumns = calcChildTotalColumns(this.children, true);
+          this.childOriginTotalColumns = calcChildOriginTotalColumns(this.children);
+          this.shadowChildOriginTotalColumns = calcChildOriginTotalColumns(this.children, true);
+          const rect = this.container.getBoundingClientRect();
+          if (rect.width && rect.height) {
+            this.width = rect.width;
+            this.height = rect.height;
+          }
+          resolveChildren(this);
+          nextTick(() => {
+            var _a, _b;
+            (_b = (_a = this.options) == null ? void 0 : _a.onDigest) == null ? void 0 : _b.call(_a, this);
+          });
+          if (!this.ready) {
+            nextTick(() => {
+              var _a, _b;
+              (_b = (_a = this.options) == null ? void 0 : _a.onInitialized) == null ? void 0 : _b.call(_a, this);
+            });
+          }
+        });
+        const mutationObserver = new import_observer.ChildListMutationObserver(digest);
+        const resizeObserver = new ResizeObserver(digest);
+        const dispose = (0, import_reactive.reaction)(() => ({ ...this.options }), digest);
+        resizeObserver.observe(this.container);
+        mutationObserver.observe(this.container, {
+          attributeFilter: ["data-grid-span"],
+          attributes: true
+        });
+        initialize();
+        return () => {
+          resizeObserver.unobserve(this.container);
+          resizeObserver.disconnect();
+          mutationObserver.disconnect();
+          dispose();
+          this.children = [];
+        };
+      }
+      return () => {
+      };
+    }, "connect");
+    this.options = {
+      breakpoints: [720, 1280, 1920],
+      columnGap: 8,
+      rowGap: 4,
+      minWidth: 100,
+      colWrap: true,
+      strictAutoFit: false,
+      ...options
+    };
+    (0, import_reactive.define)(this, {
+      options: import_reactive.observable.shallow,
+      width: import_reactive.observable.ref,
+      height: import_reactive.observable.ref,
+      ready: import_reactive.observable.ref,
+      children: import_reactive.observable.ref,
+      childOriginTotalColumns: import_reactive.observable.ref,
+      shadowChildOriginTotalColumns: import_reactive.observable.ref,
+      shadowChildTotalColumns: import_reactive.observable.ref,
+      childTotalColumns: import_reactive.observable.ref,
+      columns: import_reactive.observable.computed,
+      templateColumns: import_reactive.observable.computed,
+      gap: import_reactive.observable.computed,
+      maxColumns: import_reactive.observable.computed,
+      minColumns: import_reactive.observable.computed,
+      maxWidth: import_reactive.observable.computed,
+      minWidth: import_reactive.observable.computed,
+      breakpoints: import_reactive.observable.computed,
+      breakpoint: import_reactive.observable.computed,
+      rowGap: import_reactive.observable.computed,
+      columnGap: import_reactive.observable.computed,
+      colWrap: import_reactive.observable.computed
+    });
+  }
+  set breakpoints(breakpoints) {
+    this.options.breakpoints = breakpoints;
+  }
+  get breakpoints() {
+    return this.options.breakpoints;
+  }
+  get breakpoint() {
+    return calcBreakpointIndex(this.options.breakpoints, this.width);
+  }
+  set maxWidth(maxWidth) {
+    this.options.maxWidth = maxWidth;
+  }
+  get maxWidth() {
+    return factor(this.options.maxWidth, this) ?? Infinity;
+  }
+  set minWidth(minWidth) {
+    this.options.minWidth = minWidth;
+  }
+  get minWidth() {
+    return factor(this.options.minWidth, this) ?? 100;
+  }
+  set maxColumns(maxColumns) {
+    this.options.maxColumns = maxColumns;
+  }
+  get maxColumns() {
+    return factor(this.options.maxColumns, this) ?? Infinity;
+  }
+  set maxRows(maxRows) {
+    this.options.maxRows = maxRows;
+  }
+  get maxRows() {
+    return this.options.maxRows ?? Infinity;
+  }
+  set minColumns(minColumns) {
+    this.options.minColumns = minColumns;
+  }
+  get minColumns() {
+    return factor(this.options.minColumns, this) ?? 1;
+  }
+  set rowGap(rowGap) {
+    this.options.rowGap = rowGap;
+  }
+  get rowGap() {
+    return factor(this.options.rowGap, this) ?? 5;
+  }
+  set columnGap(columnGap) {
+    this.options.columnGap = columnGap;
+  }
+  get columnGap() {
+    return factor(this.options.columnGap, this) ?? 10;
+  }
+  set colWrap(colWrap) {
+    this.options.colWrap = colWrap;
+  }
+  get colWrap() {
+    return factor(this.options.colWrap, this) ?? true;
+  }
+  get columns() {
+    if (!this.ready) return 0;
+    const originTotalColumns = this.childOriginTotalColumns;
+    if (this.colWrap === false) {
+      return originTotalColumns;
+    }
+    const baseColumns = this.childSize;
+    const strictMaxWidthColumns = Math.round(this.width / (this.maxWidth + this.columnGap));
+    const looseMaxWidthColumns = Math.min(originTotalColumns, strictMaxWidthColumns);
+    const maxWidthColumns = this.options.strictAutoFit ? strictMaxWidthColumns : looseMaxWidthColumns;
+    const strictMinWidthColumns = Math.round(this.width / (this.minWidth + this.columnGap));
+    const looseMinWidthColumns = Math.min(originTotalColumns, strictMinWidthColumns);
+    const minWidthColumns = this.options.strictAutoFit ? strictMinWidthColumns : looseMinWidthColumns;
+    const minCalculatedColumns = Math.min(baseColumns, originTotalColumns, maxWidthColumns, minWidthColumns);
+    const maxCalculatedColumns = Math.max(baseColumns, originTotalColumns, maxWidthColumns, minWidthColumns);
+    const finalColumns = calcSatisfyColumns(
+      this.width,
+      maxCalculatedColumns,
+      minCalculatedColumns,
+      this.maxWidth,
+      this.minWidth,
+      this.columnGap
+    );
+    if (finalColumns >= this.maxColumns) {
+      return this.maxColumns;
+    }
+    if (finalColumns <= this.minColumns) {
+      return this.minColumns;
+    }
+    return finalColumns;
+  }
+  get rows() {
+    return Math.ceil(this.childTotalColumns / this.columns);
+  }
+  get shadowRows() {
+    return Math.ceil(this.shadowChildTotalColumns / this.columns);
+  }
+  get templateColumns() {
+    if (!this.width) return "";
+    if (this.maxWidth === Infinity) {
+      return `repeat(${this.columns},minmax(0,1fr))`;
+    }
+    if (this.options.strictAutoFit !== true) {
+      const columnWidth = (this.width - (this.columns - 1) * this.columnGap) / this.columns;
+      if (columnWidth < this.minWidth || columnWidth > this.maxWidth) {
+        return `repeat(${this.columns},minmax(0,1fr))`;
+      }
+    }
+    return `repeat(${this.columns},minmax(${this.minWidth}px,${this.maxWidth}px))`;
+  }
+  get gap() {
+    return `${this.rowGap}px ${this.columnGap}px`;
+  }
+  get childSize() {
+    return this.children.length;
+  }
+  get fullnessLastColumn() {
+    var _a;
+    return this.columns === ((_a = this.children[this.childSize - 1]) == null ? void 0 : _a.span);
+  }
+};
+__name(_Grid, "Grid");
+_Grid.id = /* @__PURE__ */ __name((options = {}) => JSON.stringify(
+  [
+    "maxRows",
+    "maxColumns",
+    "minColumns",
+    "maxWidth",
+    "minWidth",
+    "breakpoints",
+    "columnGap",
+    "rowGap",
+    "colWrap",
+    "strictAutoFit"
+  ].map((key) => options[key])
+), "id");
+let Grid = _Grid;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Grid
+});

package/lib/grid/observer.d.ts

@@ -0,0 +1,19 @@
+type ChildNode = {
+    element?: HTMLElement;
+    observer?: MutationObserver;
+    dispose?: () => void;
+};
+export declare class ChildListMutationObserver {
+    observer: MutationObserver;
+    callback: MutationCallback;
+    childList: ChildNode[];
+    init: MutationObserverInit;
+    constructor(callback: MutationCallback);
+    observeChildList(element: HTMLElement): void;
+    addObserver(element: HTMLElement): void;
+    removeObserver(element: HTMLElement): void;
+    handler: (mutations: MutationRecord[]) => void;
+    observe: (element: HTMLElement, init?: MutationObserverInit) => void;
+    disconnect: () => void;
+}
+export {};

package/lib/grid/observer.js

@@ -0,0 +1,107 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var observer_exports = {};
+__export(observer_exports, {
+  ChildListMutationObserver: () => ChildListMutationObserver
+});
+module.exports = __toCommonJS(observer_exports);
+const isHTMLElement = /* @__PURE__ */ __name((node) => node.nodeType === 1, "isHTMLElement");
+const _ChildListMutationObserver = class _ChildListMutationObserver {
+  constructor(callback) {
+    this.childList = [];
+    this.handler = /* @__PURE__ */ __name((mutations) => {
+      mutations.forEach((mutation) => {
+        if (mutation.type === "childList") {
+          mutation.addedNodes.forEach((node) => {
+            if (isHTMLElement(node)) {
+              this.addObserver(node);
+            }
+          });
+          mutation.removedNodes.forEach((node) => {
+            if (isHTMLElement(node)) {
+              this.removeObserver(node);
+            }
+          });
+        }
+      });
+      this.callback(mutations, this.observer);
+    }, "handler");
+    this.observe = /* @__PURE__ */ __name((element, init) => {
+      this.init = init;
+      this.observeChildList(element);
+      this.observer.observe(element, {
+        ...this.init,
+        subtree: false,
+        childList: true,
+        characterData: false,
+        characterDataOldValue: false,
+        attributeOldValue: false
+      });
+    }, "observe");
+    this.disconnect = /* @__PURE__ */ __name(() => {
+      this.observer.disconnect();
+    }, "disconnect");
+    this.callback = callback;
+    this.observer = new MutationObserver(this.handler);
+  }
+  observeChildList(element) {
+    Array.from(element.children).forEach((node) => {
+      this.addObserver(node);
+    });
+  }
+  addObserver(element) {
+    const child = this.childList.find((t) => t.element === element);
+    if (!child) {
+      const childIndex = this.childList.length;
+      const child2 = {
+        element,
+        observer: new MutationObserver(this.callback),
+        dispose: /* @__PURE__ */ __name(() => {
+          if (child2.observer) {
+            child2.observer.disconnect();
+            delete child2.observer;
+            this.childList.splice(childIndex, 1);
+          }
+        }, "dispose")
+      };
+      child2.observer.observe(child2.element, {
+        ...this.init,
+        subtree: false,
+        childList: false,
+        characterData: false,
+        characterDataOldValue: false,
+        attributeOldValue: false
+      });
+      this.childList.push(child2);
+    }
+  }
+  removeObserver(element) {
+    var _a;
+    const child = this.childList.find((t) => t.element === element);
+    if (child) {
+      (_a = child.dispose) == null ? void 0 : _a.call(child);
+    }
+  }
+};
+__name(_ChildListMutationObserver, "ChildListMutationObserver");
+let ChildListMutationObserver = _ChildListMutationObserver;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ChildListMutationObserver
+});

package/lib/index.d.ts

@@ -1,24 +1,12 @@
-import { ArrayField, FormPathPattern, GeneralField, IExchangeArrayStateProps, INodePatch, ISpliceArrayStateProps } from '@formily/core';
-import { FormPath } from '@formily/shared';
-export * from '@formily/core';
-export type { ArrayField, Field, FormPathPattern, GeneralField, ObjectField } from '@formily/core';
-export * from '@formily/grid';
-export * from '@formily/json-schema';
-export { type IFieldProps, type IRecursionFieldProps, type ISchemaFieldProps, type ISchemaFieldReactFactoryOptions, type IVoidFieldProps, type JSXComponent, type SchemaReactComponents, FormConsumer, ArrayField as ArrayFieldComponent, ExpressionScope, Field as FieldComponent, FieldContext, FormContext, FormProvider, ObjectField as ObjectFieldComponent, RecursionField, SchemaComponentsContext, SchemaContext, SchemaExpressionScopeContext, SchemaOptionsContext, VoidField as VoidFieldComponent, connect, createSchemaField, mapProps, mapReadPretty, useExpressionScope, useField, useFieldSchema, useForm, useFormEffects, RecordScope, RecordsScope, useParentForm, } from '@formily/react';
-export * from '@formily/reactive';
-export * from '@formily/reactive-react';
-export * from '@formily/shared';
-export * from '@formily/validator';
-interface IRecycleTarget {
-    onMount: () => void;
-    onUnmount: () => void;
-}
-export declare const useAttach: <T extends IRecycleTarget>(target: T) => T;
-export declare const NumberIndexReg: RegExp;
-export declare const exchangeArrayState: (field: ArrayField, props: IExchangeArrayStateProps) => void;
-export declare const patchFieldStates: (target: Record<string, GeneralField>, patches: INodePatch<GeneralField>[]) => void;
-export declare const destroy: (target: Record<string, GeneralField>, address: string, forceClear?: boolean) => void;
-export declare const locateNode: (field: GeneralField, address: FormPathPattern) => GeneralField;
-export declare const buildFieldPath: (field: GeneralField) => FormPath;
-export declare const buildDataPath: (fields: Record<string, GeneralField>, pattern: FormPath) => FormPath;
-export declare const spliceArrayState: (field: ArrayField, props?: ISpliceArrayStateProps) => void;
+export { buildDataPath, buildFieldPath, spliceArrayState, locateNode, destroy, patchFieldStates, exchangeArrayState, } from './core/shared/internals';
+export { NumberIndexReg } from './core/shared/constants';
+export { useAttach } from './react/hooks/useAttach';
+export * from './core';
+export type { ArrayField, Field, FormPathPattern, GeneralField, ObjectField } from './core';
+export * from './grid';
+export * from './json-schema';
+export { type IFieldProps, type IRecursionFieldProps, type ISchemaFieldProps, type ISchemaFieldReactFactoryOptions, type IVoidFieldProps, type JSXComponent, type SchemaReactComponents, FormConsumer, ArrayField as ArrayFieldComponent, ExpressionScope, Field as FieldComponent, FieldContext, FormContext, FormProvider, ObjectField as ObjectFieldComponent, RecursionField, SchemaComponentsContext, SchemaContext, SchemaExpressionScopeContext, SchemaOptionsContext, VoidField as VoidFieldComponent, connect, createSchemaField, mapProps, mapReadPretty, useExpressionScope, useField, useFieldSchema, useForm, useFormEffects, RecordScope, RecordsScope, useParentForm, } from './react';
+export * from './reactive';
+export * from './reactive-react';
+export * from './shared';
+export * from './validator';