@plasmicpkgs/antd 0.0.95 → 0.0.96

package/dist/antd.cjs.development.js

@@ -6,10 +6,10 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 
 var registerComponent = _interopDefault(require('@plasmicapp/host/registerComponent'));
 var Button = _interopDefault(require('antd/lib/button'));
+var Carousel = _interopDefault(require('antd/lib/carousel'));
 var Checkbox = _interopDefault(require('antd/lib/checkbox/Checkbox'));
 var CheckboxGroup = _interopDefault(require('antd/lib/checkbox/Group'));
 var React = _interopDefault(require('react'));
-var Carousel = _interopDefault(require('antd/lib/carousel'));
 var AntdCollapse = _interopDefault(require('antd/lib/collapse/Collapse'));
 var CollapsePanel = _interopDefault(require('antd/lib/collapse/CollapsePanel'));
 var AntdDropdown = _interopDefault(require('antd/lib/dropdown'));
@@ -24,11 +24,13 @@ var MenuDivider = _interopDefault(require('antd/lib/menu/MenuDivider'));
 var MenuItem = _interopDefault(require('antd/lib/menu/MenuItem'));
 var SubMenu = _interopDefault(require('antd/lib/menu/SubMenu'));
 var rcMenu = require('rc-menu');
-var Rate = _interopDefault(require('antd/lib/rate'));
 var rcSelect = require('rc-select');
+var Rate = _interopDefault(require('antd/lib/rate'));
 var Select = _interopDefault(require('antd/lib/select'));
 var AntdSlider = _interopDefault(require('antd/lib/slider'));
 var Switch = _interopDefault(require('antd/lib/switch'));
+var host = require('@plasmicapp/host');
+var Table = _interopDefault(require('antd/lib/table/Table'));
 var antd = require('antd');
 var AntdTabs = _interopDefault(require('antd/lib/tabs'));
 var rcTabs = require('rc-tabs');
@@ -113,6 +115,69 @@ function registerButton(loader, customButtonMeta) {
   doRegisterComponent(Button, customButtonMeta != null ? customButtonMeta : buttonMeta);
 }
 
