@nickeylin/antd-mobile-pro 2.0.0

package/dist/cjs/components/tree/demo/demo.js

@@ -0,0 +1,47 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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);
+
+// src/components/tree/demo/demo.tsx
+var demo_exports = {};
+__export(demo_exports, {
+  default: () => demo_default
+});
+module.exports = __toCommonJS(demo_exports);
+var import_antd_mobile_pro = require("../../..");
+var import_data = require("./data");
+var App = () => {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    import_antd_mobile_pro.Tree,
+    {
+      defaultExpandAll: true,
+      multiple: false,
+      checkable: true,
+      showLine: true,
+      onSelect: (selectedKeys, info) => {
+        import_antd_mobile_pro.Toast.show(
+          (info.selected ? "" : "取消") + "选择: " + info.node.title
+        );
+      },
+      onCheck: (checked, info) => {
+        console.log("onCheck", checked, info);
+      },
+      dataSource: import_data.treeData
+    }
+  ));
+};
+var demo_default = App;

package/dist/cjs/components/tree/demo/demo1.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const App: React.FC;
+export default App;

package/dist/cjs/components/tree/demo/demo1.js

@@ -0,0 +1,64 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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);
+
+// src/components/tree/demo/demo1.tsx
+var demo1_exports = {};
+__export(demo1_exports, {
+  default: () => demo1_default
+});
+module.exports = __toCommonJS(demo1_exports);
+var import_antd_mobile_pro = require("../../..");
+var import_react = require("react");
+var import_data = require("./data");
+var App = () => {
+  const [expandedKeys, setExpandedKeys] = (0, import_react.useState)([
+    "0-0-0",
+    "0-0-1"
+  ]);
+  const [checkedKeys, setCheckedKeys] = (0, import_react.useState)(["0-0-0"]);
+  const [selectedKeys, setSelectedKeys] = (0, import_react.useState)([]);
+  const [autoExpandParent, setAutoExpandParent] = (0, import_react.useState)(true);
+  const onExpand = (expandedKeysValue) => {
+    console.log("onExpand", expandedKeysValue);
+    setExpandedKeys(expandedKeysValue);
+    setAutoExpandParent(false);
+  };
+  const onSelect = (selectedKeysValue, info) => {
+    console.log("onSelect", info);
+    setSelectedKeys(selectedKeysValue);
+  };
+  return /* @__PURE__ */ React.createElement(
+    import_antd_mobile_pro.Tree,
+    {
+      checkable: true,
+      onExpand,
+      expandedKeys,
+      autoExpandParent,
+      onCheck: (checked, info) => {
+        console.log(checked, info);
+        if (Array.isArray(checked))
+          setCheckedKeys(checked);
+      },
+      checkedKeys,
+      onSelect,
+      selectedKeys,
+      dataSource: import_data.treeData
+    }
+  );
+};
+var demo1_default = App;

package/dist/cjs/components/tree/demo/demo2.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const App: () => JSX.Element;
+export default App;

package/dist/cjs/components/tree/demo/demo2.js

@@ -0,0 +1,49 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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);
+
+// src/components/tree/demo/demo2.tsx
+var demo2_exports = {};
+__export(demo2_exports, {
+  default: () => demo2_default
+});
+module.exports = __toCommonJS(demo2_exports);
+var import_antd_mobile_pro = require("../../..");
+var App = () => {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    import_antd_mobile_pro.Tree,
+    {
+      key: "key",
+      fieldNames: { title: "name" },
+      defaultExpandAll: true,
+      multiple: false,
+      checkable: true,
+      showLine: true,
+      params: {
+        url: "http://10.4.32.53:7300/mock/633848a1e00822b584e6d608/example/getOrganization",
+        method: "get"
+      },
+      onSelect: (selectedKeys, info) => {
+        import_antd_mobile_pro.Toast.show((info.selected ? "" : "取消") + "选择: " + info.node.name);
+      },
+      onCheck: (checked, info) => {
+        console.log("onCheck", checked, info);
+      }
+    }
+  ));
+};
+var demo2_default = App;

package/dist/cjs/components/tree/demo/demo3.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const App: React.FC;
+export default App;

package/dist/cjs/components/tree/demo/demo3.js

