import template from "./Space.html";
  import style from "antd/lib/space/style/index.css";
  angular.module("esNgAntd").directive("esSpace", function (esNgAntd) {

      return {
          controllerAs: "esSpace",
          restrict: "E",
          transclude: true,
          replace: true,
          scope: {
              direction: "@",
              size: "@",
          },

          template: template,
          controller: function ($scope, $element, $attrs) {
              this.getContext = function () {
                  return $scope;
              };
  
              $scope.state = {
                  direction: $scope.direction || "horizontal",
                  size: $scope.size || 8,
              };
          },

          link: function ($scope, $element, $attrs, $controllers, $transclude) {

              esNgAntd.createStyle("ant-space", style);
              $element.removeAttr("ng-class");
              $element.removeAttr("ng-style");
              let childrens = $transclude();
  

              for (let i = 0; i < childrens.length; i++) {
                  const children = childrens[i];

                  if (children.nodeType === 1) {
                      let item = angular
                          .element("<div>")
                          .addClass("ant-space-item")
                          .append(children);
                      $element.append(item);

                  }
              }

          },
      };
  });