+var contentStyle = {
+  height: "160px",
+  color: "#fff",
+  lineHeight: "160px",
+  textAlign: "center",
+  backgroundColor: "#364d79"
+};
+var carouselMeta = {
+  name: "AntdCarousel",
+  displayName: "Antd Carousel",
+  props: {
+    autoplay: {
+      type: "boolean",
+      description: "Whether to scroll automatically",
+      defaultValueHint: false
+    },
+    dotPosition: {
+      type: "choice",
+      options: ["top", "bottom", "left", "right"],
+      description: "The position of the dots",
+      defaultValueHint: "bottom"
+    },
+    dots: {
+      type: "boolean",
+      description: "Whether to show the dots at the bottom of the gallery",
+      defaultValueHint: true
+    },
+    effect: {
+      type: "choice",
+      options: ["scrollx", "fade"],
+      defaultValueHint: "scrollx"
+    },
+    children: {
+      type: "slot",
+      defaultValue: [{
+        type: "vbox",
+        children: {
+          type: "text",
+          value: "1",
+          styles: contentStyle
+        }
+      }, {
+        type: "vbox",
+        children: {
+          type: "text",
+          value: "2",
+          styles: contentStyle
+        }
+      }]
+    }
+  },
+  importPath: "antd/lib/carousel",
+  importName: "Carousel",
+  isDefaultExport: true
+};
+function registerCarousel(loader, customCarouselMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(Carousel, customCarouselMeta != null ? customCarouselMeta : carouselMeta);
+}
+
 function _extends() {
   _extends = Object.assign || function (target) {
     for (var i = 1; i < arguments.length; i++) {
@@ -306,69 +371,6 @@ function registerCheckboxGroup(loader, customCheckboxGroupMeta) {
   doRegisterComponent(CheckboxGroup, customCheckboxGroupMeta != null ? customCheckboxGroupMeta : checkboxGroupMeta);
 }
 
-var contentStyle = {
-  height: "160px",
-  color: "#fff",
-  lineHeight: "160px",
-  textAlign: "center",
-  backgroundColor: "#364d79"
-};
-var carouselMeta = {
-  name: "AntdCarousel",
-  displayName: "Antd Carousel",
-  props: {
-    autoplay: {
-      type: "boolean",
-      description: "Whether to scroll automatically",
-      defaultValueHint: false
-    },
-    dotPosition: {
-      type: "choice",
-      options: ["top", "bottom", "left", "right"],
-      description: "The position of the dots",
-      defaultValueHint: "bottom"
-    },
-    dots: {
-      type: "boolean",
-      description: "Whether to show the dots at the bottom of the gallery",
-      defaultValueHint: true
-    },
-    effect: {
-      type: "choice",
-      options: ["scrollx", "fade"],
-      defaultValueHint: "scrollx"
-    },
-    children: {
-      type: "slot",
-      defaultValue: [{
-        type: "vbox",
-        children: {
-          type: "text",
-          value: "1",
-          styles: contentStyle
-        }
-      }, {
-        type: "vbox",
-        children: {
-          type: "text",
-          value: "2",
-          styles: contentStyle
-        }
-      }]
-    }
-  },
-  importPath: "antd/lib/carousel",
-  importName: "Carousel",
-  isDefaultExport: true
-};
-function registerCarousel(loader, customCarouselMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(Carousel, customCarouselMeta != null ? customCarouselMeta : carouselMeta);
-}
-
 var _excluded = ["openIcon", "closeIcon"];
 var collapstePanelMeta = {
   name: "AntdCollapsePanel",
@@ -1275,62 +1277,6 @@ function registerMenu(loader, customMenuMeta) {
   doRegisterComponent(Menu, customMenuMeta != null ? customMenuMeta : menuMeta);
 }
 
-var rateMeta = {
-  name: "AntdRate",
-  displayName: "Antd Rate",
-  props: {
-    allowClear: {
-      type: "boolean",
-      description: "Whether to allow clear when clicking again",
-      defaultValueHint: true
-    },
-    allowHalf: {
-      type: "boolean",
-      description: "Whether to allow semi selection",
-      defaultValueHint: false
-    },
-    autoFocus: {
-      type: "boolean",
-      description: "If componet is focused when mounted",
-      defaultValueHint: false
-    },
-    count: {
-      type: "number",
-      description: "Star count"
-    },
-    disabled: {
-      type: "boolean",
-      description: "Disabled state of component",
-      defaultValueHint: false
-    },
-    tooltips: {
-      type: "array",
-      description: "Array to customize tooltip for each icon"
-    },
-    value: {
-      type: "number",
-      description: "The default value",
-      editOnly: true,
-      uncontrolledProp: "defaultValue",
-      defaultValueHint: 0
-    },
-    character: {
-      type: "slot",
-      hidePlaceholder: true
-    }
-  },
-  importPath: "antd/lib/rate",
-  importName: "Rate",
-  isDefaultExport: true
-};
-function registerRate(loader, customRateMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(Rate, customRateMeta != null ? customRateMeta : rateMeta);
-}
-
 var optionMeta = {
   name: "AntdOption",
   displayName: "Antd Option",
@@ -1404,6 +1350,62 @@ function registerOptGroup(loader, customOptGroupMeta) {
   doRegisterComponent(rcSelect.OptGroup, customOptGroupMeta != null ? customOptGroupMeta : optGroupMeta);
 }
 
+var rateMeta = {
+  name: "AntdRate",
+  displayName: "Antd Rate",
+  props: {
+    allowClear: {
+      type: "boolean",
+      description: "Whether to allow clear when clicking again",
+      defaultValueHint: true
+    },
+    allowHalf: {
+      type: "boolean",
+      description: "Whether to allow semi selection",
+      defaultValueHint: false
+    },
+    autoFocus: {
+      type: "boolean",
+      description: "If componet is focused when mounted",
+      defaultValueHint: false
+    },
+    count: {
+      type: "number",
+      description: "Star count"
+    },
+    disabled: {
+      type: "boolean",
+      description: "Disabled state of component",
+      defaultValueHint: false
+    },
+    tooltips: {
+      type: "array",
+      description: "Array to customize tooltip for each icon"
+    },
+    value: {
+      type: "number",
+      description: "The default value",
+      editOnly: true,
+      uncontrolledProp: "defaultValue",
+      defaultValueHint: 0
+    },
+    character: {
+      type: "slot",
+      hidePlaceholder: true
+    }
+  },
+  importPath: "antd/lib/rate",
+  importName: "Rate",
+  isDefaultExport: true
+};
+function registerRate(loader, customRateMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(Rate, customRateMeta != null ? customRateMeta : rateMeta);
+}
+
 var selectMeta = {
   name: "AntdSelect",
   displayName: "Antd Select",
@@ -1698,6 +1700,201 @@ function registerSwitch(loader, customSwitchMeta) {
   doRegisterComponent(Switch, customSwitchMeta != null ? customSwitchMeta : switchMeta);
 }
 
+// properties in plasmic.
+
+function TableColumn(_props) {
+  return null;
+}
+function TableValue(props) {
+  var _column$toString;
+
+  var className = props.className;
+  var column = host.useSelector("currentColumn");
+  return React.createElement("div", {
+    className: className
+  }, (_column$toString = column == null ? void 0 : column.toString()) != null ? _column$toString : "");
+}
+function TableWrapper(props) {
+  var _columns$props$childr, _columns$props;
+
+  var className = props.className,
+      items = props.items,
+      columns = props.columns,
+      size = props.size,
+      onSelect = props.onSelect,
+      pagination = props.pagination; // Plasmic Studio Canvas currently renders items in a slightly different way than the generated code:
+  // - In the studio:
+  //     - The `columns` prop value is an array of nested react <Column  /> nodes.
+  // - In the generated code (preview mode):
+  //     - The `columns` prop value is a React Node with a `children` property that contains
+  //       an array of the nested react <Column /> components.
+
+  var tableColumns = (_columns$props$childr = columns == null ? void 0 : (_columns$props = columns.props) == null ? void 0 : _columns$props.children) != null ? _columns$props$childr : columns; // Convert the props.columns slot children to an array of column definitions
+
+  var columnDefinitions = React.useMemo(function () {
+    return React.Children.map(tableColumns, function (column, columnIndex) {
+      if (!column) {
+        return undefined;
+      }
+
+      var _column$props = column.props,
+          columnTemplate = _column$props.columnTemplate,
+          title = _column$props.title,
+          dataIndex = _column$props.dataIndex;
+      var columnDefinition = {
+        columnIndex: columnIndex,
+        title: title,
+        dataIndex: dataIndex,
+        key: columnIndex,
+        render: function render(value, record, rowIndex) {
+          return React.createElement(host.DataProvider, {
+            name: "currentRow",
+            data: record
+          }, React.createElement(host.DataProvider, {
+            name: "currentRowIndex",
+            data: rowIndex
+          }, React.createElement(host.DataProvider, {
+            name: "currentColumn",
+            data: value
+          }, host.repeatedElement(rowIndex, columnTemplate))));
+        }
+      };
+      return columnDefinition;
+    }).filter(Boolean);
+  }, [tableColumns]);
+  return React.createElement(Table, {
+    className: className,
+    columns: columnDefinitions,
+    dataSource: items,
+    size: size,
+    onRow: function onRow(record) {
+      return {
+        onMouseUp: function onMouseUp() {
+          return onSelect == null ? void 0 : onSelect(record.id);
+        }
+      };
+    },
+    pagination: pagination ? undefined : pagination,
+    rowKey: "id"
+  });
+}
+var DEFAULT_ITEMS = [{
+  name: "John Brown",
+  age: 19,
+  address: "New York No. 1 Lake Park",
+  tags: ["student", "developer"]
+}, {
+  name: "Jim Green",
+  age: 42,
+  address: "London No. 1 Lake Park",
+  tags: ["teacher"]
+}, {
+  name: "Joe Black",
+  age: 32,
+  address: "Sidney No. 1 Lake Park",
+  tags: ["cool", "teacher"]
+}];
+
+function capitalize(input) {
+  return input.charAt(0).toUpperCase() + input.slice(1);
+}
+
+var tableMeta = {
+  name: "AntdTable",
+  displayName: "Antd Table",
+  props: {
+    items: {
+      type: "array",
+      description: "The data to display in the table, as a list of objects (one object per row)",
+      defaultValue: DEFAULT_ITEMS
+    },
+    columns: {
+      type: "slot",
+      allowedComponents: ["AntdTableColumn"],
+      defaultValue: /*#__PURE__*/Object.keys(DEFAULT_ITEMS[0]).map(function (columnName) {
+        return {
+          type: "component",
+          name: "PlasmicAntDesignTableColumn",
+          props: {
+            title: capitalize(columnName),
+            dataIndex: columnName
+          }
+        };
+      })
+    },
+    size: {
+      type: "choice",
+      options: ["large", "middle", "small"],
+      defaultValueHint: "large"
+    },
+    pagination: {
+      type: "boolean",
+      defaultValueHint: true
+    }
+  },
+  importPath: "@plasmicpkgs/antd/skinny/registerTable",
+  importName: "TableWrapper"
+};
+var tableColumnMeta = {
+  name: "AntdTableColumn",
+  parentComponentName: "AntdTable",
+  providesData: true,
+  props: {
+    title: {
+      type: "string",
+      defaultValue: "Name"
+    },
+    dataIndex: {
+      type: "string",
+      defaultValue: "name",
+      description: "The field to show. The table accepts some data as a list of objects, and this is the name of the field in those objects that this column will display."
+    },
+    columnTemplate: {
+      type: "slot",
+      defaultValue: {
+        type: "vbox",
+        styles: {
+          padding: 0
+        },
+        children: [{
+          type: "component",
+          name: "AntdTableValue"
+        }]
+      }
+    }
+  },
+  importPath: "@plasmicpkgs/antd/skinny/registerTable",
+  importName: "TableColumn"
+};
+var tableValueMeta = {
+  name: "AntdTableValue",
+  parentComponentName: "AntdTableColumn",
+  props: {},
+  importPath: "@plasmicpkgs/antd/skinny/registerTable",
+  importName: "TableValue"
+};
+function registerTable(loader, customMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : host.registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(TableWrapper, customMeta != null ? customMeta : tableMeta);
+}
+function registerTableColumn(loader, customMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : host.registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(TableColumn, customMeta != null ? customMeta : tableColumnMeta);
+}
+function registerTableValue(loader, customMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : host.registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(TableValue, customMeta != null ? customMeta : tableValueMeta);
+}
+
 var _excluded$2 = ["leftTabBarExtraContent", "rightTabBarExtraContent"];
 var tabPaneMeta = {
   name: "AntdTabPane",
@@ -2050,6 +2247,9 @@ function registerAll(loader) {
   registerInputPassword(loader);
   registerInputGroup(loader);
   registerTabPane(loader);
+  registerTable(loader);
+  registerTableColumn(loader);
+  registerTableValue(loader);
   registerTabs(loader);
   registerRate(loader);
 }