@@ -0,0 +1,99 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/tree/demo/demo3.tsx
+var demo3_exports = {};
+__export(demo3_exports, {
+  default: () => demo3_default
+});
+module.exports = __toCommonJS(demo3_exports);
+var import_antd_mobile_pro = require("../../..");
+var import_react = __toESM(require("react"));
+var import_data = require("./data");
+var App = () => {
+  const [gData, setGData] = (0, import_react.useState)(import_data.treeData);
+  const [expandedKeys] = (0, import_react.useState)(["0-0", "0-0-0", "0-0-0-0"]);
+  const onDragEnter = (info) => {
+    console.log(info);
+  };
+  const onDrop = (info) => {
+    console.log(info);
+    const dropKey = info.node.key;
+    const dragKey = info.dragNode.key;
+    const dropPos = info.node.pos.split("-");
+    const dropPosition = info.dropPosition - Number(dropPos[dropPos.length - 1]);
+    const loop = (data2, key, callback) => {
+      for (let i = 0; i < data2.length; i++) {
+        if (data2[i].key === key) {
+          return callback(data2[i], i, data2);
+        }
+        if (data2[i].children) {
+          loop(data2[i].children, key, callback);
+        }
+      }
+    };
+    const data = [...gData];
+    let dragObj;
+    loop(data, dragKey, (item, index, arr) => {
+      arr.splice(index, 1);
+      dragObj = item;
+    });
+    if (!info.dropToGap) {
+      loop(data, dropKey, (item) => {
+        item.children = item.children || [];
+        item.children.unshift(dragObj);
+      });
+    } else {
+      let ar = [];
+      let i;
+      loop(data, dropKey, (_item, index, arr) => {
+        ar = arr;
+        i = index;
+      });
+      if (dropPosition === -1) {
+        ar.splice(i, 0, dragObj);
+      } else {
+        ar.splice(i + 1, 0, dragObj);
+      }
+    }
+    setGData(data);
+  };
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_antd_mobile_pro.Tree,
+    {
+      className: "draggable-tree",
+      defaultExpandedKeys: expandedKeys,
+      draggable: true,
+      blockNode: true,
+      onDragEnter,
+      onDrop,
+      dataSource: gData
+    }
+  );
+};
+var demo3_default = App;

package/dist/cjs/components/tree/index.d.ts

@@ -0,0 +1,5 @@
+import './style/index.less';
+import Tree from './tree';
+export type { DirectoryTreeProps } from './DirectoryTree';
+export type { TreeDataNode, TreeProps } from './tree';
+export default Tree;

package/dist/cjs/components/tree/index.js

@@ -0,0 +1,37 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/tree/index.tsx
+var tree_exports = {};
+__export(tree_exports, {
+  default: () => tree_default
+});
+module.exports = __toCommonJS(tree_exports);
+var import_style = require("./style/index.less");
+var import_tree = __toESM(require("./tree"));
+var tree_default = import_tree.default;

package/dist/cjs/components/tree/style/checkbox/index.d.ts

@@ -0,0 +1,2 @@
+import '../../style/index.less';
+import './index.less';

package/dist/cjs/components/tree/style/checkbox/index.js

@@ -0,0 +1,3 @@
+// src/components/tree/style/checkbox/index.tsx
+var import_style = require("../../style/index.less");
+var import_index = require("./index.less");

package/dist/cjs/components/tree/style/checkbox/index.less

@@ -0,0 +1,6 @@
+@import '../../style/themes/index';
+@import './mixin.less';
+
+.antCheckboxFn();
+
+@import './rtl';

package/dist/cjs/components/tree/style/checkbox/mixin.less

@@ -0,0 +1,272 @@
+// @import '../../style/mixins/index';
+@import '../../../styles/variable.less';
+@import '../common/mixins.less';
+
+@background-color-base: hsv(0, 0, 96%); // Default grey background color
+@ease-out-back: cubic-bezier(0.12, 0.4, 0.29, 1.46);
+@ease-in-back: cubic-bezier(0.71, -0.46, 0.88, 0.6);
+
+// Border color
+@border-color-base: hsv(0, 0, 85%); // base border outline a component
+@border-color-split: rgba(0, 0, 0, 0.06); // split border inside a component
+@border-color-inverse: var(--adm-color-border);
+@border-width-base: 1px; // width of the border for a component
+@border-style-base: solid; // style of a components border
+
+// Disabled states
+@disabled-color: fade(#000, 25%);
+@disabled-bg: @background-color-base;
+@disabled-active-bg: tint(#000, 90%);
+@disabled-color-dark: fade(#fff, 35%);
+
+// Checkbox
+@checkbox-size: 16px;
+@checkbox-color: var(--adm-color-primary);
+@checkbox-check-color: var(--adm-color-background);
+@checkbox-check-bg: @checkbox-check-color;
+@checkbox-border-width: 1px;
+@checkbox-border-radius: 2px;
+@checkbox-group-item-margin-right: 8px;
+
+@input-disabled-bg: @disabled-bg;
+
+.antCheckboxFn(@checkbox-prefix-cls: ~'@{suid-prefix}-checkbox') {
+  @checkbox-inner-prefix-cls: ~'@{checkbox-prefix-cls}-inner';
+  // 一般状态
+  .@{checkbox-prefix-cls} {
+    .reset-component();
+
+    position: relative;
+    top: 0.2em;
+    line-height: 1;
+    white-space: nowrap;
+    outline: none;
+    cursor: pointer;
+
+    .@{checkbox-prefix-cls}-wrapper:hover &-inner,
+    &:hover &-inner,
+    &-input:focus + &-inner {
+      border-color: @checkbox-color;
+    }
+
+    &-checked::after {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      border: 1px solid @checkbox-color;
+      border-radius: @checkbox-border-radius;
+      visibility: hidden;
+      animation: suidCheckboxEffect 0.36s ease-in-out;
+      animation-fill-mode: backwards;
+      content: '';
+      box-sizing: border-box;
+    }
+
+    &:hover::after,
+    .@{checkbox-prefix-cls}-wrapper:hover &::after {
+      visibility: visible;
+    }
+
+    &-inner {
+      position: relative;
+      top: 0;
+      left: 0;
+      display: block;
+      width: @checkbox-size;
+      height: @checkbox-size;
+      direction: ltr;
+      background-color: @checkbox-check-bg;
+      border: @checkbox-border-width @border-style-base @border-color-base;
+      border-radius: @checkbox-border-radius;
+      // Fix IE checked style
+      // https://github.com/ant-design/ant-design/issues/12597
+      border-collapse: separate;
+      transition: all 0.3s;
+
+      &::after {
+        @check-width: (@checkbox-size / 14) * 5px;
+        @check-height: (@checkbox-size / 14) * 8px;
+
+        position: absolute;
+        top: 50%;
+        // https://github.com/ant-design/ant-design/pull/19452
+        // https://github.com/ant-design/ant-design/pull/31726
+        left: 21.5%;
+        display: table;
+        width: @check-width;
+        height: @check-height;
+        border: 2px solid @checkbox-check-color;
+        border-top: 0;
+        border-left: 0;
+        transform: rotate(45deg) scale(0) translate(-50%, -50%);
+        opacity: 0;
+        transition: all 0.1s @ease-in-back, opacity 0.1s;
+        content: ' ';
+      }
+    }
+
+    &-input {
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      z-index: 1;
+      width: 100%;
+      height: 100%;
+      cursor: pointer;
+      opacity: 0;
+    }
+  }
+
+  // 选中状态
+  .@{checkbox-prefix-cls}-checked .@{checkbox-inner-prefix-cls}::after {
+    position: absolute;
+    display: table;
+    border: 2px solid @checkbox-check-color;
+    border-top: 0;
+    border-left: 0;
+    transform: rotate(45deg) scale(1) translate(-50%, -50%);
+    opacity: 1;
+    transition: all 0.2s @ease-out-back 0.1s;
+    content: ' ';
+  }
+
+  .@{checkbox-prefix-cls}-checked {
+    .@{checkbox-inner-prefix-cls} {
+      background-color: @checkbox-color;
+      border-color: @checkbox-color;
+    }
+  }
+
+  .@{checkbox-prefix-cls}-disabled {
+    cursor: not-allowed;
+
+    &.@{checkbox-prefix-cls}-checked {
+      .@{checkbox-inner-prefix-cls}::after {
+        border-color: @disabled-color;
+        animation-name: none;
+      }
+    }
+
+    .@{checkbox-prefix-cls}-input {
+      cursor: not-allowed;
+      pointer-events: none;
+    }
+
+    .@{checkbox-inner-prefix-cls} {
+      background-color: @input-disabled-bg;
+      border-color: @border-color-base !important;
+
+      &::after {
+        border-color: @input-disabled-bg;
+        border-collapse: separate;
+        animation-name: none;
+      }
+    }
+
+    & + span {
+      color: @disabled-color;
+      cursor: not-allowed;
+    }
+
+    // Not show highlight border of checkbox when disabled
+    &:hover::after,
+    .@{checkbox-prefix-cls}-wrapper:hover &::after {
+      visibility: hidden;
+    }
+  }
+
+  .@{checkbox-prefix-cls}-wrapper {
+    .reset-component();
+    display: inline-flex;
+    align-items: baseline;
+    line-height: unset;
+    cursor: pointer;
+
+    &::after {
+      display: inline-block;
+      width: 0;
+      overflow: hidden;
+      content: '\a0';
+    }
+
+    &.@{checkbox-prefix-cls}-wrapper-disabled {
+      cursor: not-allowed;
+    }
+
+    & + & {
+      margin-left: 8px;
+    }
+
+    &&-in-form-item {
+      input[type='checkbox'] {
+        width: 14px;
+        height: 14px;
+      }
+    }
+  }
+
+  .@{checkbox-prefix-cls} + span {
+    padding-right: 8px;
+    padding-left: 8px;
+  }
+
+  .@{checkbox-prefix-cls}-group {
+    .reset-component();
+    display: inline-block;
+
+    &-item {
+      margin-right: @checkbox-group-item-margin-right;
+
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+
+    &-item + &-item {
+      margin-left: 0;
+    }
+  }
+
+  // 半选状态
+  .@{checkbox-prefix-cls}-indeterminate {
+    .@{checkbox-inner-prefix-cls} {
+      background-color: @checkbox-check-bg;
+      border-color: @border-color-base;
+    }
+    .@{checkbox-inner-prefix-cls}::after {
+      @indeterminate-width: @checkbox-size - 8px;
+      @indeterminate-height: @checkbox-size - 8px;
+
+      top: 50%;
+      left: 50%;
+      width: @indeterminate-width;
+      height: @indeterminate-height;
+      background-color: @checkbox-color;
+      border: 0;
+      transform: translate(-50%, -50%) scale(1);
+      opacity: 1;
+      content: ' ';
+    }
+
+    &.@{checkbox-prefix-cls}-disabled .@{checkbox-inner-prefix-cls}::after {
+      background-color: @disabled-color;
+      border-color: @disabled-color;
+    }
+  }
+}
+
+@keyframes suidCheckboxEffect {
+  0% {
+    transform: scale(1);
+    opacity: 0.5;
+  }
+
+  100% {
+    transform: scale(1.6);
+    opacity: 0;
+  }
+}

package/dist/cjs/components/tree/style/checkbox/rtl.less

@@ -0,0 +1,29 @@
+@import '../../../styles/variable.less';
+@import '../../style/mixins/index';
+
+.antCheckboxFn(@checkbox-prefix-cls: ~'@{suid-prefix}-checkbox') {
+  .@{checkbox-prefix-cls}-rtl {
+    direction: rtl;
+  }
+
+  .@{checkbox-prefix-cls}-group {
+    &-item {
+      .@{checkbox-prefix-cls}-group-rtl & {
+        margin-right: 0;
+        margin-left: @checkbox-group-item-margin-right;
+      }
+
+      &:last-child {
+        .@{checkbox-prefix-cls}-group-rtl & {
+          margin-left: 0 !important;
+        }
+      }
+    }
+
+    &-item + &-item {
+      .@{checkbox-prefix-cls}-group-rtl & {
+        margin-left: @checkbox-group-item-margin-right;
+      }
+    }
+  }
+}

package/dist/cjs/components/tree/style/common/mixins.less

@@ -0,0 +1,11 @@
+.reset-component() {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: var(--adm-color-text);
+  font-size: var(--adm-font-size-main);
+  font-variant: tabular-nums;
+  line-height: 1.5715;
+  list-style: none;
+  font-feature-settings: 'tnum';
+}