/******/ (() => { // webpackBootstrap
/******/ 	var __webpack_modules__ = ({

/***/ "./node_modules/@splidejs/react-splide/dist/js/react-splide.esm.js":
/*!*************************************************************************!*\
  !*** ./node_modules/@splidejs/react-splide/dist/js/react-splide.esm.js ***!
  \*************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Splide": () => (/* binding */ Splide2),
/* harmony export */   "SplideSlide": () => (/* binding */ SplideSlide),
/* harmony export */   "SplideTrack": () => (/* binding */ SplideTrack)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
// node_modules/@splidejs/splide/dist/js/splide.esm.js
function _defineProperties(target, props) {
  for (var i = 0; i < props.length; i++) {
    var descriptor = props[i];
    descriptor.enumerable = descriptor.enumerable || false;
    descriptor.configurable = true;
    if ("value" in descriptor)
      descriptor.writable = true;
    Object.defineProperty(target, descriptor.key, descriptor);
  }
}
function _createClass(Constructor, protoProps, staticProps) {
  if (protoProps)
    _defineProperties(Constructor.prototype, protoProps);
  if (staticProps)
    _defineProperties(Constructor, staticProps);
  Object.defineProperty(Constructor, "prototype", { writable: false });
  return Constructor;
}
var MEDIA_PREFERS_REDUCED_MOTION = "(prefers-reduced-motion: reduce)";
var CREATED = 1;
var MOUNTED = 2;
var IDLE = 3;
var MOVING = 4;
var SCROLLING = 5;
var DRAGGING = 6;
var DESTROYED = 7;
var STATES = {
  CREATED,
  MOUNTED,
  IDLE,
  MOVING,
  SCROLLING,
  DRAGGING,
  DESTROYED
};
function empty(array) {
  array.length = 0;
}
function slice(arrayLike, start, end) {
  return Array.prototype.slice.call(arrayLike, start, end);
}
function apply(func) {
  return func.bind.apply(func, [null].concat(slice(arguments, 1)));
}
var nextTick = setTimeout;
var noop = function noop2() {
};
function raf(func) {
  return requestAnimationFrame(func);
}
function typeOf(type, subject) {
  return typeof subject === type;
}
function isObject(subject) {
  return !isNull(subject) && typeOf("object", subject);
}
var isArray = Array.isArray;
var isFunction = apply(typeOf, "function");
var isString = apply(typeOf, "string");
var isUndefined = apply(typeOf, "undefined");
function isNull(subject) {
  return subject === null;
}
function isHTMLElement(subject) {
  try {
    return subject instanceof (subject.ownerDocument.defaultView || window).HTMLElement;
  } catch (e) {
    return false;
  }
}
function toArray(value) {
  return isArray(value) ? value : [value];
}
function forEach(values, iteratee) {
  toArray(values).forEach(iteratee);
}
function includes(array, value) {
  return array.indexOf(value) > -1;
}
function push(array, items) {
  array.push.apply(array, toArray(items));
  return array;
}
function toggleClass(elm, classes, add) {
  if (elm) {
    forEach(classes, function(name) {
      if (name) {
        elm.classList[add ? "add" : "remove"](name);
      }
    });
  }
}
function addClass(elm, classes) {
  toggleClass(elm, isString(classes) ? classes.split(" ") : classes, true);
}
function append(parent, children2) {
  forEach(children2, parent.appendChild.bind(parent));
}
function before(nodes, ref) {
  forEach(nodes, function(node) {
    var parent = (ref || node).parentNode;
    if (parent) {
      parent.insertBefore(node, ref);
    }
  });
}
function matches(elm, selector) {
  return isHTMLElement(elm) && (elm["msMatchesSelector"] || elm.matches).call(elm, selector);
}
function children(parent, selector) {
  var children2 = parent ? slice(parent.children) : [];
  return selector ? children2.filter(function(child2) {
    return matches(child2, selector);
  }) : children2;
}
function child(parent, selector) {
  return selector ? children(parent, selector)[0] : parent.firstElementChild;
}
var ownKeys = Object.keys;
function forOwn(object, iteratee, right) {
  if (object) {
    (right ? ownKeys(object).reverse() : ownKeys(object)).forEach(function(key) {
      key !== "__proto__" && iteratee(object[key], key);
    });
  }
  return object;
}
function assign(object) {
  slice(arguments, 1).forEach(function(source) {
    forOwn(source, function(value, key) {
      object[key] = source[key];
    });
  });
  return object;
}
function merge(object) {
  slice(arguments, 1).forEach(function(source) {
    forOwn(source, function(value, key) {
      if (isArray(value)) {
        object[key] = value.slice();
      } else if (isObject(value)) {
        object[key] = merge({}, isObject(object[key]) ? object[key] : {}, value);
      } else {
        object[key] = value;
      }
    });
  });
  return object;
}
function omit(object, keys) {
  forEach(keys || ownKeys(object), function(key) {
    delete object[key];
  });
}
function removeAttribute(elms, attrs) {
  forEach(elms, function(elm) {
    forEach(attrs, function(attr) {
      elm && elm.removeAttribute(attr);
    });
  });
}
function setAttribute(elms, attrs, value) {
  if (isObject(attrs)) {
    forOwn(attrs, function(value2, name) {
      setAttribute(elms, name, value2);
    });
  } else {
    forEach(elms, function(elm) {
      isNull(value) || value === "" ? removeAttribute(elm, attrs) : elm.setAttribute(attrs, String(value));
    });
  }
}
function create(tag, attrs, parent) {
  var elm = document.createElement(tag);
  if (attrs) {
    isString(attrs) ? addClass(elm, attrs) : setAttribute(elm, attrs);
  }
  parent && append(parent, elm);
  return elm;
}
function style(elm, prop, value) {
  if (isUndefined(value)) {
    return getComputedStyle(elm)[prop];
  }
  if (!isNull(value)) {
    elm.style[prop] = "" + value;
  }
}
function display(elm, display2) {
  style(elm, "display", display2);
}
function focus(elm) {
  elm["setActive"] && elm["setActive"]() || elm.focus({
    preventScroll: true
  });
}
function getAttribute(elm, attr) {
  return elm.getAttribute(attr);
}
function hasClass(elm, className) {
  return elm && elm.classList.contains(className);
}
function rect(target) {
  return target.getBoundingClientRect();
}
function remove(nodes) {
  forEach(nodes, function(node) {
    if (node && node.parentNode) {
      node.parentNode.removeChild(node);
    }
  });
}
function parseHtml(html) {
  return child(new DOMParser().parseFromString(html, "text/html").body);
}
function prevent(e, stopPropagation) {
  e.preventDefault();
  if (stopPropagation) {
    e.stopPropagation();
    e.stopImmediatePropagation();
  }
}
function query(parent, selector) {
  return parent && parent.querySelector(selector);
}
function queryAll(parent, selector) {
  return selector ? slice(parent.querySelectorAll(selector)) : [];
}
function removeClass(elm, classes) {
  toggleClass(elm, classes, false);
}
function timeOf(e) {
  return e.timeStamp;
}
function unit(value) {
  return isString(value) ? value : value ? value + "px" : "";
}
var PROJECT_CODE = "splide";
var DATA_ATTRIBUTE = "data-" + PROJECT_CODE;
function assert(condition, message) {
  if (!condition) {
    throw new Error("[" + PROJECT_CODE + "] " + (message || ""));
  }
}
var min = Math.min;
var max = Math.max;
var floor = Math.floor;
var ceil = Math.ceil;
var abs = Math.abs;
function approximatelyEqual(x, y, epsilon) {
  return abs(x - y) < epsilon;
}
function between(number, x, y, exclusive) {
  var minimum = min(x, y);
  var maximum = max(x, y);
  return exclusive ? minimum < number && number < maximum : minimum <= number && number <= maximum;
}
function clamp(number, x, y) {
  var minimum = min(x, y);
  var maximum = max(x, y);
  return min(max(minimum, number), maximum);
}
function sign(x) {
  return +(x > 0) - +(x < 0);
}
function format(string, replacements) {
  forEach(replacements, function(replacement) {
    string = string.replace("%s", "" + replacement);
  });
  return string;
}
function pad(number) {
  return number < 10 ? "0" + number : "" + number;
}
var ids = {};
function uniqueId(prefix) {
  return "" + prefix + pad(ids[prefix] = (ids[prefix] || 0) + 1);
}
function EventBinder() {
  var listeners = [];
  function bind(targets, events, callback, options) {
    forEachEvent(targets, events, function(target, event, namespace) {
      var isEventTarget = "addEventListener" in target;
      var remover = isEventTarget ? target.removeEventListener.bind(target, event, callback, options) : target["removeListener"].bind(target, callback);
      isEventTarget ? target.addEventListener(event, callback, options) : target["addListener"](callback);
      listeners.push([target, event, namespace, callback, remover]);
    });
  }
  function unbind(targets, events, callback) {
    forEachEvent(targets, events, function(target, event, namespace) {
      listeners = listeners.filter(function(listener) {
        if (listener[0] === target && listener[1] === event && listener[2] === namespace && (!callback || listener[3] === callback)) {
          listener[4]();
          return false;
        }
        return true;
      });
    });
  }
  function dispatch(target, type, detail) {
    var e;
    var bubbles = true;
    if (typeof CustomEvent === "function") {
      e = new CustomEvent(type, {
        bubbles,
        detail
      });
    } else {
      e = document.createEvent("CustomEvent");
      e.initCustomEvent(type, bubbles, false, detail);
    }
    target.dispatchEvent(e);
    return e;
  }
  function forEachEvent(targets, events, iteratee) {
    forEach(targets, function(target) {
      target && forEach(events, function(events2) {
        events2.split(" ").forEach(function(eventNS) {
          var fragment = eventNS.split(".");
          iteratee(target, fragment[0], fragment[1]);
        });
      });
    });
  }
  function destroy() {
    listeners.forEach(function(data) {
      data[4]();
    });
    empty(listeners);
  }
  return {
    bind,
    unbind,
    dispatch,
    destroy
  };
}
var EVENT_MOUNTED = "mounted";
var EVENT_READY = "ready";
var EVENT_MOVE = "move";
var EVENT_MOVED = "moved";
var EVENT_CLICK = "click";
var EVENT_ACTIVE = "active";
var EVENT_INACTIVE = "inactive";
var EVENT_VISIBLE = "visible";
var EVENT_HIDDEN = "hidden";
var EVENT_REFRESH = "refresh";
var EVENT_UPDATED = "updated";
var EVENT_RESIZE = "resize";
var EVENT_RESIZED = "resized";
var EVENT_DRAG = "drag";
var EVENT_DRAGGING = "dragging";
var EVENT_DRAGGED = "dragged";
var EVENT_SCROLL = "scroll";
var EVENT_SCROLLED = "scrolled";
var EVENT_OVERFLOW = "overflow";
var EVENT_DESTROY = "destroy";
var EVENT_ARROWS_MOUNTED = "arrows:mounted";
var EVENT_ARROWS_UPDATED = "arrows:updated";
var EVENT_PAGINATION_MOUNTED = "pagination:mounted";
var EVENT_PAGINATION_UPDATED = "pagination:updated";
var EVENT_NAVIGATION_MOUNTED = "navigation:mounted";
var EVENT_AUTOPLAY_PLAY = "autoplay:play";
var EVENT_AUTOPLAY_PLAYING = "autoplay:playing";
var EVENT_AUTOPLAY_PAUSE = "autoplay:pause";
var EVENT_LAZYLOAD_LOADED = "lazyload:loaded";
var EVENT_SLIDE_KEYDOWN = "sk";
var EVENT_SHIFTED = "sh";
var EVENT_END_INDEX_CHANGED = "ei";
function EventInterface(Splide22) {
  var bus = Splide22 ? Splide22.event.bus : document.createDocumentFragment();
  var binder = EventBinder();
  function on(events, callback) {
    binder.bind(bus, toArray(events).join(" "), function(e) {
      callback.apply(callback, isArray(e.detail) ? e.detail : []);
    });
  }
  function emit(event) {
    binder.dispatch(bus, event, slice(arguments, 1));
  }
  if (Splide22) {
    Splide22.event.on(EVENT_DESTROY, binder.destroy);
  }
  return assign(binder, {
    bus,
    on,
    off: apply(binder.unbind, bus),
    emit
  });
}
function RequestInterval(interval, onInterval, onUpdate, limit) {
  var now = Date.now;
  var startTime;
  var rate = 0;
  var id;
  var paused = true;
  var count = 0;
  function update() {
    if (!paused) {
      rate = interval ? min((now() - startTime) / interval, 1) : 1;
      onUpdate && onUpdate(rate);
      if (rate >= 1) {
        onInterval();
        startTime = now();
        if (limit && ++count >= limit) {
          return pause();
        }
      }
      id = raf(update);
    }
  }
  function start(resume) {
    resume || cancel();
    startTime = now() - (resume ? rate * interval : 0);
    paused = false;
    id = raf(update);
  }
  function pause() {
    paused = true;
  }
  function rewind() {
    startTime = now();
    rate = 0;
    if (onUpdate) {
      onUpdate(rate);
    }
  }
  function cancel() {
    id && cancelAnimationFrame(id);
    rate = 0;
    id = 0;
    paused = true;
  }
  function set(time) {
    interval = time;
  }
  function isPaused() {
    return paused;
  }
  return {
    start,
    rewind,
    pause,
    cancel,
    set,
    isPaused
  };
}
function State(initialState) {
  var state = initialState;
  function set(value) {
    state = value;
  }
  function is(states) {
    return includes(toArray(states), state);
  }
  return {
    set,
    is
  };
}
function Throttle(func, duration) {
  var interval = RequestInterval(duration || 0, func, null, 1);
  return function() {
    interval.isPaused() && interval.start();
  };
}
function Media(Splide22, Components2, options) {
  var state = Splide22.state;
  var breakpoints = options.breakpoints || {};
  var reducedMotion = options.reducedMotion || {};
  var binder = EventBinder();
  var queries = [];
  function setup() {
    var isMin = options.mediaQuery === "min";
    ownKeys(breakpoints).sort(function(n, m) {
      return isMin ? +n - +m : +m - +n;
    }).forEach(function(key) {
      register(breakpoints[key], "(" + (isMin ? "min" : "max") + "-width:" + key + "px)");
    });
    register(reducedMotion, MEDIA_PREFERS_REDUCED_MOTION);
    update();
  }
  function destroy(completely) {
    if (completely) {
      binder.destroy();
    }
  }
  function register(options2, query2) {
    var queryList = matchMedia(query2);
    binder.bind(queryList, "change", update);
    queries.push([options2, queryList]);
  }
  function update() {
    var destroyed = state.is(DESTROYED);
    var direction = options.direction;
    var merged = queries.reduce(function(merged2, entry) {
      return merge(merged2, entry[1].matches ? entry[0] : {});
    }, {});
    omit(options);
    set(merged);
    if (options.destroy) {
      Splide22.destroy(options.destroy === "completely");
    } else if (destroyed) {
      destroy(true);
      Splide22.mount();
    } else {
      direction !== options.direction && Splide22.refresh();
    }
  }
  function reduce(enable) {
    if (matchMedia(MEDIA_PREFERS_REDUCED_MOTION).matches) {
      enable ? merge(options, reducedMotion) : omit(options, ownKeys(reducedMotion));
    }
  }
  function set(opts, base, notify) {
    merge(options, opts);
    base && merge(Object.getPrototypeOf(options), opts);
    if (notify || !state.is(CREATED)) {
      Splide22.emit(EVENT_UPDATED, options);
    }
  }
  return {
    setup,
    destroy,
    reduce,
    set
  };
}
var ARROW = "Arrow";
var ARROW_LEFT = ARROW + "Left";
var ARROW_RIGHT = ARROW + "Right";
var ARROW_UP = ARROW + "Up";
var ARROW_DOWN = ARROW + "Down";
var RTL = "rtl";
var TTB = "ttb";
var ORIENTATION_MAP = {
  width: ["height"],
  left: ["top", "right"],
  right: ["bottom", "left"],
  x: ["y"],
  X: ["Y"],
  Y: ["X"],
  ArrowLeft: [ARROW_UP, ARROW_RIGHT],
  ArrowRight: [ARROW_DOWN, ARROW_LEFT]
};
function Direction(Splide22, Components2, options) {
  function resolve(prop, axisOnly, direction) {
    direction = direction || options.direction;
    var index = direction === RTL && !axisOnly ? 1 : direction === TTB ? 0 : -1;
    return ORIENTATION_MAP[prop] && ORIENTATION_MAP[prop][index] || prop.replace(/width|left|right/i, function(match, offset) {
      var replacement = ORIENTATION_MAP[match.toLowerCase()][index] || match;
      return offset > 0 ? replacement.charAt(0).toUpperCase() + replacement.slice(1) : replacement;
    });
  }
  function orient(value) {
    return value * (options.direction === RTL ? 1 : -1);
  }
  return {
    resolve,
    orient
  };
}
var ROLE = "role";
var TAB_INDEX = "tabindex";
var DISABLED = "disabled";
var ARIA_PREFIX = "aria-";
var ARIA_CONTROLS = ARIA_PREFIX + "controls";
var ARIA_CURRENT = ARIA_PREFIX + "current";
var ARIA_SELECTED = ARIA_PREFIX + "selected";
var ARIA_LABEL = ARIA_PREFIX + "label";
var ARIA_LABELLEDBY = ARIA_PREFIX + "labelledby";
var ARIA_HIDDEN = ARIA_PREFIX + "hidden";
var ARIA_ORIENTATION = ARIA_PREFIX + "orientation";
var ARIA_ROLEDESCRIPTION = ARIA_PREFIX + "roledescription";
var ARIA_LIVE = ARIA_PREFIX + "live";
var ARIA_BUSY = ARIA_PREFIX + "busy";
var ARIA_ATOMIC = ARIA_PREFIX + "atomic";
var ALL_ATTRIBUTES = [ROLE, TAB_INDEX, DISABLED, ARIA_CONTROLS, ARIA_CURRENT, ARIA_LABEL, ARIA_LABELLEDBY, ARIA_HIDDEN, ARIA_ORIENTATION, ARIA_ROLEDESCRIPTION];
var CLASS_PREFIX = PROJECT_CODE + "__";
var STATUS_CLASS_PREFIX = "is-";
var CLASS_ROOT = PROJECT_CODE;
var CLASS_TRACK = CLASS_PREFIX + "track";
var CLASS_LIST = CLASS_PREFIX + "list";
var CLASS_SLIDE = CLASS_PREFIX + "slide";
var CLASS_CLONE = CLASS_SLIDE + "--clone";
var CLASS_CONTAINER = CLASS_SLIDE + "__container";
var CLASS_ARROWS = CLASS_PREFIX + "arrows";
var CLASS_ARROW = CLASS_PREFIX + "arrow";
var CLASS_ARROW_PREV = CLASS_ARROW + "--prev";
var CLASS_ARROW_NEXT = CLASS_ARROW + "--next";
var CLASS_PAGINATION = CLASS_PREFIX + "pagination";
var CLASS_PAGINATION_PAGE = CLASS_PAGINATION + "__page";
var CLASS_PROGRESS = CLASS_PREFIX + "progress";
var CLASS_PROGRESS_BAR = CLASS_PROGRESS + "__bar";
var CLASS_TOGGLE = CLASS_PREFIX + "toggle";
var CLASS_TOGGLE_PLAY = CLASS_TOGGLE + "__play";
var CLASS_TOGGLE_PAUSE = CLASS_TOGGLE + "__pause";
var CLASS_SPINNER = CLASS_PREFIX + "spinner";
var CLASS_SR = CLASS_PREFIX + "sr";
var CLASS_INITIALIZED = STATUS_CLASS_PREFIX + "initialized";
var CLASS_ACTIVE = STATUS_CLASS_PREFIX + "active";
var CLASS_PREV = STATUS_CLASS_PREFIX + "prev";
var CLASS_NEXT = STATUS_CLASS_PREFIX + "next";
var CLASS_VISIBLE = STATUS_CLASS_PREFIX + "visible";
var CLASS_LOADING = STATUS_CLASS_PREFIX + "loading";
var CLASS_FOCUS_IN = STATUS_CLASS_PREFIX + "focus-in";
var CLASS_OVERFLOW = STATUS_CLASS_PREFIX + "overflow";
var STATUS_CLASSES = [CLASS_ACTIVE, CLASS_VISIBLE, CLASS_PREV, CLASS_NEXT, CLASS_LOADING, CLASS_FOCUS_IN, CLASS_OVERFLOW];
var CLASSES = {
  slide: CLASS_SLIDE,
  clone: CLASS_CLONE,
  arrows: CLASS_ARROWS,
  arrow: CLASS_ARROW,
  prev: CLASS_ARROW_PREV,
  next: CLASS_ARROW_NEXT,
  pagination: CLASS_PAGINATION,
  page: CLASS_PAGINATION_PAGE,
  spinner: CLASS_SPINNER
};
function closest(from, selector) {
  if (isFunction(from.closest)) {
    return from.closest(selector);
  }
  var elm = from;
  while (elm && elm.nodeType === 1) {
    if (matches(elm, selector)) {
      break;
    }
    elm = elm.parentElement;
  }
  return elm;
}
var FRICTION = 5;
var LOG_INTERVAL = 200;
var POINTER_DOWN_EVENTS = "touchstart mousedown";
var POINTER_MOVE_EVENTS = "touchmove mousemove";
var POINTER_UP_EVENTS = "touchend touchcancel mouseup click";
function Elements(Splide22, Components2, options) {
  var _EventInterface = EventInterface(Splide22), on = _EventInterface.on, bind = _EventInterface.bind;
  var root = Splide22.root;
  var i18n = options.i18n;
  var elements = {};
  var slides = [];
  var rootClasses = [];
  var trackClasses = [];
  var track;
  var list;
  var isUsingKey;
  function setup() {
    collect();
    init();
    update();
  }
  function mount() {
    on(EVENT_REFRESH, destroy);
    on(EVENT_REFRESH, setup);
    on(EVENT_UPDATED, update);
    bind(document, POINTER_DOWN_EVENTS + " keydown", function(e) {
      isUsingKey = e.type === "keydown";
    }, {
      capture: true
    });
    bind(root, "focusin", function() {
      toggleClass(root, CLASS_FOCUS_IN, !!isUsingKey);
    });
  }
  function destroy(completely) {
    var attrs = ALL_ATTRIBUTES.concat("style");
    empty(slides);
    removeClass(root, rootClasses);
    removeClass(track, trackClasses);
    removeAttribute([track, list], attrs);
    removeAttribute(root, completely ? attrs : ["style", ARIA_ROLEDESCRIPTION]);
  }
  function update() {
    removeClass(root, rootClasses);
    removeClass(track, trackClasses);
    rootClasses = getClasses(CLASS_ROOT);
    trackClasses = getClasses(CLASS_TRACK);
    addClass(root, rootClasses);
    addClass(track, trackClasses);
    setAttribute(root, ARIA_LABEL, options.label);
    setAttribute(root, ARIA_LABELLEDBY, options.labelledby);
  }
  function collect() {
    track = find("." + CLASS_TRACK);
    list = child(track, "." + CLASS_LIST);
    assert(track && list, "A track/list element is missing.");
    push(slides, children(list, "." + CLASS_SLIDE + ":not(." + CLASS_CLONE + ")"));
    forOwn({
      arrows: CLASS_ARROWS,
      pagination: CLASS_PAGINATION,
      prev: CLASS_ARROW_PREV,
      next: CLASS_ARROW_NEXT,
      bar: CLASS_PROGRESS_BAR,
      toggle: CLASS_TOGGLE
    }, function(className, key) {
      elements[key] = find("." + className);
    });
    assign(elements, {
      root,
      track,
      list,
      slides
    });
  }
  function init() {
    var id = root.id || uniqueId(PROJECT_CODE);
    var role = options.role;
    root.id = id;
    track.id = track.id || id + "-track";
    list.id = list.id || id + "-list";
    if (!getAttribute(root, ROLE) && root.tagName !== "SECTION" && role) {
      setAttribute(root, ROLE, role);
    }
    setAttribute(root, ARIA_ROLEDESCRIPTION, i18n.carousel);
    setAttribute(list, ROLE, "presentation");
  }
  function find(selector) {
    var elm = query(root, selector);
    return elm && closest(elm, "." + CLASS_ROOT) === root ? elm : void 0;
  }
  function getClasses(base) {
    return [base + "--" + options.type, base + "--" + options.direction, options.drag && base + "--draggable", options.isNavigation && base + "--nav", base === CLASS_ROOT && CLASS_ACTIVE];
  }
  return assign(elements, {
    setup,
    mount,
    destroy
  });
}
var SLIDE = "slide";
var LOOP = "loop";
var FADE = "fade";
function Slide$1(Splide22, index, slideIndex, slide) {
  var event = EventInterface(Splide22);
  var on = event.on, emit = event.emit, bind = event.bind;
  var Components = Splide22.Components, root = Splide22.root, options = Splide22.options;
  var isNavigation = options.isNavigation, updateOnMove = options.updateOnMove, i18n = options.i18n, pagination = options.pagination, slideFocus = options.slideFocus;
  var resolve = Components.Direction.resolve;
  var styles = getAttribute(slide, "style");
  var label = getAttribute(slide, ARIA_LABEL);
  var isClone = slideIndex > -1;
  var container = child(slide, "." + CLASS_CONTAINER);
  var destroyed;
  function mount() {
    if (!isClone) {
      slide.id = root.id + "-slide" + pad(index + 1);
      setAttribute(slide, ROLE, pagination ? "tabpanel" : "group");
      setAttribute(slide, ARIA_ROLEDESCRIPTION, i18n.slide);
      setAttribute(slide, ARIA_LABEL, label || format(i18n.slideLabel, [index + 1, Splide22.length]));
    }
    listen();
  }
  function listen() {
    bind(slide, "click", apply(emit, EVENT_CLICK, self));
    bind(slide, "keydown", apply(emit, EVENT_SLIDE_KEYDOWN, self));
    on([EVENT_MOVED, EVENT_SHIFTED, EVENT_SCROLLED], update);
    on(EVENT_NAVIGATION_MOUNTED, initNavigation);
    if (updateOnMove) {
      on(EVENT_MOVE, onMove);
    }
  }
  function destroy() {
    destroyed = true;
    event.destroy();
    removeClass(slide, STATUS_CLASSES);
    removeAttribute(slide, ALL_ATTRIBUTES);
    setAttribute(slide, "style", styles);
    setAttribute(slide, ARIA_LABEL, label || "");
  }
  function initNavigation() {
    var controls = Splide22.splides.map(function(target) {
      var Slide2 = target.splide.Components.Slides.getAt(index);
      return Slide2 ? Slide2.slide.id : "";
    }).join(" ");
    setAttribute(slide, ARIA_LABEL, format(i18n.slideX, (isClone ? slideIndex : index) + 1));
    setAttribute(slide, ARIA_CONTROLS, controls);
    setAttribute(slide, ROLE, slideFocus ? "button" : "");
    slideFocus && removeAttribute(slide, ARIA_ROLEDESCRIPTION);
  }
  function onMove() {
    if (!destroyed) {
      update();
    }
  }
  function update() {
    if (!destroyed) {
      var curr = Splide22.index;
      updateActivity();
      updateVisibility();
      toggleClass(slide, CLASS_PREV, index === curr - 1);
      toggleClass(slide, CLASS_NEXT, index === curr + 1);
    }
  }
  function updateActivity() {
    var active = isActive();
    if (active !== hasClass(slide, CLASS_ACTIVE)) {
      toggleClass(slide, CLASS_ACTIVE, active);
      setAttribute(slide, ARIA_CURRENT, isNavigation && active || "");
      emit(active ? EVENT_ACTIVE : EVENT_INACTIVE, self);
    }
  }
  function updateVisibility() {
    var visible = isVisible();
    var hidden = !visible && (!isActive() || isClone);
    if (!Splide22.state.is([MOVING, SCROLLING])) {
      setAttribute(slide, ARIA_HIDDEN, hidden || "");
    }
    setAttribute(queryAll(slide, options.focusableNodes || ""), TAB_INDEX, hidden ? -1 : "");
    if (slideFocus) {
      setAttribute(slide, TAB_INDEX, hidden ? -1 : 0);
    }
    if (visible !== hasClass(slide, CLASS_VISIBLE)) {
      toggleClass(slide, CLASS_VISIBLE, visible);
      emit(visible ? EVENT_VISIBLE : EVENT_HIDDEN, self);
    }
    if (!visible && document.activeElement === slide) {
      var Slide2 = Components.Slides.getAt(Splide22.index);
      Slide2 && focus(Slide2.slide);
    }
  }
  function style$1(prop, value, useContainer) {
    style(useContainer && container || slide, prop, value);
  }
  function isActive() {
    var curr = Splide22.index;
    return curr === index || options.cloneStatus && curr === slideIndex;
  }
  function isVisible() {
    if (Splide22.is(FADE)) {
      return isActive();
    }
    var trackRect = rect(Components.Elements.track);
    var slideRect = rect(slide);
    var left = resolve("left", true);
    var right = resolve("right", true);
    return floor(trackRect[left]) <= ceil(slideRect[left]) && floor(slideRect[right]) <= ceil(trackRect[right]);
  }
  function isWithin(from, distance) {
    var diff = abs(from - index);
    if (!isClone && (options.rewind || Splide22.is(LOOP))) {
      diff = min(diff, Splide22.length - diff);
    }
    return diff <= distance;
  }
  var self = {
    index,
    slideIndex,
    slide,
    container,
    isClone,
    mount,
    destroy,
    update,
    style: style$1,
    isWithin
  };
  return self;
}
function Slides(Splide22, Components2, options) {
  var _EventInterface2 = EventInterface(Splide22), on = _EventInterface2.on, emit = _EventInterface2.emit, bind = _EventInterface2.bind;
  var _Components2$Elements = Components2.Elements, slides = _Components2$Elements.slides, list = _Components2$Elements.list;
  var Slides2 = [];
  function mount() {
    init();
    on(EVENT_REFRESH, destroy);
    on(EVENT_REFRESH, init);
  }
  function init() {
    slides.forEach(function(slide, index) {
      register(slide, index, -1);
    });
  }
  function destroy() {
    forEach$1(function(Slide2) {
      Slide2.destroy();
    });
    empty(Slides2);
  }
  function update() {
    forEach$1(function(Slide2) {
      Slide2.update();
    });
  }
  function register(slide, index, slideIndex) {
    var object = Slide$1(Splide22, index, slideIndex, slide);
    object.mount();
    Slides2.push(object);
    Slides2.sort(function(Slide1, Slide2) {
      return Slide1.index - Slide2.index;
    });
  }
  function get(excludeClones) {
    return excludeClones ? filter(function(Slide2) {
      return !Slide2.isClone;
    }) : Slides2;
  }
  function getIn(page) {
    var Controller2 = Components2.Controller;
    var index = Controller2.toIndex(page);
    var max2 = Controller2.hasFocus() ? 1 : options.perPage;
    return filter(function(Slide2) {
      return between(Slide2.index, index, index + max2 - 1);
    });
  }
  function getAt(index) {
    return filter(index)[0];
  }
  function add(items, index) {
    forEach(items, function(slide) {
      if (isString(slide)) {
        slide = parseHtml(slide);
      }
      if (isHTMLElement(slide)) {
        var ref = slides[index];
        ref ? before(slide, ref) : append(list, slide);
        addClass(slide, options.classes.slide);
        observeImages(slide, apply(emit, EVENT_RESIZE));
      }
    });
    emit(EVENT_REFRESH);
  }
  function remove$1(matcher) {
    remove(filter(matcher).map(function(Slide2) {
      return Slide2.slide;
    }));
    emit(EVENT_REFRESH);
  }
  function forEach$1(iteratee, excludeClones) {
    get(excludeClones).forEach(iteratee);
  }
  function filter(matcher) {
    return Slides2.filter(isFunction(matcher) ? matcher : function(Slide2) {
      return isString(matcher) ? matches(Slide2.slide, matcher) : includes(toArray(matcher), Slide2.index);
    });
  }
  function style2(prop, value, useContainer) {
    forEach$1(function(Slide2) {
      Slide2.style(prop, value, useContainer);
    });
  }
  function observeImages(elm, callback) {
    var images = queryAll(elm, "img");
    var length = images.length;
    if (length) {
      images.forEach(function(img) {
        bind(img, "load error", function() {
          if (!--length) {
            callback();
          }
        });
      });
    } else {
      callback();
    }
  }
  function getLength(excludeClones) {
    return excludeClones ? slides.length : Slides2.length;
  }
  function isEnough() {
    return Slides2.length > options.perPage;
  }
  return {
    mount,
    destroy,
    update,
    register,
    get,
    getIn,
    getAt,
    add,
    remove: remove$1,
    forEach: forEach$1,
    filter,
    style: style2,
    getLength,
    isEnough
  };
}
function Layout(Splide22, Components2, options) {
  var _EventInterface3 = EventInterface(Splide22), on = _EventInterface3.on, bind = _EventInterface3.bind, emit = _EventInterface3.emit;
  var Slides2 = Components2.Slides;
  var resolve = Components2.Direction.resolve;
  var _Components2$Elements2 = Components2.Elements, root = _Components2$Elements2.root, track = _Components2$Elements2.track, list = _Components2$Elements2.list;
  var getAt = Slides2.getAt, styleSlides = Slides2.style;
  var vertical;
  var rootRect;
  var overflow;
  function mount() {
    init();
    bind(window, "resize load", Throttle(apply(emit, EVENT_RESIZE)));
    on([EVENT_UPDATED, EVENT_REFRESH], init);
    on(EVENT_RESIZE, resize);
  }
  function init() {
    vertical = options.direction === TTB;
    style(root, "maxWidth", unit(options.width));
    style(track, resolve("paddingLeft"), cssPadding(false));
    style(track, resolve("paddingRight"), cssPadding(true));
    resize(true);
  }
  function resize(force) {
    var newRect = rect(root);
    if (force || rootRect.width !== newRect.width || rootRect.height !== newRect.height) {
      style(track, "height", cssTrackHeight());
      styleSlides(resolve("marginRight"), unit(options.gap));
      styleSlides("width", cssSlideWidth());
      styleSlides("height", cssSlideHeight(), true);
      rootRect = newRect;
      emit(EVENT_RESIZED);
      if (overflow !== (overflow = isOverflow())) {
        toggleClass(root, CLASS_OVERFLOW, overflow);
        emit(EVENT_OVERFLOW, overflow);
      }
    }
  }
  function cssPadding(right) {
    var padding = options.padding;
    var prop = resolve(right ? "right" : "left");
    return padding && unit(padding[prop] || (isObject(padding) ? 0 : padding)) || "0px";
  }
  function cssTrackHeight() {
    var height = "";
    if (vertical) {
      height = cssHeight();
      assert(height, "height or heightRatio is missing.");
      height = "calc(" + height + " - " + cssPadding(false) + " - " + cssPadding(true) + ")";
    }
    return height;
  }
  function cssHeight() {
    return unit(options.height || rect(list).width * options.heightRatio);
  }
  function cssSlideWidth() {
    return options.autoWidth ? null : unit(options.fixedWidth) || (vertical ? "" : cssSlideSize());
  }
  function cssSlideHeight() {
    return unit(options.fixedHeight) || (vertical ? options.autoHeight ? null : cssSlideSize() : cssHeight());
  }
  function cssSlideSize() {
    var gap = unit(options.gap);
    return "calc((100%" + (gap && " + " + gap) + ")/" + (options.perPage || 1) + (gap && " - " + gap) + ")";
  }
  function listSize() {
    return rect(list)[resolve("width")];
  }
  function slideSize(index, withoutGap) {
    var Slide2 = getAt(index || 0);
    return Slide2 ? rect(Slide2.slide)[resolve("width")] + (withoutGap ? 0 : getGap()) : 0;
  }
  function totalSize(index, withoutGap) {
    var Slide2 = getAt(index);
    if (Slide2) {
      var right = rect(Slide2.slide)[resolve("right")];
      var left = rect(list)[resolve("left")];
      return abs(right - left) + (withoutGap ? 0 : getGap());
    }
    return 0;
  }
  function sliderSize(withoutGap) {
    return totalSize(Splide22.length - 1) - totalSize(0) + slideSize(0, withoutGap);
  }
  function getGap() {
    var Slide2 = getAt(0);
    return Slide2 && parseFloat(style(Slide2.slide, resolve("marginRight"))) || 0;
  }
  function getPadding(right) {
    return parseFloat(style(track, resolve("padding" + (right ? "Right" : "Left")))) || 0;
  }
  function isOverflow() {
    return Splide22.is(FADE) || sliderSize(true) > listSize();
  }
  return {
    mount,
    resize,
    listSize,
    slideSize,
    sliderSize,
    totalSize,
    getPadding,
    isOverflow
  };
}
var MULTIPLIER = 2;
function Clones(Splide22, Components2, options) {
  var event = EventInterface(Splide22);
  var on = event.on;
  var Elements2 = Components2.Elements, Slides2 = Components2.Slides;
  var resolve = Components2.Direction.resolve;
  var clones = [];
  var cloneCount;
  function mount() {
    on(EVENT_REFRESH, remount);
    on([EVENT_UPDATED, EVENT_RESIZE], observe);
    if (cloneCount = computeCloneCount()) {
      generate(cloneCount);
      Components2.Layout.resize(true);
    }
  }
  function remount() {
    destroy();
    mount();
  }
  function destroy() {
    remove(clones);
    empty(clones);
    event.destroy();
  }
  function observe() {
    var count = computeCloneCount();
    if (cloneCount !== count) {
      if (cloneCount < count || !count) {
        event.emit(EVENT_REFRESH);
      }
    }
  }
  function generate(count) {
    var slides = Slides2.get().slice();
    var length = slides.length;
    if (length) {
      while (slides.length < count) {
        push(slides, slides);
      }
      push(slides.slice(-count), slides.slice(0, count)).forEach(function(Slide2, index) {
        var isHead = index < count;
        var clone = cloneDeep(Slide2.slide, index);
        isHead ? before(clone, slides[0].slide) : append(Elements2.list, clone);
        push(clones, clone);
        Slides2.register(clone, index - count + (isHead ? 0 : length), Slide2.index);
      });
    }
  }
  function cloneDeep(elm, index) {
    var clone = elm.cloneNode(true);
    addClass(clone, options.classes.clone);
    clone.id = Splide22.root.id + "-clone" + pad(index + 1);
    return clone;
  }
  function computeCloneCount() {
    var clones2 = options.clones;
    if (!Splide22.is(LOOP)) {
      clones2 = 0;
    } else if (isUndefined(clones2)) {
      var fixedSize = options[resolve("fixedWidth")] && Components2.Layout.slideSize(0);
      var fixedCount = fixedSize && ceil(rect(Elements2.track)[resolve("width")] / fixedSize);
      clones2 = fixedCount || options[resolve("autoWidth")] && Splide22.length || options.perPage * MULTIPLIER;
    }
    return clones2;
  }
  return {
    mount,
    destroy
  };
}
function Move(Splide22, Components2, options) {
  var _EventInterface4 = EventInterface(Splide22), on = _EventInterface4.on, emit = _EventInterface4.emit;
  var set = Splide22.state.set;
  var _Components2$Layout = Components2.Layout, slideSize = _Components2$Layout.slideSize, getPadding = _Components2$Layout.getPadding, totalSize = _Components2$Layout.totalSize, listSize = _Components2$Layout.listSize, sliderSize = _Components2$Layout.sliderSize;
  var _Components2$Directio = Components2.Direction, resolve = _Components2$Directio.resolve, orient = _Components2$Directio.orient;
  var _Components2$Elements3 = Components2.Elements, list = _Components2$Elements3.list, track = _Components2$Elements3.track;
  var Transition;
  function mount() {
    Transition = Components2.Transition;
    on([EVENT_MOUNTED, EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH], reposition);
  }
  function reposition() {
    if (!Components2.Controller.isBusy()) {
      Components2.Scroll.cancel();
      jump(Splide22.index);
      Components2.Slides.update();
    }
  }
  function move(dest, index, prev, callback) {
    if (dest !== index && canShift(dest > prev)) {
      cancel();
      translate(shift(getPosition(), dest > prev), true);
    }
    set(MOVING);
    emit(EVENT_MOVE, index, prev, dest);
    Transition.start(index, function() {
      set(IDLE);
      emit(EVENT_MOVED, index, prev, dest);
      callback && callback();
    });
  }
  function jump(index) {
    translate(toPosition(index, true));
  }
  function translate(position, preventLoop) {
    if (!Splide22.is(FADE)) {
      var destination = preventLoop ? position : loop(position);
      style(list, "transform", "translate" + resolve("X") + "(" + destination + "px)");
      position !== destination && emit(EVENT_SHIFTED);
    }
  }
  function loop(position) {
    if (Splide22.is(LOOP)) {
      var index = toIndex(position);
      var exceededMax = index > Components2.Controller.getEnd();
      var exceededMin = index < 0;
      if (exceededMin || exceededMax) {
        position = shift(position, exceededMax);
      }
    }
    return position;
  }
  function shift(position, backwards) {
    var excess = position - getLimit(backwards);
    var size = sliderSize();
    position -= orient(size * (ceil(abs(excess) / size) || 1)) * (backwards ? 1 : -1);
    return position;
  }
  function cancel() {
    translate(getPosition(), true);
    Transition.cancel();
  }
  function toIndex(position) {
    var Slides2 = Components2.Slides.get();
    var index = 0;
    var minDistance = Infinity;
    for (var i = 0; i < Slides2.length; i++) {
      var slideIndex = Slides2[i].index;
      var distance = abs(toPosition(slideIndex, true) - position);
      if (distance <= minDistance) {
        minDistance = distance;
        index = slideIndex;
      } else {
        break;
      }
    }
    return index;
  }
  function toPosition(index, trimming) {
    var position = orient(totalSize(index - 1) - offset(index));
    return trimming ? trim(position) : position;
  }
  function getPosition() {
    var left = resolve("left");
    return rect(list)[left] - rect(track)[left] + orient(getPadding(false));
  }
  function trim(position) {
    if (options.trimSpace && Splide22.is(SLIDE)) {
      position = clamp(position, 0, orient(sliderSize(true) - listSize()));
    }
    return position;
  }
  function offset(index) {
    var focus2 = options.focus;
    return focus2 === "center" ? (listSize() - slideSize(index, true)) / 2 : +focus2 * slideSize(index) || 0;
  }
  function getLimit(max2) {
    return toPosition(max2 ? Components2.Controller.getEnd() : 0, !!options.trimSpace);
  }
  function canShift(backwards) {
    var shifted = orient(shift(getPosition(), backwards));
    return backwards ? shifted >= 0 : shifted <= list[resolve("scrollWidth")] - rect(track)[resolve("width")];
  }
  function exceededLimit(max2, position) {
    position = isUndefined(position) ? getPosition() : position;
    var exceededMin = max2 !== true && orient(position) < orient(getLimit(false));
    var exceededMax = max2 !== false && orient(position) > orient(getLimit(true));
    return exceededMin || exceededMax;
  }
  return {
    mount,
    move,
    jump,
    translate,
    shift,
    cancel,
    toIndex,
    toPosition,
    getPosition,
    getLimit,
    exceededLimit,
    reposition
  };
}
function Controller(Splide22, Components2, options) {
  var _EventInterface5 = EventInterface(Splide22), on = _EventInterface5.on, emit = _EventInterface5.emit;
  var Move2 = Components2.Move;
  var getPosition = Move2.getPosition, getLimit = Move2.getLimit, toPosition = Move2.toPosition;
  var _Components2$Slides = Components2.Slides, isEnough = _Components2$Slides.isEnough, getLength = _Components2$Slides.getLength;
  var omitEnd = options.omitEnd;
  var isLoop = Splide22.is(LOOP);
  var isSlide = Splide22.is(SLIDE);
  var getNext = apply(getAdjacent, false);
  var getPrev = apply(getAdjacent, true);
  var currIndex = options.start || 0;
  var endIndex;
  var prevIndex = currIndex;
  var slideCount;
  var perMove;
  var perPage;
  function mount() {
    init();
    on([EVENT_UPDATED, EVENT_REFRESH, EVENT_END_INDEX_CHANGED], init);
    on(EVENT_RESIZED, onResized);
  }
  function init() {
    slideCount = getLength(true);
    perMove = options.perMove;
    perPage = options.perPage;
    endIndex = getEnd();
    var index = clamp(currIndex, 0, omitEnd ? endIndex : slideCount - 1);
    if (index !== currIndex) {
      currIndex = index;
      Move2.reposition();
    }
  }
  function onResized() {
    if (endIndex !== getEnd()) {
      emit(EVENT_END_INDEX_CHANGED);
    }
  }
  function go(control, allowSameIndex, callback) {
    if (!isBusy()) {
      var dest = parse(control);
      var index = loop(dest);
      if (index > -1 && (allowSameIndex || index !== currIndex)) {
        setIndex(index);
        Move2.move(dest, index, prevIndex, callback);
      }
    }
  }
  function scroll(destination, duration, snap, callback) {
    Components2.Scroll.scroll(destination, duration, snap, function() {
      var index = loop(Move2.toIndex(getPosition()));
      setIndex(omitEnd ? min(index, endIndex) : index);
      callback && callback();
    });
  }
  function parse(control) {
    var index = currIndex;
    if (isString(control)) {
      var _ref = control.match(/([+\-<>])(\d+)?/) || [], indicator = _ref[1], number = _ref[2];
      if (indicator === "+" || indicator === "-") {
        index = computeDestIndex(currIndex + +("" + indicator + (+number || 1)), currIndex);
      } else if (indicator === ">") {
        index = number ? toIndex(+number) : getNext(true);
      } else if (indicator === "<") {
        index = getPrev(true);
      }
    } else {
      index = isLoop ? control : clamp(control, 0, endIndex);
    }
    return index;
  }
  function getAdjacent(prev, destination) {
    var number = perMove || (hasFocus() ? 1 : perPage);
    var dest = computeDestIndex(currIndex + number * (prev ? -1 : 1), currIndex, !(perMove || hasFocus()));
    if (dest === -1 && isSlide) {
      if (!approximatelyEqual(getPosition(), getLimit(!prev), 1)) {
        return prev ? 0 : endIndex;
      }
    }
    return destination ? dest : loop(dest);
  }
  function computeDestIndex(dest, from, snapPage) {
    if (isEnough() || hasFocus()) {
      var index = computeMovableDestIndex(dest);
      if (index !== dest) {
        from = dest;
        dest = index;
        snapPage = false;
      }
      if (dest < 0 || dest > endIndex) {
        if (!perMove && (between(0, dest, from, true) || between(endIndex, from, dest, true))) {
          dest = toIndex(toPage(dest));
        } else {
          if (isLoop) {
            dest = snapPage ? dest < 0 ? -(slideCount % perPage || perPage) : slideCount : dest;
          } else if (options.rewind) {
            dest = dest < 0 ? endIndex : 0;
          } else {
            dest = -1;
          }
        }
      } else {
        if (snapPage && dest !== from) {
          dest = toIndex(toPage(from) + (dest < from ? -1 : 1));
        }
      }
    } else {
      dest = -1;
    }
    return dest;
  }
  function computeMovableDestIndex(dest) {
    if (isSlide && options.trimSpace === "move" && dest !== currIndex) {
      var position = getPosition();
      while (position === toPosition(dest, true) && between(dest, 0, Splide22.length - 1, !options.rewind)) {
        dest < currIndex ? --dest : ++dest;
      }
    }
    return dest;
  }
  function loop(index) {
    return isLoop ? (index + slideCount) % slideCount || 0 : index;
  }
  function getEnd() {
    var end = slideCount - (hasFocus() || isLoop && perMove ? 1 : perPage);
    while (omitEnd && end-- > 0) {
      if (toPosition(slideCount - 1, true) !== toPosition(end, true)) {
        end++;
        break;
      }
    }
    return clamp(end, 0, slideCount - 1);
  }
  function toIndex(page) {
    return clamp(hasFocus() ? page : perPage * page, 0, endIndex);
  }
  function toPage(index) {
    return hasFocus() ? min(index, endIndex) : floor((index >= endIndex ? slideCount - 1 : index) / perPage);
  }
  function toDest(destination) {
    var closest2 = Move2.toIndex(destination);
    return isSlide ? clamp(closest2, 0, endIndex) : closest2;
  }
  function setIndex(index) {
    if (index !== currIndex) {
      prevIndex = currIndex;
      currIndex = index;
    }
  }
  function getIndex(prev) {
    return prev ? prevIndex : currIndex;
  }
  function hasFocus() {
    return !isUndefined(options.focus) || options.isNavigation;
  }
  function isBusy() {
    return Splide22.state.is([MOVING, SCROLLING]) && !!options.waitForTransition;
  }
  return {
    mount,
    go,
    scroll,
    getNext,
    getPrev,
    getAdjacent,
    getEnd,
    setIndex,
    getIndex,
    toIndex,
    toPage,
    toDest,
    hasFocus,
    isBusy
  };
}
var XML_NAME_SPACE = "http://www.w3.org/2000/svg";
var PATH = "m15.5 0.932-4.3 4.38 14.5 14.6-14.5 14.5 4.3 4.4 14.6-14.6 4.4-4.3-4.4-4.4-14.6-14.6z";
var SIZE = 40;
function Arrows(Splide22, Components2, options) {
  var event = EventInterface(Splide22);
  var on = event.on, bind = event.bind, emit = event.emit;
  var classes = options.classes, i18n = options.i18n;
  var Elements2 = Components2.Elements, Controller2 = Components2.Controller;
  var placeholder = Elements2.arrows, track = Elements2.track;
  var wrapper = placeholder;
  var prev = Elements2.prev;
  var next = Elements2.next;
  var created;
  var wrapperClasses;
  var arrows = {};
  function mount() {
    init();
    on(EVENT_UPDATED, remount);
  }
  function remount() {
    destroy();
    mount();
  }
  function init() {
    var enabled = options.arrows;
    if (enabled && !(prev && next)) {
      createArrows();
    }
    if (prev && next) {
      assign(arrows, {
        prev,
        next
      });
      display(wrapper, enabled ? "" : "none");
      addClass(wrapper, wrapperClasses = CLASS_ARROWS + "--" + options.direction);
      if (enabled) {
        listen();
        update();
        setAttribute([prev, next], ARIA_CONTROLS, track.id);
        emit(EVENT_ARROWS_MOUNTED, prev, next);
      }
    }
  }
  function destroy() {
    event.destroy();
    removeClass(wrapper, wrapperClasses);
    if (created) {
      remove(placeholder ? [prev, next] : wrapper);
      prev = next = null;
    } else {
      removeAttribute([prev, next], ALL_ATTRIBUTES);
    }
  }
  function listen() {
    on([EVENT_MOUNTED, EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED], update);
    bind(next, "click", apply(go, ">"));
    bind(prev, "click", apply(go, "<"));
  }
  function go(control) {
    Controller2.go(control, true);
  }
  function createArrows() {
    wrapper = placeholder || create("div", classes.arrows);
    prev = createArrow(true);
    next = createArrow(false);
    created = true;
    append(wrapper, [prev, next]);
    !placeholder && before(wrapper, track);
  }
  function createArrow(prev2) {
    var arrow = '<button class="' + classes.arrow + " " + (prev2 ? classes.prev : classes.next) + '" type="button"><svg xmlns="' + XML_NAME_SPACE + '" viewBox="0 0 ' + SIZE + " " + SIZE + '" width="' + SIZE + '" height="' + SIZE + '" focusable="false"><path d="' + (options.arrowPath || PATH) + '" />';
    return parseHtml(arrow);
  }
  function update() {
    if (prev && next) {
      var index = Splide22.index;
      var prevIndex = Controller2.getPrev();
      var nextIndex = Controller2.getNext();
      var prevLabel = prevIndex > -1 && index < prevIndex ? i18n.last : i18n.prev;
      var nextLabel = nextIndex > -1 && index > nextIndex ? i18n.first : i18n.next;
      prev.disabled = prevIndex < 0;
      next.disabled = nextIndex < 0;
      setAttribute(prev, ARIA_LABEL, prevLabel);
      setAttribute(next, ARIA_LABEL, nextLabel);
      emit(EVENT_ARROWS_UPDATED, prev, next, prevIndex, nextIndex);
    }
  }
  return {
    arrows,
    mount,
    destroy,
    update
  };
}
var INTERVAL_DATA_ATTRIBUTE = DATA_ATTRIBUTE + "-interval";
function Autoplay(Splide22, Components2, options) {
  var _EventInterface6 = EventInterface(Splide22), on = _EventInterface6.on, bind = _EventInterface6.bind, emit = _EventInterface6.emit;
  var interval = RequestInterval(options.interval, Splide22.go.bind(Splide22, ">"), onAnimationFrame);
  var isPaused = interval.isPaused;
  var Elements2 = Components2.Elements, _Components2$Elements4 = Components2.Elements, root = _Components2$Elements4.root, toggle = _Components2$Elements4.toggle;
  var autoplay = options.autoplay;
  var hovered;
  var focused;
  var stopped = autoplay === "pause";
  function mount() {
    if (autoplay) {
      listen();
      toggle && setAttribute(toggle, ARIA_CONTROLS, Elements2.track.id);
      stopped || play();
      update();
    }
  }
  function listen() {
    if (options.pauseOnHover) {
      bind(root, "mouseenter mouseleave", function(e) {
        hovered = e.type === "mouseenter";
        autoToggle();
      });
    }
    if (options.pauseOnFocus) {
      bind(root, "focusin focusout", function(e) {
        focused = e.type === "focusin";
        autoToggle();
      });
    }
    if (toggle) {
      bind(toggle, "click", function() {
        stopped ? play() : pause(true);
      });
    }
    on([EVENT_MOVE, EVENT_SCROLL, EVENT_REFRESH], interval.rewind);
    on(EVENT_MOVE, onMove);
  }
  function play() {
    if (isPaused() && Components2.Slides.isEnough()) {
      interval.start(!options.resetProgress);
      focused = hovered = stopped = false;
      update();
      emit(EVENT_AUTOPLAY_PLAY);
    }
  }
  function pause(stop) {
    if (stop === void 0) {
      stop = true;
    }
    stopped = !!stop;
    update();
    if (!isPaused()) {
      interval.pause();
      emit(EVENT_AUTOPLAY_PAUSE);
    }
  }
  function autoToggle() {
    if (!stopped) {
      hovered || focused ? pause(false) : play();
    }
  }
  function update() {
    if (toggle) {
      toggleClass(toggle, CLASS_ACTIVE, !stopped);
      setAttribute(toggle, ARIA_LABEL, options.i18n[stopped ? "play" : "pause"]);
    }
  }
  function onAnimationFrame(rate) {
    var bar = Elements2.bar;
    bar && style(bar, "width", rate * 100 + "%");
    emit(EVENT_AUTOPLAY_PLAYING, rate);
  }
  function onMove(index) {
    var Slide2 = Components2.Slides.getAt(index);
    interval.set(Slide2 && +getAttribute(Slide2.slide, INTERVAL_DATA_ATTRIBUTE) || options.interval);
  }
  return {
    mount,
    destroy: interval.cancel,
    play,
    pause,
    isPaused
  };
}
function Cover(Splide22, Components2, options) {
  var _EventInterface7 = EventInterface(Splide22), on = _EventInterface7.on;
  function mount() {
    if (options.cover) {
      on(EVENT_LAZYLOAD_LOADED, apply(toggle, true));
      on([EVENT_MOUNTED, EVENT_UPDATED, EVENT_REFRESH], apply(cover, true));
    }
  }
  function cover(cover2) {
    Components2.Slides.forEach(function(Slide2) {
      var img = child(Slide2.container || Slide2.slide, "img");
      if (img && img.src) {
        toggle(cover2, img, Slide2);
      }
    });
  }
  function toggle(cover2, img, Slide2) {
    Slide2.style("background", cover2 ? 'center/cover no-repeat url("' + img.src + '")' : "", true);
    display(img, cover2 ? "none" : "");
  }
  return {
    mount,
    destroy: apply(cover, false)
  };
}
var BOUNCE_DIFF_THRESHOLD = 10;
var BOUNCE_DURATION = 600;
var FRICTION_FACTOR = 0.6;
var BASE_VELOCITY = 1.5;
var MIN_DURATION = 800;
function Scroll(Splide22, Components2, options) {
  var _EventInterface8 = EventInterface(Splide22), on = _EventInterface8.on, emit = _EventInterface8.emit;
  var set = Splide22.state.set;
  var Move2 = Components2.Move;
  var getPosition = Move2.getPosition, getLimit = Move2.getLimit, exceededLimit = Move2.exceededLimit, translate = Move2.translate;
  var isSlide = Splide22.is(SLIDE);
  var interval;
  var callback;
  var friction = 1;
  function mount() {
    on(EVENT_MOVE, clear);
    on([EVENT_UPDATED, EVENT_REFRESH], cancel);
  }
  function scroll(destination, duration, snap, onScrolled, noConstrain) {
    var from = getPosition();
    clear();
    if (snap && (!isSlide || !exceededLimit())) {
      var size = Components2.Layout.sliderSize();
      var offset = sign(destination) * size * floor(abs(destination) / size) || 0;
      destination = Move2.toPosition(Components2.Controller.toDest(destination % size)) + offset;
    }
    var noDistance = approximatelyEqual(from, destination, 1);
    friction = 1;
    duration = noDistance ? 0 : duration || max(abs(destination - from) / BASE_VELOCITY, MIN_DURATION);
    callback = onScrolled;
    interval = RequestInterval(duration, onEnd, apply(update, from, destination, noConstrain), 1);
    set(SCROLLING);
    emit(EVENT_SCROLL);
    interval.start();
  }
  function onEnd() {
    set(IDLE);
    callback && callback();
    emit(EVENT_SCROLLED);
  }
  function update(from, to, noConstrain, rate) {
    var position = getPosition();
    var target = from + (to - from) * easing(rate);
    var diff = (target - position) * friction;
    translate(position + diff);
    if (isSlide && !noConstrain && exceededLimit()) {
      friction *= FRICTION_FACTOR;
      if (abs(diff) < BOUNCE_DIFF_THRESHOLD) {
        scroll(getLimit(exceededLimit(true)), BOUNCE_DURATION, false, callback, true);
      }
    }
  }
  function clear() {
    if (interval) {
      interval.cancel();
    }
  }
  function cancel() {
    if (interval && !interval.isPaused()) {
      clear();
      onEnd();
    }
  }
  function easing(t) {
    var easingFunc = options.easingFunc;
    return easingFunc ? easingFunc(t) : 1 - Math.pow(1 - t, 4);
  }
  return {
    mount,
    destroy: clear,
    scroll,
    cancel
  };
}
var SCROLL_LISTENER_OPTIONS = {
  passive: false,
  capture: true
};
function Drag(Splide22, Components2, options) {
  var _EventInterface9 = EventInterface(Splide22), on = _EventInterface9.on, emit = _EventInterface9.emit, bind = _EventInterface9.bind, unbind = _EventInterface9.unbind;
  var state = Splide22.state;
  var Move2 = Components2.Move, Scroll2 = Components2.Scroll, Controller2 = Components2.Controller, track = Components2.Elements.track, reduce = Components2.Media.reduce;
  var _Components2$Directio2 = Components2.Direction, resolve = _Components2$Directio2.resolve, orient = _Components2$Directio2.orient;
  var getPosition = Move2.getPosition, exceededLimit = Move2.exceededLimit;
  var basePosition;
  var baseEvent;
  var prevBaseEvent;
  var isFree;
  var dragging;
  var exceeded = false;
  var clickPrevented;
  var disabled;
  var target;
  function mount() {
    bind(track, POINTER_MOVE_EVENTS, noop, SCROLL_LISTENER_OPTIONS);
    bind(track, POINTER_UP_EVENTS, noop, SCROLL_LISTENER_OPTIONS);
    bind(track, POINTER_DOWN_EVENTS, onPointerDown, SCROLL_LISTENER_OPTIONS);
    bind(track, "click", onClick, {
      capture: true
    });
    bind(track, "dragstart", prevent);
    on([EVENT_MOUNTED, EVENT_UPDATED], init);
  }
  function init() {
    var drag = options.drag;
    disable(!drag);
    isFree = drag === "free";
  }
  function onPointerDown(e) {
    clickPrevented = false;
    if (!disabled) {
      var isTouch = isTouchEvent(e);
      if (isDraggable(e.target) && (isTouch || !e.button)) {
        if (!Controller2.isBusy()) {
          target = isTouch ? track : window;
          dragging = state.is([MOVING, SCROLLING]);
          prevBaseEvent = null;
          bind(target, POINTER_MOVE_EVENTS, onPointerMove, SCROLL_LISTENER_OPTIONS);
          bind(target, POINTER_UP_EVENTS, onPointerUp, SCROLL_LISTENER_OPTIONS);
          Move2.cancel();
          Scroll2.cancel();
          save(e);
        } else {
          prevent(e, true);
        }
      }
    }
  }
  function onPointerMove(e) {
    if (!state.is(DRAGGING)) {
      state.set(DRAGGING);
      emit(EVENT_DRAG);
    }
    if (e.cancelable) {
      if (dragging) {
        Move2.translate(basePosition + constrain(diffCoord(e)));
        var expired = diffTime(e) > LOG_INTERVAL;
        var hasExceeded = exceeded !== (exceeded = exceededLimit());
        if (expired || hasExceeded) {
          save(e);
        }
        clickPrevented = true;
        emit(EVENT_DRAGGING);
        prevent(e);
      } else if (isSliderDirection(e)) {
        dragging = shouldStart(e);
        prevent(e);
      }
    }
  }
  function onPointerUp(e) {
    if (state.is(DRAGGING)) {
      state.set(IDLE);
      emit(EVENT_DRAGGED);
    }
    if (dragging) {
      move(e);
      prevent(e);
    }
    unbind(target, POINTER_MOVE_EVENTS, onPointerMove);
    unbind(target, POINTER_UP_EVENTS, onPointerUp);
    dragging = false;
  }
  function onClick(e) {
    if (!disabled && clickPrevented) {
      prevent(e, true);
    }
  }
  function save(e) {
    prevBaseEvent = baseEvent;
    baseEvent = e;
    basePosition = getPosition();
  }
  function move(e) {
    var velocity = computeVelocity(e);
    var destination = computeDestination(velocity);
    var rewind = options.rewind && options.rewindByDrag;
    reduce(false);
    if (isFree) {
      Controller2.scroll(destination, 0, options.snap);
    } else if (Splide22.is(FADE)) {
      Controller2.go(orient(sign(velocity)) < 0 ? rewind ? "<" : "-" : rewind ? ">" : "+");
    } else if (Splide22.is(SLIDE) && exceeded && rewind) {
      Controller2.go(exceededLimit(true) ? ">" : "<");
    } else {
      Controller2.go(Controller2.toDest(destination), true);
    }
    reduce(true);
  }
  function shouldStart(e) {
    var thresholds = options.dragMinThreshold;
    var isObj = isObject(thresholds);
    var mouse = isObj && thresholds.mouse || 0;
    var touch = (isObj ? thresholds.touch : +thresholds) || 10;
    return abs(diffCoord(e)) > (isTouchEvent(e) ? touch : mouse);
  }
  function isSliderDirection(e) {
    return abs(diffCoord(e)) > abs(diffCoord(e, true));
  }
  function computeVelocity(e) {
    if (Splide22.is(LOOP) || !exceeded) {
      var time = diffTime(e);
      if (time && time < LOG_INTERVAL) {
        return diffCoord(e) / time;
      }
    }
    return 0;
  }
  function computeDestination(velocity) {
    return getPosition() + sign(velocity) * min(abs(velocity) * (options.flickPower || 600), isFree ? Infinity : Components2.Layout.listSize() * (options.flickMaxPages || 1));
  }
  function diffCoord(e, orthogonal) {
    return coordOf(e, orthogonal) - coordOf(getBaseEvent(e), orthogonal);
  }
  function diffTime(e) {
    return timeOf(e) - timeOf(getBaseEvent(e));
  }
  function getBaseEvent(e) {
    return baseEvent === e && prevBaseEvent || baseEvent;
  }
  function coordOf(e, orthogonal) {
    return (isTouchEvent(e) ? e.changedTouches[0] : e)["page" + resolve(orthogonal ? "Y" : "X")];
  }
  function constrain(diff) {
    return diff / (exceeded && Splide22.is(SLIDE) ? FRICTION : 1);
  }
  function isDraggable(target2) {
    var noDrag = options.noDrag;
    return !matches(target2, "." + CLASS_PAGINATION_PAGE + ", ." + CLASS_ARROW) && (!noDrag || !matches(target2, noDrag));
  }
  function isTouchEvent(e) {
    return typeof TouchEvent !== "undefined" && e instanceof TouchEvent;
  }
  function isDragging() {
    return dragging;
  }
  function disable(value) {
    disabled = value;
  }
  return {
    mount,
    disable,
    isDragging
  };
}
var NORMALIZATION_MAP = {
  Spacebar: " ",
  Right: ARROW_RIGHT,
  Left: ARROW_LEFT,
  Up: ARROW_UP,
  Down: ARROW_DOWN
};
function normalizeKey(key) {
  key = isString(key) ? key : key.key;
  return NORMALIZATION_MAP[key] || key;
}
var KEYBOARD_EVENT = "keydown";
function Keyboard(Splide22, Components2, options) {
  var _EventInterface10 = EventInterface(Splide22), on = _EventInterface10.on, bind = _EventInterface10.bind, unbind = _EventInterface10.unbind;
  var root = Splide22.root;
  var resolve = Components2.Direction.resolve;
  var target;
  var disabled;
  function mount() {
    init();
    on(EVENT_UPDATED, destroy);
    on(EVENT_UPDATED, init);
    on(EVENT_MOVE, onMove);
  }
  function init() {
    var keyboard = options.keyboard;
    if (keyboard) {
      target = keyboard === "global" ? window : root;
      bind(target, KEYBOARD_EVENT, onKeydown);
    }
  }
  function destroy() {
    unbind(target, KEYBOARD_EVENT);
  }
  function disable(value) {
    disabled = value;
  }
  function onMove() {
    var _disabled = disabled;
    disabled = true;
    nextTick(function() {
      disabled = _disabled;
    });
  }
  function onKeydown(e) {
    if (!disabled) {
      var key = normalizeKey(e);
      if (key === resolve(ARROW_LEFT)) {
        Splide22.go("<");
      } else if (key === resolve(ARROW_RIGHT)) {
        Splide22.go(">");
      }
    }
  }
  return {
    mount,
    destroy,
    disable
  };
}
var SRC_DATA_ATTRIBUTE = DATA_ATTRIBUTE + "-lazy";
var SRCSET_DATA_ATTRIBUTE = SRC_DATA_ATTRIBUTE + "-srcset";
var IMAGE_SELECTOR = "[" + SRC_DATA_ATTRIBUTE + "], [" + SRCSET_DATA_ATTRIBUTE + "]";
function LazyLoad(Splide22, Components2, options) {
  var _EventInterface11 = EventInterface(Splide22), on = _EventInterface11.on, off = _EventInterface11.off, bind = _EventInterface11.bind, emit = _EventInterface11.emit;
  var isSequential = options.lazyLoad === "sequential";
  var events = [EVENT_MOVED, EVENT_SCROLLED];
  var entries = [];
  function mount() {
    if (options.lazyLoad) {
      init();
      on(EVENT_REFRESH, init);
    }
  }
  function init() {
    empty(entries);
    register();
    if (isSequential) {
      loadNext();
    } else {
      off(events);
      on(events, check);
      check();
    }
  }
  function register() {
    Components2.Slides.forEach(function(Slide2) {
      queryAll(Slide2.slide, IMAGE_SELECTOR).forEach(function(img) {
        var src = getAttribute(img, SRC_DATA_ATTRIBUTE);
        var srcset = getAttribute(img, SRCSET_DATA_ATTRIBUTE);
        if (src !== img.src || srcset !== img.srcset) {
          var className = options.classes.spinner;
          var parent = img.parentElement;
          var spinner = child(parent, "." + className) || create("span", className, parent);
          entries.push([img, Slide2, spinner]);
          img.src || display(img, "none");
        }
      });
    });
  }
  function check() {
    entries = entries.filter(function(data) {
      var distance = options.perPage * ((options.preloadPages || 1) + 1) - 1;
      return data[1].isWithin(Splide22.index, distance) ? load(data) : true;
    });
    entries.length || off(events);
  }
  function load(data) {
    var img = data[0];
    addClass(data[1].slide, CLASS_LOADING);
    bind(img, "load error", apply(onLoad, data));
    setAttribute(img, "src", getAttribute(img, SRC_DATA_ATTRIBUTE));
    setAttribute(img, "srcset", getAttribute(img, SRCSET_DATA_ATTRIBUTE));
    removeAttribute(img, SRC_DATA_ATTRIBUTE);
    removeAttribute(img, SRCSET_DATA_ATTRIBUTE);
  }
  function onLoad(data, e) {
    var img = data[0], Slide2 = data[1];
    removeClass(Slide2.slide, CLASS_LOADING);
    if (e.type !== "error") {
      remove(data[2]);
      display(img, "");
      emit(EVENT_LAZYLOAD_LOADED, img, Slide2);
      emit(EVENT_RESIZE);
    }
    isSequential && loadNext();
  }
  function loadNext() {
    entries.length && load(entries.shift());
  }
  return {
    mount,
    destroy: apply(empty, entries),
    check
  };
}
function Pagination(Splide22, Components2, options) {
  var event = EventInterface(Splide22);
  var on = event.on, emit = event.emit, bind = event.bind;
  var Slides2 = Components2.Slides, Elements2 = Components2.Elements, Controller2 = Components2.Controller;
  var hasFocus = Controller2.hasFocus, getIndex = Controller2.getIndex, go = Controller2.go;
  var resolve = Components2.Direction.resolve;
  var placeholder = Elements2.pagination;
  var items = [];
  var list;
  var paginationClasses;
  function mount() {
    destroy();
    on([EVENT_UPDATED, EVENT_REFRESH, EVENT_END_INDEX_CHANGED], mount);
    var enabled = options.pagination;
    placeholder && display(placeholder, enabled ? "" : "none");
    if (enabled) {
      on([EVENT_MOVE, EVENT_SCROLL, EVENT_SCROLLED], update);
      createPagination();
      update();
      emit(EVENT_PAGINATION_MOUNTED, {
        list,
        items
      }, getAt(Splide22.index));
    }
  }
  function destroy() {
    if (list) {
      remove(placeholder ? slice(list.children) : list);
      removeClass(list, paginationClasses);
      empty(items);
      list = null;
    }
    event.destroy();
  }
  function createPagination() {
    var length = Splide22.length;
    var classes = options.classes, i18n = options.i18n, perPage = options.perPage;
    var max2 = hasFocus() ? Controller2.getEnd() + 1 : ceil(length / perPage);
    list = placeholder || create("ul", classes.pagination, Elements2.track.parentElement);
    addClass(list, paginationClasses = CLASS_PAGINATION + "--" + getDirection());
    setAttribute(list, ROLE, "tablist");
    setAttribute(list, ARIA_LABEL, i18n.select);
    setAttribute(list, ARIA_ORIENTATION, getDirection() === TTB ? "vertical" : "");
    for (var i = 0; i < max2; i++) {
      var li = create("li", null, list);
      var button = create("button", {
        class: classes.page,
        type: "button"
      }, li);
      var controls = Slides2.getIn(i).map(function(Slide2) {
        return Slide2.slide.id;
      });
      var text = !hasFocus() && perPage > 1 ? i18n.pageX : i18n.slideX;
      bind(button, "click", apply(onClick, i));
      if (options.paginationKeyboard) {
        bind(button, "keydown", apply(onKeydown, i));
      }
      setAttribute(li, ROLE, "presentation");
      setAttribute(button, ROLE, "tab");
      setAttribute(button, ARIA_CONTROLS, controls.join(" "));
      setAttribute(button, ARIA_LABEL, format(text, i + 1));
      setAttribute(button, TAB_INDEX, -1);
      items.push({
        li,
        button,
        page: i
      });
    }
  }
  function onClick(page) {
    go(">" + page, true);
  }
  function onKeydown(page, e) {
    var length = items.length;
    var key = normalizeKey(e);
    var dir = getDirection();
    var nextPage = -1;
    if (key === resolve(ARROW_RIGHT, false, dir)) {
      nextPage = ++page % length;
    } else if (key === resolve(ARROW_LEFT, false, dir)) {
      nextPage = (--page + length) % length;
    } else if (key === "Home") {
      nextPage = 0;
    } else if (key === "End") {
      nextPage = length - 1;
    }
    var item = items[nextPage];
    if (item) {
      focus(item.button);
      go(">" + nextPage);
      prevent(e, true);
    }
  }
  function getDirection() {
    return options.paginationDirection || options.direction;
  }
  function getAt(index) {
    return items[Controller2.toPage(index)];
  }
  function update() {
    var prev = getAt(getIndex(true));
    var curr = getAt(getIndex());
    if (prev) {
      var button = prev.button;
      removeClass(button, CLASS_ACTIVE);
      removeAttribute(button, ARIA_SELECTED);
      setAttribute(button, TAB_INDEX, -1);
    }
    if (curr) {
      var _button = curr.button;
      addClass(_button, CLASS_ACTIVE);
      setAttribute(_button, ARIA_SELECTED, true);
      setAttribute(_button, TAB_INDEX, "");
    }
    emit(EVENT_PAGINATION_UPDATED, {
      list,
      items
    }, prev, curr);
  }
  return {
    items,
    mount,
    destroy,
    getAt,
    update
  };
}
var TRIGGER_KEYS = [" ", "Enter"];
function Sync(Splide22, Components2, options) {
  var isNavigation = options.isNavigation, slideFocus = options.slideFocus;
  var events = [];
  function mount() {
    Splide22.splides.forEach(function(target) {
      if (!target.isParent) {
        sync(Splide22, target.splide);
        sync(target.splide, Splide22);
      }
    });
    if (isNavigation) {
      navigate();
    }
  }
  function destroy() {
    events.forEach(function(event) {
      event.destroy();
    });
    empty(events);
  }
  function remount() {
    destroy();
    mount();
  }
  function sync(splide, target) {
    var event = EventInterface(splide);
    event.on(EVENT_MOVE, function(index, prev, dest) {
      target.go(target.is(LOOP) ? dest : index);
    });
    events.push(event);
  }
  function navigate() {
    var event = EventInterface(Splide22);
    var on = event.on;
    on(EVENT_CLICK, onClick);
    on(EVENT_SLIDE_KEYDOWN, onKeydown);
    on([EVENT_MOUNTED, EVENT_UPDATED], update);
    events.push(event);
    event.emit(EVENT_NAVIGATION_MOUNTED, Splide22.splides);
  }
  function update() {
    setAttribute(Components2.Elements.list, ARIA_ORIENTATION, options.direction === TTB ? "vertical" : "");
  }
  function onClick(Slide2) {
    Splide22.go(Slide2.index);
  }
  function onKeydown(Slide2, e) {
    if (includes(TRIGGER_KEYS, normalizeKey(e))) {
      onClick(Slide2);
      prevent(e);
    }
  }
  return {
    setup: apply(Components2.Media.set, {
      slideFocus: isUndefined(slideFocus) ? isNavigation : slideFocus
    }, true),
    mount,
    destroy,
    remount
  };
}
function Wheel(Splide22, Components2, options) {
  var _EventInterface12 = EventInterface(Splide22), bind = _EventInterface12.bind;
  var lastTime = 0;
  function mount() {
    if (options.wheel) {
      bind(Components2.Elements.track, "wheel", onWheel, SCROLL_LISTENER_OPTIONS);
    }
  }
  function onWheel(e) {
    if (e.cancelable) {
      var deltaY = e.deltaY;
      var backwards = deltaY < 0;
      var timeStamp = timeOf(e);
      var _min = options.wheelMinThreshold || 0;
      var sleep = options.wheelSleep || 0;
      if (abs(deltaY) > _min && timeStamp - lastTime > sleep) {
        Splide22.go(backwards ? "<" : ">");
        lastTime = timeStamp;
      }
      shouldPrevent(backwards) && prevent(e);
    }
  }
  function shouldPrevent(backwards) {
    return !options.releaseWheel || Splide22.state.is(MOVING) || Components2.Controller.getAdjacent(backwards) !== -1;
  }
  return {
    mount
  };
}
var SR_REMOVAL_DELAY = 90;
function Live(Splide22, Components2, options) {
  var _EventInterface13 = EventInterface(Splide22), on = _EventInterface13.on;
  var track = Components2.Elements.track;
  var enabled = options.live && !options.isNavigation;
  var sr = create("span", CLASS_SR);
  var interval = RequestInterval(SR_REMOVAL_DELAY, apply(toggle, false));
  function mount() {
    if (enabled) {
      disable(!Components2.Autoplay.isPaused());
      setAttribute(track, ARIA_ATOMIC, true);
      sr.textContent = "\u2026";
      on(EVENT_AUTOPLAY_PLAY, apply(disable, true));
      on(EVENT_AUTOPLAY_PAUSE, apply(disable, false));
      on([EVENT_MOVED, EVENT_SCROLLED], apply(toggle, true));
    }
  }
  function toggle(active) {
    setAttribute(track, ARIA_BUSY, active);
    if (active) {
      append(track, sr);
      interval.start();
    } else {
      remove(sr);
      interval.cancel();
    }
  }
  function destroy() {
    removeAttribute(track, [ARIA_LIVE, ARIA_ATOMIC, ARIA_BUSY]);
    remove(sr);
  }
  function disable(disabled) {
    if (enabled) {
      setAttribute(track, ARIA_LIVE, disabled ? "off" : "polite");
    }
  }
  return {
    mount,
    disable,
    destroy
  };
}
var ComponentConstructors = /* @__PURE__ */ Object.freeze({
  __proto__: null,
  Media,
  Direction,
  Elements,
  Slides,
  Layout,
  Clones,
  Move,
  Controller,
  Arrows,
  Autoplay,
  Cover,
  Scroll,
  Drag,
  Keyboard,
  LazyLoad,
  Pagination,
  Sync,
  Wheel,
  Live
});
var I18N = {
  prev: "Previous slide",
  next: "Next slide",
  first: "Go to first slide",
  last: "Go to last slide",
  slideX: "Go to slide %s",
  pageX: "Go to page %s",
  play: "Start autoplay",
  pause: "Pause autoplay",
  carousel: "carousel",
  slide: "slide",
  select: "Select a slide to show",
  slideLabel: "%s of %s"
};
var DEFAULTS = {
  type: "slide",
  role: "region",
  speed: 400,
  perPage: 1,
  cloneStatus: true,
  arrows: true,
  pagination: true,
  paginationKeyboard: true,
  interval: 5e3,
  pauseOnHover: true,
  pauseOnFocus: true,
  resetProgress: true,
  easing: "cubic-bezier(0.25, 1, 0.5, 1)",
  drag: true,
  direction: "ltr",
  trimSpace: true,
  focusableNodes: "a, button, textarea, input, select, iframe",
  live: true,
  classes: CLASSES,
  i18n: I18N,
  reducedMotion: {
    speed: 0,
    rewindSpeed: 0,
    autoplay: "pause"
  }
};
function Fade(Splide22, Components2, options) {
  var Slides2 = Components2.Slides;
  function mount() {
    EventInterface(Splide22).on([EVENT_MOUNTED, EVENT_REFRESH], init);
  }
  function init() {
    Slides2.forEach(function(Slide2) {
      Slide2.style("transform", "translateX(-" + 100 * Slide2.index + "%)");
    });
  }
  function start(index, done) {
    Slides2.style("transition", "opacity " + options.speed + "ms " + options.easing);
    nextTick(done);
  }
  return {
    mount,
    start,
    cancel: noop
  };
}
function Slide(Splide22, Components2, options) {
  var Move2 = Components2.Move, Controller2 = Components2.Controller, Scroll2 = Components2.Scroll;
  var list = Components2.Elements.list;
  var transition = apply(style, list, "transition");
  var endCallback;
  function mount() {
    EventInterface(Splide22).bind(list, "transitionend", function(e) {
      if (e.target === list && endCallback) {
        cancel();
        endCallback();
      }
    });
  }
  function start(index, done) {
    var destination = Move2.toPosition(index, true);
    var position = Move2.getPosition();
    var speed = getSpeed(index);
    if (abs(destination - position) >= 1 && speed >= 1) {
      if (options.useScroll) {
        Scroll2.scroll(destination, speed, false, done);
      } else {
        transition("transform " + speed + "ms " + options.easing);
        Move2.translate(destination, true);
        endCallback = done;
      }
    } else {
      Move2.jump(index);
      done();
    }
  }
  function cancel() {
    transition("");
    Scroll2.cancel();
  }
  function getSpeed(index) {
    var rewindSpeed = options.rewindSpeed;
    if (Splide22.is(SLIDE) && rewindSpeed) {
      var prev = Controller2.getIndex(true);
      var end = Controller2.getEnd();
      if (prev === 0 && index >= end || prev >= end && index === 0) {
        return rewindSpeed;
      }
    }
    return options.speed;
  }
  return {
    mount,
    start,
    cancel
  };
}
var _Splide = /* @__PURE__ */ function() {
  function _Splide2(target, options) {
    this.event = EventInterface();
    this.Components = {};
    this.state = State(CREATED);
    this.splides = [];
    this._o = {};
    this._E = {};
    var root = isString(target) ? query(document, target) : target;
    assert(root, root + " is invalid.");
    this.root = root;
    options = merge({
      label: getAttribute(root, ARIA_LABEL) || "",
      labelledby: getAttribute(root, ARIA_LABELLEDBY) || ""
    }, DEFAULTS, _Splide2.defaults, options || {});
    try {
      merge(options, JSON.parse(getAttribute(root, DATA_ATTRIBUTE)));
    } catch (e) {
      assert(false, "Invalid JSON");
    }
    this._o = Object.create(merge({}, options));
  }
  var _proto = _Splide2.prototype;
  _proto.mount = function mount(Extensions, Transition) {
    var _this = this;
    var state = this.state, Components2 = this.Components;
    assert(state.is([CREATED, DESTROYED]), "Already mounted!");
    state.set(CREATED);
    this._C = Components2;
    this._T = Transition || this._T || (this.is(FADE) ? Fade : Slide);
    this._E = Extensions || this._E;
    var Constructors = assign({}, ComponentConstructors, this._E, {
      Transition: this._T
    });
    forOwn(Constructors, function(Component, key) {
      var component = Component(_this, Components2, _this._o);
      Components2[key] = component;
      component.setup && component.setup();
    });
    forOwn(Components2, function(component) {
      component.mount && component.mount();
    });
    this.emit(EVENT_MOUNTED);
    addClass(this.root, CLASS_INITIALIZED);
    state.set(IDLE);
    this.emit(EVENT_READY);
    return this;
  };
  _proto.sync = function sync(splide) {
    this.splides.push({
      splide
    });
    splide.splides.push({
      splide: this,
      isParent: true
    });
    if (this.state.is(IDLE)) {
      this._C.Sync.remount();
      splide.Components.Sync.remount();
    }
    return this;
  };
  _proto.go = function go(control) {
    this._C.Controller.go(control);
    return this;
  };
  _proto.on = function on(events, callback) {
    this.event.on(events, callback);
    return this;
  };
  _proto.off = function off(events) {
    this.event.off(events);
    return this;
  };
  _proto.emit = function emit(event) {
    var _this$event;
    (_this$event = this.event).emit.apply(_this$event, [event].concat(slice(arguments, 1)));
    return this;
  };
  _proto.add = function add(slides, index) {
    this._C.Slides.add(slides, index);
    return this;
  };
  _proto.remove = function remove2(matcher) {
    this._C.Slides.remove(matcher);
    return this;
  };
  _proto.is = function is(type) {
    return this._o.type === type;
  };
  _proto.refresh = function refresh() {
    this.emit(EVENT_REFRESH);
    return this;
  };
  _proto.destroy = function destroy(completely) {
    if (completely === void 0) {
      completely = true;
    }
    var event = this.event, state = this.state;
    if (state.is(CREATED)) {
      EventInterface(this).on(EVENT_READY, this.destroy.bind(this, completely));
    } else {
      forOwn(this._C, function(component) {
        component.destroy && component.destroy(completely);
      }, true);
      event.emit(EVENT_DESTROY);
      event.destroy();
      completely && empty(this.splides);
      state.set(DESTROYED);
    }
    return this;
  };
  _createClass(_Splide2, [{
    key: "options",
    get: function get() {
      return this._o;
    },
    set: function set(options) {
      this._C.Media.set(options, true, true);
    }
  }, {
    key: "length",
    get: function get() {
      return this._C.Slides.getLength(true);
    }
  }, {
    key: "index",
    get: function get() {
      return this._C.Controller.getIndex();
    }
  }]);
  return _Splide2;
}();
var Splide = _Splide;
Splide.defaults = {};
Splide.STATES = STATES;

// src/js/components/Splide/Splide.tsx


// src/js/constants/events.ts
var EVENTS = [
  [EVENT_MOUNTED, "onMounted"],
  [EVENT_READY, "onReady"],
  [EVENT_MOVE, "onMove"],
  [EVENT_MOVED, "onMoved"],
  [EVENT_CLICK, "onClick"],
  [EVENT_ACTIVE, "onActive"],
  [EVENT_INACTIVE, "onInactive"],
  [EVENT_VISIBLE, "onVisible"],
  [EVENT_HIDDEN, "onHidden"],
  [EVENT_REFRESH, "onRefresh"],
  [EVENT_UPDATED, "onUpdated"],
  [EVENT_RESIZE, "onResize"],
  [EVENT_RESIZED, "onResized"],
  [EVENT_DRAG, "onDrag"],
  [EVENT_DRAGGING, "onDragging"],
  [EVENT_DRAGGED, "onDragged"],
  [EVENT_SCROLL, "onScroll"],
  [EVENT_SCROLLED, "onScrolled"],
  [EVENT_DESTROY, "onDestroy"],
  [EVENT_ARROWS_MOUNTED, "onArrowsMounted"],
  [EVENT_ARROWS_UPDATED, "onArrowsUpdated"],
  [EVENT_PAGINATION_MOUNTED, "onPaginationMounted"],
  [EVENT_PAGINATION_UPDATED, "onPaginationUpdated"],
  [EVENT_NAVIGATION_MOUNTED, "onNavigationMounted"],
  [EVENT_AUTOPLAY_PLAY, "onAutoplayPlay"],
  [EVENT_AUTOPLAY_PLAYING, "onAutoplayPlaying"],
  [EVENT_AUTOPLAY_PAUSE, "onAutoplayPause"],
  [EVENT_LAZYLOAD_LOADED, "onLazyLoadLoaded"]
];

// src/js/utils/classNames/classNames.ts
function classNames(...classes) {
  return classes.filter(Boolean).join(" ");
}

// src/js/utils/isObject/isObject.ts
function isObject2(subject) {
  return subject !== null && typeof subject === "object";
}

// src/js/utils/isEqualDeep/isEqualDeep.ts
function isEqualDeep(subject1, subject2) {
  if (Array.isArray(subject1) && Array.isArray(subject2)) {
    return subject1.length === subject2.length && !subject1.some((elm, index) => !isEqualDeep(elm, subject2[index]));
  }
  if (isObject2(subject1) && isObject2(subject2)) {
    const keys1 = Object.keys(subject1);
    const keys2 = Object.keys(subject2);
    return keys1.length === keys2.length && !keys1.some((key) => {
      return !Object.prototype.hasOwnProperty.call(subject2, key) || !isEqualDeep(subject1[key], subject2[key]);
    });
  }
  return subject1 === subject2;
}

// src/js/utils/isEqualShallow/isEqualShallow.ts
function isEqualShallow(array1, array2) {
  return array1.length === array2.length && !array1.some((elm, index) => elm !== array2[index]);
}

// src/js/utils/forOwn/forOwn.ts
function forOwn2(object, iteratee) {
  if (object) {
    const keys = Object.keys(object);
    for (let i = 0; i < keys.length; i++) {
      const key = keys[i];
      if (key !== "__proto__") {
        if (iteratee(object[key], key) === false) {
          break;
        }
      }
    }
  }
  return object;
}

// src/js/utils/merge/merge.ts
function merge2(object, source) {
  const merged = object;
  forOwn2(source, (value, key) => {
    if (Array.isArray(value)) {
      merged[key] = value.slice();
    } else if (isObject2(value)) {
      merged[key] = merge2(isObject2(merged[key]) ? merged[key] : {}, value);
    } else {
      merged[key] = value;
    }
  });
  return merged;
}

// src/js/components/SplideTrack/SplideTrack.tsx

var SplideTrack = ({ children: children2, className, ...props }) => {
  return /* @__PURE__ */ react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
    className: classNames("splide__track", className),
    ...props
  }, /* @__PURE__ */ react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
    className: "splide__list"
  }, children2));
};

// src/js/components/Splide/Splide.tsx
var Splide2 = class extends (react__WEBPACK_IMPORTED_MODULE_0___default().Component) {
  constructor() {
    super(...arguments);
    this.splideRef = react__WEBPACK_IMPORTED_MODULE_0___default().createRef();
    this.slides = [];
  }
  componentDidMount() {
    const { options, extensions, transition } = this.props;
    const { current } = this.splideRef;
    if (current) {
      this.splide = new Splide(current, options);
      this.bind(this.splide);
      this.splide.mount(extensions, transition);
      this.options = merge2({}, options || {});
      this.slides = this.getSlides();
    }
  }
  componentWillUnmount() {
    if (this.splide) {
      this.splide.destroy();
      this.splide = void 0;
    }
    this.options = void 0;
    this.slides.length = 0;
  }
  componentDidUpdate() {
    if (!this.splide) {
      return;
    }
    const { options } = this.props;
    if (options && !isEqualDeep(this.options, options)) {
      this.splide.options = options;
      this.options = merge2({}, options);
    }
    const newSlides = this.getSlides();
    if (!isEqualShallow(this.slides, newSlides)) {
      this.splide.refresh();
      this.slides = newSlides;
    }
  }
  sync(splide) {
    var _a;
    (_a = this.splide) == null ? void 0 : _a.sync(splide);
  }
  go(control) {
    var _a;
    (_a = this.splide) == null ? void 0 : _a.go(control);
  }
  getSlides() {
    var _a;
    if (this.splide) {
      const children2 = (_a = this.splide.Components.Elements) == null ? void 0 : _a.list.children;
      return children2 && Array.prototype.slice.call(children2) || [];
    }
    return [];
  }
  bind(splide) {
    EVENTS.forEach(([event, name]) => {
      const handler = this.props[name];
      if (typeof handler === "function") {
        splide.on(event, (...args) => {
          handler(splide, ...args);
        });
      }
    });
  }
  omit(props, keys) {
    keys.forEach((key) => {
      if (Object.prototype.hasOwnProperty.call(props, key)) {
        delete props[key];
      }
    });
    return props;
  }
  render() {
    const { className, tag: Root = "div", hasTrack = true, children: children2, ...props } = this.props;
    return /* @__PURE__ */ react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Root, {
      className: classNames("splide", className),
      ref: this.splideRef,
      ...this.omit(props, ["options", ...EVENTS.map((event) => event[1])])
    }, hasTrack ? /* @__PURE__ */ react__WEBPACK_IMPORTED_MODULE_0___default().createElement(SplideTrack, null, children2) : children2);
  }
};

// src/js/components/SplideSlide/SplideSlide.tsx

var SplideSlide = ({ children: children2, className, ...props }) => {
  return /* @__PURE__ */ react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
    className: classNames("splide__slide", className),
    ...props
  }, children2);
};

/*!
 * Splide.js
 * Version  : 4.1.3
 * License  : MIT
 * Copyright: 2022 Naotoshi Fujita
 */


/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/icon/index.js":
/*!******************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/icon/index.js ***!
  \******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/**
 * WordPress dependencies
 */

/** @typedef {{icon: JSX.Element, size?: number} & import('@wordpress/primitives').SVGProps} IconProps */

/**
 * Return an SVG icon.
 *
 * @param {IconProps} props icon is the SVG component to render
 *                          size is a number specifiying the icon size in pixels
 *                          Other props will be passed to wrapped SVG component
 *
 * @return {JSX.Element}  Icon component
 */

function Icon(_ref) {
  let {
    icon,
    size = 24,
    ...props
  } = _ref;
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.cloneElement)(icon, {
    width: size,
    height: size,
    ...props
  });
}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Icon);
//# sourceMappingURL=index.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/arrow-right.js":
/*!***************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/arrow-right.js ***!
  \***************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const arrowRight = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "m14.5 6.5-1 1 3.7 3.7H4v1.6h13.2l-3.7 3.7 1 1 5.6-5.5z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (arrowRight);
//# sourceMappingURL=arrow-right.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/chevron-down.js":
/*!****************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/chevron-down.js ***!
  \****************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const chevronDown = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  viewBox: "0 0 24 24",
  xmlns: "http://www.w3.org/2000/svg"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 14l4.5-3.6 1 1.2z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (chevronDown);
//# sourceMappingURL=chevron-down.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/chevron-up.js":
/*!**************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/chevron-up.js ***!
  \**************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const chevronUp = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  viewBox: "0 0 24 24",
  xmlns: "http://www.w3.org/2000/svg"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M6.5 12.4L12 8l5.5 4.4-.9 1.2L12 10l-4.5 3.6-1-1.2z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (chevronUp);
//# sourceMappingURL=chevron-up.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/close.js":
/*!*********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/close.js ***!
  \*********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const close = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M13 11.8l6.1-6.3-1-1-6.1 6.2-6.1-6.2-1 1 6.1 6.3-6.5 6.7 1 1 6.5-6.6 6.5 6.6 1-1z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (close);
//# sourceMappingURL=close.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/cloud.js":
/*!*********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/cloud.js ***!
  \*********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const cloud = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M17.3 10.1c0-2.5-2.1-4.4-4.8-4.4-2.2 0-4.1 1.4-4.6 3.3h-.2C5.7 9 4 10.7 4 12.8c0 2.1 1.7 3.8 3.7 3.8h9c1.8 0 3.2-1.5 3.2-3.3.1-1.6-1.1-2.9-2.6-3.2zm-.5 5.1h-9c-1.2 0-2.2-1.1-2.2-2.3s1-2.4 2.2-2.4h1.3l.3-1.1c.4-1.3 1.7-2.2 3.2-2.2 1.8 0 3.3 1.3 3.3 2.9v1.3l1.3.2c.8.1 1.4.9 1.4 1.8-.1 1-.9 1.8-1.8 1.8z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (cloud);
//# sourceMappingURL=cloud.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/download.js":
/*!************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/download.js ***!
  \************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const download = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M18 11.3l-1-1.1-4 4V3h-1.5v11.3L7 10.2l-1 1.1 6.2 5.8 5.8-5.8zm.5 3.7v3.5h-13V15H4v5h16v-5h-1.5z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (download);
//# sourceMappingURL=download.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/line-dotted.js":
/*!***************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/line-dotted.js ***!
  \***************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const lineDotted = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  fillRule: "evenodd",
  d: "M5.25 11.25h1.5v1.5h-1.5v-1.5zm3 0h1.5v1.5h-1.5v-1.5zm4.5 0h-1.5v1.5h1.5v-1.5zm1.5 0h1.5v1.5h-1.5v-1.5zm4.5 0h-1.5v1.5h1.5v-1.5z",
  clipRule: "evenodd"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (lineDotted);
//# sourceMappingURL=line-dotted.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/link-off.js":
/*!************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/link-off.js ***!
  \************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const linkOff = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M15.6 7.3h-.7l1.6-3.5-.9-.4-3.9 8.5H9v1.5h2l-1.3 2.8H8.4c-2 0-3.7-1.7-3.7-3.7s1.7-3.7 3.7-3.7H10V7.3H8.4c-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2H9l-1.4 3.2.9.4 5.7-12.5h1.4c2 0 3.7 1.7 3.7 3.7s-1.7 3.7-3.7 3.7H14v1.5h1.6c2.9 0 5.2-2.3 5.2-5.2 0-2.9-2.4-5.2-5.2-5.2z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (linkOff);
//# sourceMappingURL=link-off.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/link.js":
/*!********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/link.js ***!
  \********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const link = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M15.6 7.2H14v1.5h1.6c2 0 3.7 1.7 3.7 3.7s-1.7 3.7-3.7 3.7H14v1.5h1.6c2.8 0 5.2-2.3 5.2-5.2 0-2.9-2.3-5.2-5.2-5.2zM4.7 12.4c0-2 1.7-3.7 3.7-3.7H10V7.2H8.4c-2.9 0-5.2 2.3-5.2 5.2 0 2.9 2.3 5.2 5.2 5.2H10v-1.5H8.4c-2 0-3.7-1.7-3.7-3.7zm4.6.9h5.3v-1.5H9.3v1.5z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (link);
//# sourceMappingURL=link.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/menu.js":
/*!********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/menu.js ***!
  \********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const menu = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M5 5v1.5h14V5H5zm0 7.8h14v-1.5H5v1.5zM5 19h14v-1.5H5V19z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (menu);
//# sourceMappingURL=menu.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/pencil.js":
/*!**********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/pencil.js ***!
  \**********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const pencil = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M20.1 5.1L16.9 2 6.2 12.7l-1.3 4.4 4.5-1.3L20.1 5.1zM4 20.8h8v-1.5H4v1.5z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (pencil);
//# sourceMappingURL=pencil.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/plus.js":
/*!********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/plus.js ***!
  \********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const plus = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M18 11.2h-5.2V6h-1.6v5.2H6v1.6h5.2V18h1.6v-5.2H18z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (plus);
//# sourceMappingURL=plus.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/settings.js":
/*!************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/settings.js ***!
  \************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const settings = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M14.5 13.8c-1.1 0-2.1.7-2.4 1.8H4V17h8.1c.3 1 1.3 1.8 2.4 1.8s2.1-.7 2.4-1.8H20v-1.5h-3.1c-.3-1-1.3-1.7-2.4-1.7zM11.9 7c-.3-1-1.3-1.8-2.4-1.8S7.4 6 7.1 7H4v1.5h3.1c.3 1 1.3 1.8 2.4 1.8s2.1-.7 2.4-1.8H20V7h-8.1z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (settings);
//# sourceMappingURL=settings.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/styles.js":
/*!**********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/styles.js ***!
  \**********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__),
/* harmony export */   "styles": () => (/* binding */ styles)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives");
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

const styles = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.SVG, {
  viewBox: "0 0 24 24",
  xmlns: "http://www.w3.org/2000/svg"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M12 4c-4.4 0-8 3.6-8 8v.1c0 4.1 3.2 7.5 7.2 7.9h.8c4.4 0 8-3.6 8-8s-3.6-8-8-8zm0 15V5c3.9 0 7 3.1 7 7s-3.1 7-7 7z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (styles);
//# sourceMappingURL=styles.js.map

/***/ }),

/***/ "./node_modules/animejs/lib/anime.es.js":
/*!**********************************************!*\
  !*** ./node_modules/animejs/lib/anime.es.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/*
 * anime.js v3.2.1
 * (c) 2020 Julian Garnier
 * Released under the MIT license
 * animejs.com
 */

// Defaults

var defaultInstanceSettings = {
  update: null,
  begin: null,
  loopBegin: null,
  changeBegin: null,
  change: null,
  changeComplete: null,
  loopComplete: null,
  complete: null,
  loop: 1,
  direction: 'normal',
  autoplay: true,
  timelineOffset: 0
};

var defaultTweenSettings = {
  duration: 1000,
  delay: 0,
  endDelay: 0,
  easing: 'easeOutElastic(1, .5)',
  round: 0
};

var validTransforms = ['translateX', 'translateY', 'translateZ', 'rotate', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'perspective', 'matrix', 'matrix3d'];

// Caching

var cache = {
  CSS: {},
  springs: {}
};

// Utils

function minMax(val, min, max) {
  return Math.min(Math.max(val, min), max);
}

function stringContains(str, text) {
  return str.indexOf(text) > -1;
}

function applyArguments(func, args) {
  return func.apply(null, args);
}

var is = {
  arr: function (a) { return Array.isArray(a); },
  obj: function (a) { return stringContains(Object.prototype.toString.call(a), 'Object'); },
  pth: function (a) { return is.obj(a) && a.hasOwnProperty('totalLength'); },
  svg: function (a) { return a instanceof SVGElement; },
  inp: function (a) { return a instanceof HTMLInputElement; },
  dom: function (a) { return a.nodeType || is.svg(a); },
  str: function (a) { return typeof a === 'string'; },
  fnc: function (a) { return typeof a === 'function'; },
  und: function (a) { return typeof a === 'undefined'; },
  nil: function (a) { return is.und(a) || a === null; },
  hex: function (a) { return /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(a); },
  rgb: function (a) { return /^rgb/.test(a); },
  hsl: function (a) { return /^hsl/.test(a); },
  col: function (a) { return (is.hex(a) || is.rgb(a) || is.hsl(a)); },
  key: function (a) { return !defaultInstanceSettings.hasOwnProperty(a) && !defaultTweenSettings.hasOwnProperty(a) && a !== 'targets' && a !== 'keyframes'; },
};

// Easings

function parseEasingParameters(string) {
  var match = /\(([^)]+)\)/.exec(string);
  return match ? match[1].split(',').map(function (p) { return parseFloat(p); }) : [];
}

// Spring solver inspired by Webkit Copyright © 2016 Apple Inc. All rights reserved. https://webkit.org/demos/spring/spring.js

function spring(string, duration) {

  var params = parseEasingParameters(string);
  var mass = minMax(is.und(params[0]) ? 1 : params[0], .1, 100);
  var stiffness = minMax(is.und(params[1]) ? 100 : params[1], .1, 100);
  var damping = minMax(is.und(params[2]) ? 10 : params[2], .1, 100);
  var velocity =  minMax(is.und(params[3]) ? 0 : params[3], .1, 100);
  var w0 = Math.sqrt(stiffness / mass);
  var zeta = damping / (2 * Math.sqrt(stiffness * mass));
  var wd = zeta < 1 ? w0 * Math.sqrt(1 - zeta * zeta) : 0;
  var a = 1;
  var b = zeta < 1 ? (zeta * w0 + -velocity) / wd : -velocity + w0;

  function solver(t) {
    var progress = duration ? (duration * t) / 1000 : t;
    if (zeta < 1) {
      progress = Math.exp(-progress * zeta * w0) * (a * Math.cos(wd * progress) + b * Math.sin(wd * progress));
    } else {
      progress = (a + b * progress) * Math.exp(-progress * w0);
    }
    if (t === 0 || t === 1) { return t; }
    return 1 - progress;
  }

  function getDuration() {
    var cached = cache.springs[string];
    if (cached) { return cached; }
    var frame = 1/6;
    var elapsed = 0;
    var rest = 0;
    while(true) {
      elapsed += frame;
      if (solver(elapsed) === 1) {
        rest++;
        if (rest >= 16) { break; }
      } else {
        rest = 0;
      }
    }
    var duration = elapsed * frame * 1000;
    cache.springs[string] = duration;
    return duration;
  }

  return duration ? solver : getDuration;

}

// Basic steps easing implementation https://developer.mozilla.org/fr/docs/Web/CSS/transition-timing-function

function steps(steps) {
  if ( steps === void 0 ) steps = 10;

  return function (t) { return Math.ceil((minMax(t, 0.000001, 1)) * steps) * (1 / steps); };
}

// BezierEasing https://github.com/gre/bezier-easing

var bezier = (function () {

  var kSplineTableSize = 11;
  var kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);

  function A(aA1, aA2) { return 1.0 - 3.0 * aA2 + 3.0 * aA1 }
  function B(aA1, aA2) { return 3.0 * aA2 - 6.0 * aA1 }
  function C(aA1)      { return 3.0 * aA1 }

  function calcBezier(aT, aA1, aA2) { return ((A(aA1, aA2) * aT + B(aA1, aA2)) * aT + C(aA1)) * aT }
  function getSlope(aT, aA1, aA2) { return 3.0 * A(aA1, aA2) * aT * aT + 2.0 * B(aA1, aA2) * aT + C(aA1) }

  function binarySubdivide(aX, aA, aB, mX1, mX2) {
    var currentX, currentT, i = 0;
    do {
      currentT = aA + (aB - aA) / 2.0;
      currentX = calcBezier(currentT, mX1, mX2) - aX;
      if (currentX > 0.0) { aB = currentT; } else { aA = currentT; }
    } while (Math.abs(currentX) > 0.0000001 && ++i < 10);
    return currentT;
  }

  function newtonRaphsonIterate(aX, aGuessT, mX1, mX2) {
    for (var i = 0; i < 4; ++i) {
      var currentSlope = getSlope(aGuessT, mX1, mX2);
      if (currentSlope === 0.0) { return aGuessT; }
      var currentX = calcBezier(aGuessT, mX1, mX2) - aX;
      aGuessT -= currentX / currentSlope;
    }
    return aGuessT;
  }

  function bezier(mX1, mY1, mX2, mY2) {

    if (!(0 <= mX1 && mX1 <= 1 && 0 <= mX2 && mX2 <= 1)) { return; }
    var sampleValues = new Float32Array(kSplineTableSize);

    if (mX1 !== mY1 || mX2 !== mY2) {
      for (var i = 0; i < kSplineTableSize; ++i) {
        sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);
      }
    }

    function getTForX(aX) {

      var intervalStart = 0;
      var currentSample = 1;
      var lastSample = kSplineTableSize - 1;

      for (; currentSample !== lastSample && sampleValues[currentSample] <= aX; ++currentSample) {
        intervalStart += kSampleStepSize;
      }

      --currentSample;

      var dist = (aX - sampleValues[currentSample]) / (sampleValues[currentSample + 1] - sampleValues[currentSample]);
      var guessForT = intervalStart + dist * kSampleStepSize;
      var initialSlope = getSlope(guessForT, mX1, mX2);

      if (initialSlope >= 0.001) {
        return newtonRaphsonIterate(aX, guessForT, mX1, mX2);
      } else if (initialSlope === 0.0) {
        return guessForT;
      } else {
        return binarySubdivide(aX, intervalStart, intervalStart + kSampleStepSize, mX1, mX2);
      }

    }

    return function (x) {
      if (mX1 === mY1 && mX2 === mY2) { return x; }
      if (x === 0 || x === 1) { return x; }
      return calcBezier(getTForX(x), mY1, mY2);
    }

  }

  return bezier;

})();

var penner = (function () {

  // Based on jQuery UI's implemenation of easing equations from Robert Penner (http://www.robertpenner.com/easing)

  var eases = { linear: function () { return function (t) { return t; }; } };

  var functionEasings = {
    Sine: function () { return function (t) { return 1 - Math.cos(t * Math.PI / 2); }; },
    Circ: function () { return function (t) { return 1 - Math.sqrt(1 - t * t); }; },
    Back: function () { return function (t) { return t * t * (3 * t - 2); }; },
    Bounce: function () { return function (t) {
      var pow2, b = 4;
      while (t < (( pow2 = Math.pow(2, --b)) - 1) / 11) {}
      return 1 / Math.pow(4, 3 - b) - 7.5625 * Math.pow(( pow2 * 3 - 2 ) / 22 - t, 2)
    }; },
    Elastic: function (amplitude, period) {
      if ( amplitude === void 0 ) amplitude = 1;
      if ( period === void 0 ) period = .5;

      var a = minMax(amplitude, 1, 10);
      var p = minMax(period, .1, 2);
      return function (t) {
        return (t === 0 || t === 1) ? t : 
          -a * Math.pow(2, 10 * (t - 1)) * Math.sin((((t - 1) - (p / (Math.PI * 2) * Math.asin(1 / a))) * (Math.PI * 2)) / p);
      }
    }
  };

  var baseEasings = ['Quad', 'Cubic', 'Quart', 'Quint', 'Expo'];

  baseEasings.forEach(function (name, i) {
    functionEasings[name] = function () { return function (t) { return Math.pow(t, i + 2); }; };
  });

  Object.keys(functionEasings).forEach(function (name) {
    var easeIn = functionEasings[name];
    eases['easeIn' + name] = easeIn;
    eases['easeOut' + name] = function (a, b) { return function (t) { return 1 - easeIn(a, b)(1 - t); }; };
    eases['easeInOut' + name] = function (a, b) { return function (t) { return t < 0.5 ? easeIn(a, b)(t * 2) / 2 : 
      1 - easeIn(a, b)(t * -2 + 2) / 2; }; };
    eases['easeOutIn' + name] = function (a, b) { return function (t) { return t < 0.5 ? (1 - easeIn(a, b)(1 - t * 2)) / 2 : 
      (easeIn(a, b)(t * 2 - 1) + 1) / 2; }; };
  });

  return eases;

})();

function parseEasings(easing, duration) {
  if (is.fnc(easing)) { return easing; }
  var name = easing.split('(')[0];
  var ease = penner[name];
  var args = parseEasingParameters(easing);
  switch (name) {
    case 'spring' : return spring(easing, duration);
    case 'cubicBezier' : return applyArguments(bezier, args);
    case 'steps' : return applyArguments(steps, args);
    default : return applyArguments(ease, args);
  }
}

// Strings

function selectString(str) {
  try {
    var nodes = document.querySelectorAll(str);
    return nodes;
  } catch(e) {
    return;
  }
}

// Arrays

function filterArray(arr, callback) {
  var len = arr.length;
  var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  var result = [];
  for (var i = 0; i < len; i++) {
    if (i in arr) {
      var val = arr[i];
      if (callback.call(thisArg, val, i, arr)) {
        result.push(val);
      }
    }
  }
  return result;
}

function flattenArray(arr) {
  return arr.reduce(function (a, b) { return a.concat(is.arr(b) ? flattenArray(b) : b); }, []);
}

function toArray(o) {
  if (is.arr(o)) { return o; }
  if (is.str(o)) { o = selectString(o) || o; }
  if (o instanceof NodeList || o instanceof HTMLCollection) { return [].slice.call(o); }
  return [o];
}

function arrayContains(arr, val) {
  return arr.some(function (a) { return a === val; });
}

// Objects

function cloneObject(o) {
  var clone = {};
  for (var p in o) { clone[p] = o[p]; }
  return clone;
}

function replaceObjectProps(o1, o2) {
  var o = cloneObject(o1);
  for (var p in o1) { o[p] = o2.hasOwnProperty(p) ? o2[p] : o1[p]; }
  return o;
}

function mergeObjects(o1, o2) {
  var o = cloneObject(o1);
  for (var p in o2) { o[p] = is.und(o1[p]) ? o2[p] : o1[p]; }
  return o;
}

// Colors

function rgbToRgba(rgbValue) {
  var rgb = /rgb\((\d+,\s*[\d]+,\s*[\d]+)\)/g.exec(rgbValue);
  return rgb ? ("rgba(" + (rgb[1]) + ",1)") : rgbValue;
}

function hexToRgba(hexValue) {
  var rgx = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
  var hex = hexValue.replace(rgx, function (m, r, g, b) { return r + r + g + g + b + b; } );
  var rgb = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
  var r = parseInt(rgb[1], 16);
  var g = parseInt(rgb[2], 16);
  var b = parseInt(rgb[3], 16);
  return ("rgba(" + r + "," + g + "," + b + ",1)");
}

function hslToRgba(hslValue) {
  var hsl = /hsl\((\d+),\s*([\d.]+)%,\s*([\d.]+)%\)/g.exec(hslValue) || /hsla\((\d+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)/g.exec(hslValue);
  var h = parseInt(hsl[1], 10) / 360;
  var s = parseInt(hsl[2], 10) / 100;
  var l = parseInt(hsl[3], 10) / 100;
  var a = hsl[4] || 1;
  function hue2rgb(p, q, t) {
    if (t < 0) { t += 1; }
    if (t > 1) { t -= 1; }
    if (t < 1/6) { return p + (q - p) * 6 * t; }
    if (t < 1/2) { return q; }
    if (t < 2/3) { return p + (q - p) * (2/3 - t) * 6; }
    return p;
  }
  var r, g, b;
  if (s == 0) {
    r = g = b = l;
  } else {
    var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
    var p = 2 * l - q;
    r = hue2rgb(p, q, h + 1/3);
    g = hue2rgb(p, q, h);
    b = hue2rgb(p, q, h - 1/3);
  }
  return ("rgba(" + (r * 255) + "," + (g * 255) + "," + (b * 255) + "," + a + ")");
}

function colorToRgb(val) {
  if (is.rgb(val)) { return rgbToRgba(val); }
  if (is.hex(val)) { return hexToRgba(val); }
  if (is.hsl(val)) { return hslToRgba(val); }
}

// Units

function getUnit(val) {
  var split = /[+-]?\d*\.?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?(%|px|pt|em|rem|in|cm|mm|ex|ch|pc|vw|vh|vmin|vmax|deg|rad|turn)?$/.exec(val);
  if (split) { return split[1]; }
}

function getTransformUnit(propName) {
  if (stringContains(propName, 'translate') || propName === 'perspective') { return 'px'; }
  if (stringContains(propName, 'rotate') || stringContains(propName, 'skew')) { return 'deg'; }
}

// Values

function getFunctionValue(val, animatable) {
  if (!is.fnc(val)) { return val; }
  return val(animatable.target, animatable.id, animatable.total);
}

function getAttribute(el, prop) {
  return el.getAttribute(prop);
}

function convertPxToUnit(el, value, unit) {
  var valueUnit = getUnit(value);
  if (arrayContains([unit, 'deg', 'rad', 'turn'], valueUnit)) { return value; }
  var cached = cache.CSS[value + unit];
  if (!is.und(cached)) { return cached; }
  var baseline = 100;
  var tempEl = document.createElement(el.tagName);
  var parentEl = (el.parentNode && (el.parentNode !== document)) ? el.parentNode : document.body;
  parentEl.appendChild(tempEl);
  tempEl.style.position = 'absolute';
  tempEl.style.width = baseline + unit;
  var factor = baseline / tempEl.offsetWidth;
  parentEl.removeChild(tempEl);
  var convertedUnit = factor * parseFloat(value);
  cache.CSS[value + unit] = convertedUnit;
  return convertedUnit;
}

function getCSSValue(el, prop, unit) {
  if (prop in el.style) {
    var uppercasePropName = prop.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
    var value = el.style[prop] || getComputedStyle(el).getPropertyValue(uppercasePropName) || '0';
    return unit ? convertPxToUnit(el, value, unit) : value;
  }
}

function getAnimationType(el, prop) {
  if (is.dom(el) && !is.inp(el) && (!is.nil(getAttribute(el, prop)) || (is.svg(el) && el[prop]))) { return 'attribute'; }
  if (is.dom(el) && arrayContains(validTransforms, prop)) { return 'transform'; }
  if (is.dom(el) && (prop !== 'transform' && getCSSValue(el, prop))) { return 'css'; }
  if (el[prop] != null) { return 'object'; }
}

function getElementTransforms(el) {
  if (!is.dom(el)) { return; }
  var str = el.style.transform || '';
  var reg  = /(\w+)\(([^)]*)\)/g;
  var transforms = new Map();
  var m; while (m = reg.exec(str)) { transforms.set(m[1], m[2]); }
  return transforms;
}

function getTransformValue(el, propName, animatable, unit) {
  var defaultVal = stringContains(propName, 'scale') ? 1 : 0 + getTransformUnit(propName);
  var value = getElementTransforms(el).get(propName) || defaultVal;
  if (animatable) {
    animatable.transforms.list.set(propName, value);
    animatable.transforms['last'] = propName;
  }
  return unit ? convertPxToUnit(el, value, unit) : value;
}

function getOriginalTargetValue(target, propName, unit, animatable) {
  switch (getAnimationType(target, propName)) {
    case 'transform': return getTransformValue(target, propName, animatable, unit);
    case 'css': return getCSSValue(target, propName, unit);
    case 'attribute': return getAttribute(target, propName);
    default: return target[propName] || 0;
  }
}

function getRelativeValue(to, from) {
  var operator = /^(\*=|\+=|-=)/.exec(to);
  if (!operator) { return to; }
  var u = getUnit(to) || 0;
  var x = parseFloat(from);
  var y = parseFloat(to.replace(operator[0], ''));
  switch (operator[0][0]) {
    case '+': return x + y + u;
    case '-': return x - y + u;
    case '*': return x * y + u;
  }
}

function validateValue(val, unit) {
  if (is.col(val)) { return colorToRgb(val); }
  if (/\s/g.test(val)) { return val; }
  var originalUnit = getUnit(val);
  var unitLess = originalUnit ? val.substr(0, val.length - originalUnit.length) : val;
  if (unit) { return unitLess + unit; }
  return unitLess;
}

// getTotalLength() equivalent for circle, rect, polyline, polygon and line shapes
// adapted from https://gist.github.com/SebLambla/3e0550c496c236709744

function getDistance(p1, p2) {
  return Math.sqrt(Math.pow(p2.x - p1.x, 2) + Math.pow(p2.y - p1.y, 2));
}

function getCircleLength(el) {
  return Math.PI * 2 * getAttribute(el, 'r');
}

function getRectLength(el) {
  return (getAttribute(el, 'width') * 2) + (getAttribute(el, 'height') * 2);
}

function getLineLength(el) {
  return getDistance(
    {x: getAttribute(el, 'x1'), y: getAttribute(el, 'y1')}, 
    {x: getAttribute(el, 'x2'), y: getAttribute(el, 'y2')}
  );
}

function getPolylineLength(el) {
  var points = el.points;
  var totalLength = 0;
  var previousPos;
  for (var i = 0 ; i < points.numberOfItems; i++) {
    var currentPos = points.getItem(i);
    if (i > 0) { totalLength += getDistance(previousPos, currentPos); }
    previousPos = currentPos;
  }
  return totalLength;
}

function getPolygonLength(el) {
  var points = el.points;
  return getPolylineLength(el) + getDistance(points.getItem(points.numberOfItems - 1), points.getItem(0));
}

// Path animation

function getTotalLength(el) {
  if (el.getTotalLength) { return el.getTotalLength(); }
  switch(el.tagName.toLowerCase()) {
    case 'circle': return getCircleLength(el);
    case 'rect': return getRectLength(el);
    case 'line': return getLineLength(el);
    case 'polyline': return getPolylineLength(el);
    case 'polygon': return getPolygonLength(el);
  }
}

function setDashoffset(el) {
  var pathLength = getTotalLength(el);
  el.setAttribute('stroke-dasharray', pathLength);
  return pathLength;
}

// Motion path

function getParentSvgEl(el) {
  var parentEl = el.parentNode;
  while (is.svg(parentEl)) {
    if (!is.svg(parentEl.parentNode)) { break; }
    parentEl = parentEl.parentNode;
  }
  return parentEl;
}

function getParentSvg(pathEl, svgData) {
  var svg = svgData || {};
  var parentSvgEl = svg.el || getParentSvgEl(pathEl);
  var rect = parentSvgEl.getBoundingClientRect();
  var viewBoxAttr = getAttribute(parentSvgEl, 'viewBox');
  var width = rect.width;
  var height = rect.height;
  var viewBox = svg.viewBox || (viewBoxAttr ? viewBoxAttr.split(' ') : [0, 0, width, height]);
  return {
    el: parentSvgEl,
    viewBox: viewBox,
    x: viewBox[0] / 1,
    y: viewBox[1] / 1,
    w: width,
    h: height,
    vW: viewBox[2],
    vH: viewBox[3]
  }
}

function getPath(path, percent) {
  var pathEl = is.str(path) ? selectString(path)[0] : path;
  var p = percent || 100;
  return function(property) {
    return {
      property: property,
      el: pathEl,
      svg: getParentSvg(pathEl),
      totalLength: getTotalLength(pathEl) * (p / 100)
    }
  }
}

function getPathProgress(path, progress, isPathTargetInsideSVG) {
  function point(offset) {
    if ( offset === void 0 ) offset = 0;

    var l = progress + offset >= 1 ? progress + offset : 0;
    return path.el.getPointAtLength(l);
  }
  var svg = getParentSvg(path.el, path.svg);
  var p = point();
  var p0 = point(-1);
  var p1 = point(+1);
  var scaleX = isPathTargetInsideSVG ? 1 : svg.w / svg.vW;
  var scaleY = isPathTargetInsideSVG ? 1 : svg.h / svg.vH;
  switch (path.property) {
    case 'x': return (p.x - svg.x) * scaleX;
    case 'y': return (p.y - svg.y) * scaleY;
    case 'angle': return Math.atan2(p1.y - p0.y, p1.x - p0.x) * 180 / Math.PI;
  }
}

// Decompose value

function decomposeValue(val, unit) {
  // const rgx = /-?\d*\.?\d+/g; // handles basic numbers
  // const rgx = /[+-]?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?/g; // handles exponents notation
  var rgx = /[+-]?\d*\.?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?/g; // handles exponents notation
  var value = validateValue((is.pth(val) ? val.totalLength : val), unit) + '';
  return {
    original: value,
    numbers: value.match(rgx) ? value.match(rgx).map(Number) : [0],
    strings: (is.str(val) || unit) ? value.split(rgx) : []
  }
}

// Animatables

function parseTargets(targets) {
  var targetsArray = targets ? (flattenArray(is.arr(targets) ? targets.map(toArray) : toArray(targets))) : [];
  return filterArray(targetsArray, function (item, pos, self) { return self.indexOf(item) === pos; });
}

function getAnimatables(targets) {
  var parsed = parseTargets(targets);
  return parsed.map(function (t, i) {
    return {target: t, id: i, total: parsed.length, transforms: { list: getElementTransforms(t) } };
  });
}

// Properties

function normalizePropertyTweens(prop, tweenSettings) {
  var settings = cloneObject(tweenSettings);
  // Override duration if easing is a spring
  if (/^spring/.test(settings.easing)) { settings.duration = spring(settings.easing); }
  if (is.arr(prop)) {
    var l = prop.length;
    var isFromTo = (l === 2 && !is.obj(prop[0]));
    if (!isFromTo) {
      // Duration divided by the number of tweens
      if (!is.fnc(tweenSettings.duration)) { settings.duration = tweenSettings.duration / l; }
    } else {
      // Transform [from, to] values shorthand to a valid tween value
      prop = {value: prop};
    }
  }
  var propArray = is.arr(prop) ? prop : [prop];
  return propArray.map(function (v, i) {
    var obj = (is.obj(v) && !is.pth(v)) ? v : {value: v};
    // Default delay value should only be applied to the first tween
    if (is.und(obj.delay)) { obj.delay = !i ? tweenSettings.delay : 0; }
    // Default endDelay value should only be applied to the last tween
    if (is.und(obj.endDelay)) { obj.endDelay = i === propArray.length - 1 ? tweenSettings.endDelay : 0; }
    return obj;
  }).map(function (k) { return mergeObjects(k, settings); });
}


function flattenKeyframes(keyframes) {
  var propertyNames = filterArray(flattenArray(keyframes.map(function (key) { return Object.keys(key); })), function (p) { return is.key(p); })
  .reduce(function (a,b) { if (a.indexOf(b) < 0) { a.push(b); } return a; }, []);
  var properties = {};
  var loop = function ( i ) {
    var propName = propertyNames[i];
    properties[propName] = keyframes.map(function (key) {
      var newKey = {};
      for (var p in key) {
        if (is.key(p)) {
          if (p == propName) { newKey.value = key[p]; }
        } else {
          newKey[p] = key[p];
        }
      }
      return newKey;
    });
  };

  for (var i = 0; i < propertyNames.length; i++) loop( i );
  return properties;
}

function getProperties(tweenSettings, params) {
  var properties = [];
  var keyframes = params.keyframes;
  if (keyframes) { params = mergeObjects(flattenKeyframes(keyframes), params); }
  for (var p in params) {
    if (is.key(p)) {
      properties.push({
        name: p,
        tweens: normalizePropertyTweens(params[p], tweenSettings)
      });
    }
  }
  return properties;
}

// Tweens

function normalizeTweenValues(tween, animatable) {
  var t = {};
  for (var p in tween) {
    var value = getFunctionValue(tween[p], animatable);
    if (is.arr(value)) {
      value = value.map(function (v) { return getFunctionValue(v, animatable); });
      if (value.length === 1) { value = value[0]; }
    }
    t[p] = value;
  }
  t.duration = parseFloat(t.duration);
  t.delay = parseFloat(t.delay);
  return t;
}

function normalizeTweens(prop, animatable) {
  var previousTween;
  return prop.tweens.map(function (t) {
    var tween = normalizeTweenValues(t, animatable);
    var tweenValue = tween.value;
    var to = is.arr(tweenValue) ? tweenValue[1] : tweenValue;
    var toUnit = getUnit(to);
    var originalValue = getOriginalTargetValue(animatable.target, prop.name, toUnit, animatable);
    var previousValue = previousTween ? previousTween.to.original : originalValue;
    var from = is.arr(tweenValue) ? tweenValue[0] : previousValue;
    var fromUnit = getUnit(from) || getUnit(originalValue);
    var unit = toUnit || fromUnit;
    if (is.und(to)) { to = previousValue; }
    tween.from = decomposeValue(from, unit);
    tween.to = decomposeValue(getRelativeValue(to, from), unit);
    tween.start = previousTween ? previousTween.end : 0;
    tween.end = tween.start + tween.delay + tween.duration + tween.endDelay;
    tween.easing = parseEasings(tween.easing, tween.duration);
    tween.isPath = is.pth(tweenValue);
    tween.isPathTargetInsideSVG = tween.isPath && is.svg(animatable.target);
    tween.isColor = is.col(tween.from.original);
    if (tween.isColor) { tween.round = 1; }
    previousTween = tween;
    return tween;
  });
}

// Tween progress

var setProgressValue = {
  css: function (t, p, v) { return t.style[p] = v; },
  attribute: function (t, p, v) { return t.setAttribute(p, v); },
  object: function (t, p, v) { return t[p] = v; },
  transform: function (t, p, v, transforms, manual) {
    transforms.list.set(p, v);
    if (p === transforms.last || manual) {
      var str = '';
      transforms.list.forEach(function (value, prop) { str += prop + "(" + value + ") "; });
      t.style.transform = str;
    }
  }
};

// Set Value helper

function setTargetsValue(targets, properties) {
  var animatables = getAnimatables(targets);
  animatables.forEach(function (animatable) {
    for (var property in properties) {
      var value = getFunctionValue(properties[property], animatable);
      var target = animatable.target;
      var valueUnit = getUnit(value);
      var originalValue = getOriginalTargetValue(target, property, valueUnit, animatable);
      var unit = valueUnit || getUnit(originalValue);
      var to = getRelativeValue(validateValue(value, unit), originalValue);
      var animType = getAnimationType(target, property);
      setProgressValue[animType](target, property, to, animatable.transforms, true);
    }
  });
}

// Animations

function createAnimation(animatable, prop) {
  var animType = getAnimationType(animatable.target, prop.name);
  if (animType) {
    var tweens = normalizeTweens(prop, animatable);
    var lastTween = tweens[tweens.length - 1];
    return {
      type: animType,
      property: prop.name,
      animatable: animatable,
      tweens: tweens,
      duration: lastTween.end,
      delay: tweens[0].delay,
      endDelay: lastTween.endDelay
    }
  }
}

function getAnimations(animatables, properties) {
  return filterArray(flattenArray(animatables.map(function (animatable) {
    return properties.map(function (prop) {
      return createAnimation(animatable, prop);
    });
  })), function (a) { return !is.und(a); });
}

// Create Instance

function getInstanceTimings(animations, tweenSettings) {
  var animLength = animations.length;
  var getTlOffset = function (anim) { return anim.timelineOffset ? anim.timelineOffset : 0; };
  var timings = {};
  timings.duration = animLength ? Math.max.apply(Math, animations.map(function (anim) { return getTlOffset(anim) + anim.duration; })) : tweenSettings.duration;
  timings.delay = animLength ? Math.min.apply(Math, animations.map(function (anim) { return getTlOffset(anim) + anim.delay; })) : tweenSettings.delay;
  timings.endDelay = animLength ? timings.duration - Math.max.apply(Math, animations.map(function (anim) { return getTlOffset(anim) + anim.duration - anim.endDelay; })) : tweenSettings.endDelay;
  return timings;
}

var instanceID = 0;

function createNewInstance(params) {
  var instanceSettings = replaceObjectProps(defaultInstanceSettings, params);
  var tweenSettings = replaceObjectProps(defaultTweenSettings, params);
  var properties = getProperties(tweenSettings, params);
  var animatables = getAnimatables(params.targets);
  var animations = getAnimations(animatables, properties);
  var timings = getInstanceTimings(animations, tweenSettings);
  var id = instanceID;
  instanceID++;
  return mergeObjects(instanceSettings, {
    id: id,
    children: [],
    animatables: animatables,
    animations: animations,
    duration: timings.duration,
    delay: timings.delay,
    endDelay: timings.endDelay
  });
}

// Core

var activeInstances = [];

var engine = (function () {
  var raf;

  function play() {
    if (!raf && (!isDocumentHidden() || !anime.suspendWhenDocumentHidden) && activeInstances.length > 0) {
      raf = requestAnimationFrame(step);
    }
  }
  function step(t) {
    // memo on algorithm issue:
    // dangerous iteration over mutable `activeInstances`
    // (that collection may be updated from within callbacks of `tick`-ed animation instances)
    var activeInstancesLength = activeInstances.length;
    var i = 0;
    while (i < activeInstancesLength) {
      var activeInstance = activeInstances[i];
      if (!activeInstance.paused) {
        activeInstance.tick(t);
        i++;
      } else {
        activeInstances.splice(i, 1);
        activeInstancesLength--;
      }
    }
    raf = i > 0 ? requestAnimationFrame(step) : undefined;
  }

  function handleVisibilityChange() {
    if (!anime.suspendWhenDocumentHidden) { return; }

    if (isDocumentHidden()) {
      // suspend ticks
      raf = cancelAnimationFrame(raf);
    } else { // is back to active tab
      // first adjust animations to consider the time that ticks were suspended
      activeInstances.forEach(
        function (instance) { return instance ._onDocumentVisibility(); }
      );
      engine();
    }
  }
  if (typeof document !== 'undefined') {
    document.addEventListener('visibilitychange', handleVisibilityChange);
  }

  return play;
})();

function isDocumentHidden() {
  return !!document && document.hidden;
}

// Public Instance

function anime(params) {
  if ( params === void 0 ) params = {};


  var startTime = 0, lastTime = 0, now = 0;
  var children, childrenLength = 0;
  var resolve = null;

  function makePromise(instance) {
    var promise = window.Promise && new Promise(function (_resolve) { return resolve = _resolve; });
    instance.finished = promise;
    return promise;
  }

  var instance = createNewInstance(params);
  var promise = makePromise(instance);

  function toggleInstanceDirection() {
    var direction = instance.direction;
    if (direction !== 'alternate') {
      instance.direction = direction !== 'normal' ? 'normal' : 'reverse';
    }
    instance.reversed = !instance.reversed;
    children.forEach(function (child) { return child.reversed = instance.reversed; });
  }

  function adjustTime(time) {
    return instance.reversed ? instance.duration - time : time;
  }

  function resetTime() {
    startTime = 0;
    lastTime = adjustTime(instance.currentTime) * (1 / anime.speed);
  }

  function seekChild(time, child) {
    if (child) { child.seek(time - child.timelineOffset); }
  }

  function syncInstanceChildren(time) {
    if (!instance.reversePlayback) {
      for (var i = 0; i < childrenLength; i++) { seekChild(time, children[i]); }
    } else {
      for (var i$1 = childrenLength; i$1--;) { seekChild(time, children[i$1]); }
    }
  }

  function setAnimationsProgress(insTime) {
    var i = 0;
    var animations = instance.animations;
    var animationsLength = animations.length;
    while (i < animationsLength) {
      var anim = animations[i];
      var animatable = anim.animatable;
      var tweens = anim.tweens;
      var tweenLength = tweens.length - 1;
      var tween = tweens[tweenLength];
      // Only check for keyframes if there is more than one tween
      if (tweenLength) { tween = filterArray(tweens, function (t) { return (insTime < t.end); })[0] || tween; }
      var elapsed = minMax(insTime - tween.start - tween.delay, 0, tween.duration) / tween.duration;
      var eased = isNaN(elapsed) ? 1 : tween.easing(elapsed);
      var strings = tween.to.strings;
      var round = tween.round;
      var numbers = [];
      var toNumbersLength = tween.to.numbers.length;
      var progress = (void 0);
      for (var n = 0; n < toNumbersLength; n++) {
        var value = (void 0);
        var toNumber = tween.to.numbers[n];
        var fromNumber = tween.from.numbers[n] || 0;
        if (!tween.isPath) {
          value = fromNumber + (eased * (toNumber - fromNumber));
        } else {
          value = getPathProgress(tween.value, eased * toNumber, tween.isPathTargetInsideSVG);
        }
        if (round) {
          if (!(tween.isColor && n > 2)) {
            value = Math.round(value * round) / round;
          }
        }
        numbers.push(value);
      }
      // Manual Array.reduce for better performances
      var stringsLength = strings.length;
      if (!stringsLength) {
        progress = numbers[0];
      } else {
        progress = strings[0];
        for (var s = 0; s < stringsLength; s++) {
          var a = strings[s];
          var b = strings[s + 1];
          var n$1 = numbers[s];
          if (!isNaN(n$1)) {
            if (!b) {
              progress += n$1 + ' ';
            } else {
              progress += n$1 + b;
            }
          }
        }
      }
      setProgressValue[anim.type](animatable.target, anim.property, progress, animatable.transforms);
      anim.currentValue = progress;
      i++;
    }
  }

  function setCallback(cb) {
    if (instance[cb] && !instance.passThrough) { instance[cb](instance); }
  }

  function countIteration() {
    if (instance.remaining && instance.remaining !== true) {
      instance.remaining--;
    }
  }

  function setInstanceProgress(engineTime) {
    var insDuration = instance.duration;
    var insDelay = instance.delay;
    var insEndDelay = insDuration - instance.endDelay;
    var insTime = adjustTime(engineTime);
    instance.progress = minMax((insTime / insDuration) * 100, 0, 100);
    instance.reversePlayback = insTime < instance.currentTime;
    if (children) { syncInstanceChildren(insTime); }
    if (!instance.began && instance.currentTime > 0) {
      instance.began = true;
      setCallback('begin');
    }
    if (!instance.loopBegan && instance.currentTime > 0) {
      instance.loopBegan = true;
      setCallback('loopBegin');
    }
    if (insTime <= insDelay && instance.currentTime !== 0) {
      setAnimationsProgress(0);
    }
    if ((insTime >= insEndDelay && instance.currentTime !== insDuration) || !insDuration) {
      setAnimationsProgress(insDuration);
    }
    if (insTime > insDelay && insTime < insEndDelay) {
      if (!instance.changeBegan) {
        instance.changeBegan = true;
        instance.changeCompleted = false;
        setCallback('changeBegin');
      }
      setCallback('change');
      setAnimationsProgress(insTime);
    } else {
      if (instance.changeBegan) {
        instance.changeCompleted = true;
        instance.changeBegan = false;
        setCallback('changeComplete');
      }
    }
    instance.currentTime = minMax(insTime, 0, insDuration);
    if (instance.began) { setCallback('update'); }
    if (engineTime >= insDuration) {
      lastTime = 0;
      countIteration();
      if (!instance.remaining) {
        instance.paused = true;
        if (!instance.completed) {
          instance.completed = true;
          setCallback('loopComplete');
          setCallback('complete');
          if (!instance.passThrough && 'Promise' in window) {
            resolve();
            promise = makePromise(instance);
          }
        }
      } else {
        startTime = now;
        setCallback('loopComplete');
        instance.loopBegan = false;
        if (instance.direction === 'alternate') {
          toggleInstanceDirection();
        }
      }
    }
  }

  instance.reset = function() {
    var direction = instance.direction;
    instance.passThrough = false;
    instance.currentTime = 0;
    instance.progress = 0;
    instance.paused = true;
    instance.began = false;
    instance.loopBegan = false;
    instance.changeBegan = false;
    instance.completed = false;
    instance.changeCompleted = false;
    instance.reversePlayback = false;
    instance.reversed = direction === 'reverse';
    instance.remaining = instance.loop;
    children = instance.children;
    childrenLength = children.length;
    for (var i = childrenLength; i--;) { instance.children[i].reset(); }
    if (instance.reversed && instance.loop !== true || (direction === 'alternate' && instance.loop === 1)) { instance.remaining++; }
    setAnimationsProgress(instance.reversed ? instance.duration : 0);
  };

  // internal method (for engine) to adjust animation timings before restoring engine ticks (rAF)
  instance._onDocumentVisibility = resetTime;

  // Set Value helper

  instance.set = function(targets, properties) {
    setTargetsValue(targets, properties);
    return instance;
  };

  instance.tick = function(t) {
    now = t;
    if (!startTime) { startTime = now; }
    setInstanceProgress((now + (lastTime - startTime)) * anime.speed);
  };

  instance.seek = function(time) {
    setInstanceProgress(adjustTime(time));
  };

  instance.pause = function() {
    instance.paused = true;
    resetTime();
  };

  instance.play = function() {
    if (!instance.paused) { return; }
    if (instance.completed) { instance.reset(); }
    instance.paused = false;
    activeInstances.push(instance);
    resetTime();
    engine();
  };

  instance.reverse = function() {
    toggleInstanceDirection();
    instance.completed = instance.reversed ? false : true;
    resetTime();
  };

  instance.restart = function() {
    instance.reset();
    instance.play();
  };

  instance.remove = function(targets) {
    var targetsArray = parseTargets(targets);
    removeTargetsFromInstance(targetsArray, instance);
  };

  instance.reset();

  if (instance.autoplay) { instance.play(); }

  return instance;

}

// Remove targets from animation

function removeTargetsFromAnimations(targetsArray, animations) {
  for (var a = animations.length; a--;) {
    if (arrayContains(targetsArray, animations[a].animatable.target)) {
      animations.splice(a, 1);
    }
  }
}

function removeTargetsFromInstance(targetsArray, instance) {
  var animations = instance.animations;
  var children = instance.children;
  removeTargetsFromAnimations(targetsArray, animations);
  for (var c = children.length; c--;) {
    var child = children[c];
    var childAnimations = child.animations;
    removeTargetsFromAnimations(targetsArray, childAnimations);
    if (!childAnimations.length && !child.children.length) { children.splice(c, 1); }
  }
  if (!animations.length && !children.length) { instance.pause(); }
}

function removeTargetsFromActiveInstances(targets) {
  var targetsArray = parseTargets(targets);
  for (var i = activeInstances.length; i--;) {
    var instance = activeInstances[i];
    removeTargetsFromInstance(targetsArray, instance);
  }
}

// Stagger helpers

function stagger(val, params) {
  if ( params === void 0 ) params = {};

  var direction = params.direction || 'normal';
  var easing = params.easing ? parseEasings(params.easing) : null;
  var grid = params.grid;
  var axis = params.axis;
  var fromIndex = params.from || 0;
  var fromFirst = fromIndex === 'first';
  var fromCenter = fromIndex === 'center';
  var fromLast = fromIndex === 'last';
  var isRange = is.arr(val);
  var val1 = isRange ? parseFloat(val[0]) : parseFloat(val);
  var val2 = isRange ? parseFloat(val[1]) : 0;
  var unit = getUnit(isRange ? val[1] : val) || 0;
  var start = params.start || 0 + (isRange ? val1 : 0);
  var values = [];
  var maxValue = 0;
  return function (el, i, t) {
    if (fromFirst) { fromIndex = 0; }
    if (fromCenter) { fromIndex = (t - 1) / 2; }
    if (fromLast) { fromIndex = t - 1; }
    if (!values.length) {
      for (var index = 0; index < t; index++) {
        if (!grid) {
          values.push(Math.abs(fromIndex - index));
        } else {
          var fromX = !fromCenter ? fromIndex%grid[0] : (grid[0]-1)/2;
          var fromY = !fromCenter ? Math.floor(fromIndex/grid[0]) : (grid[1]-1)/2;
          var toX = index%grid[0];
          var toY = Math.floor(index/grid[0]);
          var distanceX = fromX - toX;
          var distanceY = fromY - toY;
          var value = Math.sqrt(distanceX * distanceX + distanceY * distanceY);
          if (axis === 'x') { value = -distanceX; }
          if (axis === 'y') { value = -distanceY; }
          values.push(value);
        }
        maxValue = Math.max.apply(Math, values);
      }
      if (easing) { values = values.map(function (val) { return easing(val / maxValue) * maxValue; }); }
      if (direction === 'reverse') { values = values.map(function (val) { return axis ? (val < 0) ? val * -1 : -val : Math.abs(maxValue - val); }); }
    }
    var spacing = isRange ? (val2 - val1) / maxValue : val1;
    return start + (spacing * (Math.round(values[i] * 100) / 100)) + unit;
  }
}

// Timeline

function timeline(params) {
  if ( params === void 0 ) params = {};

  var tl = anime(params);
  tl.duration = 0;
  tl.add = function(instanceParams, timelineOffset) {
    var tlIndex = activeInstances.indexOf(tl);
    var children = tl.children;
    if (tlIndex > -1) { activeInstances.splice(tlIndex, 1); }
    function passThrough(ins) { ins.passThrough = true; }
    for (var i = 0; i < children.length; i++) { passThrough(children[i]); }
    var insParams = mergeObjects(instanceParams, replaceObjectProps(defaultTweenSettings, params));
    insParams.targets = insParams.targets || params.targets;
    var tlDuration = tl.duration;
    insParams.autoplay = false;
    insParams.direction = tl.direction;
    insParams.timelineOffset = is.und(timelineOffset) ? tlDuration : getRelativeValue(timelineOffset, tlDuration);
    passThrough(tl);
    tl.seek(insParams.timelineOffset);
    var ins = anime(insParams);
    passThrough(ins);
    children.push(ins);
    var timings = getInstanceTimings(children, params);
    tl.delay = timings.delay;
    tl.endDelay = timings.endDelay;
    tl.duration = timings.duration;
    tl.seek(0);
    tl.reset();
    if (tl.autoplay) { tl.play(); }
    return tl;
  };
  return tl;
}

anime.version = '3.2.1';
anime.speed = 1;
// TODO:#review: naming, documentation
anime.suspendWhenDocumentHidden = true;
anime.running = activeInstances;
anime.remove = removeTargetsFromActiveInstances;
anime.get = getOriginalTargetValue;
anime.set = setTargetsValue;
anime.convertPx = convertPxToUnit;
anime.path = getPath;
anime.setDashoffset = setDashoffset;
anime.stagger = stagger;
anime.timeline = timeline;
anime.easing = parseEasings;
anime.penner = penner;
anime.random = function (min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; };

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (anime);


/***/ }),

/***/ "./src/blocks/accordion-nested-item/index.js":
/*!***************************************************!*\
  !*** ./src/blocks/accordion-nested-item/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");














const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/accordion-nested-item", {
  apiVersion: 2,
  title: "Accordion Item",
  parent: ['post-grid/accordion-nested'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "6.2",
      width: "36",
      height: "4.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#8db1ff",
      d: "M4,8.87a.14.14,0,0,1-.1,0L3.13,8a.12.12,0,0,1,0-.17.12.12,0,0,1,.17,0L4,8.55l.64-.75a.13.13,0,0,1,.18,0A.12.12,0,0,1,4.8,8l-.74.86A.12.12,0,0,1,4,8.87Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "6.07",
      y: "7.76",
      width: "17.44",
      height: "1.11"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "16.16",
      width: "36",
      height: "8.66"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "11.18",
      width: "36",
      height: "4.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M4,12.73a.12.12,0,0,1,.09,0l.74.86a.12.12,0,0,1,0,.17.13.13,0,0,1-.18,0L4,13.05l-.65.75a.12.12,0,0,1-.17,0,.12.12,0,0,1,0-.17l.74-.86A.14.14,0,0,1,4,12.73Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "6.07",
      y: "12.73",
      width: "17.44",
      height: "1.11"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "25.58",
      width: "36",
      height: "4.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#8db1ff",
      d: "M4,28.24a.13.13,0,0,1-.1,0l-.74-.86a.14.14,0,0,1,0-.18.12.12,0,0,1,.17,0l.65.75.64-.75a.12.12,0,1,1,.19.16l-.74.86A.11.11,0,0,1,4,28.24Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "6.07",
      y: "27.13",
      width: "17.44",
      height: "1.11"
    }))
  },
  attributes: {
    content: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'accordion-content'
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    header: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'accordion-header'
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          },
          display: {
            Desktop: 'flex'
          }
        }
      }
    },
    headerLabel: {
      type: 'object',
      default: {
        options: {
          text: 'Accordion Header Text',
          tag: 'div',
          class: 'accordion-header-label'
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    labelCounter: {
      type: 'object',
      default: {
        options: {
          position: '',
          tag: 'div',
          class: 'accordion-header-counter'
        },
        styles: {}
      }
    },
    labelIcon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",
          iconSrc: 'fas fa-angle-down',
          position: 'left',
          enable: false,
          class: 'accordion-icon'
        },
        styles: {}
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",
          iconSrc: 'fas fa-angle-down',
          position: 'left',
          class: 'accordion-icon'
        },
        styles: {}
      }
    },
    iconToggle: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",
          iconSrc: 'fas fa-angle-up',
          class: 'accordion-icon-toggle'
        },
        styles: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: [],
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var header = attributes.header;
    var headerLabel = attributes.headerLabel;
    var labelCounter = attributes.labelCounter;
    var labelIcon = attributes.labelIcon;
    var content = attributes.content;
    var icon = attributes.icon;
    var iconToggle = attributes.iconToggle;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    const [toggled, setToggled] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    const contentSelector = blockClass + '-accordion-content';
    const headerSelector = blockClass + '-accordion-header';
    const headerLabelSelector = blockClass + '-accordion-header-label';
    const labelIconSelector = blockClass + '-accordion-header-label-icon';
    const labelCounterSelector = blockClass + '-accordion-label-counter';
    const iconSelector = blockClass + '-accordion-icon';
    const iconToggleSelector = blockClass + '-accordion-icon-toggle';
    let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__.applyFilters)('isProFeature', true);
    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    const [iconToggleHtml, seticonToggleHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    const [labelIconHtml, setlabelIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      console.log(icon);
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="accordion-icon ${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon, icon.options.iconSrc]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = iconToggle.options.iconSrc;
      var iconHtml = `<span class="accordion-icon-toggle ${iconSrc}"></span>`;
      seticonToggleHtml(iconHtml);
    }, [iconToggle, iconToggle.options.iconSrc]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = labelIcon.options.iconSrc;
      var iconHtml = `<span class="accordion-icon-toggle ${iconSrc}"></span>`;
      setlabelIconHtml(iconHtml);
    }, [labelIcon, labelIcon.options.iconSrc]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleHeader(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, header);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        header: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeader(sudoScource, key) {
      var object = myStore.deletePropertyDeep(header, [sudoScource, key, breakPointX]);
      setAttributes({
        header: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeader(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, header);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        header: object
      });
    }

    function onChangeStyleHeaderLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, headerLabel);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        headerLabel: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerLabelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeaderLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(headerLabel, [sudoScource, key, breakPointX]);
      setAttributes({
        headerLabel: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerLabelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeaderLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, headerLabel);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        headerLabel: object
      });
    }

    function onPickCssLibraryHeaderLabel(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        headerLabel[sudoScource] = sudoScourceArgs;
      });
      var headerLabelX = Object.assign({}, headerLabel);
      setAttributes({
        headerLabel: headerLabelX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, headerLabelSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleLabelCounter(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelCounter);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelCounter: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelCounterSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelCounter(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelCounter, [sudoScource, key, breakPointX]);
      setAttributes({
        labelCounter: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelCounterSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelCounter(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelCounter);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelCounter: object
      });
    }

    function onPickCssLibraryLabelCounter(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        labelCounter[sudoScource] = sudoScourceArgs;
      });
      var labelCounterX = Object.assign({}, labelCounter);
      setAttributes({
        labelCounter: labelCounterX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, labelCounterSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleContent(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, content);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        content: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleContent(sudoScource, key) {
      var object = myStore.deletePropertyDeep(content, [sudoScource, key, breakPointX]);
      setAttributes({
        content: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleContent(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, content);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        content: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleIconToggle(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, iconToggle);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        iconToggle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconToggleSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIconToggle(sudoScource, key) {
      var object = myStore.deletePropertyDeep(iconToggle, [sudoScource, key, breakPointX]);
      setAttributes({
        iconToggle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconToggleSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIconToggle(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, iconToggle);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        iconToggle: object
      });
    }

    function onPickCssLibraryIconToggle(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        iconToggle[sudoScource] = sudoScourceArgs;
      });
      var iconToggleX = Object.assign({}, iconToggle);
      setAttributes({
        iconToggle: iconToggleX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconToggleSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryHeader(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        header[sudoScource] = sudoScourceArgs;
      });
      var headerX = Object.assign({}, header);
      setAttributes({
        header: headerX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    const setActiveTab = uid => {
      //setAttributes({ activeTab: uid });
      //const parentBlock = select('core/block-editor').getBlock(clientId);
      const parentClientId = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlockHierarchyRootClientId(clientId);
      wp.data.dispatch('core/block-editor').selectBlock(parentClientId); //wp.data.dispatch( 'core/edit-post' ).openGeneralSidebar( 'edit-post/block' )
      // parentBlock.innerBlocks.forEach((innerBlock) => {
      //   dispatch('core/block-editor').updateBlockAttributes(
      //     innerBlock.clientId,
      //     {
      //       activeTab: uid,
      //     }
      //   );
      // });
    };

    function onPickCssLibraryContent(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        content[sudoScource] = sudoScourceArgs;
      });
      var contentX = Object.assign({}, content);
      setAttributes({
        content: contentX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)();
    var allowedExtraBlocks = [];
    wp.blocks.getBlockTypes().forEach(function (blockType) {
      if (blockType.name.startsWith('post-grid/accordion-nested')) {
        if (!isProFeature) {
          allowedExtraBlocks.push(blockType.name);
        }
      } else {
        allowedExtraBlocks.push(blockType.name);
      }
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Header",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: header.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...header.options,
          tag: newVal
        };
        setAttributes({
          header: { ...header,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: header,
      onChange: onChangeStyleHeader,
      onAdd: onAddStyleHeader,
      onRemove: onRemoveStyleHeader
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: header,
      onChange: onPickCssLibraryHeader
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Header Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: headerLabel.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }, {
        label: 'a',
        value: 'a'
      }],
      onChange: newVal => {
        var options = { ...headerLabel.options,
          tag: newVal
        };
        setAttributes({
          headerLabel: { ...headerLabel,
            options: options
          }
        });
      }
    })), headerLabel.options.tag == 'a' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom Slug"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: headerLabel.options.slug == undefined ? '' : headerLabel.options.slug,
      onChange: newVal => {
        var options = { ...headerLabel.options,
          slug: newVal
        };
        setAttributes({
          headerLabel: { ...headerLabel,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      label: "Enable Label Icon?",
      help: labelIcon.options.enable ? 'Label Icon Enabled' : 'Label Icon Disabled.',
      checked: labelIcon.options.enable ? true : false,
      onChange: e => {
        var options = { ...labelIcon.options,
          enable: labelIcon.options.enable ? false : true
        };
        setAttributes({
          labelIcon: { ...labelIcon,
            options: options
          }
        });
      }
    }), labelIcon.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
      library: labelIcon.options.library,
      srcType: labelIcon.options.srcType,
      iconSrc: labelIcon.options.iconSrc,
      onChange: arg => {
        var options = { ...labelIcon.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          labelIcon: { ...labelIcon,
            options: options
          }
        });
        var childBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks;
        childBlocks.map(childBlock => {
          var childClientId = childBlock.clientId;
          var childAttributes = childBlock.attributes;
          childAttributes.labelIcon.options.srcType = arg.srcType;
          childAttributes.labelIcon.options.library = arg.library;
          childAttributes.labelIcon.options.iconSrc = arg.iconSrc;
          (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').updateBlockAttributes(childClientId, childAttributes);
          wp.data.dispatch('core/block-editor').selectBlock(childClientId);
        });
        wp.data.dispatch('core/block-editor').selectBlock(clientId);
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: headerLabel,
      onChange: onChangeStyleHeaderLabel,
      onAdd: onAddStyleHeaderLabel,
      onRemove: onRemoveStyleHeaderLabel
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: headerLabel,
      onChange: onPickCssLibraryHeaderLabel
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label Counter",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      label: "Enable Header Counter?",
      help: labelCounter.options.enable ? 'Header Counter Enabled' : 'Header Counter Disabled.',
      checked: labelCounter.options.enable ? true : false,
      onChange: e => {
        var options = { ...labelCounter.options,
          enable: labelCounter.options.enable ? false : true
        };
        setAttributes({
          labelCounter: { ...labelCounter,
            options: options
          }
        });
        var childBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks;
        childBlocks.map(childBlock => {
          var childClientId = childBlock.clientId;
          var childAttributes = childBlock.attributes;
          childAttributes.labelCounter.options.enable = labelCounter.options.enable ? true : false;
          (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').updateBlockAttributes(childClientId, childAttributes);
          wp.data.dispatch('core/block-editor').selectBlock(childClientId);
        });
        wp.data.dispatch('core/block-editor').selectBlock(clientId);
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Counter postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: labelCounter.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Left',
        value: 'left'
      }, {
        label: 'Right',
        value: 'right'
      }],
      onChange: newVal => {
        var options = { ...labelCounter.options,
          position: newVal
        };
        setAttributes({
          labelCounter: { ...labelCounter,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: labelCounter.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...labelCounter.options,
          tag: newVal
        };
        setAttributes({
          labelCounter: { ...labelCounter,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelCounter,
      onChange: onChangeStyleLabelCounter,
      onAdd: onAddStyleLabelCounter,
      onRemove: onRemoveStyleLabelCounter
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: labelCounter,
      onChange: onPickCssLibraryLabelCounter
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Content",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: content.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...content.options,
          tag: newVal
        };
        setAttributes({
          content: { ...content,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: content,
      onChange: onChangeStyleContent,
      onAdd: onAddStyleContent,
      onRemove: onRemoveStyleContent
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: content,
      onChange: onPickCssLibraryContent
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: arg => {
        var options = { ...icon.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Toggled Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
      library: iconToggle.options.library,
      srcType: iconToggle.options.srcType,
      iconSrc: iconToggle.options.iconSrc,
      onChange: arg => {
        var options = { ...iconToggle.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          iconToggle: { ...iconToggle,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Left',
        value: 'left'
      }, {
        label: 'Right',
        value: 'right'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `${blockId}-accordion-header accordion-header ${toggled ? 'accordion-header-active' : ''}`,
      onClick: ev => {
        setToggled(!toggled);
      }
    }, labelCounter.options.position == 'left' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: `${blockId}-accordion-label-counter accordion-label-counter`
    }, attributes.count), icon.options.position == 'left' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !toggled && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: `${blockId}-accordion-icon accordion-icon}`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), toggled && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: `${blockId}-accordion-icon-toggle accordion-icon-toggle}`,
      dangerouslySetInnerHTML: {
        __html: iconToggleHtml
      }
    })), labelIcon.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: `${blockId}-accordion-header-label-icon accordion-header-label-icon}`,
      dangerouslySetInnerHTML: {
        __html: labelIconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
      className: `${blockId}-accordion-header-label accordion-header-label`,
      value: headerLabel.options.text,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: newVal => {
        var options = { ...headerLabel.options,
          text: newVal
        };
        setAttributes({
          headerLabel: { ...headerLabel,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Start Writing...')
    }), icon.options.position == 'right' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !toggled && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: `${blockId}-accordion-icon accordion-icon}`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), toggled && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: `${blockId}-accordion-icon-toggle accordion-icon-toggle}`,
      dangerouslySetInnerHTML: {
        __html: iconToggleHtml
      }
    })), labelCounter.options.position == 'right' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: `${blockId}-accordion-label-counter accordion-label-counter`
    }, attributes.count)), toggled && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `${blockId}-accordion-content accordion-content`
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InnerBlocks, {
      allowedBlocks: allowedExtraBlocks,
      renderAppender: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InnerBlocks.ButtonBlockAppender, null)
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps.save({});
    const {
      children,
      ...innerBlocksProps
    } = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useInnerBlocksProps.save(blockProps);
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, children);
  }
});

/***/ }),

/***/ "./src/blocks/accordion-nested/index.js":
/*!**********************************************!*\
  !*** ./src/blocks/accordion-nested/index.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_divider__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/divider */ "./src/components/divider/index.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./variations */ "./src/blocks/accordion-nested/variations.js");

















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/accordion-nested", {
  apiVersion: 2,
  title: "Accordion",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "6.2",
      width: "36",
      height: "4.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#8db1ff",
      d: "M4,8.87a.14.14,0,0,1-.1,0L3.13,8a.12.12,0,0,1,0-.17.12.12,0,0,1,.17,0L4,8.55l.64-.75a.13.13,0,0,1,.18,0A.12.12,0,0,1,4.8,8l-.74.86A.12.12,0,0,1,4,8.87Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "6.07",
      y: "7.76",
      width: "17.44",
      height: "1.11"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "16.16",
      width: "36",
      height: "8.66"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "11.18",
      width: "36",
      height: "4.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M4,12.73a.12.12,0,0,1,.09,0l.74.86a.12.12,0,0,1,0,.17.13.13,0,0,1-.18,0L4,13.05l-.65.75a.12.12,0,0,1-.17,0,.12.12,0,0,1,0-.17l.74-.86A.14.14,0,0,1,4,12.73Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "6.07",
      y: "12.73",
      width: "17.44",
      height: "1.11"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "25.58",
      width: "36",
      height: "4.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#8db1ff",
      d: "M4,28.24a.13.13,0,0,1-.1,0l-.74-.86a.14.14,0,0,1,0-.18.12.12,0,0,1,.17,0l.65.75.64-.75a.12.12,0,1,1,.19.16l-.74.86A.11.11,0,0,1,4,28.24Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "6.07",
      y: "27.13",
      width: "17.44",
      height: "1.11"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          content: '',
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    searchWrap: {
      type: 'object',
      default: {
        options: {
          enable: false,
          contentSrc: ['content', 'label'],
          tag: 'div',
          class: 'accordion-search-wrap'
        },
        styles: {}
      }
    },
    searchInput: {
      type: 'object',
      default: {
        options: {
          tag: 'input',
          type: 'text',
          value: '',
          placeholder: 'Search here...',
          class: 'accordion-search-input'
        },
        styles: {}
      }
    },
    content: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'accordion-content'
        },
        styles: {}
      }
    },
    header: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'accordion-header'
        },
        styles: {}
      }
    },
    headerActive: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'accordion-header'
        },
        styles: {}
      }
    },
    headerLabel: {
      type: 'object',
      default: {
        options: {
          text: 'Accordion Header',
          tag: 'div',
          class: 'accordion-header-label'
        },
        styles: {}
      }
    },
    labelCounter: {
      type: 'object',
      default: {
        options: {
          enable: false,
          position: 'left',
          tag: 'div',
          class: 'label-counter'
        },
        styles: {}
      }
    },
    labelIcon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-angle-down',
          position: 'left',

          /*left, right, before, after */
          class: 'accordion-icon'
        },
        styles: {}
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-angle-down',
          position: 'left',

          /*left, right, before, after */
          class: 'accordion-icon'
        },
        styles: {}
      }
    },
    iconToggle: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-angle-up',
          class: 'accordion-icon-toggle'
        },
        styles: {}
      }
    },
    schema: {
      type: 'object',
      default: {
        options: {
          enable: true
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  providesContext: {
    'post-grid/accordion-nested/schema': 'schema'
  },
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var header = attributes.header;
    var headerActive = attributes.headerActive;
    var headerLabel = attributes.headerLabel;
    var labelIcon = attributes.labelIcon;
    var labelCounter = attributes.labelCounter;
    var searchWrap = attributes.searchWrap;
    var searchInput = attributes.searchInput;
    var schema = attributes.schema;
    var content = attributes.content;
    var icon = attributes.icon;
    var iconToggle = attributes.iconToggle;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__.applyFilters)('isProFeature', true); //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    const contentSelector = blockClass + ' .accordion-content';
    const headerSelector = blockClass + ' .accordion-header';
    const headerActiveSelector = blockClass + ' .accordion-header-active';
    const headerLabelSelector = blockClass + ' .accordion-header-label';
    const labelIconSelector = blockClass + ' .accordion-label-icon';
    const labelCounterSelector = blockClass + ' .accordion-label-counter';
    const searchWrapSelector = blockClass + '-accordion-search-wrap';
    const searchInputSelector = blockClass + '-accordion-search-input';
    const iconSelector = blockClass + ' .accordion-icon';
    const iconToggleSelector = blockClass + ' .accordion-icon-toggle';
    const {
      replaceInnerBlocks
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useDispatch)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store);
    const hasInnerBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store).getBlocks(clientId).length > 0, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var childBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks;
      childBlocks.map(childBlock => {
        var childClientId = childBlock.clientId;
        var childAttributes = childBlock.attributes;
        childAttributes.icon.options.position = icon.options.position;
        (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').updateBlockAttributes(childClientId, childAttributes);
        wp.data.dispatch('core/block-editor').selectBlock(childClientId);
      });
      wp.data.dispatch('core/block-editor').selectBlock(clientId);
    }, [icon.options.position]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var childBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks;
      childBlocks.map(childBlock => {
        var childClientId = childBlock.clientId;
        var childAttributes = childBlock.attributes;
        childAttributes.labelCounter.options.position = labelCounter.options.position;
        (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').updateBlockAttributes(childClientId, childAttributes);
        wp.data.dispatch('core/block-editor').selectBlock(childClientId);
      });
      wp.data.dispatch('core/block-editor').selectBlock(clientId);
    }, [labelCounter.options.position]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleHeader(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, header);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        header: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeader(sudoScource, key) {
      var object = myStore.deletePropertyDeep(header, [sudoScource, key, breakPointX]);
      setAttributes({
        header: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeader(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, header);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        header: object
      });
    }

    function onPickCssLibraryHeader(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        header[sudoScource] = sudoScourceArgs;
      });
      var headerX = Object.assign({}, header);
      setAttributes({
        header: headerX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    } // #########


    function onChangeStyleHeaderActive(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, headerActive);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        headerActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerActiveSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeaderActive(sudoScource, key) {
      var object = myStore.deletePropertyDeep(headerActive, [sudoScource, key, breakPointX]);
      setAttributes({
        headerActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerActiveSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeaderActive(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, headerActive);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        headerActive: object
      });
    }

    function onPickCssLibraryHeaderActive(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        headerActive[sudoScource] = sudoScourceArgs;
      });
      var headerActiveX = Object.assign({}, headerActive);
      setAttributes({
        headerActive: headerActiveX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, headerActiveSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    } //########


    function onChangeStyleHeaderLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, headerLabel);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        headerLabel: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerLabelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeaderLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(headerLabel, [sudoScource, key, breakPointX]);
      setAttributes({
        headerLabel: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerLabelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeaderLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, headerLabel);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        headerLabel: object
      });
    }

    function onPickCssLibraryHeaderLabel(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        headerLabel[sudoScource] = sudoScourceArgs;
      });
      var headerLabelX = Object.assign({}, headerLabel);
      setAttributes({
        headerLabel: headerLabelX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, headerLabelSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleLabelCounter(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelCounter);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelCounter: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelCounterSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelCounter(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelCounter, [sudoScource, key, breakPointX]);
      setAttributes({
        labelCounter: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelCounterSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelCounter(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelCounter);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelCounter: object
      });
    }

    function onPickCssLibraryLabelCounter(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        labelCounter[sudoScource] = sudoScourceArgs;
      });
      var labelCounterX = Object.assign({}, labelCounter);
      setAttributes({
        labelCounter: labelCounterX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, labelCounterSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleContent(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, content);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        content: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleContent(sudoScource, key) {
      var object = myStore.deletePropertyDeep(content, [sudoScource, key, breakPointX]);
      setAttributes({
        content: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleContent(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, content);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        content: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleIconToggle(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, iconToggle);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        iconToggle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconToggleSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIconToggle(sudoScource, key) {
      var object = myStore.deletePropertyDeep(iconToggle, [sudoScource, key, breakPointX]);
      setAttributes({
        iconToggle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconToggleSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIconToggle(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, iconToggle);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        iconToggle: object
      });
    }

    function onPickCssLibraryIconToggle(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        iconToggle[sudoScource] = sudoScourceArgs;
      });
      var iconToggleX = Object.assign({}, iconToggle);
      setAttributes({
        iconToggle: iconToggleX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconToggleSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryContent(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        content[sudoScource] = sudoScourceArgs;
      });
      var contentX = Object.assign({}, content);
      setAttributes({
        content: contentX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleSearchWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, searchWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        searchWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, searchWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleSearchWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(searchWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        searchWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, searchWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleSearchWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, searchWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        searchWrap: object
      });
    }

    function onChangeStyleSearchInput(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, searchInput);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        searchInput: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, searchInputSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleSearchInput(sudoScource, key) {
      var object = myStore.deletePropertyDeep(searchInput, [sudoScource, key, breakPointX]);
      setAttributes({
        searchInput: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, searchInputSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleSearchInput(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, searchInput);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        searchInput: object
      });
    }

    const ALLOWED_BLOCKS = ['post-grid/accordion-nested-item'];
    const MY_TEMPLATE = [['post-grid/accordion-nested-item', {}], ['post-grid/accordion-nested-item', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-accordion-nested`
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      allowedBlocks: ALLOWED_BLOCKS,
      __experimentalDirectInsert: true,
      template: MY_TEMPLATE,
      templateInsertUpdatesSelection: true
    });
    var childBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks;
    var count = 0;
    childBlocks.forEach(function (childBlock) {
      count++;
      var childClientId = childBlock.clientId;
      var childAttributes = childBlock.attributes;
      childAttributes.count = count;
      (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').updateBlockAttributes(childClientId, childAttributes);
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Header",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: header.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...header.options,
          tag: newVal
        };
        setAttributes({
          header: { ...header,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: header,
      onChange: onChangeStyleHeader,
      onAdd: onAddStyleHeader,
      onRemove: onRemoveStyleHeader
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_20__["default"], {
      blockId: blockId,
      obj: header,
      onChange: onPickCssLibraryHeader
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Header Active",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: headerActive,
      onChange: onChangeStyleHeaderActive,
      onAdd: onAddStyleHeaderActive,
      onRemove: onRemoveStyleHeaderActive
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_20__["default"], {
      blockId: blockId,
      obj: headerActive,
      onChange: onPickCssLibraryHeaderActive
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Header Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: headerLabel.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }, {
        label: 'a',
        value: 'a'
      }],
      onChange: newVal => {
        var options = { ...headerLabel.options,
          tag: newVal
        };
        setAttributes({
          headerLabel: { ...headerLabel,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      label: "Enable Label Icon?",
      help: labelIcon.options.enable ? 'Label Icon Enabled' : 'Label Icon Disabled.',
      checked: labelIcon.options.enable ? true : false,
      onChange: e => {
        var options = { ...labelIcon.options,
          enable: labelIcon.options.enable ? false : true
        };
        setAttributes({
          labelIcon: { ...labelIcon,
            options: options
          }
        });
      }
    }), labelIcon.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_21__["default"], {
      library: labelIcon.options.library,
      srcType: labelIcon.options.srcType,
      iconSrc: labelIcon.options.iconSrc,
      onChange: arg => {
        var options = { ...labelIcon.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          labelIcon: { ...labelIcon,
            options: options
          }
        });
        var childBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks;
        childBlocks.map(childBlock => {
          var childClientId = childBlock.clientId;
          var childAttributes = childBlock.attributes;
          childAttributes.labelIcon.options.srcType = arg.srcType;
          childAttributes.labelIcon.options.library = arg.library;
          childAttributes.labelIcon.options.iconSrc = arg.iconSrc;
          (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').updateBlockAttributes(childClientId, childAttributes);
          wp.data.dispatch('core/block-editor').selectBlock(childClientId);
        });
        console.log(clientId);
        wp.data.dispatch('core/block-editor').selectBlock(clientId);
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: headerLabel,
      onChange: onChangeStyleHeaderLabel,
      onAdd: onAddStyleHeaderLabel,
      onRemove: onRemoveStyleHeaderLabel
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_20__["default"], {
      blockId: blockId,
      obj: headerLabel,
      onChange: onPickCssLibraryHeaderLabel
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label Counter",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Counter postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: labelCounter.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Left',
        value: 'left'
      }, {
        label: 'Right',
        value: 'right'
      }],
      onChange: newVal => {
        var options = { ...labelCounter.options,
          position: newVal
        };
        setAttributes({
          labelCounter: { ...labelCounter,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: labelCounter.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...labelCounter.options,
          tag: newVal
        };
        setAttributes({
          labelCounter: { ...labelCounter,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelCounter,
      onChange: onChangeStyleLabelCounter,
      onAdd: onAddStyleLabelCounter,
      onRemove: onRemoveStyleLabelCounter
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_20__["default"], {
      blockId: blockId,
      obj: labelCounter,
      onChange: onPickCssLibraryLabelCounter
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Content",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: content.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...content.options,
          tag: newVal
        };
        setAttributes({
          content: { ...content,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: content,
      onChange: onChangeStyleContent,
      onAdd: onAddStyleContent,
      onRemove: onRemoveStyleContent
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_20__["default"], {
      blockId: blockId,
      obj: content,
      onChange: onPickCssLibraryContent
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_21__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: arg => {
        var options = { ...icon.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
        var childBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks;
        childBlocks.map(childBlock => {
          setTimeout(() => {
            var childClientId = childBlock.clientId;
            console.log('childClientId', childClientId);
            var childAttributes = childBlock.attributes;
            childAttributes.icon.options.srcType = arg.srcType;
            childAttributes.icon.options.library = arg.library;
            childAttributes.icon.options.iconSrc = arg.iconSrc;
            (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').updateBlockAttributes(childClientId, childAttributes);
            wp.data.dispatch('core/block-editor').selectBlock(childClientId);
          }, 20, childBlock);
        });
        setTimeout(() => {
          wp.data.dispatch('core/block-editor').selectBlock(clientId);
          console.log('clientId', clientId);
        }, 2000);
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Toggled Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_21__["default"], {
      library: iconToggle.options.library,
      srcType: iconToggle.options.srcType,
      iconSrc: iconToggle.options.iconSrc,
      onChange: arg => {
        var options = { ...iconToggle.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          iconToggle: { ...iconToggle,
            options: options
          }
        });
        var childBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks;
        childBlocks.map(childBlock => {
          var childClientId = childBlock.clientId;
          var childAttributes = childBlock.attributes;
          childAttributes.iconToggle.options.srcType = arg.srcType;
          childAttributes.iconToggle.options.library = arg.library;
          childAttributes.iconToggle.options.iconSrc = arg.iconSrc;
          (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').updateBlockAttributes(childClientId, childAttributes); //wp.data.dispatch('core/block-editor').selectBlock(childClientId)
        });
        wp.data.dispatch('core/block-editor').selectBlock(clientId);
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Left',
        value: 'left'
      }, {
        label: 'Right',
        value: 'right'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_20__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Schema",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      label: "Enable Schema?",
      help: schema.options.enable ? 'Schema Enabled' : 'Schema Disabled.',
      checked: schema.options.enable ? true : false,
      onChange: e => {
        var options = { ...schema.options,
          enable: schema.options.enable ? false : true
        };
        setAttributes({
          schema: { ...schema,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Search",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      label: "Enable Search?",
      help: searchWrap.options.enable ? 'Search Enabled' : 'Search Disabled.',
      disabled: isProFeature,
      checked: searchWrap.options.enable ? true : false,
      onChange: e => {
        var options = { ...searchWrap.options,
          enable: searchWrap.options.enable ? false : true
        };
        setAttributes({
          searchWrap: { ...searchWrap,
            options: options
          }
        });
      }
    }), isProFeature && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-amber-400 mx-2 rounded-sm px-3  text-white hover:text-white"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
      target: "_blank",
      href: 'https://pickplugins.com/post-grid/?utm_source=search&utm_term=blockaccordion&utm_campaign=pluginPostGrid&utm_medium=search'
    }, "Pro"))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Search Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: searchWrap,
      onChange: onChangeStyleSearchWrap,
      onAdd: onAddStyleSearchWrap,
      onRemove: onRemoveStyleSearchWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Search Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: searchInput,
      onChange: onChangeStyleSearchInput,
      onAdd: onAddStyleSearchInput,
      onRemove: onRemoveStyleSearchInput
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400 hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)([['post-grid/accordion-nested-item', {}]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_23__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 bg-gray-400 cursor-pointer hover:bg-gray-500 relative",
        onClick: ev => {
          if (variation.isPro) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var atts = variation.atts;
          var wrapper = { ...atts.wrapper
          };
          var searchWrap = { ...atts.searchWrap
          };
          var searchInput = { ...atts.searchInput
          };
          var content = { ...atts.content
          };
          var header = { ...atts.header
          };
          var headerLabel = { ...atts.headerLabel
          };
          var labelCounter = { ...atts.labelCounter
          };
          var labelIcon = { ...atts.labelIcon
          };
          var icon = { ...atts.icon
          };
          var iconToggle = { ...atts.iconToggle
          };
          var blockCssY = { ...atts.blockCssY
          };
          var customCss = { ...atts.customCss
          };
          var blockCssObj = {};
          blockCssObj[wrapperSelector] = wrapper;
          blockCssObj[contentSelector] = content;
          blockCssObj[headerSelector] = header;
          blockCssObj[headerLabelSelector] = headerLabel;
          blockCssObj[labelIconSelector] = labelIcon;
          blockCssObj[labelCounterSelector] = labelCounter;
          blockCssObj[searchWrapSelector] = searchWrap;
          blockCssObj[searchInputSelector] = searchInput;
          blockCssObj[iconSelector] = icon;
          blockCssObj[iconToggleSelector] = iconToggle;
          setAttributes({
            wrapper: wrapper,
            searchWrap: searchWrap,
            searchInput: searchInput,
            content: content,
            header: header,
            headerLabel: headerLabel,
            labelCounter: labelCounter,
            labelIcon: labelIcon,
            icon: icon,
            iconToggle: iconToggle,
            customCss: customCss
          });
          var blockCssRules = myStore.getBlockCssRules(blockCssObj);
          var items = { ...blockCssY.items,
            ...blockCssRules
          };
          setAttributes({
            blockCssY: {
              items: items
            }
          });
          replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)(variation.innerBlocks), true);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, searchWrap.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `${blockId}-accordion-search-wrap`
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", {
      className: `${blockId}-accordion-search-input my-4`,
      type: searchInput.options.type,
      placeholder: searchInput.options.placeholder,
      value: searchInput.options.value
    })), innerBlocksProps.children)));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-accordion-nested`
    }); //const innerBlocksProps = useInnerBlocksProps.save(blockProps);

    const {
      children,
      ...innerBlocksProps
    } = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps.save(blockProps);
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, children); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/accordion-nested/variations.js":
/*!***************************************************!*\
  !*** ./src/blocks/accordion-nested/variations.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: 'preset-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-1'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-1'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    searchWrap: {
      options: {
        enable: false,
        contentSrc: ['content', 'label'],
        tag: 'div',
        class: 'accordion-search-wrap'
      },
      styles: {}
    },
    searchInput: {
      options: {
        tag: 'input',
        type: 'text',
        value: '',
        placeholder: 'Search here...',
        class: 'accordion-search-input'
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/accordion-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: {},
    customCss: {},
    blockCssY: {
      items: {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M27.66,26.62a1.22,1.22,0,0,1-.93-.43l-7.39-8.63A1.23,1.23,0,0,1,21.21,16l6.45,7.54L34.12,16A1.23,1.23,0,0,1,36,17.56L28.6,26.19A1.24,1.24,0,0,1,27.66,26.62Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "48.66",
    y: "15.53",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "99.56",
    width: "360",
    height: "86.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "49.78",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M27.66,65.31a1.26,1.26,0,0,1,.94.43L36,74.37A1.23,1.23,0,1,1,34.12,76l-6.46-7.53L21.21,76a1.23,1.23,0,1,1-1.87-1.6l7.39-8.63A1.22,1.22,0,0,1,27.66,65.31Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "48.66",
    y: "65.31",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "193.85",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M27.66,220.47a1.22,1.22,0,0,1-.93-.43l-7.39-8.63a1.23,1.23,0,1,1,1.87-1.6l6.45,7.53,6.46-7.53a1.23,1.23,0,1,1,1.87,1.6L28.6,220A1.24,1.24,0,0,1,27.66,220.47Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "48.66",
    y: "209.38",
    width: "174.4",
    height: "11.09"
  }))
}, {
  name: 'preset-2',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-2'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-2'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    searchWrap: {
      options: {
        enable: false,
        contentSrc: ['content', 'label'],
        tag: 'div',
        class: 'accordion-search-wrap'
      },
      styles: {}
    },
    searchInput: {
      options: {
        tag: 'input',
        type: 'text',
        value: '',
        placeholder: 'Search here...',
        class: 'accordion-search-input'
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "center"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/accordion-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "center"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: {},
    customCss: {},
    blockCssY: {
      items: {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M86.61,26.62a1.22,1.22,0,0,1-.93-.43l-7.4-8.63A1.23,1.23,0,0,1,80.15,16l6.46,7.54L93.07,16a1.23,1.23,0,0,1,1.87,1.6l-7.39,8.63A1.26,1.26,0,0,1,86.61,26.62Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "107.61",
    y: "15.53",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "99.56",
    width: "360",
    height: "86.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "49.78",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M86.61,65.31a1.26,1.26,0,0,1,.94.43l7.39,8.63A1.23,1.23,0,1,1,93.07,76l-6.46-7.53L80.15,76a1.22,1.22,0,0,1-1.73.14,1.24,1.24,0,0,1-.14-1.74l7.4-8.63A1.22,1.22,0,0,1,86.61,65.31Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "107.61",
    y: "65.31",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "193.85",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M86.61,220.47a1.22,1.22,0,0,1-.93-.43l-7.4-8.63a1.24,1.24,0,0,1,.14-1.74,1.22,1.22,0,0,1,1.73.14l6.46,7.53,6.46-7.53a1.23,1.23,0,1,1,1.87,1.6L87.55,220A1.26,1.26,0,0,1,86.61,220.47Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "107.61",
    y: "209.38",
    width: "174.4",
    height: "11.09"
  }))
}, {
  name: 'preset-3',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-3'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-3'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    searchWrap: {
      options: {
        enable: false,
        contentSrc: ['content', 'label'],
        tag: 'div',
        class: 'accordion-search-wrap'
      },
      styles: {}
    },
    searchInput: {
      options: {
        tag: 'input',
        type: 'text',
        value: '',
        placeholder: 'Search here...',
        class: 'accordion-search-input'
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "end"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/accordion-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "end"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: {},
    customCss: {},
    blockCssY: {
      items: {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    width: "360",
    height: "42.15",
    transform: "translate(360 42.15) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M332.34,26.62a1.22,1.22,0,0,0,.93-.43l7.39-8.63a1.23,1.23,0,0,0-1.87-1.6l-6.45,7.54L325.88,16a1.23,1.23,0,0,0-1.87,1.6l7.39,8.63A1.24,1.24,0,0,0,332.34,26.62Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "136.94",
    y: "15.53",
    width: "174.4",
    height: "11.09",
    transform: "translate(448.27 42.15) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "99.56",
    width: "360",
    height: "86.66",
    transform: "translate(360 285.78) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "49.78",
    width: "360",
    height: "42.15",
    transform: "translate(360 141.71) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M332.34,65.31a1.26,1.26,0,0,0-.94.43L324,74.37a1.23,1.23,0,1,0,1.87,1.6l6.46-7.53L338.79,76a1.23,1.23,0,1,0,1.87-1.6l-7.39-8.63A1.22,1.22,0,0,0,332.34,65.31Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "136.94",
    y: "65.31",
    width: "174.4",
    height: "11.09",
    transform: "translate(448.27 141.71) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "193.85",
    width: "360",
    height: "42.15",
    transform: "translate(360 429.85) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M332.34,220.47a1.22,1.22,0,0,0,.93-.43l7.39-8.63a1.23,1.23,0,1,0-1.87-1.6l-6.45,7.53-6.46-7.53a1.23,1.23,0,1,0-1.87,1.6L331.4,220A1.24,1.24,0,0,0,332.34,220.47Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "136.94",
    y: "209.38",
    width: "174.4",
    height: "11.09",
    transform: "translate(448.27 429.85) rotate(-180)"
  }))
}, {
  name: 'preset-4',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-4'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-4'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    searchWrap: {
      options: {
        enable: false,
        contentSrc: ['content', 'label'],
        tag: 'div',
        class: 'accordion-search-wrap'
      },
      styles: {}
    },
    searchInput: {
      options: {
        tag: 'input',
        type: 'text',
        value: '',
        placeholder: 'Search here...',
        class: 'accordion-search-input'
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "width": {
          "Desktop": "100%"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        }
      }
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        class: 'accordion-icon'
      },
      styles: {
        "fontSize": {
          "Desktop": "25px"
        },
        "display": {
          "Desktop": "inline-block"
        },
        "margin": {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/accordion-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "width": {
          "Desktop": "100%"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        }
      }
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        class: 'accordion-icon'
      },
      styles: {
        "fontSize": {
          "Desktop": "25px"
        },
        "display": {
          "Desktop": "inline-block"
        },
        "margin": {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: {},
    customCss: {},
    blockCssY: {
      items: {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "29.73",
    width: "330.38",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "29.73",
    y: "99.56",
    width: "330.38",
    height: "86.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "29.73",
    y: "49.78",
    width: "330.38",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "29.73",
    y: "193.85",
    width: "330.38",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M8.74,26.62a1.24,1.24,0,0,1-.94-.43L.41,17.56a1.21,1.21,0,0,1,.13-1.73A1.23,1.23,0,0,1,2.28,16L8.74,23.5,15.19,16a1.23,1.23,0,0,1,1.87,1.6L9.67,26.19A1.22,1.22,0,0,1,8.74,26.62Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M8.74,65.31a1.24,1.24,0,0,1,.93.43l7.39,8.63A1.23,1.23,0,1,1,15.19,76L8.74,68.44,2.28,76a1.23,1.23,0,1,1-1.87-1.6L7.8,65.74A1.24,1.24,0,0,1,8.74,65.31Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M8.74,220.47A1.24,1.24,0,0,1,7.8,220L.41,211.41a1.23,1.23,0,1,1,1.87-1.6l6.46,7.53,6.45-7.53a1.23,1.23,0,1,1,1.87,1.6L9.67,220A1.22,1.22,0,0,1,8.74,220.47Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "52.54",
    y: "15.53",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "52.54",
    y: "65.31",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "52.54",
    y: "209.38",
    width: "174.4",
    height: "11.09"
  }))
}, {
  name: 'preset-5',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-5'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-5'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    searchWrap: {
      options: {
        enable: false,
        contentSrc: ['content', 'label'],
        tag: 'div',
        class: 'accordion-search-wrap'
      },
      styles: {}
    },
    searchInput: {
      options: {
        tag: 'input',
        type: 'text',
        value: '',
        placeholder: 'Search here...',
        class: 'accordion-search-input'
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "width": {
          "Desktop": "100%"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        }
      }
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'right',
        class: 'accordion-icon'
      },
      styles: {
        "fontSize": {
          "Desktop": "25px"
        },
        "display": {
          "Desktop": "inline-block"
        },
        "margin": {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/accordion-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "width": {
          "Desktop": "100%"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        }
      }
    },
    labelCounter: {
      options: {
        enable: false,
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {}
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'right',
        class: 'accordion-icon'
      },
      styles: {
        "fontSize": {
          "Desktop": "25px"
        },
        "display": {
          "Desktop": "inline-block"
        },
        "margin": {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: {},
    customCss: {},
    blockCssY: {
      items: {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    width: "330.38",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "99.56",
    width: "330.38",
    height: "86.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "49.78",
    width: "330.38",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "193.85",
    width: "330.38",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M351.38,26.62a1.24,1.24,0,0,1-.94-.43l-7.39-8.63a1.23,1.23,0,0,1,1.87-1.6l6.46,7.54L357.83,16a1.23,1.23,0,0,1,1.87,1.6l-7.39,8.63A1.22,1.22,0,0,1,351.38,26.62Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M351.38,65.31a1.24,1.24,0,0,1,.93.43l7.39,8.63a1.23,1.23,0,1,1-1.87,1.6l-6.45-7.53L344.92,76a1.23,1.23,0,1,1-1.87-1.6l7.39-8.63A1.24,1.24,0,0,1,351.38,65.31Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M351.38,220.47a1.24,1.24,0,0,1-.94-.43l-7.39-8.63a1.23,1.23,0,1,1,1.87-1.6l6.46,7.53,6.45-7.53a1.23,1.23,0,1,1,1.87,1.6L352.31,220A1.22,1.22,0,0,1,351.38,220.47Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "129.16",
    y: "15.53",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "129.16",
    y: "65.31",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "129.16",
    y: "209.38",
    width: "174.4",
    height: "11.09"
  }))
}, {
  name: 'preset-6',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-6'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-6'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    searchWrap: {
      options: {
        enable: false,
        contentSrc: ['content', 'label'],
        tag: 'div',
        class: 'accordion-search-wrap'
      },
      styles: {}
    },
    searchInput: {
      options: {
        tag: 'input',
        type: 'text',
        value: '',
        placeholder: 'Search here...',
        class: 'accordion-search-input'
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        position: 'left',
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {
        "margin": {
          "Desktop": "0px 10px 0px 0px"
        }
      }
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: '',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/accordion-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        position: 'left',
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {
        "margin": {
          "Desktop": "0px 10px 0px 0px"
        }
      }
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: '',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: {},
    customCss: {},
    blockCssY: {
      items: {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "0.11",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "0.11",
    y: "99.56",
    width: "360",
    height: "86.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "0.11",
    y: "49.78",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "0.11",
    y: "193.85",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "46.54",
    y: "15.53",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "46.54",
    y: "65.31",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "46.54",
    y: "209.38",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M17,18.65v-3l4.21-2.48h2.57V29H20.86V16.29Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M19.21,76.4h6.34v2.5H15.18V76.57a29.76,29.76,0,0,0,4.9-4.32q2.07-2.3,2.07-4.14a2.5,2.5,0,0,0-.71-1.89,2.8,2.8,0,0,0-2-.68A6.05,6.05,0,0,0,15.54,67V64.2a6.74,6.74,0,0,1,2-1,7.65,7.65,0,0,1,2.38-.39,5.58,5.58,0,0,1,3.8,1.28,4.48,4.48,0,0,1,1.47,3.58C25.18,70.56,23.19,73.46,19.21,76.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M16.06,210.47v-2.75a7.16,7.16,0,0,1,3.48-.9A5.86,5.86,0,0,1,23.46,208a3.89,3.89,0,0,1,1.42,3.11,3.7,3.7,0,0,1-2.5,3.74,3.78,3.78,0,0,1,2.11,1.27,3.69,3.69,0,0,1,.75,2.37,4.08,4.08,0,0,1-1.47,3.25A6.17,6.17,0,0,1,19.66,223a9.93,9.93,0,0,1-4.18-.8v-2.85a8.27,8.27,0,0,0,4,1,3.09,3.09,0,0,0,2.06-.62,2,2,0,0,0,.74-1.59c0-1.41-1.14-2.11-3.43-2.11h-.92v-2.46h.92a3.94,3.94,0,0,0,2.16-.55,1.77,1.77,0,0,0,.88-1.58c0-1.36-.84-2-2.5-2A6.24,6.24,0,0,0,16.06,210.47Z"
  }))
}, {
  name: 'preset-7',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-7'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-7'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    searchWrap: {
      options: {
        enable: false,
        contentSrc: ['content', 'label'],
        tag: 'div',
        class: 'accordion-search-wrap'
      },
      styles: {}
    },
    searchInput: {
      options: {
        tag: 'input',
        type: 'text',
        value: '',
        placeholder: 'Search here...',
        class: 'accordion-search-input'
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "end"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        position: 'right',
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {
        "margin": {
          "Desktop": "0px 0px 0px 10px"
        }
      }
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: '',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/accordion-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "end"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "margin": {
          "Desktop": "0px 0px 0px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {}
    },
    labelCounter: {
      options: {
        position: 'right',
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {
        "margin": {
          "Desktop": "0px 0px 0px 10px"
        }
      }
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: '',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: {},
    customCss: {},
    blockCssY: {
      items: {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "99.56",
    width: "360",
    height: "86.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "49.78",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "193.85",
    width: "360",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "139.17",
    y: "15.53",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "139.17",
    y: "65.31",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "139.17",
    y: "209.38",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M336.36,18.65v-3l4.2-2.48h2.58V29h-2.89V16.29Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M338.59,76.4h6.34v2.5H334.56V76.57a29.85,29.85,0,0,0,4.91-4.32,6.55,6.55,0,0,0,2.06-4.14,2.49,2.49,0,0,0-.7-1.89,2.8,2.8,0,0,0-2-.68,6,6,0,0,0-3.86,1.5V64.2a6.62,6.62,0,0,1,2-1,7.6,7.6,0,0,1,2.38-.39,5.6,5.6,0,0,1,3.8,1.28,4.48,4.48,0,0,1,1.47,3.58C344.57,70.56,342.58,73.46,338.59,76.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M335.45,210.47v-2.75a7.15,7.15,0,0,1,3.47-.9,5.82,5.82,0,0,1,3.92,1.22,3.9,3.9,0,0,1,1.43,3.11,3.71,3.71,0,0,1-2.51,3.74,3.77,3.77,0,0,1,2.12,1.27,3.69,3.69,0,0,1,.75,2.37,4.08,4.08,0,0,1-1.47,3.25A6.18,6.18,0,0,1,339,223a9.91,9.91,0,0,1-4.17-.8v-2.85a8.27,8.27,0,0,0,4,1,3.06,3.06,0,0,0,2-.62,2,2,0,0,0,.74-1.59c0-1.41-1.14-2.11-3.42-2.11h-.92v-2.46h.92a3.94,3.94,0,0,0,2.16-.55,1.78,1.78,0,0,0,.87-1.58c0-1.36-.83-2-2.5-2A6.23,6.23,0,0,0,335.45,210.47Z"
  }))
}, {
  name: 'preset-8',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-8'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-8'),
  isPro: true,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    searchWrap: {
      options: {
        enable: false,
        contentSrc: ['content', 'label'],
        tag: 'div',
        class: 'accordion-search-wrap'
      },
      styles: {}
    },
    searchInput: {
      options: {
        tag: 'input',
        type: 'text',
        value: '',
        placeholder: 'Search here...',
        class: 'accordion-search-input'
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "width": {
          "Desktop": "100%"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        }
      }
    },
    labelCounter: {
      options: {
        position: 'left',
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {
        "margin": {
          "Desktop": "0px 10px 0px 0px"
        }
      }
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: '',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/accordion-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "start"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "width": {
          "Desktop": "100%"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        }
      }
    },
    labelCounter: {
      options: {
        position: 'left',
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {
        "margin": {
          "Desktop": "0px 10px 0px 0px"
        }
      }
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: '',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: {},
    customCss: {},
    blockCssY: {
      items: {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    class: "cls-1",
    x: "30.65",
    width: "329.35",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "56.55",
    y: "15.53",
    width: "172.07",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "30.65",
    y: "99.56",
    width: "329.35",
    height: "86.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "30.65",
    y: "49.78",
    width: "329.35",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    class: "cls-1",
    x: "56.55",
    y: "65.31",
    width: "172.07",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    class: "cls-1",
    x: "30.65",
    y: "193.85",
    width: "329.35",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "56.55",
    y: "209.38",
    width: "172.07",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    class: "cls-1",
    d: "M1.77,18.65v-3l4.15-2.48H8.46V29H5.61V16.29Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M4,76.32h6.25v2.5H0V76.49a29.67,29.67,0,0,0,4.84-4.32,6.61,6.61,0,0,0,2-4.14,2.49,2.49,0,0,0-.7-1.89,2.72,2.72,0,0,0-2-.68A5.91,5.91,0,0,0,.36,67V64.12a6.8,6.8,0,0,1,2-1,7.47,7.47,0,0,1,2.35-.39A5.45,5.45,0,0,1,8.42,64a4.51,4.51,0,0,1,1.45,3.58Q9.87,71.93,4,76.32Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    class: "cls-1",
    d: "M.87,210.39v-2.75a7,7,0,0,1,3.43-.9A5.7,5.7,0,0,1,8.17,208a3.9,3.9,0,0,1,1.4,3.11,3.69,3.69,0,0,1-2.47,3.74,3.78,3.78,0,0,1,2.09,1.27,3.75,3.75,0,0,1,.74,2.37,4.09,4.09,0,0,1-1.45,3.25A6,6,0,0,1,4.42,223a9.67,9.67,0,0,1-4.12-.8V219.3a8.11,8.11,0,0,0,3.93,1,3,3,0,0,0,2-.62A2,2,0,0,0,7,218.11C7,216.7,5.86,216,3.61,216H2.7v-2.45h.91A3.88,3.88,0,0,0,5.74,213a1.8,1.8,0,0,0,.86-1.58c0-1.36-.82-2-2.47-2A6.13,6.13,0,0,0,.87,210.39Z"
  }))
}, {
  name: 'preset-9',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-9'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-9'),
  isPro: true,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    searchWrap: {
      options: {
        enable: false,
        contentSrc: ['content', 'label'],
        tag: 'div',
        class: 'accordion-search-wrap'
      },
      styles: {}
    },
    searchInput: {
      options: {
        tag: 'input',
        type: 'text',
        value: '',
        placeholder: 'Search here...',
        class: 'accordion-search-input'
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "end"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "width": {
          "Desktop": "100%"
        },
        "textAlign": {
          "Desktop": "right"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        }
      }
    },
    labelCounter: {
      options: {
        position: 'right',
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {
        "margin": {
          "Desktop": "0px 0px 0px 10px"
        }
      }
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: '',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/accordion-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: 'accordion-content'
      },
      styles: {}
    },
    header: {
      options: {
        tag: 'div',
        class: 'accordion-header'
      },
      styles: {
        "justifyContent": {
          "Desktop": "end"
        },
        "margin": {
          "Desktop": "0px 0px 1px 0px"
        },
        "display": {
          "Desktop": "flex"
        },
        "alignItems": {
          "Desktop": "center"
        }
      }
    },
    headerLabel: {
      options: {
        text: 'Accordion Header Text',
        tag: 'div',
        class: 'accordion-header-label'
      },
      styles: {
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "width": {
          "Desktop": "100%"
        },
        "textAlign": {
          "Desktop": "right"
        },
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        }
      }
    },
    labelCounter: {
      options: {
        position: 'right',
        tag: 'div',
        class: 'accordion-header-counter'
      },
      styles: {
        "margin": {
          "Desktop": "0px 0px 0px 10px"
        }
      }
    },
    labelIcon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'left',
        enable: false,
        class: 'accordion-icon'
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: '',
        class: 'accordion-icon'
      },
      styles: {}
    },
    iconToggle: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-up',
        class: 'accordion-icon-toggle'
      },
      styles: {}
    },
    blockId: {},
    customCss: {},
    blockCssY: {
      items: {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M351.43,18.57v-3l4.2-2.48h2.57V28.94h-2.89V16.21Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M353.66,76.32H360v2.5H349.63V76.49a30.26,30.26,0,0,0,4.91-4.32A6.6,6.6,0,0,0,356.6,68a2.53,2.53,0,0,0-.7-1.89,2.8,2.8,0,0,0-2-.68A6.06,6.06,0,0,0,350,67V64.12a6.92,6.92,0,0,1,2-1,7.56,7.56,0,0,1,2.38-.39,5.6,5.6,0,0,1,3.8,1.28,4.49,4.49,0,0,1,1.47,3.58Q359.64,71.93,353.66,76.32Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M350.52,210.39v-2.75a7.13,7.13,0,0,1,3.47-.9,5.84,5.84,0,0,1,3.92,1.22,3.89,3.89,0,0,1,1.42,3.11,3.69,3.69,0,0,1-2.5,3.74,3.8,3.8,0,0,1,2.11,1.27,3.64,3.64,0,0,1,.76,2.37,4.08,4.08,0,0,1-1.47,3.25,6.2,6.2,0,0,1-4.12,1.25,9.93,9.93,0,0,1-4.18-.8V219.3a8.31,8.31,0,0,0,4,1,3.08,3.08,0,0,0,2.05-.62,2,2,0,0,0,.74-1.59c0-1.41-1.14-2.11-3.43-2.11h-.92v-2.45h.92a4,4,0,0,0,2.17-.56,1.78,1.78,0,0,0,.87-1.58c0-1.36-.83-2-2.5-2A6.23,6.23,0,0,0,350.52,210.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    width: "333.82",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "99.56",
    width: "333.82",
    height: "86.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "49.78",
    width: "333.82",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "193.85",
    width: "333.82",
    height: "42.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "124.2",
    y: "15.45",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "124.2",
    y: "65.23",
    width: "174.4",
    height: "11.09"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "124.2",
    y: "209.3",
    width: "174.4",
    height: "11.09"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/accordion/index.js":
/*!***************************************!*\
  !*** ./src/blocks/accordion/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");














const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/accordion", {
  apiVersion: 2,
  title: "Accordion (OLD)",
  parent: ['post-grid/accordion-nested'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      y: "6.2",
      width: "36",
      height: "4.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#C5C5C5",
      d: "M4,8.87a.14.14,0,0,1-.1,0L3.13,8a.12.12,0,0,1,0-.17.12.12,0,0,1,.17,0L4,8.55l.64-.75a.13.13,0,0,1,.18,0A.12.12,0,0,1,4.8,8l-.74.86A.12.12,0,0,1,4,8.87Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#C5C5C5",
      x: "6.07",
      y: "7.76",
      width: "17.44",
      height: "1.11"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#C5C5C5",
      y: "16.16",
      width: "36",
      height: "8.66"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#C5C5C5",
      y: "11.18",
      width: "36",
      height: "4.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#fff",
      d: "M4,12.73a.12.12,0,0,1,.09,0l.74.86a.12.12,0,0,1,0,.17.13.13,0,0,1-.18,0L4,13.05l-.65.75a.12.12,0,0,1-.17,0,.12.12,0,0,1,0-.17l.74-.86A.14.14,0,0,1,4,12.73Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "6.07",
      y: "12.73",
      width: "17.44",
      height: "1.11"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      y: "25.58",
      width: "36",
      height: "4.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#C5C5C5",
      d: "M4,28.24a.13.13,0,0,1-.1,0l-.74-.86a.14.14,0,0,1,0-.18.12.12,0,0,1,.17,0l.65.75.64-.75a.12.12,0,1,1,.19.16l-.74.86A.11.11,0,0,1,4,28.24Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#C5C5C5",
      x: "6.07",
      y: "27.13",
      width: "17.44",
      height: "1.11"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          content: '',
          tag: 'div',
          class: 'pg-accordion'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    items: {
      type: 'array',
      default: [{
        isActive: false,
        headerText: 'What is Lorem Ipsum?',
        content: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.',
        icon: '',
        iconToggle: '',
        styles: {}
      }]
    },
    header: {
      type: 'object',
      default: {
        options: {
          text: 'What is Lorem Ipsum?',
          tag: 'div',
          class: 'pg-accordion-header'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    headerActive: {
      type: 'object',
      default: {
        options: {
          text: 'What is Lorem Ipsum?',
          tag: 'div',
          class: 'pg-accordion-header '
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    content: {
      type: 'object',
      default: {
        options: {
          text: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.',
          tag: 'div',
          class: 'pg-accordion-content'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-right',
          class: 'icon',
          positon: 'beforeHeader',
          enableToggle: 'yes'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    iconToggle: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-down',
          class: 'iconToggle'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var items = attributes.items;
    var wrapper = attributes.wrapper;
    var header = attributes.header;
    var headerActive = attributes.headerActive;
    var content = attributes.content;
    var icon = attributes.icon;
    var iconToggle = attributes.iconToggle;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    const [isOpen, setisOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var headerSelector = blockClass + ' .pg-accordion-header';
    var headerActiveSelector = blockClass + ' .pg-accordion-header.active';
    var contentSelector = blockClass + ' .pg-accordion-content .ac-text';
    const iconSelector = blockClass + ' .icon-wrap';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    const [iconToggleHtml, setIconToggleHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = iconToggle.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconToggleHtml(iconHtml);
    }, [iconToggle]);

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onChangeIconToggle(arg) {
      var options = { ...iconToggle.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        iconToggle: { ...iconToggle,
          options: options
        }
      });
    }

    function onPickCssLibraryHeader(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        header[sudoScource] = sudoScourceArgs;
      });
      var headerX = Object.assign({}, header);
      setAttributes({
        header: headerX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryContent(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        content[sudoScource] = sudoScourceArgs;
      });
      var contentX = Object.assign({}, content);
      setAttributes({
        content: contentX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleHeader(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, header);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        header: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeader(sudoScource, key) {
      var object = myStore.deletePropertyDeep(header, [sudoScource, key, breakPointX]);
      setAttributes({
        header: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeader(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, header);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        header: object
      });
    }

    function onChangeStyleContent(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, content);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        content: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleContent(sudoScource, key) {
      var object = myStore.deletePropertyDeep(content, [sudoScource, key, breakPointX]);
      setAttributes({
        content: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleContent(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, content);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        content: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleHeaderActive(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, headerActive);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        headerActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerActiveSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeaderActive(sudoScource, key) {
      var object = myStore.deletePropertyDeep(headerActive, [sudoScource, key, breakPointX]);
      setAttributes({
        headerActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerActiveSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeaderActive(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, headerActive);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        headerActive: object
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2",
      title: "header",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Header",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: header.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...header.options,
          tag: newVal
        };
        setAttributes({
          header: { ...header,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: header,
      onChange: onChangeStyleHeader,
      onAdd: onAddStyleHeader,
      onRemove: onRemoveStyleHeader
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_20__["default"], {
      blockId: blockId,
      obj: header,
      onChange: onPickCssLibraryHeader
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Header - Active",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: headerActive,
      onChange: onChangeStyleHeaderActive,
      onAdd: onAddStyleHeaderActive,
      onRemove: onRemoveStyleHeaderActive
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Content",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: content.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...content.options,
          tag: newVal
        };
        setAttributes({
          content: { ...content,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: content,
      onChange: onChangeStyleContent,
      onAdd: onAddStyleContent,
      onRemove: onRemoveStyleContent
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_20__["default"], {
      blockId: blockId,
      obj: content,
      onChange: onPickCssLibraryContent
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_16__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Toggled Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_16__["default"], {
      library: iconToggle.options.library,
      srcType: iconToggle.options.srcType,
      iconSrc: iconToggle.options.iconSrc,
      onChange: onChangeIconToggle
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: 'Before Header Text',
        value: 'beforeHeader'
      }, {
        label: 'After Header Text',
        value: 'afterHeader'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Enable Icon Toggle"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: icon.options.enableToggle,
      options: [{
        label: 'Yes',
        value: 'yes'
      }, {
        label: 'No',
        value: 'no'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          enableToggle: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_20__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: [blockId]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 p-2 px-5 text-white my-4 text-center cursor-pointer",
      onClick: ev => {
        var itemx = items.concat({
          isActive: false,
          headerText: 'What is Lorem Ipsum?',
          content: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.',
          icon: '',
          iconToggle: '',
          styles: {}
        });
        setAttributes({
          items: itemx
        });
      }
    }, "Add"), items.map((item, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: `${header.options.class} ${items[i].isActive ? 'active' : ''} cursor-pointer`,
        onClick: ev => {
          items[i].isActive = !items[i].isActive;
          var ssdsd = items.concat([]);
          setAttributes({
            items: ssdsd
          });
        }
      }, icon.options.position == 'beforeHeader' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, icon.options.enableToggle == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !items[i].isActive && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), items[i].isActive && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap",
        dangerouslySetInnerHTML: {
          __html: iconToggleHtml
        }
      })), icon.options.enableToggle == 'no' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.RichText, {
        tagName: "span",
        value: item.headerText,
        allowedFormats: ['core/bold', 'core/italic', 'core/link'],
        onChange: content => {
          items[i].headerText = content;
          var ssdsd = items.concat([]);
          setAttributes({
            items: ssdsd
          });
        },
        placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Start Writing...')
      }), icon.options.position == 'afterHeader' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, icon.options.enableToggle == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !items[i].isActive && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap float-right",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), items[i].isActive && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap float-right",
        dangerouslySetInnerHTML: {
          __html: iconToggleHtml
        }
      })), icon.options.enableToggle == 'no' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap float-right",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "text-lg cursor-pointer px-2 text-red-500  py-1 float-right icon-close",
        onClick: ev => {
          items.splice(i, 1);
          var ssdsd = items.concat([]);
          setAttributes({
            items: ssdsd
          });
          ev.preventDefault();
        }
      })), items[i].isActive && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: content.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.RichText, {
        className: 'ac-text',
        tagName: "div",
        value: item.content,
        allowedFormats: ['core/bold', 'core/italic', 'core/link'],
        onChange: content => {
          items[i].content = content;
          var ssdsd = items.concat([]);
          setAttributes({
            items: ssdsd
          });
        },
        placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Start Writing...')
      })));
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/archive-description/index.js":
/*!*************************************************!*\
  !*** ./src/blocks/archive-description/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/archive-description", {
  apiVersion: 2,
  title: "Archive description",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "16.57",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "12.32",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "6.41",
      width: "36",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#8db1ff",
      d: "M0,22.46v7.13H10.69V22.46Zm9.43,5.87H1.26V23.72H9.43Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#8db1ff",
      d: "M12.66,22.46v7.13H23.34V22.46Zm9.42,5.87H13.92V23.72h8.16Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#8db1ff",
      d: "M25.31,22.46v7.13H36V22.46Zm9.43,5.87H26.57V23.72h8.17Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    archiveTitle: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          archiveType: 'auto',
          customLabel: 'Archive: %s',
          dateFormat: '',
          linkTo: '',
          // postUrl, customField, authorUrl, authorLink, homeUrl, custom
          linkToUrl: '',
          linkToMetaKey: '',
          linkTarget: '_blank',
          linkAttr: [],
          customUrl: '',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'far fa-calendar-alt',
          position: 'beforeArchiveTitle',

          /*before, after, prefix, postfix */
          class: 'postdate-icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    let archiveTitle = attributes.archiveTitle;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var icon = attributes.icon;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [customTags, setCustomTags] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    var archiveLinkToArgsBasic = {
      none: {
        label: 'No Link',
        value: ''
      },
      archiveUrl: {
        label: 'Archive URL',
        value: 'archiveUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      customUrl: {
        label: 'Custom',
        value: 'customUrl'
      }
    };
    let archiveLinkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('archiveLinkToArgs', archiveLinkToArgsBasic);
    var archiveTypes = {
      'auto': {
        label: 'Auto Detect',
        value: 'auto'
      } // 'author': { label: 'Author', value: 'author' },
      // 'category': { label: 'Category', value: 'category' },
      // 'tag': { label: 'Tag', value: 'tag' },
      // 'taxonomy': { label: 'Taxonomy', value: 'taxonomy' },
      // 'search': { label: 'Search', value: 'search' },
      // 'index': { label: 'Index', value: 'index' },
      // 'year': { label: 'Year', value: 'year' },
      // 'month': { label: 'Month', value: 'month' },
      // 'date': { label: 'Date', value: 'date' },
      // 'wcCatalog': { label: 'WooCommerce Catalog', value: 'wcCatalog' },
      // 'wcSearch': { label: 'WooCommerce Search', value: 'wcSearch' },

    };
    var dateFormats = {
      'Y-M-d': {
        label: '2022-May-25',
        value: 'Y-M-d'
      },
      'Y-m-d': {
        label: '2022-05-25',
        value: 'Y-m-d'
      },
      'd-m-y': {
        label: '25-05-2022',
        value: 'd-m-y'
      },
      'd/m/y': {
        label: '25/05/2022',
        value: 'd/m/y'
      },
      'y-m-d': {
        label: '2022-05-25',
        value: 'y-m-d'
      },
      'y/m/d': {
        label: '2022/05/25',
        value: 'y/m/d'
      },
      'D M y': {
        label: 'Sun May 2022',
        value: 'D M y'
      },
      'D M d, y': {
        label: 'Sun May 11, 2022',
        value: 'D M d, y'
      },
      'M D d, y': {
        label: 'May Sun 11, 2022',
        value: 'M D d, y'
      },
      'M d, y': {
        label: 'May 11, 2022',
        value: 'M d, y'
      },
      'd M y': {
        label: '25 May 2022',
        value: 'd M y'
      }
    }; // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var archiveTitleSelector = '';

    if (wrapper.options.tag.length != 0) {
      if (archiveTitle.options.linkTo.length > 0) {
        archiveTitleSelector = blockClass + ' a';
      } else {
        archiveTitleSelector = blockClass; //archiveTitleSelector = blockClass + ' .archiveTitle';
      }
    } else {
      archiveTitleSelector = blockClass;
    }

    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';
    const iconSelector = blockClass + ' .postdate-icon';
    const [archiveTitleEdited, setarchiveTitleEdited] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('Hello %s');

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function setFieldLinkTo(option, index) {
      var options = { ...archiveTitle.options,
        linkTo: option.value
      };
      setAttributes({
        archiveTitle: { ...archiveTitle,
          options: options
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      console.log(archiveTitle);
      var archiveType = archiveTitle.options.archiveType;

      if (archiveType == 'auto') {
        //archiveTitleEdited = archiveTitle.options.customLabel;
        setarchiveTitleEdited(archiveTitle.options.customLabel);
      }
    }, [archiveTitle]);

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryArchiveTitle(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        archiveTitle[sudoScource] = sudoScourceArgs;
      });
      var archiveTitleX = Object.assign({}, archiveTitle);
      setAttributes({
        archiveTitle: archiveTitleX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, archiveTitleSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddArchiveTitle(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, archiveTitle);
      obj[sudoScource] = cssObj;
      setAttributes({
        archiveTitle: obj
      });
      var selector = myStore.getElementSelector(sudoScource, archiveTitleSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddIcon(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, icon);
      obj[sudoScource] = cssObj;
      setAttributes({
        icon: obj
      });
      var selector = myStore.getElementSelector(sudoScource, iconSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPrefix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, prefix);
      obj[sudoScource] = cssObj;
      setAttributes({
        prefix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, prefixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPostfix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, postfix);
      obj[sudoScource] = cssObj;
      setAttributes({
        postfix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, postfixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    String.prototype.strtr = function (dic) {
      const str = this.toString(),
            makeToken = inx => `{{###~${inx}~###}}`,
            tokens = Object.keys(dic).map((key, inx) => ({
        key,
        val: dic[key],
        token: makeToken(inx)
      })),
            tokenizedStr = tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.key, "g"), entry.token), str);

      return tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.token, "g"), entry.val), tokenizedStr);
    };

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      console.log(iconHtml);
      setIconHtml(iconHtml);
    }, [icon]);
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ archiveTitle: archiveTitle });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      customTags['currentYear'] = '2022';
      customTags['currentMonth'] = '07';
      customTags['currentDay'] = '27';
      customTags['currentDate'] = '27';
      customTags['currentTime'] = '27';
      customTags['postPublishDate'] = '123';
      customTags['postModifiedDate'] = '123';
      customTags['termId'] = '';
      customTags['termTitle'] = '';
      customTags['termDescription'] = '';
      customTags['termPostCount'] = '';
      customTags['postTagTitle'] = 'First Tag Title';
      customTags['postTagsTitle'] = 'First Tag Title';
      customTags['postCategoryTitle'] = 'First Category Title';
      customTags['postCategoriesTitle'] = 'First Categories Title';
      customTags['postTermTitle'] = 'First Term Title';
      customTags['postTermsTitle'] = 'List of all terms title';
      customTags['postId'] = '123';
      customTags['postStatus'] = '123';
      customTags['authorId'] = '123';
      customTags['authorName'] = 'Nur Hasan';
      customTags['authorFirstName'] = 'Nur';
      customTags['authorLastName'] = 'Hasan';
      customTags['authorDescription'] = 'Hasan';
      customTags['excerpt'] = 'Here is the post excerpt';
      customTags['rankmathTitle'] = 'Hasan';
      customTags['rankmathPermalink'] = 'Hasan';
      customTags['rankmathExcerpt'] = 'Hasan';
      customTags['rankmathFocusKeyword'] = 'Hasan';
      customTags['rankmathFocusKeywords'] = 'Hasan';
      customTags['rankmathOrgname'] = 'Hasan';
      customTags['rankmathOrgurl'] = 'Hasan';
      customTags['rankmathOrglogo'] = 'Hasan';
      customTags['siteTitle'] = '';
      customTags['siteDescription'] = '';
      customTags['siteTagline'] = '';
      customTags['postMeta'] = '';
      customTags['separator'] = '';
      customTags['searchTerms'] = '';
      customTags['counter'] = '1';
    }, [clientId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onChangeStyleArchiveTitle(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, archiveTitle);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        archiveTitle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, archiveTitleSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleArchiveTitle(sudoScource, key) {
      var object = myStore.deletePropertyDeep(archiveTitle, [sudoScource, key, breakPointX]);
      setAttributes({
        archiveTitle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, archiveTitleSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleArchiveTitle(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, archiveTitle);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        archiveTitle: object
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
    }, [archiveTitle]);

    var linkAttrObj = () => {
      var sdsd = {};
      archiveTitle.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    var postUrl = archiveTitle.options.customUrl != undefined && archiveTitle.options.customUrl.length > 0 ? archiveTitle.options.customUrl : currentPostUrl;
    const CustomTag = `${wrapper.options.tag}`;
    const CustomTagPostTitle = `${archiveTitle.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-archive-description`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'span',
        value: 'span'
      }, {
        label: 'div',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: {
            styles: wrapper.styles,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Archive Description",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Archive Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: archiveTypes,
      buttonTitle: "Choose",
      onChange: (option, index) => {
        var options = { ...archiveTitle.options,
          archiveType: option.value
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      },
      values: ''
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-500 text-white p-3 py-2"
    }, archiveTypes[archiveTitle.options.archiveType].label), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Label"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: archiveTitle.options.customLabel,
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          customLabel: newVal
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    })), (archiveTitle.options.archiveType == 'year' || archiveTitle.options.archiveType == 'month' || archiveTitle.options.archiveType == 'day') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Date Format"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: dateFormats,
      buttonTitle: "Choose",
      onChange: (option, index) => {
        var options = { ...archiveTitle.options,
          dateFormat: option.value
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      },
      values: ''
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Format"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: archiveTitle.options.dateFormat,
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          dateFormat: newVal
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    })), dateFormats[archiveTitle.options.dateFormat] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2 my-3 bg-gray-500 text-white"
    }, dateFormats[archiveTitle.options.dateFormat].label)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: archiveLinkToArgs,
      buttonTitle: archiveTitle.options.linkTo.length == 0 ? 'Choose' : archiveLinkToArgs[archiveTitle.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), archiveTitle.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: archiveTitle.options.linkToMetaKey,
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          linkToMetaKey: newVal
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    })), archiveTitle.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), archiveTitle.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        var options = { ...archiveTitle.options,
          customUrl: ''
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.__experimentalLinkControl, {
      settings: [],
      value: archiveTitle.options.customUrl,
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          customUrl: newVal.url
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", archiveTitle.options.customUrl.length != 0 ? archiveTitle.options.customUrl : 'No link', " ")))), archiveTitle.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: archiveTitle.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          tag: newVal
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    })), archiveTitle.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: archiveTitle.options.linkTarget,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          linkTarget: newVal
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = archiveTitle.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...archiveTitle.options,
          linkAttr: sdsd
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), archiveTitle.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Name",
        value: archiveTitle.options.linkAttr[i].id,
        onChange: newVal => {
          archiveTitle.options.linkAttr[i].id = newVal;
          var ssdsd = archiveTitle.options.linkAttr.concat([]);
          var options = { ...archiveTitle.options,
            linkAttr: ssdsd
          };
          setAttributes({
            archiveTitle: { ...archiveTitle,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          archiveTitle.options.linkAttr[i].val = newVal;
          var ssdsd = archiveTitle.options.linkAttr.concat([]);
          var options = { ...archiveTitle.options,
            linkAttr: ssdsd
          };
          setAttributes({
            archiveTitle: { ...archiveTitle,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          archiveTitle.options.linkAttr.splice(i, 1);
          var ssdsd = archiveTitle.options.linkAttr.concat([]);
          var options = { ...archiveTitle.options,
            linkAttr: ssdsd
          };
          setAttributes({
            archiveTitle: { ...archiveTitle,
              options: options
            }
          });
        }
      })));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: archiveTitle,
      onChange: onChangeStyleArchiveTitle,
      onAdd: onAddStyleArchiveTitle,
      onRemove: onRemoveStyleArchiveTitle,
      onBulkAdd: onBulkAddArchiveTitle
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: archiveTitle,
      onChange: onPickCssLibraryArchiveTitle
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_18__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Archive Title',
        value: 'beforeArchiveTitle'
      }, {
        label: 'After Archive Title',
        value: 'afterArchiveTitle'
      }, {
        label: 'Before Prefix',
        value: 'beforePrefix'
      }, {
        label: 'After Prefix',
        value: 'afterPrefix'
      }, {
        label: 'Before Postfix',
        value: 'beforePostfix'
      }, {
        label: 'After Postfix',
        value: 'afterPostfix'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon,
      onBulkAdd: onBulkAddIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: {
            styles: prefix.styles,
            options: options
          }
        }); // setAttributes({ prefix: { text: newVal, class: prefix.options.class, color: prefix.color, backgroundColor: prefix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix,
      onBulkAdd: onBulkAddPrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        }); // setAttributes({ postfix: { text: newVal, class: prefix.options.class, color: postfix.color, backgroundColor: postfix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix,
      onBulkAdd: onBulkAddPostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title link"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, archiveTitleSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps, icon.options.position == 'beforePrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'afterPrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitle.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "archiveTitle",
      onClick: handleLinkClick
    }, linkAttrItems, {
      target: archiveTitle.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforeArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitleEdited, icon.options.position == 'afterArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), archiveTitle.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforeArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitleEdited, icon.options.position == 'afterArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitle.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "archiveTitle",
      onClick: handleLinkClick
    }, linkAttrItems, {
      target: archiveTitle.options.linkTarget,
      href: postUrl
    }), "A", icon.options.position == 'beforeArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitleEdited, icon.options.position == 'afterArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), archiveTitle.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, icon.options.position == 'beforeArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitleEdited, icon.options.position == 'afterArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/archive-title/index.js":
/*!*******************************************!*\
  !*** ./src/blocks/archive-title/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/archive-title", {
  apiVersion: 2,
  title: "Archive Title",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "16.57",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "12.32",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "6.41",
      width: "36",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#8db1ff",
      d: "M0,22.46v7.13H10.69V22.46Zm9.43,5.87H1.26V23.72H9.43Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#8db1ff",
      d: "M12.66,22.46v7.13H23.34V22.46Zm9.42,5.87H13.92V23.72h8.16Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#8db1ff",
      d: "M25.31,22.46v7.13H36V22.46Zm9.43,5.87H26.57V23.72h8.17Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    archiveTitle: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          archiveType: 'auto',
          customLabel: 'Archive: %s',
          dateFormat: '',
          linkTo: '',
          // postUrl, customField, authorUrl, authorLink, homeUrl, custom
          linkToUrl: '',
          linkToMetaKey: '',
          linkTarget: '_blank',
          linkAttr: [],
          customUrl: '',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'far fa-calendar-alt',
          position: 'beforeArchiveTitle',

          /*before, after, prefix, postfix */
          class: 'postdate-icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    let archiveTitle = attributes.archiveTitle;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var icon = attributes.icon;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [customTags, setCustomTags] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    var archiveTypes = {
      'auto': {
        label: 'Auto Detect',
        value: 'auto'
      } // 'author': { label: 'Author', value: 'author' },
      // 'category': { label: 'Category', value: 'category' },
      // 'tag': { label: 'Tag', value: 'tag' },
      // 'taxonomy': { label: 'Taxonomy', value: 'taxonomy' },
      // 'search': { label: 'Search', value: 'search' },
      // 'index': { label: 'Index', value: 'index' },
      // 'year': { label: 'Year', value: 'year' },
      // 'month': { label: 'Month', value: 'month' },
      // 'date': { label: 'Date', value: 'date' },
      // 'wcCatalog': { label: 'WooCommerce Catalog', value: 'wcCatalog' },
      // 'wcSearch': { label: 'WooCommerce Search', value: 'wcSearch' },

    };
    var archiveLinkToArgsBasic = {
      none: {
        label: 'No Link',
        value: ''
      },
      archiveUrl: {
        label: 'Archive URL',
        value: 'archiveUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      customUrl: {
        label: 'Custom',
        value: 'customUrl'
      }
    };
    let archiveLinkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('archiveLinkToArgs', archiveLinkToArgsBasic);
    var dateFormats = {
      'Y-M-d': {
        label: '2022-May-25',
        value: 'Y-M-d'
      },
      'Y-m-d': {
        label: '2022-05-25',
        value: 'Y-m-d'
      },
      'd-m-y': {
        label: '25-05-2022',
        value: 'd-m-y'
      },
      'd/m/y': {
        label: '25/05/2022',
        value: 'd/m/y'
      },
      'y-m-d': {
        label: '2022-05-25',
        value: 'y-m-d'
      },
      'y/m/d': {
        label: '2022/05/25',
        value: 'y/m/d'
      },
      'D M y': {
        label: 'Sun May 2022',
        value: 'D M y'
      },
      'D M d, y': {
        label: 'Sun May 11, 2022',
        value: 'D M d, y'
      },
      'M D d, y': {
        label: 'May Sun 11, 2022',
        value: 'M D d, y'
      },
      'M d, y': {
        label: 'May 11, 2022',
        value: 'M d, y'
      },
      'd M y': {
        label: '25 May 2022',
        value: 'd M y'
      }
    };
    const [archiveTitleEdited, setarchiveTitleEdited] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('Hello %s');

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      console.log(archiveTitle);
      var archiveType = archiveTitle.options.archiveType;

      if (archiveType == 'auto') {
        //archiveTitleEdited = archiveTitle.options.customLabel;
        setarchiveTitleEdited(archiveTitle.options.customLabel);
      }
    }, [archiveTitle]);

    function setFieldLinkTo(option, index) {
      var options = { ...archiveTitle.options,
        linkTo: option.value
      };
      setAttributes({
        archiveTitle: { ...archiveTitle,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryArchiveTitle(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        archiveTitle[sudoScource] = sudoScourceArgs;
      });
      var archiveTitleX = Object.assign({}, archiveTitle);
      setAttributes({
        archiveTitle: archiveTitleX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, archiveTitleSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleArchiveTitle(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, archiveTitle);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        archiveTitle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, archiveTitleSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleArchiveTitle(sudoScource, key) {
      var object = myStore.deletePropertyDeep(archiveTitle, [sudoScource, key, breakPointX]);
      setAttributes({
        archiveTitle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, archiveTitleSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleArchiveTitle(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, archiveTitle);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        archiveTitle: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var sudoScourceX = { ...prefix[sudoScource]
      };
      sudoScourceX[key] = {};
      prefix[sudoScource] = sudoScourceX;
      setAttributes({
        prefix: { ...prefix
        }
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddArchiveTitle(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, archiveTitle);
      obj[sudoScource] = cssObj;
      setAttributes({
        archiveTitle: obj
      });
      var selector = myStore.getElementSelector(sudoScource, archiveTitleSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddIcon(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, icon);
      obj[sudoScource] = cssObj;
      setAttributes({
        icon: obj
      });
      var selector = myStore.getElementSelector(sudoScource, iconSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPrefix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, prefix);
      obj[sudoScource] = cssObj;
      setAttributes({
        prefix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, prefixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPostfix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, postfix);
      obj[sudoScource] = cssObj;
      setAttributes({
        postfix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, postfixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    String.prototype.strtr = function (dic) {
      const str = this.toString(),
            makeToken = inx => `{{###~${inx}~###}}`,
            tokens = Object.keys(dic).map((key, inx) => ({
        key,
        val: dic[key],
        token: makeToken(inx)
      })),
            tokenizedStr = tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.key, "g"), entry.token), str);

      return tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.token, "g"), entry.val), tokenizedStr);
    };

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      console.log(iconHtml);
      setIconHtml(iconHtml);
    }, [icon]);
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ archiveTitle: archiveTitle });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      customTags['currentYear'] = '2022';
      customTags['currentMonth'] = '07';
      customTags['currentDay'] = '27';
      customTags['currentDate'] = '27';
      customTags['currentTime'] = '27';
      customTags['postPublishDate'] = '123';
      customTags['postModifiedDate'] = '123';
      customTags['termId'] = '';
      customTags['termTitle'] = '';
      customTags['termDescription'] = '';
      customTags['termPostCount'] = '';
      customTags['postTagTitle'] = 'First Tag Title';
      customTags['postTagsTitle'] = 'First Tag Title';
      customTags['postCategoryTitle'] = 'First Category Title';
      customTags['postCategoriesTitle'] = 'First Categories Title';
      customTags['postTermTitle'] = 'First Term Title';
      customTags['postTermsTitle'] = 'List of all terms title';
      customTags['postId'] = '123';
      customTags['postStatus'] = '123';
      customTags['authorId'] = '123';
      customTags['authorName'] = 'Nur Hasan';
      customTags['authorFirstName'] = 'Nur';
      customTags['authorLastName'] = 'Hasan';
      customTags['authorDescription'] = 'Hasan';
      customTags['excerpt'] = 'Here is the post excerpt';
      customTags['rankmathTitle'] = 'Hasan';
      customTags['rankmathPermalink'] = 'Hasan';
      customTags['rankmathExcerpt'] = 'Hasan';
      customTags['rankmathFocusKeyword'] = 'Hasan';
      customTags['rankmathFocusKeywords'] = 'Hasan';
      customTags['rankmathOrgname'] = 'Hasan';
      customTags['rankmathOrgurl'] = 'Hasan';
      customTags['rankmathOrglogo'] = 'Hasan';
      customTags['siteTitle'] = '';
      customTags['siteDescription'] = '';
      customTags['siteTagline'] = '';
      customTags['postMeta'] = '';
      customTags['separator'] = '';
      customTags['searchTerms'] = '';
      customTags['counter'] = '1';
    }, [clientId]); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var archiveTitleSelector = '';

    if (wrapper.options.tag.length != 0) {
      if (archiveTitle.options.linkTo.length > 0) {
        archiveTitleSelector = blockClass + ' a';
      } else {
        archiveTitleSelector = blockClass; //archiveTitleSelector = blockClass + ' .archiveTitle';
      }
    } else {
      archiveTitleSelector = blockClass;
    }

    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';
    const iconSelector = blockClass + ' .postdate-icon';
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
    }, [archiveTitle]);

    var linkAttrObj = () => {
      var sdsd = {};
      archiveTitle.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    var postUrl = archiveTitle.options.customUrl != undefined && archiveTitle.options.customUrl.length > 0 ? archiveTitle.options.customUrl : currentPostUrl;
    const CustomTag = `${wrapper.options.tag}`;
    const CustomTagPostTitle = `${archiveTitle.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-archive-title`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: {
            styles: wrapper.styles,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Archive Title",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Archive Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: archiveTypes,
      buttonTitle: "Choose",
      onChange: (option, index) => {
        var options = { ...archiveTitle.options,
          archiveType: option.value
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      },
      values: ''
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-500 text-white p-3 py-2"
    }, archiveTypes[archiveTitle.options.archiveType].label), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Label"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      className: "mr-2",
      value: archiveTitle.options.customLabel,
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          customLabel: newVal
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    })), (archiveTitle.options.archiveType == 'year' || archiveTitle.options.archiveType == 'month' || archiveTitle.options.archiveType == 'day') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Date Format"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: dateFormats,
      buttonTitle: "Choose",
      onChange: (option, index) => {
        var options = { ...archiveTitle.options,
          dateFormat: option.value
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      },
      values: ''
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Format"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      className: "mr-2",
      value: archiveTitle.options.dateFormat,
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          dateFormat: newVal
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    })), dateFormats[archiveTitle.options.dateFormat] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2 my-3 bg-gray-500 text-white"
    }, dateFormats[archiveTitle.options.dateFormat].label)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: archiveLinkToArgs,
      buttonTitle: archiveTitle.options.linkTo.length == 0 ? 'Choose' : archiveLinkToArgs[archiveTitle.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), archiveTitle.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), archiveTitle.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        var options = { ...archiveTitle.options,
          customUrl: ''
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.__experimentalLinkControl, {
      settings: [],
      value: archiveTitle.options.customUrl,
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          customUrl: newVal.url
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", archiveTitle.options.customUrl.length != 0 ? archiveTitle.options.customUrl : 'No link', " ")))), archiveTitle.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: archiveTitle.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          tag: newVal
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    })), archiveTitle.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: archiveTitle.options.linkTarget,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...archiveTitle.options,
          linkTarget: newVal
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = archiveTitle.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...archiveTitle.options,
          linkAttr: sdsd
        };
        setAttributes({
          archiveTitle: { ...archiveTitle,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), archiveTitle.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Name",
        value: archiveTitle.options.linkAttr[i].id,
        onChange: newVal => {
          archiveTitle.options.linkAttr[i].id = newVal;
          var ssdsd = archiveTitle.options.linkAttr.concat([]);
          var options = { ...archiveTitle.options,
            linkAttr: ssdsd
          };
          setAttributes({
            archiveTitle: { ...archiveTitle,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          archiveTitle.options.linkAttr[i].val = newVal;
          var ssdsd = archiveTitle.options.linkAttr.concat([]);
          var options = { ...archiveTitle.options,
            linkAttr: ssdsd
          };
          setAttributes({
            archiveTitle: { ...archiveTitle,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          archiveTitle.options.linkAttr.splice(i, 1);
          var ssdsd = archiveTitle.options.linkAttr.concat([]);
          var options = { ...archiveTitle.options,
            linkAttr: ssdsd
          };
          setAttributes({
            archiveTitle: { ...archiveTitle,
              options: options
            }
          });
        }
      })));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: archiveTitle,
      onChange: onChangeStyleArchiveTitle,
      onAdd: onAddStyleArchiveTitle,
      onRemove: onRemoveStyleArchiveTitle,
      onBulkAdd: onBulkAddArchiveTitle
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: archiveTitle,
      onChange: onPickCssLibraryArchiveTitle
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_18__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Archive Title',
        value: 'beforeArchiveTitle'
      }, {
        label: 'After Archive Title',
        value: 'afterArchiveTitle'
      }, {
        label: 'Before Prefix',
        value: 'beforePrefix'
      }, {
        label: 'After Prefix',
        value: 'afterPrefix'
      }, {
        label: 'Before Postfix',
        value: 'beforePostfix'
      }, {
        label: 'After Postfix',
        value: 'afterPostfix'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon,
      onBulkAdd: onBulkAddIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: {
            styles: prefix.styles,
            options: options
          }
        }); // setAttributes({ prefix: { text: newVal, class: prefix.options.class, color: prefix.color, backgroundColor: prefix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix,
      onBulkAdd: onBulkAddPrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        }); // setAttributes({ postfix: { text: newVal, class: prefix.options.class, color: postfix.color, backgroundColor: postfix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix,
      onBulkAdd: onBulkAddPostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title link"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, archiveTitleSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps, icon.options.position == 'beforePrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'afterPrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitle.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "archiveTitle",
      onClick: handleLinkClick
    }, linkAttrItems, {
      target: archiveTitle.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforeArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitleEdited, icon.options.position == 'afterArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), archiveTitle.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforeArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitleEdited, icon.options.position == 'afterArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitle.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "archiveTitle",
      onClick: handleLinkClick
    }, linkAttrItems, {
      target: archiveTitle.options.linkTarget,
      href: postUrl
    }), "A", icon.options.position == 'beforeArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitleEdited, icon.options.position == 'afterArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), archiveTitle.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, icon.options.position == 'beforeArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), archiveTitleEdited, icon.options.position == 'afterArchiveTitle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/breadcrumb/index.js":
/*!****************************************!*\
  !*** ./src/blocks/breadcrumb/index.js ***!
  \****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/menu.js");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");

















const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/breadcrumb", {
  apiVersion: 2,
  title: "Breadcrumb",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.55,18a.71.71,0,0,1-.24.53L12.45,22.7a.7.7,0,0,1-.91-1.06L15.79,18l-4.25-3.64a.7.7,0,0,1,.91-1.06l4.86,4.17A.71.71,0,0,1,17.55,18Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M36,18a.69.69,0,0,1-.25.53L30.89,22.7a.7.7,0,1,1-.9-1.06L34.23,18,30,14.36a.7.7,0,1,1,.9-1.06l4.86,4.17A.69.69,0,0,1,36,18Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "15.5",
      width: "10.66",
      height: "5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "2.49",
      y: "17.34",
      width: "5.68",
      height: "1.32"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "19.08",
      y: "15.5",
      width: "10.66",
      height: "5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "21.57",
      y: "17.34",
      width: "5.68",
      height: "1.32"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          class: 'icon',
          position: 'beforeLabel'
          /*beforeLabel, afterLabel, beforeSeparator, afterSeparator*/

        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    separator: {
      type: 'object',
      default: {
        options: {
          class: '',
          text: '»'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    elements: {
      "type": "object",
      "default": {
        options: {
          linkTarget: '_blank',
          showLabel: true,
          showSeparator: true,
          showIcon: false,
          iconPositon: 'beforeLabel' // beforeLabel, afterLabel, beforeSeparator, afterSeparator

        },
        styles: {
          color: {
            Desktop: '#18978F'
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          borderRadius: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        },
        items: [{
          id: 'text',
          label: 'Text',
          customText: '',
          url: '',
          siteIcon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: ''
          },
          options: {
            text: 'You are here: ',
            showSeparator: true
          },
          styles: {
            color: {
              Desktop: ''
            },
            backgroundColor: {
              Desktop: ''
            },
            padding: {
              Desktop: ''
            },
            margin: {
              Desktop: ''
            }
          }
        }, {
          id: 'homePage',
          label: 'Home Page Link',
          customText: '',
          url: '',
          siteIcon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: ''
          },
          options: {
            showSeparator: true
          },
          styles: {
            color: {
              Desktop: ''
            },
            backgroundColor: {
              Desktop: ''
            },
            padding: {
              Desktop: ''
            },
            margin: {
              Desktop: ''
            }
          }
        }, {
          id: 'postTitle',
          label: 'Post Title',
          customText: '',
          url: '',
          siteIcon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: ''
          },
          options: {
            showSeparator: true
          },
          styles: {
            color: {
              Desktop: ''
            },
            backgroundColor: {
              Desktop: ''
            },
            padding: {
              Desktop: ''
            },
            margin: {
              Desktop: ''
            }
          }
        }]
      } // avatar, name, description, id

    },
    schema: {
      type: 'object',
      default: {
        options: {
          enable: true
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var elements = attributes.elements;
    var icon = attributes.icon;
    var label = attributes.label;
    var separator = attributes.separator;
    var schema = attributes.schema;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType'];
    var wrapperSelector = blockClass; // Wrapper CSS Class Selectors

    var itemSelector = blockClass + ' .item';
    var itemLinkSelector = blockClass + ' .item a';
    var iconSelector = blockClass + ' .item .icon';
    var labelSelector = blockClass + ' .item .label';
    var separatorSelector = blockClass + ' .item .separator';
    var [breakPointX, setBreakPointX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(myStore.getBreakPoint());
    var [loading, setLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    var [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      blockCssY.items[itemSelector] = { ...blockCssY.items[itemSelector],
        'font-size': {
          "Desktop": "16px"
        }
      };
      blockCssY.items[itemSelector] = { ...blockCssY.items[itemSelector],
        'display': {
          "Desktop": "inline-block"
        }
      };
      blockCssY.items[itemSelector] = { ...blockCssY.items[itemSelector],
        'list-style': {
          "Desktop": "none"
        }
      };
      blockCssY.items[itemSelector] = { ...blockCssY.items[itemSelector],
        'margin-right': {
          "Desktop": "10px"
        }
      };
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      elements.items.map((x, index) => {
        var styles = x.styles;
        Object.entries(styles).map(y => {
          var attrId = y[0];
          var attrVal = y[1];

          if (Object.keys(attrVal).length != 0) {
            var attrIdX = '';

            if (attrId == 'backgroundColor') {
              attrIdX = 'background-color';
            } else if (attrId == 'textAlign') {
              attrIdX = 'text-align';
            } else {
              attrIdX = attrId;
            }

            if (blockCssY.items[itemSelector + '.item-' + index + ' a'] == undefined) {
              blockCssY.items[itemSelector + '.item-' + index + ' a'] = {};
              blockCssY.items[itemSelector + '.item-' + index + ' a'][attrIdX] = attrVal;
            } else {
              blockCssY.items[itemSelector + '.item-' + index + ' a'][attrIdX] = attrVal;
            }

            if (blockCssY.items[itemSelector + '.item-' + index] == undefined) {
              blockCssY.items[itemSelector + '.item-' + index] = {};
              blockCssY.items[itemSelector + '.item-' + index][attrIdX] = attrVal;
            } else {
              blockCssY.items[itemSelector + '.item-' + index][attrIdX] = attrVal;
            }

            setAttributes({
              blockCssY: {
                items: blockCssY.items
              }
            });
          }
        });
      });
      setTimeout(x => {//setAttributes({ blockCssY: { items: newValuesObjX } });
      }, 2000);
    }, [elements]);
    var linkElementsArgsBasic = [{
      id: 'text',
      label: 'Text',
      customText: 'You are here: ',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        text: 'You are here: ',
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'homePage',
      label: 'Home Page Link',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'frontPage',
      label: 'Front Page Link',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postsPage',
      label: 'Posts Page Link',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postTitle',
      label: 'Post Title',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postAuthor',
      label: 'Post Author',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postDate',
      label: 'Post Date',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        format: 'Y-m-d',
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postDay',
      label: 'Post Day',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        format: '',
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postMonth',
      label: 'Post Month',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        format: '',
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postYear',
      label: 'Post Year',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        format: '',
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postAncestors',
      isPro: true,
      label: 'Post Ancestors',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true,
        count: ''
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postId',
      label: 'Post Id',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postCategory',
      label: 'Post Category',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postTag',
      label: 'Post Tag',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postCategories',
      isPro: true,
      label: 'Post Categories',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true,
        maxCount: 3
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postTags',
      isPro: true,
      label: 'Post Tags',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true,
        maxCount: 3
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postTerm',
      isPro: true,
      label: 'Post Term',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        taxonomy: '',
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'postTerms',
      isPro: true,
      label: 'Post Terms',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        taxonomy: '',
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'termTitle',
      label: 'Term Title',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'termParents',
      isPro: true,
      label: 'Term Parents',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true,
        count: 0
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'termAncestors',
      isPro: true,
      label: 'Term Ancestors',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        taxonomy: '',
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'wcShop',
      label: 'WooCommerce Shop',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'wcAccount',
      label: 'WooCommerce Account',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'wcCart',
      label: 'WooCommerce Cart',
      isPro: true,
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'wcCheckout',
      label: 'WooCommerce Checkout',
      isPro: true,
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'searchText',
      label: 'Search Text',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'archiveTitle',
      label: 'Archive Title',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: '404Text',
      label: '404 Text',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'dateText',
      label: 'Date Text',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true,
        format: 'Y-m-d'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'monthText',
      label: 'Month Text',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true,
        format: 'Y-m'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'yearText',
      label: 'Year Text',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true,
        format: 'Y'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'authorName',
      label: 'Author Name',
      customText: '%s',
      url: '',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: ''
      },
      options: {
        showSeparator: true
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }];
    let linkElementsArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__.applyFilters)('linkElementsArgs', linkElementsArgsBasic);
    let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__.applyFilters)('isProFeature', true);

    function addMedia(option, index) {
      //var isExist = elements.items.find(x => x.label === option.label);
      //if (isExist == undefined) {
      //}
      var elementsX = elements.items.push(option);
      setAttributes({
        elements: { ...elements,
          items: elements.items
        }
      });
    }

    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleElements(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, elements);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        elements: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleElements(sudoScource, key) {
      var object = myStore.deletePropertyDeep(elements, [sudoScource, key, breakPointX]);
      setAttributes({
        elements: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleElements(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, elements);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        elements: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onChangeStyleSeparator(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleSeparator(sudoScource, key) {
      var object = myStore.deletePropertyDeep(separator, [sudoScource, key, breakPointX]);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleSeparator(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        separator: object
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);

    function onChangeBreakPoint(x, index) {
      var asdsdsd = wp.data.dispatch('postgrid-shop').setBreakPoint(x.value);
      asdsdsd.then(res => {
        setBreakPointX(res.breakpoint);
        myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      });
    }

    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-breadcrumb`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Items",
      initialOpen: true
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Add Element"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_15__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkElementsArgs,
      buttonTitle: "Choose",
      onChange: addMedia,
      values: ""
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__.ReactSortable, {
      list: elements.items,
      handle: '.handle',
      setList: item => {
        setAttributes({
          elements: { ...elements,
            items: item
          }
        });
      }
    }, elements.items.map((item, index) => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      key: item.id,
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var elementsX = elements.items.splice(index, 1);
          setAttributes({
            elements: { ...elements,
              items: elements.items
            }
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "handle cursor-pointer hover:bg-blue-500 hover:text-white px-1 py-1"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "mx-2"
      }, item.label)),
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom Label"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: item.customText,
      placeholder: "You Text: %s",
      onChange: newVal => {
        elements.items[index].customText = newVal;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, "%s"), " for output")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: item.url,
      onChange: newVal => {
        elements.items[index].url = newVal;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    })), (item.id == 'postTerms' || item.id == 'postTerm') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: item.options.taxonomy,
      onChange: newVal => {
        elements.items[index].options.taxonomy = newVal;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    })), (item.id == 'termParents' || item.id == 'postAncestors') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Max Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: item.options.count,
      onChange: newVal => {
        elements.items[index].options.count = newVal;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Use ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, "-"), " (negetive sign) to count from end."))), (item.id == 'dateText' || item.id == 'monthText' || item.id == 'yearText' || item.id == 'postDate' || item.id == 'postDay' || item.id == 'postMonth' || item.id == 'postYear') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Date Format"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: item.options.format,
      onChange: newVal => {
        elements.items[index].options.format = newVal;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
      library: item.siteIcon.library,
      srcType: item.siteIcon.srcType,
      iconSrc: item.siteIcon.iconSrc,
      onChange: arg => {
        //var options = { ...icon.options, srcType: arg.srcType, library: arg.library, iconSrc: arg.iconSrc };
        //setAttributes({ icon: { ...icon, options: options } });
        elements.items[index].siteIcon = {
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][breakPointX].icon,
      value: breakPointX
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ColorPalette, {
      value: elements.items[index].styles.color == undefined ? '' : elements.items[index].styles.color[breakPointX],
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_14__["default"],
      enableAlpha: true,
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(elements.items[index].styles.color).length == 0) {
          newValuesObj[breakPointX] = newVal;
        } else {
          newValuesObj = elements.items[index].styles.color;
          newValuesObj[breakPointX] = newVal;
        }

        var styles = { ...elements.items[index].styles,
          color: newValuesObj
        };
        elements.items[index].styles = styles;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Background Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][breakPointX].icon,
      value: breakPointX
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ColorPalette, {
      value: elements.items[index].styles.backgroundColor == undefined ? '' : elements.items[index].styles.backgroundColor[breakPointX],
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_14__["default"],
      enableAlpha: true,
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(elements.items[index].styles.backgroundColor).length == 0) {
          newValuesObj[breakPointX] = newVal;
        } else {
          newValuesObj = elements.items[index].styles.backgroundColor;
          newValuesObj[breakPointX] = newVal;
        }

        var styles = { ...elements.items[index].styles,
          backgroundColor: newValuesObj
        };
        elements.items[index].styles = styles;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        }); // var newValuesObjX = {};
        // if (blockCssY.items[itemSelector] == undefined) {
        //   newValuesObjX[itemSelector] = { ...blockCssY.items[itemSelector], 'background-color': newValuesObj };
        // } else {
        //   newValuesObjX[itemSelector] = { ...blockCssY.items[itemSelector], 'background-color': newValuesObj };
        // }
        //setAttributes({ blockCssY: { items: newValuesObjX } });
      }
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      className: "my-3",
      label: "Display Label?",
      help: elements.options.showLabel ? 'Label is displaying' : 'Label is hidden',
      checked: elements.options.showLabel ? true : false,
      onChange: e => {
        var options = { ...elements.options,
          showLabel: elements.options.showLabel ? false : true
        };
        setAttributes({
          elements: { ...elements,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      className: "my-3",
      disabled: isProFeature,
      label: "Display Icon?",
      help: elements.options.showIcon ? 'Icon is displaying' : 'Icon is hidden',
      checked: elements.options.showIcon ? true : false,
      onChange: e => {
        var options = { ...elements.options,
          showIcon: elements.options.showIcon ? false : true
        };
        setAttributes({
          elements: { ...elements,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, isProFeature && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-amber-400 rounded-sm py-1 px-3  text-white hover:text-white"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
      target: "_blank",
      href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
    }, "Pro")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      className: "my-3",
      label: "Display Separator?",
      help: elements.options.showSeparator ? 'Separator is displaying' : 'Separator is hidden',
      checked: elements.options.showSeparator ? true : false,
      onChange: e => {
        var options = { ...elements.options,
          showSeparator: elements.options.showSeparator ? false : true
        };
        setAttributes({
          elements: { ...elements,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: elements,
      onChange: onChangeStyleElements,
      onAdd: onAddStyleElements,
      onRemove: onRemoveStyleElements
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Label',
        value: 'beforeLabel'
      }, {
        label: 'After Label',
        value: 'afterLabel'
      }, {
        label: 'Before Separator',
        value: 'beforeSeparator'
      }, {
        label: 'After Separator',
        value: 'afterSeparator'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Separator",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Separator Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: separator.options.text,
      onChange: newVal => {
        var options = { ...separator.options,
          text: newVal
        };
        setAttributes({
          separator: { ...separator,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: separator,
      onChange: onChangeStyleSeparator,
      onAdd: onAddStyleSeparator,
      onRemove: onRemoveStyleSeparator
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Schema",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      label: "Enable Schema?",
      help: schema.options.enable ? 'Schema Enabled' : 'Schema Disabled.',
      checked: schema.options.enable ? true : false,
      onChange: e => {
        var options = { ...schema.options,
          enable: schema.options.enable ? false : true
        };
        setAttributes({
          schema: { ...schema,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Item Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, itemSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_17__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_18__["default"], {
      utm: {
        utm_source: 'BlockPostExcerpt',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ol", null, elements.items.map((x, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
        className: 'item item-' + index
      }, x.url.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: x.url
      }, elements.options.showIcon && icon.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: `icon ${x.siteIcon.iconSrc}`
      }), elements.options.showLabel && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "label"
      }, x.customText.length > 0 ? x.customText : x.label), elements.options.showIcon && icon.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: `icon ${x.siteIcon.iconSrc}`
      })), x.url.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, elements.options.showIcon && icon.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: `icon ${x.siteIcon.iconSrc}`
      }), elements.options.showLabel && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "label"
      }, x.customText.length > 0 ? x.customText : x.label), elements.options.showIcon && icon.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: `icon ${x.siteIcon.iconSrc}`
      })), elements.options.showSeparator && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, elements.options.showIcon && icon.options.position == 'beforeSeparator' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: `icon ${x.siteIcon.iconSrc}`
      }), elements.items.length > index && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        class: "separator"
      }, separator.options.text), elements.options.showIcon && icon.options.position == 'afterSeparator' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: `icon ${x.siteIcon.iconSrc}`
      })));
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/content-slider-item/index.js":
/*!*************************************************!*\
  !*** ./src/blocks/content-slider-item/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");













const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/content-slider-item", {
  apiVersion: 2,
  title: "Content Slider Item",
  parent: ['post-grid/content-slider'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "10.4",
      width: "7.49",
      height: "15.2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "28.51",
      y: "10.4",
      width: "7.49",
      height: "15.2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "25.18 26.5 22.47 26.5 22.47 24.7 23.37 24.7 23.37 23.79 25.18 23.79 25.18 26.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.51",
      y: "24.69",
      width: "2.98",
      height: "1.81"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "13.53 26.5 10.82 26.5 10.82 23.79 12.63 23.79 12.63 24.7 13.53 24.7 13.53 26.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "10.82",
      y: "16.07",
      width: "1.81",
      height: "3.86"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "12.63 12.21 10.82 12.21 10.82 9.5 13.53 9.5 13.53 11.3 12.63 11.3 12.63 12.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.51",
      y: "9.5",
      width: "2.98",
      height: "1.81"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "25.18 12.21 23.37 12.21 23.37 11.3 22.47 11.3 22.47 9.5 25.18 9.5 25.18 12.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "23.37",
      y: "16.07",
      width: "1.81",
      height: "3.86"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'flex-item-wrap'
        },
        styles: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);

    function generateElementSudoCss(obj) {
      var stylesObj = {};
      Object.entries(obj).map(args => {
        var sudoSrc = args[0];
        var sudoArgs = args[1];

        if (sudoSrc != 'options') {
          var selector = myStore.getElementSelector(sudoSrc, wrapperSelector); //console.log(selector);
          //console.log(sudoArgs);

          Object.entries(args[1]).map(x => {
            var attr = x[0];
            var cssPropty = myStore.cssAttrParse(attr);

            if (stylesObj[selector] == undefined) {
              stylesObj[selector] = {};
            }

            if (stylesObj[selector][cssPropty] == undefined) {
              stylesObj[selector][cssPropty] = {};
            }

            stylesObj[selector][cssPropty] = x[1];
          });
        } //console.log(stylesObj);

      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      }; //console.log(cssItemsX);

      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      //console.log(wrapper);
      //setAttributes({ customCss: customCss });
      ///myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      var elementCss = generateElementSudoCss(wrapper); //console.log(elementCss);
    }, [wrapper]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const MY_TEMPLATE = [//['core/paragraph', { placeholder: '', content: 'Hello Text...' }],
    ];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-content-slider-item splide__slide border border-dashed`
    }); //const isParentOfSelectedBlock = useSelect((select) => select('core/block-editor').hasSelectedInnerBlock(clientId, true))

    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      //allowedBlocks: ALLOWED_BLOCKS,
      template: MY_TEMPLATE,
      //orientation: 'horizontal',
      templateInsertUpdatesSelection: true,
      renderAppender: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.ButtonBlockAppender
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, innerBlocksProps.children));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-content-slider-item`
    });
    const {
      children,
      ...innerBlocksProps
    } = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps.save(blockProps);
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, children);
  }
});

/***/ }),

/***/ "./src/blocks/content-slider/index.js":
/*!********************************************!*\
  !*** ./src/blocks/content-slider/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _splidejs_react_splide__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @splidejs/react-splide */ "./node_modules/@splidejs/react-splide/dist/js/react-splide.esm.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./variations */ "./src/blocks/content-slider/variations.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _splidejs_splide_dist_css_splide_core_min_css__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @splidejs/splide/dist/css/splide-core.min.css */ "./node_modules/@splidejs/splide/dist/css/splide-core.min.css");


















const {
  RawHTML
} = wp.element;















 //import Splide from '@splidejs/splide';

 //import '@splidejs/splide/dist/css/themes/splide-skyblue.min.css';

var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/content-slider", {
  apiVersion: 2,
  title: "Content Slider",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "9.59",
      width: "8.29",
      height: "16.82"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "27.71",
      y: "9.59",
      width: "8.29",
      height: "16.82"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "11.05",
      y: "9.59",
      width: "13.9",
      height: "16.82"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {}
      }
    },
    navsWrap: {
      type: 'object',
      default: {
        options: {
          class: 'nav-wrap'
        },
        styles: {}
      }
    },
    perv: {
      type: 'object',
      default: {
        options: {
          text: 'Prev',
          class: ''
        },
        styles: {}
      }
    },
    pervIcon: {
      type: 'object',
      default: {
        options: {
          position: 'before',
          class: '',
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-left'
        },
        styles: {}
      }
    },
    next: {
      type: 'object',
      default: {
        options: {
          text: 'Next',
          class: ''
        },
        styles: {}
      }
    },
    nextIcon: {
      type: 'object',
      default: {
        options: {
          position: 'after',
          class: '',
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-right'
        },
        styles: {}
      }
    },
    paginationWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'ul',
          class: ''
        },
        styles: {}
      }
    },
    pagination: {
      type: 'object',
      default: {
        options: {
          tag: 'span',
          class: ''
        },
        styles: {}
      }
    },
    paginationActive: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {}
      }
    },
    sliderOptions: {
      type: 'object',
      default: {}
    },
    sliderOptionsRes: {
      type: 'object',
      default: {}
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var perv = attributes.perv;
    var next = attributes.next;
    var pagination = attributes.pagination;
    var paginationActive = attributes.paginationActive;
    var pervIcon = attributes.pervIcon;
    var nextIcon = attributes.nextIcon;
    var navsWrap = attributes.navsWrap;
    var paginationWrap = attributes.paginationWrap;
    var sliderOptions = attributes.sliderOptions;
    var sliderOptionsRes = attributes.sliderOptionsRes;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());
    //var breakPointX = myStore.getBreakPoint();

    const [breakPointX, setBreakPointX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(myStore != null ? myStore.getBreakPoint() : 'Desktop'); // Wrapper CSS Class Selectors
    //var wrapperSelector = blockClass;

    var wrapperSelector = blockClass + ' .splide';
    var nextSelector = blockClass + ' .splide__arrow--next';
    var pervSelector = blockClass + ' .splide__arrow--prev';
    var nextIconSelector = blockClass + ' .splide__arrow--next .icon';
    var pervIconSelector = blockClass + ' .splide__arrow--prev .icon';
    var navsWrapSelector = blockClass + ' .splide__arrows';
    var paginationWrapSelector = blockClass + ' .splide__pagination';
    var paginationSelector = blockClass + ' .splide__pagination__page';
    var paginationActiveSelector = blockClass + ' .splide__pagination__page.is-active';
    var sliderOptionsArgs = {
      autoplay: {
        label: 'Auto play',
        value: 1
      },
      interval: {
        label: 'Interval',
        value: '500'
      },
      pauseOnHover: {
        label: 'Pause On Hover',
        value: 1
      },
      pauseOnFocus: {
        label: 'Pause On Focus',
        value: 1
      },
      lazyLoad: {
        label: 'Lazy Load',
        value: 1
      },
      preloadPages: {
        label: 'Preload Pages',
        value: 1
      },
      keyboard: {
        label: 'Keyboard',
        value: 1
      },
      wheel: {
        label: 'Wheel',
        value: 1
      },
      direction: {
        label: 'Direction',
        value: 'ltr'
      },
      cover: {
        label: 'Cover',
        value: 0
      },
      rewind: {
        label: 'Rewind',
        value: 0
      },
      speed: {
        label: 'Speed',
        value: 400
      },
      rewindSpeed: {
        label: 'Rewind Speed',
        value: 400
      },
      rewindByDrag: {
        label: 'Rewind By Drag',
        value: 0
      },
      width: {
        label: 'Width',
        value: ''
      },
      height: {
        label: 'Height',
        value: ''
      },
      fixedWidth: {
        label: 'Fixed Width',
        value: ''
      },
      fixedHeight: {
        label: 'Fixed Height',
        value: ''
      },
      heightRatio: {
        label: 'Height Ratio',
        value: ''
      },
      autoWidth: {
        label: 'Auto Width',
        value: 0
      },
      autoHeight: {
        label: 'Auto Height',
        value: 0
      },
      start: {
        label: 'Start',
        value: 0
      },
      perPage: {
        label: 'Per Page',
        value: 3
      },
      perMove: {
        label: 'Per Move',
        value: 3
      },
      focus: {
        label: 'Focus',
        value: 'center'
      },
      gap: {
        label: 'Gap',
        value: '1em'
      },
      padding: {
        label: 'Padding',
        value: ''
      },
      arrows: {
        label: 'Arrows',
        value: 1
      },
      pagination: {
        label: 'Pagination',
        value: 1
      },
      //easing: { label: 'Easing', value: 'cubic-bezier(0.25, 1, 0.5, 1)' },
      paginationKeyboard: {
        label: 'Pagination Keyboard',
        value: 1
      },
      paginationDirection: {
        label: 'Pagination Direction',
        value: 'paginationDirectltrion'
      },
      drag: {
        label: 'Drag',
        value: 1
      },
      noDrag: {
        label: 'No Drag',
        value: 'input, textarea, .rich-text'
      },
      snap: {
        label: 'Snap',
        value: 1
      },
      mediaQuery: {
        label: 'Media Query',
        value: 'max'
      }
    };
    var sliderOptionsArgsRes = {
      rewind: {
        label: 'Rewind',
        value: 0
      },
      speed: {
        label: 'Speed',
        value: 400
      },
      rewindSpeed: {
        label: 'Rewind Speed',
        value: 400
      },
      rewindByDrag: {
        label: 'Rewind By Drag',
        value: 0
      },
      width: {
        label: 'Width',
        value: ''
      },
      height: {
        label: 'Height',
        value: ''
      },
      fixedWidth: {
        label: 'Fixed Width',
        value: ''
      },
      fixedHeight: {
        label: 'Fixed Height',
        value: ''
      },
      heightRatio: {
        label: 'Height Ratio',
        value: ''
      },
      perPage: {
        label: 'Per Page',
        value: 3
      },
      perMove: {
        label: 'Per Move',
        value: 3
      },
      focus: {
        label: 'Focus',
        value: 'center'
      },
      gap: {
        label: 'Gap',
        value: '1em'
      },
      padding: {
        label: 'Padding',
        value: ''
      },
      arrows: {
        label: 'Arrows',
        value: 1
      },
      pagination: {
        label: 'Pagination',
        value: 1
      },
      paginationKeyboard: {
        label: 'Pagination Keyboard',
        value: 1
      },
      paginationDirection: {
        label: 'Pagination Direction',
        value: 'paginationDirectltrion'
      },
      drag: {
        label: 'Drag',
        value: 1
      },
      snap: {
        label: 'Snap',
        value: 1
      },
      keyboard: {
        label: 'Keyboard',
        value: 1
      },
      direction: {
        label: 'Direction',
        value: 'ltr'
      },
      easing: {
        label: 'Easing',
        value: 'cubic-bezier(0.25, 1, 0.5, 1)'
      }
    };

    function onChangeBreakPoint(x, _index) {
      var asdsdsd = wp.data.dispatch('postgrid-shop').setBreakPoint(x.value);
      asdsdsd.then(res => {
        setBreakPointX(res.breakpoint);
        myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      });
      const {
        __experimentalGetPreviewDeviceType: getPreviewDeviceType
      } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/edit-post');
      const gutenbergDeviceType = getPreviewDeviceType();
    }

    const {
      replaceInnerBlocks
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useDispatch)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store);
    const hasInnerBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store).getBlocks(clientId).length > 0, [clientId]); //console.log(JSON.stringify(wp.data.select(blockEditorStore).getBlocks(clientId)));

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      console.log(sliderOptionsRes);
      var args = {};
      Object.entries(sliderOptionsRes).map(item => {
        var id = item[0];
        var vals = item[1];
        Object.entries(vals).map(arg => {
          var view = arg[0];
          var viewVal = arg[1];
          var viewPoint = '';

          if (view == 'Mobile') {
            viewPoint = '360';
          } else if (view == 'Tablet') {
            viewPoint = '780';
          } else if (view == 'Desktop') {
            viewPoint = '1024';
          }

          if (args[viewPoint] == undefined) {
            args[viewPoint] = {};
          }

          if (args[viewPoint][id] == undefined) {
            args[viewPoint][id] = '';
          }

          args[viewPoint][id] = viewVal;
        });
      });
      console.log(args);

      if (Object.entries(args).length > 0) {
        var sliderOptionsX = { ...sliderOptions
        };
        sliderOptionsX['breakpoints'] = args;
        setAttributes({
          sliderOptions: sliderOptionsX
        });
      }
    }, [sliderOptionsRes]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    const addSlide = () => {
      var childBlocks = wp.data.select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store).getBlocks(clientId);
      const slide = (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlock)('post-grid/content-slider-item');
      const position = childBlocks.length;
      (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').insertBlock(slide, position, clientId); //setActiveTab(slide.clientId);
    };

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function applyFlex(attr, newVal) {
      onChangeStyleWrapper('styles', newVal, attr);
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleNext(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, next);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        next: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, nextSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleNext(sudoScource, key) {
      var object = myStore.deletePropertyDeep(next, [sudoScource, key, breakPointX]);
      setAttributes({
        next: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, nextSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleNext(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, next);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        next: object
      });
    }

    function onBulkAddNext(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, next);
      obj[sudoScource] = cssObj;
      setAttributes({
        next: obj
      });
      var selector = myStore.getElementSelector(sudoScource, nextSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStylePrev(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, perv);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        perv: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, pervSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrev(sudoScource, key) {
      var object = myStore.deletePropertyDeep(perv, [sudoScource, key, breakPointX]);
      setAttributes({
        perv: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, pervSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrev(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, perv);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        perv: object
      });
    }

    function onBulkAddPrev(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, perv);
      obj[sudoScource] = cssObj;
      setAttributes({
        perv: obj
      });
      var selector = myStore.getElementSelector(sudoScource, pervSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStylePagination(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, pagination);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        pagination: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePagination(sudoScource, key) {
      var object = myStore.deletePropertyDeep(pagination, [sudoScource, key, breakPointX]);
      setAttributes({
        pagination: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePagination(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, pagination);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        pagination: object
      });
    }

    function onBulkAddPagination(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, pagination);
      obj[sudoScource] = cssObj;
      setAttributes({
        pagination: obj
      });
      var selector = myStore.getElementSelector(sudoScource, paginationSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStylePaginationActive(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, paginationActive);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        paginationActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationActiveSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePaginationActive(sudoScource, key) {
      var object = myStore.deletePropertyDeep(paginationActive, [sudoScource, key, breakPointX]);
      setAttributes({
        paginationActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationActiveSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePaginationActive(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, paginationActive);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        paginationActive: object
      });
    }

    function onBulkAddPaginationActive(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, paginationActive);
      obj[sudoScource] = cssObj;
      setAttributes({
        paginationActive: obj
      });
      var selector = myStore.getElementSelector(sudoScource, paginationActiveSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStylePaginationWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, paginationWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        paginationWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePaginationWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(paginationWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        paginationWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePaginationWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, paginationWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        paginationWrap: object
      });
    }

    function onBulkAddPaginationWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, paginationWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        paginationWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, paginationWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleNextIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, nextIcon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        nextIcon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, nextIconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleNextIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(nextIcon, [sudoScource, key, breakPointX]);
      setAttributes({
        nextIcon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, nextIconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleNextIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, nextIcon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        nextIcon: object
      });
    }

    function onBulkAddNextIcon(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, nextIcon);
      obj[sudoScource] = cssObj;
      setAttributes({
        nextIcon: obj
      });
      var selector = myStore.getElementSelector(sudoScource, nextIconSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStylePervIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, pervIcon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        pervIcon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, pervIconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePervIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(pervIcon, [sudoScource, key, breakPointX]);
      setAttributes({
        pervIcon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, pervIconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePervIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, pervIcon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        pervIcon: object
      });
    }

    function onBulkAddPervIcon(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, pervIcon);
      obj[sudoScource] = cssObj;
      setAttributes({
        pervIcon: obj
      });
      var selector = myStore.getElementSelector(sudoScource, pervIconSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleNavsWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, navsWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        navsWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navsWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleNavsWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(navsWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        navsWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navsWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleNavsWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, navsWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        navsWrap: object
      });
    }

    function onBulkAddNavsWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, navsWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        navsWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, navsWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    const [nextIconHtml, setNextIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    const [pervIconHtml, setPervIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = nextIcon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setNextIconHtml(iconHtml);
    }, [nextIcon.options]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = pervIcon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setPervIconHtml(iconHtml);
    }, [pervIcon.options]);
    const ALLOWED_BLOCKS = ['post-grid/content-slider-navs', 'post-grid/content-slider-loop', 'post-grid/content-slider-item'];
    const MY_TEMPLATE = [['post-grid/content-slider-item', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-content-slider  `
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      allowedBlocks: ALLOWED_BLOCKS,
      template: MY_TEMPLATE,
      orientation: 'horizontal' //templateInsertUpdatesSelection: true,
      //renderAppender: InnerBlocks.ButtonBlockAppender

    });

    var RemoveSliderArg = function (_ref) {
      let {
        index
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var sliderOptionsX = { ...sliderOptions
          };
          delete sliderOptionsX[index];
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"]
      }));
    };

    var RemoveSliderArgRes = function (_ref2) {
      let {
        index
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          console.log(index);
          var sliderOptionsResX = { ...sliderOptionsRes
          };
          delete sliderOptionsResX[index];
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"]
      }));
    };

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-600 mx-3 my-2 cursor-pointer hover:text-white font-bold text-[16px] px-5 py-2 block text-center text-white rounded",
      onClick: ev => {
        addSlide();
      }
    }, "Add Slide Item"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Slider Options",
      initialOpen: true
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "normal",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'normal',
        title: 'Normal',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-normal'
      }, {
        name: 'responsive',
        title: 'Responsive',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-responsive'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "normal"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Slider Options"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: 'Choose',
      options: sliderOptionsArgs,
      onChange: (option, index) => {
        var sliderOptionsX = { ...sliderOptions
        };
        sliderOptionsX[index] = option.value;
        setAttributes({
          sliderOptions: sliderOptionsX
        });
      },
      values: ""
    })), Object.entries(sliderOptions).map((item, index) => {
      var id = item[0];
      var value = item[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, id == 'autoplay' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Autoplay?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'rewind' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Rewind?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'interval' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Interval?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        type: "number",
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'speed' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Speed?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        type: "number",
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'rewindSpeed' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Rewind Speed?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        type: "number",
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'start' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Start?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        type: "number",
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'perPage' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Per Page?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        type: "number",
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'perMove' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Per Move?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        type: "number",
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'gap' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Gap?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'padding' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Padding?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'focus' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Focus?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'width' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Width?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'height' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Height?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'fixedWidth' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Fixed Width?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'fixedHeight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Fixed Height?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'heightRatio' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Height Ratio?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'easing' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Easing?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'pauseOnHover' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pause On Hover?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'pauseOnFocus' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pause On Focus?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'rewindByDrag' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Rewind By Drag?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'autoWidth' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Auto Width?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'autoHeight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Auto Height?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'arrows' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Navigation?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'pagination' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pagination?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'paginationKeyboard' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pagination Keyboard?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'drag' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Drag?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'snap' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Snap?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'noDrag' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "noDrag?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value,
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'paginationDirection' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pagination Direction?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'ltr',
          value: 'ltr'
        }, {
          label: 'rtl',
          value: 'rtl'
        }, {
          label: 'ttb',
          value: 'ttb'
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'direction' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Direction?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'ltr',
          value: 'ltr'
        }, {
          label: 'rtl',
          value: 'rtl'
        }, {
          label: 'ttb',
          value: 'ttb'
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'lazyLoad' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "LazyLoad?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }, {
          label: 'Nearby',
          value: 'nearby'
        }, {
          label: 'Sequential',
          value: 'sequential'
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'keyboard' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Keyboard?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }, {
          label: 'global',
          value: 'global'
        }, {
          label: 'focused',
          value: 'focused'
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'mediaQuery' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Media Query?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'min',
          value: 'min'
        }, {
          label: 'max',
          value: 'max'
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'wheel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Wheel?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })), id == 'cover' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArg, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Cover?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value,
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsX = { ...sliderOptions
          };
          sliderOptionsX[id] = newVal;
          setAttributes({
            sliderOptions: sliderOptionsX
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "responsive"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Slider Options"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: 'Choose',
      options: sliderOptionsArgsRes,
      onChange: (option, index) => {
        var sliderOptionsResX = { ...sliderOptionsRes
        };

        if (sliderOptionsResX[index] == undefined) {
          sliderOptionsResX[index] = {};
        }

        if (sliderOptionsResX[index][breakPointX] == undefined) {
          sliderOptionsResX[index][breakPointX] = option.value;
        }

        setAttributes({
          sliderOptionsRes: sliderOptionsResX
        });
      },
      values: ""
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][breakPointX].icon,
      value: breakPointX
    })), Object.entries(sliderOptionsRes).map((item, index) => {
      var id = item[0];
      var value = item[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, id == 'autoplay' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Autoplay?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'rewind' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Rewind?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'interval' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Interval?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        type: "number",
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'speed' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Speed?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        type: "number",
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'rewindSpeed' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Rewind Speed?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        type: "number",
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'start' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Start?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        type: "number",
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'perPage' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Per Page?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        type: "number",
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'perMove' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Per Move?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        type: "number",
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'gap' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Gap?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'padding' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Padding?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'focus' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Focus?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'width' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Width?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'height' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Height?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'fixedWidth' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Fixed Width?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'fixedHeight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Fixed Height?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'heightRatio' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Height Ratio?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'pauseOnHover' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pause On Hover?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'pauseOnFocus' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pause On Focus?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'rewindByDrag' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Rewind By Drag?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'autoWidth' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Auto Width?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'autoHeight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Auto Height?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'arrows' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Navigation?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'pagination' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pagination?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'paginationKeyboard' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pagination Keyboard?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'drag' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Drag?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'snap' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Snap?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'noDrag' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "No Drag?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'paginationDirection' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Pagination Direction?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'ltr',
          value: 'ltr'
        }, {
          label: 'rtl',
          value: 'rtl'
        }, {
          label: 'ttb',
          value: 'ttb'
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'direction' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Direction?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'ltr',
          value: 'ltr'
        }, {
          label: 'rtl',
          value: 'rtl'
        }, {
          label: 'ttb',
          value: 'ttb'
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'lazyLoad' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "LazyLoad?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }, {
          label: 'Nearby',
          value: 'nearby'
        }, {
          label: 'Sequential',
          value: 'sequential'
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'keyboard' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Keyboard?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }, {
          label: 'global',
          value: 'global'
        }, {
          label: 'focused',
          value: 'focused'
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'mediaQuery' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Media Query?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'min',
          value: 'min'
        }, {
          label: 'max',
          value: 'max'
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'wheel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Wheel?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })), id == 'cover' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveSliderArgRes, {
        index: id
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Cover?")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: value[breakPointX] == undefined ? "" : value[breakPointX],
        options: [{
          label: 'True',
          value: 1
        }, {
          label: 'False',
          value: 0
        }],
        onChange: newVal => {
          var sliderOptionsResX = { ...sliderOptionsRes
          };

          if (sliderOptionsResX[id][breakPointX] == undefined) {
            sliderOptionsResX[id][breakPointX] = '';
          }

          sliderOptionsResX[id][breakPointX] = newVal;
          setAttributes({
            sliderOptionsRes: sliderOptionsResX
          });
        }
      })));
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Navigation",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Nav Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: navsWrap,
      onChange: onChangeStyleNavsWrap,
      onAdd: onAddStyleNavsWrap,
      onRemove: onRemoveStyleNavsWrap,
      onBulkAdd: onBulkAddNavsWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Prev",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Previuos Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      value: perv.options.text,
      onChange: newVal => {
        var options = { ...perv.options,
          text: newVal
        };
        setAttributes({
          perv: { ...perv,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: perv,
      onChange: onChangeStylePrev,
      onAdd: onAddStylePrev,
      onRemove: onRemoveStylePrev,
      onBulkAdd: onBulkAddPrev
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Prev Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_23__["default"], {
      library: pervIcon.options.library,
      srcType: pervIcon.options.srcType,
      iconSrc: pervIcon.options.iconSrc,
      onChange: arg => {
        var options = { ...pervIcon.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          pervIcon: { ...pervIcon,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: pervIcon.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'After',
        value: 'after'
      }, {
        label: 'Before',
        value: 'before'
      }],
      onChange: newVal => {
        var options = { ...pervIcon.options,
          position: newVal
        };
        setAttributes({
          pervIcon: { ...pervIcon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: pervIcon,
      onChange: onChangeStylePervIcon,
      onAdd: onAddStylePervIcon,
      onRemove: onRemoveStylePervIcon,
      onBulkAdd: onBulkAddPervIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Next",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Previuos Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      value: next.options.text,
      onChange: newVal => {
        var options = { ...next.options,
          text: newVal
        };
        setAttributes({
          next: { ...next,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: next,
      onChange: onChangeStyleNext,
      onAdd: onAddStyleNext,
      onRemove: onRemoveStyleNext,
      onBulkAdd: onBulkAddNext
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Next Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_23__["default"], {
      library: nextIcon.options.library,
      srcType: nextIcon.options.srcType,
      iconSrc: nextIcon.options.iconSrc,
      onChange: arg => {
        var options = { ...nextIcon.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          nextIcon: { ...nextIcon,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: nextIcon.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'After',
        value: 'after'
      }, {
        label: 'Before',
        value: 'before'
      }],
      onChange: newVal => {
        var options = { ...nextIcon.options,
          position: newVal
        };
        setAttributes({
          nextIcon: { ...nextIcon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: nextIcon,
      onChange: onChangeStyleNextIcon,
      onAdd: onAddStyleNextIcon,
      onRemove: onRemoveStyleNextIcon,
      onBulkAdd: onBulkAddNextIcon
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Pagination",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Pagination Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: paginationWrap,
      onChange: onChangeStylePaginationWrap,
      onAdd: onAddStylePaginationWrap,
      onRemove: onRemoveStylePaginationWrap,
      onBulkAdd: onBulkAddPaginationWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Pagination Idle",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: pagination,
      onChange: onChangeStylePagination,
      onAdd: onAddStylePagination,
      onRemove: onRemoveStylePagination,
      onBulkAdd: onBulkAddPagination
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Pagination Active",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: paginationActive,
      onChange: onChangeStylePaginationActive,
      onAdd: onAddStylePaginationActive,
      onRemove: onRemoveStylePaginationActive,
      onBulkAdd: onBulkAddPaginationActive
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: ""
    }, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400 hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)([['post-grid/content-slider-item', {}]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_17__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 bg-gray-400 cursor-pointer hover:bg-gray-500 relative",
        onClick: ev => {
          if (variation.isPro) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var atts = variation.atts;
          var wrapper = { ...atts.wrapper
          };
          var paginationWrap = { ...atts.paginationWrap
          };
          var pagination = { ...atts.pagination
          };
          var paginationActive = { ...atts.paginationActive
          };
          var perv = { ...atts.perv
          };
          var next = { ...atts.next
          };
          var pervIcon = { ...atts.pervIcon
          };
          var nextIcon = { ...atts.nextIcon
          };
          var navsWrap = { ...atts.navsWrap
          };
          var blockCssY = { ...atts.blockCssY
          };
          var customCss = { ...atts.customCss
          };
          var sliderOptions = { ...atts.sliderOptions
          };
          var sliderOptionsRes = { ...atts.sliderOptionsRes
          };
          var blockCssObj = {};
          blockCssObj[wrapperSelector] = wrapper;
          blockCssObj[paginationSelector] = pagination;
          blockCssObj[pervIconSelector] = pervIcon;
          blockCssObj[paginationActiveSelector] = paginationActive;
          blockCssObj[nextIconSelector] = nextIcon;
          blockCssObj[pervSelector] = perv;
          blockCssObj[nextSelector] = next;
          blockCssObj[paginationWrapSelector] = paginationWrap;
          blockCssObj[navsWrapSelector] = navsWrap;
          setAttributes({
            wrapper: wrapper,
            perv: perv,
            next: next,
            pagination: pagination,
            pervIcon: pervIcon,
            paginationActive: paginationActive,
            nextIcon: nextIcon,
            paginationWrap: paginationWrap,
            navsWrap: navsWrap,
            customCss: customCss,
            sliderOptions: sliderOptions,
            sliderOptionsRes: sliderOptionsRes
          });
          var blockCssRules = myStore.getBlockCssRules(blockCssObj);
          var items = { ...blockCssY.items,
            ...blockCssRules
          };
          setAttributes({
            blockCssY: {
              items: items
            }
          });
          replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)(variation.innerBlocks), true);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_splidejs_react_splide__WEBPACK_IMPORTED_MODULE_10__.Splide, {
      hasTrack: false,
      options: sliderOptions
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_splidejs_react_splide__WEBPACK_IMPORTED_MODULE_10__.SplideTrack, null, innerBlocksProps.children), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "splide__arrows"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "perv splide__arrow splide__arrow--prev"
    }, pervIcon.options.position == 'before' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "icon",
      dangerouslySetInnerHTML: {
        __html: pervIconHtml
      }
    }), perv.options.text.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, " ", perv.options.text, " "), pervIcon.options.position == 'after' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "icon",
      dangerouslySetInnerHTML: {
        __html: pervIconHtml
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "next splide__arrow splide__arrow--next"
    }, nextIcon.options.position == 'before' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "icon",
      dangerouslySetInnerHTML: {
        __html: nextIconHtml
      }
    }), next.options.text.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, " ", next.options.text, " "), nextIcon.options.position == 'after' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "icon",
      dangerouslySetInnerHTML: {
        __html: nextIconHtml
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ul", {
      class: "splide__pagination "
    })))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var perv = attributes.perv;
    var next = attributes.next;
    var pagination = attributes.pagination;
    var paginationActive = attributes.paginationActive;
    var pervIcon = attributes.pervIcon;
    var nextIcon = attributes.nextIcon;
    var navsWrap = attributes.navsWrap;
    var paginationWrap = attributes.paginationWrap;
    var sliderOptions = attributes.sliderOptions;
    var sliderOptionsRes = attributes.sliderOptionsRes;
    var blockId = attributes.blockId;
    var pervIconHtml = `<span class="${pervIcon.options.iconSrc}"></span>`;
    var nextIconHtml = `<span class="${nextIcon.options.iconSrc}"></span>`;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-content-slider`
    });
    const {
      children,
      ...innerBlocksProps
    } = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps.save(blockProps);
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, children); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/content-slider/variations.js":
/*!*************************************************!*\
  !*** ./src/blocks/content-slider/variations.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: 'preset-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-1'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-1'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        class: ''
      },
      styles: {
        padding: {
          Desktop: '50px 0px 50px 0px'
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        position: {
          Desktop: 'absolute'
        },
        left: {
          Desktop: '0px'
        },
        top: {
          Desktop: '0px'
        }
      }
    },
    perv: {
      options: {
        text: 'Prev',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    pervIcon: {
      options: {
        position: 'before',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-left'
      },
      styles: {}
    },
    next: {
      options: {
        text: 'Next',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    nextIcon: {
      options: {
        position: 'after',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-right'
      },
      styles: {}
    },
    paginationWrap: {
      options: {
        tag: 'ul',
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        paddingTop: {
          Desktop: '30px'
        }
      }
    },
    pagination: {
      options: {
        tag: 'span',
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        width: {
          Desktop: '15px'
        },
        height: {
          Desktop: '15px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        borderRadius: {
          Desktop: ' 20px 20px 20px 20px'
        }
      }
    },
    paginationActive: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#0003B6F5'
        }
      }
    },
    sliderOptions: {
      perPage: 3,
      perMove: 1,
      gap: '1em'
    },
    sliderOptionsRes: {}
  },
  innerBlocks: [['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "70.84",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "76.15",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "81.45",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "4.39",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "7.81",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "57.76",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "61.18",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "53.37",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "111.13",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "114.54",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "106.73",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "12.25",
    y: "7.53",
    width: "9.63",
    height: "5.68"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M16.45,11.77a.13.13,0,0,1-.11,0,.15.15,0,0,1,0-.21l1.13-1.14L16.34,9.24A.16.16,0,1,1,16.56,9l1.35,1.35-1.35,1.35A.13.13,0,0,1,16.45,11.77Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "7.53",
    width: "9.63",
    height: "5.68",
    transform: "translate(9.63 20.74) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M5.44,9a.16.16,0,0,1,.11,0,.16.16,0,0,1,0,.22L4.41,10.37l1.14,1.14a.16.16,0,1,1-.22.22L4.08,10.48a.16.16,0,0,1,0-.22L5.33,9A.16.16,0,0,1,5.44,9Z"
  }))
}, {
  name: 'preset-2',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-2'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-2'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        class: ''
      },
      styles: {
        padding: {
          Desktop: '50px 0px 50px 0px'
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        position: {
          Desktop: 'absolute'
        },
        left: {
          Desktop: '0px'
        },
        top: {
          Desktop: '0px'
        },
        justifyContent: {
          Desktop: 'center'
        },
        width: {
          Desktop: '100%'
        }
      }
    },
    perv: {
      options: {
        text: 'Prev',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    pervIcon: {
      options: {
        position: 'before',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-left'
      },
      styles: {}
    },
    next: {
      options: {
        text: 'Next',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    nextIcon: {
      options: {
        position: 'after',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-right'
      },
      styles: {}
    },
    paginationWrap: {
      options: {
        tag: 'ul',
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        paddingTop: {
          Desktop: '30px'
        }
      }
    },
    pagination: {
      options: {
        tag: 'span',
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        width: {
          Desktop: '15px'
        },
        height: {
          Desktop: '15px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        borderRadius: {
          Desktop: ' 20px 20px 20px 20px'
        }
      }
    },
    paginationActive: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#0003B6F5'
        }
      }
    },
    sliderOptions: {
      perPage: 3,
      perMove: 1,
      gap: '1em'
    },
    sliderOptionsRes: {}
  },
  innerBlocks: [['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "70.84",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "76.15",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "81.45",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "4.39",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "7.81",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "57.76",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "61.18",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "53.37",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "111.13",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "114.54",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "106.73",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "77.46",
    y: "7.53",
    width: "9.63",
    height: "5.68"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M81.65,11.77a.13.13,0,0,1-.11,0,.14.14,0,0,1,0-.21l1.13-1.14L81.54,9.24A.16.16,0,1,1,81.76,9l1.35,1.35-1.35,1.35A.13.13,0,0,1,81.65,11.77Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "65.2",
    y: "7.53",
    width: "9.63",
    height: "5.68",
    transform: "translate(140.04 20.74) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M70.64,9a.16.16,0,0,1,.11,0,.16.16,0,0,1,0,.22l-1.13,1.13,1.13,1.14a.16.16,0,1,1-.22.22l-1.24-1.25a.16.16,0,0,1,0-.22L70.53,9A.16.16,0,0,1,70.64,9Z"
  }))
}, {
  name: 'preset-3',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-3'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-3'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        class: ''
      },
      styles: {
        padding: {
          Desktop: '50px 0px 50px 0px'
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        position: {
          Desktop: 'absolute'
        },
        right: {
          Desktop: '0px'
        },
        top: {
          Desktop: '0px'
        }
      }
    },
    perv: {
      options: {
        text: 'Prev',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    pervIcon: {
      options: {
        position: 'before',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-left'
      },
      styles: {}
    },
    next: {
      options: {
        text: 'Next',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    nextIcon: {
      options: {
        position: 'after',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-right'
      },
      styles: {}
    },
    paginationWrap: {
      options: {
        tag: 'ul',
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        paddingTop: {
          Desktop: '30px'
        }
      }
    },
    pagination: {
      options: {
        tag: 'span',
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        width: {
          Desktop: '15px'
        },
        height: {
          Desktop: '15px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        borderRadius: {
          Desktop: ' 20px 20px 20px 20px'
        }
      }
    },
    paginationActive: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#0003B6F5'
        }
      }
    },
    sliderOptions: {
      perPage: 3,
      perMove: 1,
      gap: '1em'
    },
    sliderOptionsRes: {}
  },
  innerBlocks: [['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "70.84",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "76.15",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "81.45",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "4.39",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "7.81",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "57.76",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "61.18",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "53.37",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "111.13",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "114.54",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "106.73",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "142.66",
    y: "7.53",
    width: "9.63",
    height: "5.68"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M146.85,11.77a.13.13,0,0,1-.11,0,.15.15,0,0,1,0-.21l1.14-1.14-1.14-1.13A.16.16,0,0,1,147,9l1.36,1.35L147,11.72A.13.13,0,0,1,146.85,11.77Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "130.41",
    y: "7.53",
    width: "9.63",
    height: "5.68",
    transform: "translate(270.44 20.74) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M135.84,9A.16.16,0,0,1,136,9a.16.16,0,0,1,0,.22l-1.13,1.13L136,11.51a.16.16,0,0,1-.22.22l-1.24-1.25a.16.16,0,0,1,0-.22L135.73,9A.16.16,0,0,1,135.84,9Z"
  }))
}, {
  name: 'preset-4',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-4'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-4'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        class: ''
      },
      styles: {
        padding: {
          Desktop: '50px 0px 50px 0px'
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        position: {
          Desktop: 'absolute'
        },
        left: {
          Desktop: '0px'
        },
        top: {
          Desktop: '0px'
        },
        justifyContent: {
          Desktop: 'space-between'
        },
        width: {
          Desktop: '100%'
        }
      }
    },
    perv: {
      options: {
        text: 'Prev',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    pervIcon: {
      options: {
        position: 'before',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-left'
      },
      styles: {}
    },
    next: {
      options: {
        text: 'Next',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    nextIcon: {
      options: {
        position: 'after',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-right'
      },
      styles: {}
    },
    paginationWrap: {
      options: {
        tag: 'ul',
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        paddingTop: {
          Desktop: '30px'
        }
      }
    },
    pagination: {
      options: {
        tag: 'span',
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        width: {
          Desktop: '15px'
        },
        height: {
          Desktop: '15px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        borderRadius: {
          Desktop: ' 20px 20px 20px 20px'
        }
      }
    },
    paginationActive: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#0003B6F5'
        }
      }
    },
    sliderOptions: {
      perPage: 3,
      perMove: 1,
      gap: '1em'
    },
    sliderOptionsRes: {}
  },
  innerBlocks: [['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "70.84",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "76.15",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "81.45",
    cy: "73.83",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "4.39",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "7.81",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "57.76",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "61.18",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "53.37",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "111.13",
    y: "53.99",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "114.54",
    y: "57.47",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "106.73",
    y: "19.41",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "142.66",
    y: "7.53",
    width: "9.63",
    height: "5.68"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M146.85,11.77a.13.13,0,0,1-.11,0,.15.15,0,0,1,0-.21l1.14-1.14-1.14-1.13A.16.16,0,0,1,147,9l1.36,1.35L147,11.72A.13.13,0,0,1,146.85,11.77Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "7.53",
    width: "9.63",
    height: "5.68",
    transform: "translate(9.63 20.74) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M5.44,9a.16.16,0,0,1,.11,0,.16.16,0,0,1,0,.22L4.41,10.37l1.14,1.14a.16.16,0,1,1-.22.22L4.08,10.48a.16.16,0,0,1,0-.22L5.33,9A.16.16,0,0,1,5.44,9Z"
  }))
}, {
  name: 'preset-5',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-5'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-5'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        class: ''
      },
      styles: {
        padding: {
          Desktop: '50px 0px 50px 0px'
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        "display": {
          "Desktop": "flex"
        },
        "position": {
          "Desktop": "absolute"
        },
        "left": {
          "Desktop": "0px"
        },
        "top": {
          "Desktop": "50%"
        },
        "justifyContent": {
          "Desktop": "space-between"
        },
        "width": {
          "Desktop": "100%"
        },
        "transform": {
          "Desktop": "translateY(-50%) "
        }
      }
    },
    perv: {
      options: {
        text: 'Prev',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    pervIcon: {
      options: {
        position: 'before',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-left'
      },
      styles: {}
    },
    next: {
      options: {
        text: 'Next',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    nextIcon: {
      options: {
        position: 'after',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-right'
      },
      styles: {}
    },
    paginationWrap: {
      options: {
        tag: 'ul',
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        paddingTop: {
          Desktop: '30px'
        }
      }
    },
    pagination: {
      options: {
        tag: 'span',
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        width: {
          Desktop: '15px'
        },
        height: {
          Desktop: '15px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        borderRadius: {
          Desktop: ' 20px 20px 20px 20px'
        }
      }
    },
    paginationActive: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#0003B6F5'
        }
      }
    },
    sliderOptions: {
      perPage: 3,
      perMove: 1,
      gap: '1em'
    },
    sliderOptionsRes: {}
  },
  innerBlocks: [['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "70.84",
    cy: "67.89",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "76.14",
    cy: "67.89",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "81.45",
    cy: "67.89",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "4.39",
    y: "48.05",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "7.81",
    y: "51.53",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "13.47",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "57.76",
    y: "48.05",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "61.18",
    y: "51.53",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "53.37",
    y: "13.47",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "111.13",
    y: "48.05",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "114.54",
    y: "51.53",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "106.73",
    y: "13.47",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "142.66",
    y: "24.82",
    width: "9.63",
    height: "5.68"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M146.85,29.06a.16.16,0,0,1-.11,0,.16.16,0,0,1,0-.22l1.14-1.13-1.14-1.13a.16.16,0,0,1,.22-.22l1.36,1.35L147,29A.16.16,0,0,1,146.85,29.06Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "24.82",
    width: "9.63",
    height: "5.68",
    transform: "translate(9.63 55.32) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M5.44,26.26a.16.16,0,0,1,.11,0,.16.16,0,0,1,0,.22L4.41,27.66l1.14,1.13a.16.16,0,0,1-.22.22L4.08,27.77a.16.16,0,0,1,0-.22l1.25-1.24A.16.16,0,0,1,5.44,26.26Z"
  }))
}, {
  name: 'preset-6',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-6'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-6'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        class: ''
      },
      styles: {
        padding: {
          Desktop: '50px 0px 50px 0px'
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        position: {
          Desktop: 'absolute'
        },
        left: {
          Desktop: '0px'
        },
        bottom: {
          Desktop: '0px'
        }
      }
    },
    perv: {
      options: {
        text: 'Prev',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    pervIcon: {
      options: {
        position: 'before',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-left'
      },
      styles: {}
    },
    next: {
      options: {
        text: 'Next',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    nextIcon: {
      options: {
        position: 'after',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-right'
      },
      styles: {}
    },
    paginationWrap: {
      options: {
        tag: 'ul',
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        position: {
          Desktop: 'absolute'
        },
        width: {
          Desktop: '100%'
        },
        top: {
          Desktop: '0px'
        },
        left: {
          Desktop: '0px'
        }
      }
    },
    pagination: {
      options: {
        tag: 'span',
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        width: {
          Desktop: '15px'
        },
        height: {
          Desktop: '15px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        borderRadius: {
          Desktop: ' 20px 20px 20px 20px'
        }
      }
    },
    paginationActive: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#0003B6F5'
        }
      }
    },
    sliderOptions: {
      perPage: 3,
      perMove: 1,
      gap: '1em'
    },
    sliderOptionsRes: {}
  },
  innerBlocks: [['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "70.84",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "76.15",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "81.45",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "4.39",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "7.81",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "57.76",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "61.18",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "53.37",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "111.13",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "114.54",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "106.73",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "12.25",
    y: "68.75",
    width: "9.63",
    height: "5.68"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M16.45,73a.15.15,0,0,1-.11,0,.16.16,0,0,1,0-.22l1.13-1.14-1.13-1.13a.16.16,0,0,1,.22-.22l1.35,1.35L16.56,73A.15.15,0,0,1,16.45,73Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "68.75",
    width: "9.63",
    height: "5.68",
    transform: "translate(9.63 143.19) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M5.44,70.19a.16.16,0,0,1,.11,0,.16.16,0,0,1,0,.22L4.41,71.59l1.14,1.14a.16.16,0,0,1-.22.22L4.08,71.7a.16.16,0,0,1,0-.22l1.25-1.24A.16.16,0,0,1,5.44,70.19Z"
  }))
}, {
  name: 'preset-7',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-7'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-7'),
  isPro: true,
  atts: {
    wrapper: {
      options: {
        class: ''
      },
      styles: {
        padding: {
          Desktop: '70px 0px 50px 0px'
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        position: {
          Desktop: 'absolute'
        },
        right: {
          Desktop: '0px'
        },
        bottom: {
          Desktop: '0px'
        }
      }
    },
    perv: {
      options: {
        text: 'Prev',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    pervIcon: {
      options: {
        position: 'before',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-left'
      },
      styles: {}
    },
    next: {
      options: {
        text: 'Next',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    nextIcon: {
      options: {
        position: 'after',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-right'
      },
      styles: {}
    },
    paginationWrap: {
      options: {
        tag: 'ul',
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        position: {
          Desktop: 'absolute'
        },
        width: {
          Desktop: '100%'
        },
        top: {
          Desktop: '0px'
        },
        left: {
          Desktop: '0px'
        }
      }
    },
    pagination: {
      options: {
        tag: 'span',
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        width: {
          Desktop: '15px'
        },
        height: {
          Desktop: '15px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        borderRadius: {
          Desktop: ' 20px 20px 20px 20px'
        }
      }
    },
    paginationActive: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#0003B6F5'
        }
      }
    },
    sliderOptions: {
      perPage: 3,
      perMove: 1,
      gap: '1em'
    },
    sliderOptionsRes: {}
  },
  innerBlocks: [['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "70.84",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "76.15",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "81.45",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "4.39",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "7.81",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "57.76",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "61.18",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "53.37",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "111.13",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "114.54",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "106.73",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "142.66",
    y: "68.75",
    width: "9.63",
    height: "5.68"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M146.85,73a.15.15,0,0,1-.11,0,.16.16,0,0,1,0-.22l1.14-1.14-1.14-1.13a.16.16,0,0,1,.22-.22l1.36,1.35L147,73A.15.15,0,0,1,146.85,73Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "130.41",
    y: "68.75",
    width: "9.63",
    height: "5.68",
    transform: "translate(270.44 143.19) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M135.84,70.19a.16.16,0,0,1,.11,0,.16.16,0,0,1,0,.22l-1.13,1.13L136,72.73a.16.16,0,0,1-.22.22l-1.24-1.25a.16.16,0,0,1,0-.22l1.24-1.24A.16.16,0,0,1,135.84,70.19Z"
  }))
}, {
  name: 'preset-8',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-8'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-8'),
  isPro: true,
  atts: {
    wrapper: {
      options: {
        class: ''
      },
      styles: {
        padding: {
          Desktop: '50px 0px 50px 0px'
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        padding: {
          Desktop: '30px 0px 0px 0px'
        }
      }
    },
    perv: {
      options: {
        text: 'Prev',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    pervIcon: {
      options: {
        position: 'before',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-left'
      },
      styles: {}
    },
    next: {
      options: {
        text: 'Next',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    nextIcon: {
      options: {
        position: 'after',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-right'
      },
      styles: {}
    },
    paginationWrap: {
      options: {
        tag: 'ul',
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        position: {
          Desktop: 'absolute'
        },
        width: {
          Desktop: '100%'
        },
        top: {
          Desktop: '0px'
        },
        left: {
          Desktop: '0px'
        }
      }
    },
    pagination: {
      options: {
        tag: 'span',
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        width: {
          Desktop: '15px'
        },
        height: {
          Desktop: '15px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        borderRadius: {
          Desktop: ' 20px 20px 20px 20px'
        }
      }
    },
    paginationActive: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#0003B6F5'
        }
      }
    },
    sliderOptions: {
      perPage: 3,
      perMove: 1,
      gap: '1em'
    },
    sliderOptionsRes: {}
  },
  innerBlocks: [['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "70.84",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "76.15",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "81.45",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "4.39",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "7.81",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "57.76",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "61.18",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "53.37",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "111.13",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "114.54",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "106.73",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "77.46",
    y: "68.75",
    width: "9.63",
    height: "5.68"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M81.65,73a.15.15,0,0,1-.11,0,.16.16,0,0,1,0-.22l1.13-1.14-1.13-1.13a.16.16,0,0,1,.22-.22l1.35,1.35L81.76,73A.15.15,0,0,1,81.65,73Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "65.2",
    y: "68.75",
    width: "9.63",
    height: "5.68",
    transform: "translate(140.04 143.19) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M70.64,70.19a.16.16,0,0,1,.11,0,.16.16,0,0,1,0,.22l-1.13,1.13,1.13,1.14a.16.16,0,0,1-.22.22L69.29,71.7a.16.16,0,0,1,0-.22l1.24-1.24A.16.16,0,0,1,70.64,70.19Z"
  }))
}, {
  name: 'preset-9',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-9'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-9'),
  isPro: true,
  atts: {
    wrapper: {
      options: {
        class: ''
      },
      styles: {
        padding: {
          Desktop: '50px 0px 50px 0px'
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        position: {
          Desktop: 'absolute'
        },
        left: {
          Desktop: '0px'
        },
        bottom: {
          Desktop: '0px'
        },
        justifyContent: {
          Desktop: 'space-between'
        },
        width: {
          Desktop: '100%'
        }
      }
    },
    perv: {
      options: {
        text: 'Prev',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    pervIcon: {
      options: {
        position: 'before',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-left'
      },
      styles: {}
    },
    next: {
      options: {
        text: 'Next',
        class: ''
      },
      styles: {
        padding: {
          Desktop: '5px 30px 5px 30px'
        },
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        color: {
          Desktop: '#fff'
        }
      }
    },
    nextIcon: {
      options: {
        position: 'after',
        class: '',
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-chevron-right'
      },
      styles: {}
    },
    paginationWrap: {
      options: {
        tag: 'ul',
        class: ''
      },
      styles: {
        display: {
          Desktop: 'flex'
        },
        justifyContent: {
          Desktop: 'center'
        },
        position: {
          Desktop: 'absolute'
        },
        width: {
          Desktop: '100%'
        },
        top: {
          Desktop: '0px'
        },
        left: {
          Desktop: '0px'
        }
      }
    },
    pagination: {
      options: {
        tag: 'span',
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#1418FF8F'
        },
        width: {
          Desktop: '15px'
        },
        height: {
          Desktop: '15px'
        },
        margin: {
          Desktop: '0px 10px 0px 0px'
        },
        borderRadius: {
          Desktop: ' 20px 20px 20px 20px'
        }
      }
    },
    paginationActive: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          Desktop: '#0003B6F5'
        }
      }
    },
    sliderOptions: {
      perPage: 3,
      perMove: 1,
      gap: '1em'
    },
    sliderOptionsRes: {}
  },
  innerBlocks: [['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}], ['post-grid/content-slider-item', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "70.84",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "76.15",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#3c3c3b",
    cx: "81.45",
    cy: "9.35",
    r: "1.21"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "4.39",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "7.81",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "57.76",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "61.18",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "53.37",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "111.13",
    y: "52.96",
    width: "36.77",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "114.54",
    y: "56.44",
    width: "29.93",
    height: "1.91",
    rx: "0.69"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "106.73",
    y: "18.38",
    width: "45.55",
    height: "28.38"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "142.66",
    y: "68.75",
    width: "9.63",
    height: "5.68"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M146.85,73a.15.15,0,0,1-.11,0,.16.16,0,0,1,0-.22l1.14-1.14-1.14-1.13a.16.16,0,0,1,.22-.22l1.36,1.35L147,73A.15.15,0,0,1,146.85,73Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "68.75",
    width: "9.63",
    height: "5.68",
    transform: "translate(9.63 143.19) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M5.44,70.19a.16.16,0,0,1,.11,0,.16.16,0,0,1,0,.22L4.41,71.59l1.14,1.14a.16.16,0,0,1-.22.22L4.08,71.7a.16.16,0,0,1,0-.22l1.25-1.24A.16.16,0,0,1,5.44,70.19Z"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/flex-wrap-item/index.js":
/*!********************************************!*\
  !*** ./src/blocks/flex-wrap-item/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");













const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/flex-wrap-item", {
  apiVersion: 2,
  title: "Flex Item",
  parent: ['post-grid/flex-wrap'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "10.4",
      width: "7.49",
      height: "15.2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "28.51",
      y: "10.4",
      width: "7.49",
      height: "15.2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "25.18 26.5 22.47 26.5 22.47 24.7 23.37 24.7 23.37 23.79 25.18 23.79 25.18 26.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.51",
      y: "24.69",
      width: "2.98",
      height: "1.81"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "13.53 26.5 10.82 26.5 10.82 23.79 12.63 23.79 12.63 24.7 13.53 24.7 13.53 26.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "10.82",
      y: "16.07",
      width: "1.81",
      height: "3.86"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "12.63 12.21 10.82 12.21 10.82 9.5 13.53 9.5 13.53 11.3 12.63 11.3 12.63 12.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.51",
      y: "9.5",
      width: "2.98",
      height: "1.81"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "25.18 12.21 23.37 12.21 23.37 11.3 22.47 11.3 22.47 9.5 25.18 9.5 25.18 12.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "23.37",
      y: "16.07",
      width: "1.81",
      height: "3.86"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'flex-item-wrap'
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          },
          flexBasis: {
            Desktop: '0'
          },
          flexGrow: {
            Desktop: '1'
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": false
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);

    function generateElementSudoCss(obj) {
      var stylesObj = {};
      Object.entries(obj).map(args => {
        var sudoSrc = args[0];
        var sudoArgs = args[1];

        if (sudoSrc != 'options') {
          var selector = myStore.getElementSelector(sudoSrc, wrapperSelector); //console.log(selector);
          //console.log(sudoArgs);

          Object.entries(args[1]).map(x => {
            var attr = x[0];
            var cssPropty = myStore.cssAttrParse(attr);

            if (stylesObj[selector] == undefined) {
              stylesObj[selector] = {};
            }

            if (stylesObj[selector][cssPropty] == undefined) {
              stylesObj[selector][cssPropty] = {};
            }

            stylesObj[selector][cssPropty] = x[1];
          });
        } //console.log(stylesObj);

      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      }; //console.log(cssItemsX);

      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      //console.log(wrapper);
      //setAttributes({ customCss: customCss });
      ///myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      var elementCss = generateElementSudoCss(wrapper); //console.log(elementCss);
    }, [wrapper]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const MY_TEMPLATE = [//['core/paragraph', { placeholder: '', content: 'Hello Text...' }],
    ];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-flex-wrap-item border border-dashed`
    }); //const isParentOfSelectedBlock = useSelect((select) => select('core/block-editor').hasSelectedInnerBlock(clientId, true))

    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      //allowedBlocks: ALLOWED_BLOCKS,
      template: MY_TEMPLATE,
      //orientation: 'horizontal',
      templateInsertUpdatesSelection: true,
      renderAppender: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.ButtonBlockAppender
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, innerBlocksProps.children));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-flex-wrap-item`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null);
  }
});

/***/ }),

/***/ "./src/blocks/flex-wrap/index.js":
/*!***************************************!*\
  !*** ./src/blocks/flex-wrap/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./variations */ "./src/blocks/flex-wrap/variations.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");

















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/flex-wrap", {
  apiVersion: 2,
  title: "Flex Wrap",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "9.59",
      width: "8.29",
      height: "16.82"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "27.71",
      y: "9.59",
      width: "8.29",
      height: "16.82"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "11.05",
      y: "9.59",
      width: "13.9",
      height: "16.82"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          display: {
            Desktop: 'flex'
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    align: ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    const {
      replaceInnerBlocks
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useDispatch)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store);
    const hasInnerBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store).getBlocks(clientId).length > 0, [clientId]); //console.log(JSON.stringify(wp.data.select(blockEditorStore).getBlocks(clientId)));

    var icons = {
      bed: '',
      layout: '',
      smiley: '',
      columns: '',
      globe: ''
    };
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss); // blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'display': { "Desktop": "flex" } };
      //blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'gap': { "Desktop": "1em" } };

      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      }); //setAttributes({ wrapper: { ...wrapper, styles: { display: { Desktop: 'flex' }, gap: { Desktop: '20px' } } } });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function applyFlex(attr, newVal) {
      onChangeStyleWrapper('styles', newVal, attr);
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    const ALLOWED_BLOCKS = ['post-grid/flex-wrap-item'];
    const MY_TEMPLATE = [['post-grid/flex-wrap-item', {}], ['post-grid/flex-wrap-item', {}], ['post-grid/flex-wrap-item', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-flex-wrap `
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      allowedBlocks: ALLOWED_BLOCKS,
      //template: MY_TEMPLATE,
      orientation: 'horizontal',
      templateInsertUpdatesSelection: true //renderAppender: InnerBlocks.ButtonBlockAppender

    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Flex Options",
      initialOpen: true
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: "",
      className: "block my-3"
    }, "Justify Content"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "grid grid-cols-4 gap-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'flex-start' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'flex-start');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Flex Start"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "5.5",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "11.44",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "17.39",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'flex-end' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'flex-end');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Flex End"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "14.94",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "20.88",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "26.83",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'center' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'center');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "10.22",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "22.11",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'space-between' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'space-between');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space Between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "5.5",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "26.83",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'space-around' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'space-around');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space Around"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "7.34",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.12",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "24.9",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'space-evenly' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'space-evenly');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space Evenly"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "5.5",
      width: "3.67",
      height: "25"
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: "",
      className: "my-3 block"
    }, "Align Items"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "grid grid-cols-4 gap-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.alignItems == undefined ? "bg-[#5655ff]" : wrapper.styles.alignItems[breakPointX] == 'flex-start' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('alignItems', 'flex-start');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Flex Start"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "5.5",
      width: "3.67",
      height: "8.88"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "16.42"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "5.5",
      width: "3.67",
      height: "12.5"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.alignItems == undefined ? "bg-[#5655ff]" : wrapper.styles.alignItems[breakPointX] == 'flex-end' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('alignItems', 'flex-end');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Flex End"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "21.62",
      width: "3.67",
      height: "8.88",
      transform: "translate(50.08 52.12) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "14.08",
      width: "3.67",
      height: "16.42",
      transform: "translate(36 44.58) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "18",
      width: "3.67",
      height: "12.5",
      transform: "translate(21.92 48.5) rotate(180)"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.alignItems == undefined ? "bg-[#5655ff]" : wrapper.styles.alignItems[breakPointX] == 'center' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('alignItems', 'center');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "13.56",
      width: "3.67",
      height: "8.88",
      transform: "translate(50.08 36) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "9.79",
      width: "3.67",
      height: "16.42",
      transform: "translate(36 36) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "13.56",
      width: "3.67",
      height: "8.88",
      transform: "translate(21.92 36) rotate(180)"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.alignItems == undefined ? "bg-[#5655ff]" : wrapper.styles.alignItems[breakPointX] == 'stretch' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('alignItems', 'stretch');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Stretch"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "9.79",
      width: "3.67",
      height: "16.42",
      transform: "translate(50.08 36) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "9.79",
      width: "3.67",
      height: "16.42",
      transform: "translate(36 36) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "9.79",
      width: "3.67",
      height: "16.42",
      transform: "translate(21.92 36) rotate(180)"
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: "",
      className: "my-3 block"
    }, "Flex Direction"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "grid grid-cols-4 gap-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexDirection == undefined ? "bg-[#5655ff]" : wrapper.styles.flexDirection[breakPointX] == 'row' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexDirection', 'row');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Row"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "5.5",
      y: "9.52",
      width: "3.67",
      height: "16.42"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "24.95 12.19 23.25 13.85 25.93 16.51 13.19 16.51 12.33 16.5 12.31 18.91 25.95 18.91 23.29 21.57 24.95 23.27 30.5 17.73 24.95 12.19"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexDirection == undefined ? "bg-[#5655ff]" : wrapper.styles.flexDirection[breakPointX] == 'row-reverse' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexDirection', 'row-reverse');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Row Reverse"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "26.83",
      y: "9.52",
      width: "3.67",
      height: "16.42",
      transform: "translate(57.33 35.45) rotate(-180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "11.05 12.19 12.75 13.85 10.07 16.51 22.81 16.51 23.67 16.5 23.69 18.91 10.04 18.91 12.71 21.57 11.05 23.27 5.5 17.73 11.05 12.19"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexDirection == undefined ? "bg-[#5655ff]" : wrapper.styles.flexDirection[breakPointX] == 'column' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexDirection', 'column');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Column"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "20.45",
      width: "3.67",
      height: "16.42",
      transform: "translate(-10.66 46.66) rotate(-90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "23.54 11.05 21.88 12.75 19.21 10.07 19.21 22.81 19.22 23.67 16.82 23.69 16.81 10.04 14.16 12.71 12.46 11.05 18 5.5 23.54 11.05"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexDirection == undefined ? "bg-[#5655ff]" : wrapper.styles.flexDirection[breakPointX] == 'column-reverse' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexDirection', 'column-reverse');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Column-reverse"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "-0.87",
      width: "3.67",
      height: "16.42",
      transform: "translate(25.34 -10.66) rotate(90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "12.46 24.95 14.13 23.25 16.79 25.93 16.79 13.19 16.78 12.33 19.18 12.31 19.19 25.95 21.84 23.29 23.54 24.95 18 30.5 12.46 24.95"
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: "",
      className: "my-3 block"
    }, "Flex Wrap"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "grid grid-cols-4 gap-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexWrap == undefined ? "bg-[#5655ff]" : wrapper.styles.flexWrap[breakPointX] == 'wrap' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexWrap', 'wrap');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "6.08",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "1.95",
      width: "3.67",
      height: "25",
      transform: "translate(32.45 -3.55) rotate(90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "16.79 18.15 15.81 19.11 17.35 20.65 6.01 20.65 5.51 20.64 5.5 22.03 17.37 22.03 15.83 23.56 16.79 24.54 19.99 21.35 16.79 18.15"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexWrap == undefined ? "bg-[#5655ff]" : wrapper.styles.flexWrap[breakPointX] == 'wrap-reverse' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexWrap', 'wrap-reverse');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "6.08",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "10.21",
      width: "3.67",
      height: "25",
      transform: "translate(40.71 4.71) rotate(90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "8.7 19.01 9.68 18.05 8.14 16.51 19.48 16.51 19.98 16.51 19.99 15.13 8.12 15.12 9.66 13.6 8.7 12.61 5.5 15.81 8.7 19.01"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexWrap == undefined ? "bg-[#5655ff]" : wrapper.styles.flexWrap[breakPointX] == 'nowrap' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexWrap', 'nowrap');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "6.08",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "25",
      transform: "translate(36) rotate(90)"
    })))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: ""
    }, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400 hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)([['post-grid/flex-wrap-item', {
          "wrapper": {
            "options": {
              "tag": "div",
              "class": "flex-item-wrap"
            },
            "styles": {
              "flexBasis": {
                "Desktop": "0"
              },
              "flexGrow": {
                "Desktop": "1"
              }
            }
          }
        }], ['post-grid/flex-wrap-item', {
          "wrapper": {
            "options": {
              "tag": "div",
              "class": "flex-item-wrap"
            },
            "styles": {
              "flexBasis": {
                "Desktop": "0"
              },
              "flexGrow": {
                "Desktop": "1"
              }
            }
          }
        }]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_16__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 bg-gray-400 cursor-pointer hover:bg-gray-500 relative",
        onClick: ev => {
          if (variation.isPro) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var atts = variation.atts;
          var wrapper = { ...atts.wrapper
          };
          var blockCssY = { ...atts.blockCssY
          };
          var customCss = { ...atts.customCss
          };
          var blockCssObj = {};
          blockCssObj[wrapperSelector] = wrapper;
          setAttributes({
            wrapper: wrapper,
            customCss: customCss
          });
          var blockCssRules = myStore.getBlockCssRules(blockCssObj);
          var items = { ...blockCssY.items,
            ...blockCssRules
          };
          setAttributes({
            blockCssY: {
              items: items
            }
          });
          replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)(variation.innerBlocks), true);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, innerBlocksProps.children)));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-flex-wrap`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/flex-wrap/variations.js":
/*!********************************************!*\
  !*** ./src/blocks/flex-wrap/variations.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__);


/**
 * WordPress dependencies
 */


let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('isProFeature', true);
/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: '1-column',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('1 Col'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('1 Col'),
  isDefault: true,
  isPro: false,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "152.29",
    height: "82.57"
  }))
}, {
  name: '2-columns',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('2-columns'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('2-columns'),
  isPro: false,
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "119.78",
    width: "32.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "79.58",
    width: "72.71",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "72.71",
    height: "82.57"
  })),
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block']
}, {
  name: '3-columns',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('3-columns'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('3-columns'),
  isPro: false,
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "46.18",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "53.05",
    width: "99.24",
    height: "82.57"
  })),
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "46.18",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "53.05",
    width: "46.18",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "106.1",
    width: "46.18",
    height: "82.57"
  }))
}, {
  name: '4-columns',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('4-columns'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('4-columns'),
  isPro: false,
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "39.15",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "46.02",
    width: "60.25",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "113.14",
    width: "39.15",
    height: "82.57"
  })),
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "32.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "40.21",
    width: "31.66",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "80.41",
    width: "31.66",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "120.62",
    width: "31.66",
    height: "82.57"
  }))
}, {
  name: '5-columns',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('5-columns'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('5-columns'),
  isPro: false,
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "39.15",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "46.02",
    width: "60.25",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "113.14",
    width: "39.15",
    height: "82.57"
  })),
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "25.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "31.7",
    width: "25.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "63.4",
    width: "25.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "95.09",
    width: "25.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "126.79",
    width: "25.5",
    height: "82.57"
  }))
}, {
  name: '33-66',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('33-66'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('33-66'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "33%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "66%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "46.18",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "53.05",
    width: "99.24",
    height: "82.57"
  }))
}, {
  name: '66-33',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('66-33'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('66-33'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "66%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "33%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "99.24",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "106.1",
    width: "46.18",
    height: "82.57"
  }))
}, {
  name: '25-50-25',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('25-50-25'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('25-50-25'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "50%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "39.15",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "46.02",
    width: "60.25",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "113.14",
    width: "39.15",
    height: "82.57"
  }))
}, {
  name: '25-25-50',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('25-25-50'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('25-25-50'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "50%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "31.29",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "38.16",
    width: "31.29",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "76.33",
    width: "75.96",
    height: "82.57"
  }))
}, {
  name: '50-25-25',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('50-25-25'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('50-25-25'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "50%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/flex-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "120.99",
    width: "31.29",
    height: "82.57",
    transform: "translate(273.28 82.57) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "82.83",
    width: "31.29",
    height: "82.57",
    transform: "translate(196.95 82.57) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "75.96",
    height: "82.57",
    transform: "translate(75.96 82.57) rotate(180)"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/form-field-checkbox/index.js":
/*!*************************************************!*\
  !*** ./src/blocks/form-field-checkbox/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/form-field-checkbox", {
  apiVersion: 2,
  title: "Form Field - Checkbox",
  parent: ['post-grid/form-wrap'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    labelWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          tag: 'label',
          for: 'label',
          enable: true,
          text: 'Your Name',
          class: 'pg-form-field-label'
        },
        styles: {}
      }
    },
    item: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    itemLabel: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    input: {
      type: 'object',
      default: {
        options: {
          value: null,
          name: '',
          required: false,
          disabled: false,
          multiple: false,
          autofocus: null,
          readonly: false,
          args: {
            0: {
              label: 'Option 1',
              value: 'option1',
              readonly: false
            },
            1: {
              label: 'Option 2',
              value: 'option2',
              readonly: false
            },
            2: {
              label: 'Option 3',
              value: 'option3',
              readonly: false
            }
          },
          argsSrc: {
            src: '',
            // posts, users, countryNames, countryCodes, Gender, ageGroups
            taxonomy: '',
            postType: [],
            userRole: []
          },
          id: '',
          class: 'pg-form-field-checkbox',
          postion: 'afterLabel' // beforeLabel, afterLabel, insideLabel

        },
        styles: {}
      }
    },
    inputWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    errorWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          text: '',
          position: 'afterInput',
          class: ''
        },
        styles: {}
      }
    },
    requiredWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'span',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var label = attributes.label;
    var input = attributes.input;
    var item = attributes.item;
    var itemLabel = attributes.itemLabel;
    var inputWrap = attributes.inputWrap;
    var errorWrap = attributes.errorWrap;
    var labelWrap = attributes.labelWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    const [pramSrcEnable, setpramSrcEnable] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    var [postTypes, setpostTypes] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({}); // Using the hook.

    var [userRoles, setuserRoles] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({}); // Using the hook.

    var [taxonomies, settaxonomies] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({}); // Using the hook.
    // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var labelSelector = blockClass + ' label';
    var checkboxSelector = blockClass + ' input[type="checkbox"]';
    var labelWrapSelector = blockClass + ' .label-wrap';
    var inputWrapSelector = blockClass + ' .input-wrap';
    var errorWrapSelector = blockClass + ' .error-wrap';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default()({
        path: '/post-grid/v2/post_types',
        method: 'POST',
        data: {}
      }).then(res => {
        var types = [];
        Object.entries(res).map(x => {
          var postTypeId = x[0];
          var postTypeLabel = x[1];
          types.push({
            label: postTypeLabel,
            value: postTypeId
          });
        });
        setpostTypes(types);
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default()({
        path: '/post-grid/v2/user_roles_list',
        method: 'POST',
        data: {}
      }).then(res => {
        console.log(res);
        var roles = res.roles == undefined ? [] : res.roles;
        var rolesX = [];
        Object.entries(roles).map(role => {
          var index = role[0];
          var val = role[1];
          rolesX.push({
            label: val,
            value: index
          });
        });
        setuserRoles(rolesX);
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default()({
        path: '/post-grid/v2/post_type_objects',
        method: 'POST',
        data: {}
      }).then(res => {
        console.log(res);
        var taxItems = [];
        Object.entries(res).map(arg => {
          var index = arg[0];
          var tax = arg[1];
          taxItems.push({
            label: tax.label,
            value: tax.id
          });
        });
        settaxonomies(taxItems);
      });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onBulkAddLabel(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, label);
      obj[sudoScource] = cssObj;
      setAttributes({
        label: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInput(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, checkboxSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInput(sudoScource, key) {
      var object = myStore.deletePropertyDeep(input, [sudoScource, key, breakPointX]);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, checkboxSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInput(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        input: object
      });
    }

    function onBulkAddInput(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, input);
      obj[sudoScource] = cssObj;
      setAttributes({
        input: obj
      });
      var selector = myStore.getElementSelector(sudoScource, checkboxSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelWrap: object
      });
    }

    function onBulkAddLabelWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, labelWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        labelWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInputWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInputWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(inputWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInputWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        inputWrap: object
      });
    }

    function onBulkAddInputWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, inputWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        inputWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleErrorWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleErrorWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(errorWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleErrorWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        errorWrap: object
      });
    }

    function onBulkAddErrorWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, errorWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        errorWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-form-field-input`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelWrap,
      onChange: onChangeStyleLabelWrap,
      onAdd: onAddStyleLabelWrap,
      onRemove: onRemoveStyleLabelWrap,
      onBulkAdd: onBulkAddLabelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Enable?",
      help: label.options.enable ? 'Label Enabled' : 'Label Disabled.',
      checked: label.options.enable ? true : false,
      onChange: e => {
        var options = { ...label.options,
          enable: label.options.enable ? false : true
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: label.options.text,
      onChange: newVal => {
        var options = { ...label.options,
          text: newVal
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel,
      onBulkAdd: onBulkAddLabel
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: inputWrap,
      onChange: onChangeStyleInputWrap,
      onAdd: onAddStyleInputWrap,
      onRemove: onRemoveStyleInputWrap,
      onBulkAdd: onBulkAddInputWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Checkbox",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 px-3 py-2 rounded-sm text-white inline-block my-3 mr-2 cursor-pointer",
      onClick: ev => {
        var options = { ...input.options
        };
        var args = options.args;
        var length = Object.entries(input.options.args).length;
        args[length] = {
          label: '',
          value: ''
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }, "Add Option"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: " inline-block  mr-2 relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 px-3 py-2 rounded-sm text-white inline-block my-3 mr-2 cursor-pointer ",
      onClick: ev => {
        setpramSrcEnable(!pramSrcEnable);
      }
    }, "Pram Source"), pramSrcEnable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Popover, {
      position: "bottom left"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-3 w-64"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Source Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: input.options.argsSrc.src,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'Taxonomy',
        value: 'taxonomy'
      }, {
        label: 'Posts',
        value: 'posts'
      }, {
        label: 'Users',
        value: 'users'
      }, {
        label: 'Country Names',
        value: 'countryNames'
      }, {
        label: 'Country Codes',
        value: 'countryCodes'
      }, {
        label: 'Gender',
        value: 'gender'
      }, {
        label: 'Age Groups',
        value: 'ageGroups'
      }],
      onChange: newVal => {
        var options = { ...input.options
        };
        var argsSrc = options.argsSrc;
        argsSrc.src = newVal;
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), input.options.argsSrc.src == 'posts' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Post Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      multiple: true,
      value: input.options.argsSrc.postType,
      options: postTypes,
      onChange: newVal => {
        var options = { ...input.options
        };
        var argsSrc = options.argsSrc;
        argsSrc.postType = newVal;
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }))), input.options.argsSrc.src == 'taxonomy' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: input.options.argsSrc.taxonomy,
      options: taxonomies,
      onChange: newVal => {
        var options = { ...input.options
        };
        var argsSrc = options.argsSrc;
        argsSrc.taxonomy = newVal;
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }))), input.options.argsSrc.src == 'users' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "User Role"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      multiple: true,
      value: input.options.argsSrc.userRole,
      options: userRoles,
      onChange: newVal => {
        var options = { ...input.options
        };
        var argsSrc = options.argsSrc;
        argsSrc.userRole = newVal;
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, input.options.argsSrc.src.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, Object.entries(input.options.args).map(item => {
      var index = item[0];
      var arg = item[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex justify-between items-center my-3"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: arg.label,
        placeholder: "Option Label",
        onChange: newVal => {
          var options = { ...input.options
          };
          var args = options.args;
          args[index].label = newVal;
          setAttributes({
            input: { ...input,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Option Value",
        value: arg.value,
        onChange: newVal => {
          var options = { ...input.options
          };
          var args = options.args;
          args[index].value = newVal;
          setAttributes({
            input: { ...input,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer bg-red-500 hover:bg-red-600 text-white px-1 rounded-sm"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"], {
        fill: "#fff",
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        onClick: ev => {
          var optionsX = { ...input.options
          };
          delete optionsX['args'][index];
          setAttributes({
            input: { ...input,
              options: optionsX
            }
          });
        }
      })));
    })), input.options.argsSrc.src.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, "Options will automatically generated from ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "text-bold"
    }, input.options.argsSrc.src))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.name,
      onChange: newVal => {
        var options = { ...input.options,
          name: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ul", null, input.options.value != null && Object.entries(input.options.value).map(x => {
      var val = x[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", null, val);
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Readonly?",
      help: input.options.readonly ? 'Readonly Enabled' : 'Readonly Disabled.',
      checked: input.options.readonly ? true : false,
      onChange: e => {
        var options = { ...input.options,
          readonly: input.options.readonly ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Required?",
      help: input.options.required ? 'Required Enabled' : 'Required Disabled.',
      checked: input.options.required ? true : false,
      onChange: e => {
        var options = { ...input.options,
          required: input.options.required ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Disabled?",
      help: input.options.disabled ? 'Disabled Enabled' : 'Disabled Disabled.',
      checked: input.options.disabled ? true : false,
      onChange: e => {
        var options = { ...input.options,
          disabled: input.options.disabled ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: input,
      onChange: onChangeStyleInput,
      onAdd: onAddStyleInput,
      onRemove: onRemoveStyleInput,
      onBulkAdd: onBulkAddInput
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Error Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Error Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: errorWrap.options.text,
      onChange: newVal => {
        var options = { ...errorWrap.options,
          text: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: errorWrap.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'afterlabel',
        value: 'afterlabel'
      }, {
        label: 'afterInput',
        value: 'afterInput'
      }],
      onChange: newVal => {
        var options = { ...errorWrap.options,
          position: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: errorWrap,
      onChange: onChangeStyleErrorWrap,
      onAdd: onAddStyleErrorWrap,
      onRemove: onRemoveStyleErrorWrap,
      onBulkAdd: onBulkAddErrorWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "label-wrap"
    }, label.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, label.options.text), errorWrap.options.position == 'afterlabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "input-wrap"
    }, Object.entries(input.options.args).map((item, index) => {
      var index = item[0];
      var arg = item[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "item"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", {
        type: "checkbox",
        id: blockId + '-' + index,
        value: arg.value,
        name: input.options.name,
        multiple: input.options.multiple,
        required: input.options.required,
        disabled: input.options.disabled,
        readonly: input.options.readonly,
        onChange: ev => {
          var newVal = ev.target.value;
          var oldVal = input.options.value;

          if (typeof input.options.value == 'object') {
            var count = input.options.value.length;
            var valueX = input.options.value;
            valueX[count] = newVal;
          } else {
            valueX = [oldVal];
          }

          var options = { ...input.options,
            value: valueX
          };
          setAttributes({
            input: { ...input,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: blockId + '-' + index
      }, arg.label));
    }), errorWrap.options.position == 'afterInput' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/form-field-file-multi/index.js":
/*!***************************************************!*\
  !*** ./src/blocks/form-field-file-multi/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/form-field-file-multi", {
  apiVersion: 2,
  title: "Form Field - Multi File",
  parent: ['post-grid/form-wrap'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          tag: 'label',
          for: 'label',
          enable: true,
          text: 'Your Name',
          class: 'pg-form-field-label'
        },
        styles: {}
      }
    },
    item: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    itemLabel: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    addItem: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          postion: 'afterFiles',
          // beforeFiles, afterFiles
          class: '',
          text: ''
        },
        styles: {}
      }
    },
    file: {
      type: 'object',
      default: {
        options: {
          value: null,
          name: '',
          required: false,
          disabled: false,
          multiple: false,
          autofocus: null,
          readonly: false,
          maxCount: 3,
          maxSize: null,
          fileTypes: ['jpg', 'jpeg', 'png', 'gif', 'pdf'],
          id: '',
          class: 'pg-form-field-file-multi',
          postion: 'afterLabel' // beforeLabel, afterLabel, insideLabel

        },
        styles: {}
      }
    },
    inputWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    labelWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    errorWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          text: '',
          position: 'afterInput',
          class: ''
        },
        styles: {}
      }
    },
    requiredWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'span',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var label = attributes.label;
    var file = attributes.file;
    var item = attributes.item;
    var itemLabel = attributes.itemLabel;
    var addItem = attributes.addItem;
    var inputWrap = attributes.inputWrap;
    var errorWrap = attributes.errorWrap;
    var labelWrap = attributes.labelWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var labelSelector = blockClass + ' label';
    var checkboxSelector = blockClass + ' input[type="file"]';
    var addItemSelector = blockClass + ' .add-item';
    var labelWrapSelector = blockClass + ' .label-wrap';
    var inputWrapSelector = blockClass + ' .input-wrap';
    var errorWrapSelector = blockClass + ' .error-wrap';
    const [fileCounts, setfileCounts] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var inputCounts = [];

      for (let i = 0; i < parseInt(file.options.maxCount); i++) {
        inputCounts.push(i);
      }

      setfileCounts(inputCounts);
    }, [file.options.maxCount]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      var options = { ...file.options,
        name: blockId
      };
      setAttributes({
        file: { ...file,
          options: options
        }
      });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onBulkAddLabel(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, label);
      obj[sudoScource] = cssObj;
      setAttributes({
        label: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleAddItem(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, addItem);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        addItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, addItemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleAddItem(sudoScource, key) {
      var object = myStore.deletePropertyDeep(addItem, [sudoScource, key, breakPointX]);
      setAttributes({
        addItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, addItemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleAddItem(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, addItem);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        addItem: object
      });
    }

    function onBulkAddAddItem(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, addItem);
      obj[sudoScource] = cssObj;
      setAttributes({
        addItem: obj
      });
      var selector = myStore.getElementSelector(sudoScource, addItemSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInput(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, file);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        file: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, checkboxSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInput(sudoScource, key) {
      var object = myStore.deletePropertyDeep(file, [sudoScource, key, breakPointX]);
      setAttributes({
        file: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, checkboxSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInput(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, file);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        file: object
      });
    }

    function onBulkAddInput(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, file);
      obj[sudoScource] = cssObj;
      setAttributes({
        file: obj
      });
      var selector = myStore.getElementSelector(sudoScource, checkboxSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelWrap: object
      });
    }

    function onBulkAddLabelWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, labelWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        labelWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInputWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInputWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(inputWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInputWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        inputWrap: object
      });
    }

    function onBulkAddInputWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, inputWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        inputWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleErrorWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleErrorWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(errorWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleErrorWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        errorWrap: object
      });
    }

    function onBulkAddErrorWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, errorWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        errorWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-form-field-file-multi`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelWrap,
      onChange: onChangeStyleLabelWrap,
      onAdd: onAddStyleLabelWrap,
      onRemove: onRemoveStyleLabelWrap,
      onBulkAdd: onBulkAddLabelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Enable?",
      help: label.options.enable ? 'Label Enabled' : 'Label Disabled.',
      checked: label.options.enable ? true : false,
      onChange: e => {
        var options = { ...label.options,
          enable: label.options.enable ? false : true
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: label.options.text,
      onChange: newVal => {
        var options = { ...label.options,
          text: newVal
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel,
      onBulkAdd: onBulkAddLabel
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: inputWrap,
      onChange: onChangeStyleInputWrap,
      onAdd: onAddStyleInputWrap,
      onRemove: onRemoveStyleInputWrap,
      onBulkAdd: onBulkAddInputWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "File",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 px-3 py-2 rounded-sm text-white inline-block my-3 mr-2",
      onClick: ev => {
        var options = { ...file.options
        };
        var fileTypes = options.fileTypes;
        fileTypes.push('');
        setAttributes({ ...file,
          options: options
        });
      }
    }, "Add Option"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, file.options.fileTypes.map((item, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex justify-between items-center my-3"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: item,
        placeholder: ".FileType",
        onChange: newVal => {
          var options = { ...file.options
          };
          var fileTypes = options.fileTypes;
          fileTypes[index] = newVal;
          setAttributes({ ...file,
            options: options
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer bg-red-500 hover:bg-red-600 text-white px-1 rounded-sm"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"], {
        fill: "#fff",
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        onClick: ev => {
          var options = { ...file.options
          };
          var fileTypes = options.fileTypes;
          fileTypes.splice(index, 1);
          setAttributes({ ...file,
            options: options
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: file.options.name,
      onChange: newVal => {
        var options = { ...file.options,
          name: newVal
        };
        setAttributes({
          file: { ...file,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "File Max Size "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      type: "number",
      value: file.options.maxSize,
      onChange: newVal => {
        var options = { ...file.options,
          maxSize: newVal
        };
        setAttributes({
          file: { ...file,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Readonly?",
      help: file.options.readonly ? 'Readonly Enabled' : 'Readonly Disabled.',
      checked: file.options.readonly ? true : false,
      onChange: e => {
        var options = { ...file.options,
          readonly: file.options.readonly ? false : true
        };
        setAttributes({
          file: { ...file,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Required?",
      help: file.options.required ? 'Required Enabled' : 'Required Disabled.',
      checked: file.options.required ? true : false,
      onChange: e => {
        var options = { ...file.options,
          required: file.options.required ? false : true
        };
        setAttributes({
          file: { ...file,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Disabled?",
      help: file.options.disabled ? 'Disabled Enabled' : 'Disabled Disabled.',
      checked: file.options.disabled ? true : false,
      onChange: e => {
        var options = { ...file.options,
          disabled: file.options.disabled ? false : true
        };
        setAttributes({
          file: { ...file,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: file,
      onChange: onChangeStyleInput,
      onAdd: onAddStyleInput,
      onRemove: onRemoveStyleInput,
      onBulkAdd: onBulkAddInput
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Add Item Wrap ",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: addItem.options.text,
      onChange: newVal => {
        var options = { ...addItem.options,
          text: newVal
        };
        setAttributes({
          addItem: { ...addItem,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: addItem.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'Before Files',
        value: 'beforeFiles'
      }, {
        label: 'After Files',
        value: 'afterFiles'
      }, {
        label: 'After Label',
        value: 'afterLabel'
      }],
      onChange: newVal => {
        var options = { ...addItem.options,
          position: newVal
        };
        setAttributes({
          addItem: { ...addItem,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: addItem,
      onChange: onChangeStyleAddItem,
      onAdd: onAddStyleAddItem,
      onRemove: onRemoveStyleAddItem,
      onBulkAdd: onBulkAddAddItem
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Error Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Error Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: errorWrap.options.text,
      onChange: newVal => {
        var options = { ...errorWrap.options,
          text: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: errorWrap.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'Before label',
        value: 'beforeLabel'
      }, {
        label: 'After Files',
        value: 'afterFiles'
      }],
      onChange: newVal => {
        var options = { ...errorWrap.options,
          position: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: errorWrap,
      onChange: onChangeStyleErrorWrap,
      onAdd: onAddStyleErrorWrap,
      onRemove: onRemoveStyleErrorWrap,
      onBulkAdd: onBulkAddErrorWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "label-wrap"
    }, label.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, label.options.text), errorWrap.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "input-wrap"
    }, addItem.options.position == 'afterFiles' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "add-item",
      onClick: ev => {
        var count = fileCounts.length;
        fileCounts.push(count);
        setfileCounts(fileCounts);
      }
    }, "Add"), fileCounts.map((item, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "item"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", {
        type: "file",
        value: file.options.value,
        name: file.options.name + '[]',
        multiple: file.options.multiple,
        required: file.options.required,
        disabled: file.options.disabled,
        readonly: file.options.readonly,
        onChange: ev => {
          var newVal = ev.target.value;
          var options = { ...file.options,
            value: newVal
          };
          setAttributes({
            file: { ...file,
              options: options
            }
          });
        }
      }));
    }), addItem.options.position == 'afterFiles' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "add-item",
      onClick: ev => {
        var count = fileCounts.length;
        fileCounts.push(count);
        setfileCounts(fileCounts);
      }
    }, "Add"), errorWrap.options.position == 'afterFiles' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/form-field-file/index.js":
/*!*********************************************!*\
  !*** ./src/blocks/form-field-file/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/form-field-file", {
  apiVersion: 2,
  title: "Form Field - File",
  parent: ['post-grid/form-wrap'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          tag: 'label',
          for: 'label',
          enable: true,
          text: 'Your Name',
          class: 'pg-form-field-label'
        },
        styles: {}
      }
    },
    input: {
      type: 'object',
      default: {
        options: {
          type: 'text',
          placeholder: 'Write your name',
          value: '',
          name: '',
          required: false,
          disabled: false,
          minLength: null,
          maxLength: null,
          readonly: false,
          multiple: false,
          maxCount: 3,
          maxSize: null,
          fileTypes: ['.jpg', '.jpeg', '.png', '.gif', '.pdf'],
          id: '',
          class: 'pg-form-field-file',
          postion: 'afterLabel' // beforeLabel, afterLabel, insideLabel

        },
        styles: {}
      }
    },
    inputWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    labelWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    errorWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          text: '',
          position: 'afterInput',
          class: ''
        },
        styles: {}
      }
    },
    requiredWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'span',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var label = attributes.label;
    var input = attributes.input;
    var inputWrap = attributes.inputWrap;
    var errorWrap = attributes.errorWrap;
    var labelWrap = attributes.labelWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var labelSelector = blockClass + ' label';
    var inputSelector = blockClass + ' input';
    var labelWrapSelector = blockClass + ' .label-wrap';
    var inputWrapSelector = blockClass + ' .input-wrap';
    var errorWrapSelector = blockClass + ' .error-wrap';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onBulkAddLabel(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, label);
      obj[sudoScource] = cssObj;
      setAttributes({
        label: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInput(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInput(sudoScource, key) {
      var object = myStore.deletePropertyDeep(input, [sudoScource, key, breakPointX]);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInput(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        input: object
      });
    }

    function onBulkAddInput(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, input);
      obj[sudoScource] = cssObj;
      setAttributes({
        input: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelWrap: object
      });
    }

    function onBulkAddLabelWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, labelWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        labelWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInputWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInputWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(inputWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInputWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        inputWrap: object
      });
    }

    function onBulkAddInputWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, inputWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        inputWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleErrorWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleErrorWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(errorWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleErrorWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        errorWrap: object
      });
    }

    function onBulkAddErrorWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, errorWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        errorWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.useBlockProps)({
      className: ` ${blockId} pg-form-field-text`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
        console.log(wrapper);
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Label Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelWrap,
      onChange: onChangeStyleLabelWrap,
      onAdd: onAddStyleLabelWrap,
      onRemove: onRemoveStyleLabelWrap,
      onBulkAdd: onBulkAddLabelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      className: "my-3",
      label: "Enable?",
      help: label.options.enable ? 'Label Enabled' : 'Label Disabled.',
      checked: label.options.enable ? true : false,
      onChange: e => {
        var options = { ...label.options,
          enable: label.options.enable ? false : true
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: label.options.text,
      onChange: newVal => {
        var options = { ...label.options,
          text: newVal
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel,
      onBulkAdd: onBulkAddLabel
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Input Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: inputWrap,
      onChange: onChangeStyleInputWrap,
      onAdd: onAddStyleInputWrap,
      onRemove: onRemoveStyleInputWrap,
      onBulkAdd: onBulkAddInputWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 px-3 py-2 rounded-sm text-white inline-block my-3 mr-2",
      onClick: ev => {
        var options = { ...input.options
        };
        var fileTypes = options.fileTypes;
        fileTypes.push('');
        setAttributes({ ...input,
          options: options
        });
      }
    }, "Add File Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, input.options.fileTypes.map((item, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex justify-between items-center my-3"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        className: "mr-2",
        value: item,
        placeholder: ".FileType",
        onChange: newVal => {
          var options = { ...input.options
          };
          var fileTypes = options.fileTypes;
          fileTypes[index] = newVal;
          setAttributes({ ...input,
            options: options
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer bg-red-500 hover:bg-red-600 text-white px-1 rounded-sm"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"], {
        fill: "#fff",
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        onClick: ev => {
          var options = { ...input.options
          };
          var fileTypes = options.fileTypes;
          fileTypes.splice(index, 1);
          setAttributes({ ...input,
            options: options
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.name,
      onChange: newVal => {
        var options = { ...input.options,
          name: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "File Max Size "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      type: "number",
      value: input.options.maxSize,
      onChange: newVal => {
        var options = { ...input.options,
          maxSize: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      className: "my-3",
      label: "Multiple?",
      help: input.options.multiple ? 'Multiple Enabled' : 'Multiple Disabled.',
      checked: input.options.multiple ? true : false,
      onChange: e => {
        var options = { ...input.options,
          multiple: input.options.multiple ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      className: "my-3",
      label: "Readonly?",
      help: input.options.readonly ? 'Readonly Enabled' : 'Readonly Disabled.',
      checked: input.options.readonly ? true : false,
      onChange: e => {
        var options = { ...input.options,
          readonly: input.options.readonly ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      className: "my-3",
      label: "Required?",
      help: input.options.required ? 'Required Enabled' : 'Required Disabled.',
      checked: input.options.required ? true : false,
      onChange: e => {
        var options = { ...input.options,
          required: input.options.required ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      className: "my-3",
      label: "Disabled?",
      help: input.options.disabled ? 'Disabled Enabled' : 'Disabled Disabled.',
      checked: input.options.disabled ? true : false,
      onChange: e => {
        var options = { ...input.options,
          disabled: input.options.disabled ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: input,
      onChange: onChangeStyleInput,
      onAdd: onAddStyleInput,
      onRemove: onRemoveStyleInput,
      onBulkAdd: onBulkAddInput
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Error Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Error Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: errorWrap.options.text,
      onChange: newVal => {
        var options = { ...errorWrap.options,
          text: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: errorWrap.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'afterlabel',
        value: 'afterlabel'
      }, {
        label: 'afterInput',
        value: 'afterInput'
      }],
      onChange: newVal => {
        var options = { ...errorWrap.options,
          position: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: errorWrap,
      onChange: onChangeStyleErrorWrap,
      onAdd: onAddStyleErrorWrap,
      onRemove: onRemoveStyleErrorWrap,
      onBulkAdd: onBulkAddErrorWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "label-wrap"
    }, label.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, label.options.text), errorWrap.options.position == 'afterlabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "input-wrap"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", {
      type: 'file',
      placeholder: input.options.placeholder,
      value: input.options.value,
      name: input.options.name,
      required: input.options.required,
      disabled: input.options.disabled,
      readonly: input.options.readonly,
      onChange: ev => {
        var newVal = ev.target.value;
        var options = { ...input.options,
          value: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), errorWrap.options.position == 'afterInput' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/form-field-input/index.js":
/*!**********************************************!*\
  !*** ./src/blocks/form-field-input/index.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/form-field-input", {
  apiVersion: 2,
  title: "Form Field - Input",
  parent: ['post-grid/form-wrap', 'post-grid/flex-wrap', 'post-grid/flex-wrap-item', 'post-grid/grid-wrap', 'post-grid/grid-wrap-item', 'core/columns', 'post-grid/tabs-nested-item', 'post-grid/accordion-nested-item'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        }
      }
    },
    labelWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          tag: 'label',
          for: 'label',
          enable: true,
          text: 'Your Name',
          class: 'pg-form-field-label'
        }
      }
    },
    input: {
      type: 'object',
      default: {
        options: {
          type: 'text',
          placeholder: 'Write your name',
          value: '',
          valueSource: '',
          name: '',
          required: false,
          disabled: false,
          size: false,
          minLength: null,
          maxLength: null,
          readonly: false,
          step: null,
          pattern: null,
          patternCustom: '',
          includeMailBody: true,
          max: null,
          min: null,
          checked: false,
          autocomplete: false,
          id: '',
          class: 'pg-form-field-input',
          postion: 'afterLabel' // beforeLabel, afterLabel, insideLabel

        }
      }
    },
    inputWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    errorWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          text: '',
          position: 'afterInput',
          class: ''
        }
      }
    },
    requiredWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'span',
          enable: true,
          class: ''
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ['post-grid/formId'],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var labelWrap = attributes.labelWrap;
    var label = attributes.label;
    var input = attributes.input;
    var inputWrap = attributes.inputWrap;
    var errorWrap = attributes.errorWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var labelWrapSelector = blockClass + ' .label-wrap';
    var labelSelector = blockClass + ' label';
    var inputWrapSelector = blockClass + ' .input-wrap';
    var inputSelector = blockClass + ' input';
    var errorWrapSelector = blockClass + ' .error-wrap';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelWrap: object
      });
    }

    function onBulkAddLabelWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, labelWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        labelWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInputWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInputWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(inputWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInputWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        inputWrap: object
      });
    }

    function onBulkAddInputWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, inputWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        inputWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleErrorWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleErrorWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(errorWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleErrorWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        errorWrap: object
      });
    }

    function onBulkAddErrorWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, errorWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        errorWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onBulkAddLabel(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, label);
      obj[sudoScource] = cssObj;
      setAttributes({
        label: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInput(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInput(sudoScource, key) {
      var object = myStore.deletePropertyDeep(input, [sudoScource, key, breakPointX]);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInput(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        input: object
      });
    }

    function onBulkAddInput(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, input);
      obj[sudoScource] = cssObj;
      setAttributes({
        input: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-form-field-text`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelWrap,
      onChange: onChangeStyleLabelWrap,
      onAdd: onAddStyleLabelWrap,
      onRemove: onRemoveStyleLabelWrap,
      onBulkAdd: onBulkAddLabelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Enable?",
      help: label.options.enable ? 'Label Enabled' : 'Label Disabled.',
      checked: label.options.enable ? true : false,
      onChange: e => {
        var options = { ...label.options,
          enable: label.options.enable ? false : true
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: label.options.text,
      onChange: newVal => {
        var options = { ...label.options,
          text: newVal
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel,
      onBulkAdd: onBulkAddLabel
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: inputWrap,
      onChange: onChangeStyleInputWrap,
      onAdd: onAddStyleInputWrap,
      onRemove: onRemoveStyleInputWrap,
      onBulkAdd: onBulkAddInputWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Input Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: input.options.type,
      options: [{
        label: 'Number',
        value: 'number'
      }, {
        label: 'Range',
        value: 'range'
      }, {
        label: 'Checkbox',
        value: 'checkbox'
      }, {
        label: 'Email',
        value: 'email'
      }, {
        label: 'URL',
        value: 'url'
      }, {
        label: 'Password',
        value: 'password'
      }, {
        label: 'Hidden',
        value: 'hidden'
      }, {
        label: 'Search',
        value: 'search'
      }, {
        label: 'Telephone',
        value: 'tel'
      }, {
        label: 'Text',
        value: 'text'
      }, {
        label: 'Time',
        value: 'time'
      }, {
        label: 'Week',
        value: 'week'
      }, {
        label: 'Color',
        value: 'color'
      }, {
        label: 'Date',
        value: 'date'
      }, {
        label: 'Datetime-local',
        value: 'datetime-local'
      }, {
        label: 'Button',
        value: 'button'
      }, {
        label: 'Submit',
        value: 'submit'
      } // { label: 'File', value: 'file' },
      ],
      onChange: newVal => {
        var options = { ...input.options,
          type: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.name,
      onChange: newVal => {
        var options = { ...input.options,
          name: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Default Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.value,
      onChange: newVal => {
        var options = { ...input.options,
          value: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Default Value Source"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: input.options.valueSource,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: 'Post ID',
        value: 'postID'
      }, {
        label: 'Post Slug',
        value: 'postSlug'
      }, {
        label: 'Post Title',
        value: 'postTitle'
      }, // { label: 'Post Tags', value: 'postTags' },
      // { label: 'Post Category Ids', value: 'postCategoryIds' },
      // { label: 'Post Category Slugs', value: 'postCategorySlugs' },
      {
        label: 'Post Author ID',
        value: 'postAuthorID'
      }, {
        label: 'User Id',
        value: 'userId'
      }, {
        label: 'User Email',
        value: 'userEmail'
      }, {
        label: 'User Display Name',
        value: 'userDisplayName'
      }, {
        label: 'User Login',
        value: 'userLogin'
      }, {
        label: 'User Nicename',
        value: 'userNicename'
      }],
      onChange: newVal => {
        var options = { ...input.options,
          valueSource: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Placeholder"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.placeholder,
      onChange: newVal => {
        var options = { ...input.options,
          placeholder: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Readonly?",
      help: input.options.readonly ? 'Readonly Enabled' : 'Readonly Disabled.',
      checked: input.options.readonly ? true : false,
      onChange: e => {
        var options = { ...input.options,
          readonly: input.options.readonly ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Required?",
      help: input.options.required ? 'Required Enabled' : 'Required Disabled.',
      checked: input.options.required ? true : false,
      onChange: e => {
        var options = { ...input.options,
          required: input.options.required ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Disabled?",
      help: input.options.disabled ? 'Disabled Enabled' : 'Disabled Disabled.',
      checked: input.options.disabled ? true : false,
      onChange: e => {
        var options = { ...input.options,
          disabled: input.options.disabled ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Include With Email Body?",
      help: input.options.includeMailBody ? 'Enabled' : 'Disabled.',
      checked: input.options.includeMailBody ? true : false,
      onChange: e => {
        var options = { ...input.options,
          includeMailBody: input.options.includeMailBody ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), input.options.type == 'date' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Input Pattern"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: input.options.pattern,
      options: [{
        label: 'Choose Pattern',
        value: ''
      }, {
        label: 'ddmmyyyy',
        value: 'ddmmyyyy'
      }, {
        label: 'dd/mm/yyyy',
        value: 'dd/mm/yyyy'
      }, {
        label: 'mm/dd/yyyy',
        value: 'mm/dd/yyyy'
      }, {
        label: 'dd-mm-yyyy',
        value: 'dd-mm-yyyy'
      }, {
        label: 'mm-dd-yyyy',
        value: 'mm-dd-yyyy'
      }, {
        label: 'Custom Pattern',
        value: 'custom'
      }],
      onChange: newVal => {
        var options = { ...input.options,
          pattern: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), input.options.pattern == 'custom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom Pattern"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.patternCustom,
      onChange: newVal => {
        var options = { ...input.options,
          patternCustom: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: input,
      onChange: onChangeStyleInput,
      onAdd: onAddStyleInput,
      onRemove: onRemoveStyleInput,
      onBulkAdd: onBulkAddInput
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Error Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Error Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: errorWrap.options.text,
      onChange: newVal => {
        var options = { ...errorWrap.options,
          text: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: errorWrap.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'afterlabel',
        value: 'afterlabel'
      }, {
        label: 'afterInput',
        value: 'afterInput'
      }],
      onChange: newVal => {
        var options = { ...errorWrap.options,
          position: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: errorWrap,
      onChange: onChangeStyleErrorWrap,
      onAdd: onAddStyleErrorWrap,
      onRemove: onRemoveStyleErrorWrap,
      onBulkAdd: onBulkAddErrorWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "label-wrap"
    }, label.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, label.options.text), errorWrap.options.position == 'afterlabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "input-wrap"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", {
      type: input.options.type,
      placeholder: input.options.placeholder,
      value: input.options.value,
      name: input.options.name,
      required: input.options.required,
      disabled: input.options.disabled,
      readonly: input.options.readonly,
      onChange: ev => {
        var newVal = ev.target.value;
        var options = { ...input.options,
          value: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), errorWrap.options.position == 'afterInput' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/form-field-radio/index.js":
/*!**********************************************!*\
  !*** ./src/blocks/form-field-radio/index.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/form-field-radio", {
  apiVersion: 2,
  title: "Form Field - Radio",
  parent: ['post-grid/form-wrap'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          enable: true,
          tag: 'label',
          for: 'label',
          text: 'Your Name',
          class: 'pg-form-field-label'
        },
        styles: {}
      }
    },
    inputWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    radio: {
      type: 'object',
      default: {
        options: {
          value: null,
          name: '',
          required: false,
          disabled: false,
          multiple: false,
          autofocus: null,
          readonly: false,
          args: {
            0: {
              label: 'Option 1',
              value: 'option1'
            },
            1: {
              label: 'Option 2',
              value: 'option2'
            },
            2: {
              label: 'Option 3',
              value: 'option3'
            }
          },
          id: '',
          class: 'pg-form-field-radio',
          postion: 'afterLabel' // beforeLabel, afterLabel, insideLabel

        },
        styles: {}
      }
    },
    item: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    itemLabel: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    labelWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    errorWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          text: '',
          position: 'afterInput',
          class: ''
        },
        styles: {}
      }
    },
    requiredWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'span',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var label = attributes.label;
    var radio = attributes.radio;
    var item = attributes.item;
    var itemLabel = attributes.itemLabel;
    var inputWrap = attributes.inputWrap;
    var errorWrap = attributes.errorWrap;
    var labelWrap = attributes.labelWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var labelSelector = blockClass + ' label';
    var checkboxSelector = blockClass + ' input[type="radio"]';
    var labelWrapSelector = blockClass + ' .label-wrap';
    var inputWrapSelector = blockClass + ' .input-wrap';
    var errorWrapSelector = blockClass + ' .error-wrap';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onBulkAddLabel(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, label);
      obj[sudoScource] = cssObj;
      setAttributes({
        label: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInput(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, radio);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        radio: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, checkboxSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInput(sudoScource, key) {
      var object = myStore.deletePropertyDeep(radio, [sudoScource, key, breakPointX]);
      setAttributes({
        radio: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, checkboxSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInput(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, radio);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        radio: object
      });
    }

    function onBulkAddInput(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, radio);
      obj[sudoScource] = cssObj;
      setAttributes({
        radio: obj
      });
      var selector = myStore.getElementSelector(sudoScource, checkboxSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelWrap: object
      });
    }

    function onBulkAddLabelWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, labelWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        labelWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInputWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInputWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(inputWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInputWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        inputWrap: object
      });
    }

    function onBulkAddInputWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, inputWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        inputWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleErrorWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleErrorWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(errorWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleErrorWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        errorWrap: object
      });
    }

    function onBulkAddErrorWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, errorWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        errorWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-form-field-radio`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelWrap,
      onChange: onChangeStyleLabelWrap,
      onAdd: onAddStyleLabelWrap,
      onRemove: onRemoveStyleLabelWrap,
      onBulkAdd: onBulkAddLabelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Enable?",
      help: label.options.enable ? 'Label Enabled' : 'Label Disabled.',
      checked: label.options.enable ? true : false,
      onChange: e => {
        var options = { ...label.options,
          enable: label.options.enable ? false : true
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: label.options.text,
      onChange: newVal => {
        var options = { ...label.options,
          text: newVal
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel,
      onBulkAdd: onBulkAddLabel
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: inputWrap,
      onChange: onChangeStyleInputWrap,
      onAdd: onAddStyleInputWrap,
      onRemove: onRemoveStyleInputWrap,
      onBulkAdd: onBulkAddInputWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "radio",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 px-3 py-2 rounded-sm text-white inline-block my-3 mr-2",
      onClick: ev => {
        var options = { ...radio.options
        };
        var args = options.args;
        var length = Object.entries(radio.options.args).length;
        args[length] = {
          label: '',
          value: ''
        };
        setAttributes({
          radio: { ...radio,
            options: options
          }
        });
      }
    }, "Add Option"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, Object.entries(radio.options.args).map(item => {
      var index = item[0];
      var arg = item[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex justify-between items-center my-3"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: arg.label,
        placeholder: "Option Label",
        onChange: newVal => {
          var options = { ...radio.options
          };
          var args = options.args;
          args[index].label = newVal;
          setAttributes({
            radio: { ...radio,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Option Value",
        value: arg.value,
        onChange: newVal => {
          var options = { ...radio.options
          };
          var args = options.args;
          args[index].value = newVal;
          setAttributes({
            radio: { ...radio,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer bg-red-500 hover:bg-red-600 text-white px-1 rounded-sm"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"], {
        fill: "#fff",
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        onClick: ev => {
          var optionsX = { ...radio.options
          };
          delete optionsX['args'][index];
          setAttributes({
            radio: { ...radio,
              options: optionsX
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: radio.options.name,
      onChange: newVal => {
        var options = { ...radio.options,
          name: newVal
        };
        setAttributes({
          radio: { ...radio,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: radio.options.value,
      onChange: newVal => {
        var options = { ...radio.options,
          value: newVal
        };
        setAttributes({
          radio: { ...radio,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Readonly?",
      help: radio.options.readonly ? 'Readonly Enabled' : 'Readonly Disabled.',
      checked: radio.options.readonly ? true : false,
      onChange: e => {
        var options = { ...radio.options,
          readonly: radio.options.readonly ? false : true
        };
        setAttributes({
          radio: { ...radio,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Required?",
      help: radio.options.required ? 'Required Enabled' : 'Required Disabled.',
      checked: radio.options.required ? true : false,
      onChange: e => {
        var options = { ...radio.options,
          required: radio.options.required ? false : true
        };
        setAttributes({
          radio: { ...radio,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Disabled?",
      help: radio.options.disabled ? 'Disabled Enabled' : 'Disabled Disabled.',
      checked: radio.options.disabled ? true : false,
      onChange: e => {
        var options = { ...radio.options,
          disabled: radio.options.disabled ? false : true
        };
        setAttributes({
          radio: { ...radio,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: radio,
      onChange: onChangeStyleInput,
      onAdd: onAddStyleInput,
      onRemove: onRemoveStyleInput,
      onBulkAdd: onBulkAddInput
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Error Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Error Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: errorWrap.options.text,
      onChange: newVal => {
        var options = { ...errorWrap.options,
          text: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: errorWrap.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'afterlabel',
        value: 'afterlabel'
      }, {
        label: 'afterInput',
        value: 'afterInput'
      }],
      onChange: newVal => {
        var options = { ...errorWrap.options,
          position: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: errorWrap,
      onChange: onChangeStyleErrorWrap,
      onAdd: onAddStyleErrorWrap,
      onRemove: onRemoveStyleErrorWrap,
      onBulkAdd: onBulkAddErrorWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "label-wrap"
    }, label.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, label.options.text), errorWrap.options.position == 'afterlabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "input-wrap"
    }, Object.entries(radio.options.args).map((item, index) => {
      var index = item[0];
      var arg = item[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "item"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", {
        type: "radio",
        value: arg.value,
        name: radio.options.name,
        multiple: radio.options.multiple,
        required: radio.options.required,
        disabled: radio.options.disabled,
        readonly: radio.options.readonly,
        id: blockId + '-' + index,
        onChange: ev => {
          var newVal = ev.target.value;
          var options = { ...radio.options,
            value: newVal
          };
          setAttributes({
            radio: { ...radio,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: blockId + '-' + index
      }, arg.label));
    }), errorWrap.options.position == 'afterInput' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/form-field-select/index.js":
/*!***********************************************!*\
  !*** ./src/blocks/form-field-select/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/form-field-select", {
  apiVersion: 2,
  title: "Form Field - Select",
  parent: ['post-grid/form-wrap'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          tag: 'label',
          for: 'label',
          enable: true,
          text: 'Your Name',
          class: 'pg-form-field-label'
        },
        styles: {}
      }
    },
    inputWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    select: {
      type: 'object',
      default: {
        options: {
          value: null,
          placeholder: "-Select-",
          name: '',
          required: false,
          disabled: false,
          multiple: false,
          autofocus: null,
          readonly: false,
          args: {
            0: {
              label: 'Option 1',
              value: 'option1'
            },
            1: {
              label: 'Option 2',
              value: 'option2'
            },
            2: {
              label: 'Option 3',
              value: 'option3'
            }
          },
          id: '',
          class: 'pg-form-field-select',
          postion: 'afterLabel' // beforeLabel, afterLabel, insideLabel

        },
        styles: {}
      }
    },
    labelWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    errorWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          text: '',
          position: 'afterInput',
          class: ''
        },
        styles: {}
      }
    },
    requiredWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'span',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var label = attributes.label;
    var select = attributes.select;
    var inputWrap = attributes.inputWrap;
    var errorWrap = attributes.errorWrap;
    var labelWrap = attributes.labelWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var labelSelector = blockClass + ' label';
    var selectSelector = blockClass + ' select';
    var labelWrapSelector = blockClass + ' .label-wrap';
    var inputWrapSelector = blockClass + ' .input-wrap';
    var errorWrapSelector = blockClass + ' .error-wrap';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function RemoveArgs(_ref) {
      let {
        index,
        title
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer bg-red-500 hover:bg-red-600 text-white px-1 rounded-sm"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"], {
        fill: "#fff",
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        onClick: ev => {
          // var selectOptionsX = { ...selectOptions };
          // delete selectOptionsX[index];
          // setAttributes({ selectOptions: selectOptionsX });
          var optionsX = { ...select.options
          };
          delete optionsX['args'][index];
          setAttributes({
            select: { ...select,
              options: optionsX
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "ml-2"
      }, title));
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onBulkAddLabel(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, label);
      obj[sudoScource] = cssObj;
      setAttributes({
        label: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInput(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, select);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        select: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, selectSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInput(sudoScource, key) {
      var object = myStore.deletePropertyDeep(select, [sudoScource, key, breakPointX]);
      setAttributes({
        select: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, selectSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInput(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, select);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        select: object
      });
    }

    function onBulkAddInput(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, select);
      obj[sudoScource] = cssObj;
      setAttributes({
        select: obj
      });
      var selector = myStore.getElementSelector(sudoScource, selectSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelWrap: object
      });
    }

    function onBulkAddLabelWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, labelWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        labelWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInputWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInputWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(inputWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInputWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        inputWrap: object
      });
    }

    function onBulkAddInputWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, inputWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        inputWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleErrorWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleErrorWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(errorWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleErrorWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        errorWrap: object
      });
    }

    function onBulkAddErrorWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, errorWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        errorWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-form-field-select`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelWrap,
      onChange: onChangeStyleLabelWrap,
      onAdd: onAddStyleLabelWrap,
      onRemove: onRemoveStyleLabelWrap,
      onBulkAdd: onBulkAddLabelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Enable?",
      help: label.options.enable ? 'Label Enabled' : 'Label Disabled.',
      checked: label.options.enable ? true : false,
      onChange: e => {
        var options = { ...label.options,
          enable: label.options.enable ? false : true
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: label.options.text,
      onChange: newVal => {
        var options = { ...label.options,
          text: newVal
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel,
      onBulkAdd: onBulkAddLabel
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: inputWrap,
      onChange: onChangeStyleInputWrap,
      onAdd: onAddStyleInputWrap,
      onRemove: onRemoveStyleInputWrap,
      onBulkAdd: onBulkAddInputWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Select",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 cursor-pointer px-3 py-2 rounded-sm text-white inline-block my-3 mr-2",
      onClick: ev => {
        var options = { ...select.options
        };
        var args = options.args;
        var length = Object.entries(select.options.args).length;
        args[length] = {
          label: 'Label',
          value: 'value'
        };
        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    }, "Add Option"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 cursor-pointer px-3 py-2 rounded-sm text-white inline-block my-3",
      onClick: ev => {
        var options = { ...select.options
        };
        var args = options.args;
        var length = Object.entries(select.options.args).length;
        args[length] = {
          label: 'Group Label',
          args: {}
        };
        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    }, "Add Option Group"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Data Sets"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, Object.entries(select.options.args).map(item => {
      var index = item[0];
      var arg = item[1];
      var args = arg.args; //console.log(args);

      if (args != undefined) {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveArgs, {
            index: index,
            title: arg.label
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: "bg-blue-500 px-3 py-2 rounded-sm text-white inline-block my-3 mr-2",
          onClick: ev => {
            // var selectOptionsX = { ...selectOptions };
            // var length = Object.entries(selectOptionsX[index]['args']).length
            // selectOptionsX[index]['args'][length] = { label: '', value: '' }
            // setAttributes({ selectOptions: selectOptionsX });
            console.log(index);
            var options = { ...select.options
            };
            var args = options.args;
            console.log(args);
            var length = Object.entries(select.options.args[index].args).length;
            args[index]['args'][length] = {
              label: '',
              value: ''
            };
            setAttributes({
              select: { ...select,
                options: options
              }
            });
          }
        }, "Add Option"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Group Label"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: arg.label,
          onChange: newVal => {
            // var selectOptionsX = { ...selectOptions };
            // selectOptionsX[index]['label'] = newVal
            // setAttributes({ selectOptions: selectOptionsX });
            var options = { ...select.options
            };
            var args = options.args;
            args[index]['label'] = newVal;
            setAttributes({
              select: { ...select,
                options: options
              }
            });
          }
        })), Object.entries(args).map(x => {
          var optionIndex = x[0];
          var optionData = x[1];
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
            className: "flex justify-between items-center my-3"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
            className: "mr-2",
            value: optionData.label,
            placeholder: "Option Label",
            onChange: newVal => {
              // var selectOptionsX = { ...selectOptions };
              // selectOptionsX[index]['args'][optionIndex]['label'] = newVal
              // setAttributes({ selectOptions: selectOptionsX });
              var options = { ...select.options
              };
              var args = options.args;
              args[index]['args'][optionIndex].label = newVal;
              setAttributes({
                select: { ...select,
                  options: options
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
            className: "mr-2",
            value: optionData.value,
            placeholder: "Option Value",
            onChange: newVal => {
              // var selectOptionsX = { ...selectOptions };
              // selectOptionsX[index]['args'][optionIndex]['value'] = newVal
              // setAttributes({ selectOptions: selectOptionsX });
              var options = { ...select.options
              };
              var args = options.args;
              args[index]['args'][optionIndex].value = newVal;
              setAttributes({
                select: { ...select,
                  options: options
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
            className: "cursor-pointer bg-red-500 hover:bg-red-600 text-white px-1 py-1 rounded-sm"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"], {
            fill: "#fff",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
            onClick: ev => {
              // var selectOptionsX = { ...selectOptions };
              // delete selectOptionsX[index];
              // setAttributes({ selectOptions: selectOptionsX });
              var options = { ...select.options
              };
              var args = options.args;
              delete args[index]['args'][optionIndex];
              setAttributes({
                select: { ...select,
                  options: options
                }
              });
            }
          })));
        }));
      }

      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex justify-between items-center my-3"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveArgs, {
        index: index
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: arg.label,
        placeholder: "Option Label",
        onChange: newVal => {
          // var selectOptionsX = { ...selectOptions };
          // selectOptionsX[index]['label'] = newVal
          // setAttributes({ selectOptions: selectOptionsX });
          var options = { ...select.options
          };
          var args = options.args;
          args[index].label = newVal;
          setAttributes({
            select: { ...select,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Option Value",
        value: arg.value,
        onChange: newVal => {
          // var selectOptionsX = { ...selectOptions };
          // selectOptionsX[index]['value'] = newVal
          // setAttributes({ selectOptions: selectOptionsX });
          var options = { ...select.options
          };
          var args = options.args;
          args[index].value = newVal;
          setAttributes({
            select: { ...select,
              options: options
            }
          });
        }
      }));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: select.options.name,
      onChange: newVal => {
        var options = { ...select.options,
          name: newVal
        };
        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    })), typeof select.options.value == 'object' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ul", null, select.options.value != null && Object.entries(select.options.value).map(x => {
      var val = x[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", null, val);
    }))), typeof select.options.value == 'string' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: select.options.value,
      onChange: newVal => {
        var options = { ...select.options,
          value: newVal
        };
        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Placeholder"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: select.options.placeholder,
      onChange: newVal => {
        var options = { ...select.options,
          placeholder: newVal
        };
        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Multiple?",
      help: select.options.multiple ? 'Multiple Enabled' : 'Multiple Disabled.',
      checked: select.options.multiple ? true : false,
      onChange: e => {
        var options = { ...select.options,
          multiple: select.options.multiple ? false : true
        };
        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Readonly?",
      help: select.options.readonly ? 'Readonly Enabled' : 'Readonly Disabled.',
      checked: select.options.readonly ? true : false,
      onChange: e => {
        var options = { ...select.options,
          readonly: select.options.readonly ? false : true
        };
        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Required?",
      help: select.options.required ? 'Required Enabled' : 'Required Disabled.',
      checked: select.options.required ? true : false,
      onChange: e => {
        var options = { ...select.options,
          required: select.options.required ? false : true
        };
        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Disabled?",
      help: select.options.disabled ? 'Disabled Enabled' : 'Disabled Disabled.',
      checked: select.options.disabled ? true : false,
      onChange: e => {
        var options = { ...select.options,
          disabled: select.options.disabled ? false : true
        };
        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: select,
      onChange: onChangeStyleInput,
      onAdd: onAddStyleInput,
      onRemove: onRemoveStyleInput,
      onBulkAdd: onBulkAddInput
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Error Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Error Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: errorWrap.options.text,
      onChange: newVal => {
        var options = { ...errorWrap.options,
          text: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: errorWrap.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'afterlabel',
        value: 'afterlabel'
      }, {
        label: 'afterInput',
        value: 'afterInput'
      }],
      onChange: newVal => {
        var options = { ...errorWrap.options,
          position: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: errorWrap,
      onChange: onChangeStyleErrorWrap,
      onAdd: onAddStyleErrorWrap,
      onRemove: onRemoveStyleErrorWrap,
      onBulkAdd: onBulkAddErrorWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "label-wrap"
    }, label.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, label.options.text), errorWrap.options.position == 'afterlabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "input-wrap"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("select", {
      name: select.options.name,
      multiple: select.options.multiple,
      required: select.options.required,
      disabled: select.options.disabled,
      readonly: select.options.readonly,
      onChange: ev => {
        var newVal = ev.target.value;
        var multiple = select.options.multiple;

        if (multiple) {
          var oldVal = select.options.value;

          if (typeof select.options.value == 'object') {
            var count = select.options.value.length;
            var valueX = select.options.value;
            valueX[count] = newVal;
          } else {
            valueX = [oldVal];
          }

          var options = { ...select.options,
            value: valueX
          };
        } else {
          var options = { ...select.options,
            value: newVal
          };
        }

        setAttributes({
          select: { ...select,
            options: options
          }
        });
      }
    }, Object.entries(select.options.args).map((item, index) => {
      var index = item[0];
      var arg = item[1];
      var args = arg.args; //console.log(args);

      if (args != undefined) {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("optgroup", {
          label: arg.label
        }, Object.entries(args).map(x => {
          var optionIndex = x[0];
          var optionData = x[1];
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("option", {
            value: optionData.value
          }, optionData.label);
        }));
      }

      if (args == undefined) {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("option", {
          value: arg.value
        }, arg.label);
      }
    })), errorWrap.options.position == 'afterInput' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/form-field-submit/index.js":
/*!***********************************************!*\
  !*** ./src/blocks/form-field-submit/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/form-field-submit", {
  apiVersion: 2,
  title: "Form Field - Submit",
  parent: ['post-grid/form-wrap', 'post-grid/flex-wrap', 'post-grid/flex-wrap-item', 'post-grid/grid-wrap', 'post-grid/grid-wrap-item', 'core/columns', 'post-grid/tabs-nested-item', 'post-grid/accordion-nested-item'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        }
      }
    },
    labelWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          tag: 'label',
          for: 'label',
          enable: true,
          text: '',
          class: 'pg-form-field-label'
        }
      }
    },
    input: {
      type: 'object',
      default: {
        options: {
          type: 'submit',
          placeholder: '',
          value: 'Submit',
          name: '',
          required: false,
          disabled: false,
          size: false,
          minLength: null,
          maxLength: null,
          readonly: false,
          step: null,
          pattern: null,
          max: null,
          min: null,
          checked: false,
          autocomplete: false,
          id: '',
          class: 'pg-form-field-submit',
          postion: 'afterLabel' // beforeLabel, afterLabel, insideLabel

        }
      }
    },
    inputWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    errorWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          text: '',
          position: 'afterInput',
          class: ''
        }
      }
    },
    requiredWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'span',
          enable: true,
          class: ''
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var labelWrap = attributes.labelWrap;
    var label = attributes.label;
    var input = attributes.input;
    var inputWrap = attributes.inputWrap;
    var errorWrap = attributes.errorWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var labelWrapSelector = blockClass + ' .label-wrap';
    var labelSelector = blockClass + ' label';
    var inputWrapSelector = blockClass + ' .input-wrap';
    var inputSelector = blockClass + ' input';
    var errorWrapSelector = blockClass + ' .error-wrap';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelWrap: object
      });
    }

    function onBulkAddLabelWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, labelWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        labelWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInputWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInputWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(inputWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInputWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        inputWrap: object
      });
    }

    function onBulkAddInputWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, inputWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        inputWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleErrorWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleErrorWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(errorWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleErrorWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        errorWrap: object
      });
    }

    function onBulkAddErrorWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, errorWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        errorWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onBulkAddLabel(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, label);
      obj[sudoScource] = cssObj;
      setAttributes({
        label: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInput(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInput(sudoScource, key) {
      var object = myStore.deletePropertyDeep(input, [sudoScource, key, breakPointX]);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInput(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        input: object
      });
    }

    function onBulkAddInput(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, input);
      obj[sudoScource] = cssObj;
      setAttributes({
        input: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-form-field-text`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelWrap,
      onChange: onChangeStyleLabelWrap,
      onAdd: onAddStyleLabelWrap,
      onRemove: onRemoveStyleLabelWrap,
      onBulkAdd: onBulkAddLabelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Enable?",
      help: label.options.enable ? 'Label Enabled' : 'Label Disabled.',
      checked: label.options.enable ? true : false,
      onChange: e => {
        var options = { ...label.options,
          enable: label.options.enable ? false : true
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: label.options.text,
      onChange: newVal => {
        var options = { ...label.options,
          text: newVal
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel,
      onBulkAdd: onBulkAddLabel
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: inputWrap,
      onChange: onChangeStyleInputWrap,
      onAdd: onAddStyleInputWrap,
      onRemove: onRemoveStyleInputWrap,
      onBulkAdd: onBulkAddInputWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Input",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Input Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: input.options.type,
      options: [{
        label: 'Number',
        value: 'number'
      }, {
        label: 'Range',
        value: 'range'
      }, {
        label: 'Email',
        value: 'email'
      }, {
        label: 'URL',
        value: 'url'
      }, {
        label: 'Password',
        value: 'password'
      }, {
        label: 'Hidden',
        value: 'hidden'
      }, {
        label: 'Search',
        value: 'search'
      }, {
        label: 'Telephone',
        value: 'tel'
      }, {
        label: 'Text',
        value: 'text'
      }, {
        label: 'Time',
        value: 'time'
      }, {
        label: 'Week',
        value: 'week'
      }, {
        label: 'Color',
        value: 'color'
      }, {
        label: 'Date',
        value: 'date'
      }, {
        label: 'Datetime-local',
        value: 'datetime-local'
      }, {
        label: 'Button',
        value: 'button'
      }, {
        label: 'Submit',
        value: 'submit'
      } // { label: 'File', value: 'file' },
      ],
      onChange: newVal => {
        var options = { ...input.options,
          type: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.name,
      onChange: newVal => {
        var options = { ...input.options,
          name: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Default Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.value,
      onChange: newVal => {
        var options = { ...input.options,
          value: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Placeholder"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.placeholder,
      onChange: newVal => {
        var options = { ...input.options,
          placeholder: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Readonly?",
      help: input.options.readonly ? 'Readonly Enabled' : 'Readonly Disabled.',
      checked: input.options.readonly ? true : false,
      onChange: e => {
        var options = { ...input.options,
          readonly: input.options.readonly ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Required?",
      help: input.options.required ? 'Required Enabled' : 'Required Disabled.',
      checked: input.options.required ? true : false,
      onChange: e => {
        var options = { ...input.options,
          required: input.options.required ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Disabled?",
      help: input.options.disabled ? 'Disabled Enabled' : 'Disabled Disabled.',
      checked: input.options.disabled ? true : false,
      onChange: e => {
        var options = { ...input.options,
          disabled: input.options.disabled ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: input,
      onChange: onChangeStyleInput,
      onAdd: onAddStyleInput,
      onRemove: onRemoveStyleInput,
      onBulkAdd: onBulkAddInput
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Error Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Error Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: errorWrap.options.text,
      onChange: newVal => {
        var options = { ...errorWrap.options,
          text: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: errorWrap.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'afterlabel',
        value: 'afterlabel'
      }, {
        label: 'afterInput',
        value: 'afterInput'
      }],
      onChange: newVal => {
        var options = { ...errorWrap.options,
          position: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: errorWrap,
      onChange: onChangeStyleErrorWrap,
      onAdd: onAddStyleErrorWrap,
      onRemove: onRemoveStyleErrorWrap,
      onBulkAdd: onBulkAddErrorWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "label-wrap"
    }, label.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, label.options.text), errorWrap.options.position == 'afterlabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "input-wrap"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", {
      type: input.options.type,
      placeholder: input.options.placeholder,
      value: input.options.value,
      name: input.options.name,
      required: input.options.required,
      disabled: input.options.disabled,
      readonly: input.options.readonly,
      onChange: ev => {
        var newVal = ev.target.value;
        var options = { ...input.options,
          value: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), errorWrap.options.position == 'afterInput' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/form-field-textarea/index.js":
/*!*************************************************!*\
  !*** ./src/blocks/form-field-textarea/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/form-field-textarea", {
  apiVersion: 2,
  title: "Form Field - Textarea",
  parent: ['post-grid/form-wrap'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          tag: 'label',
          for: 'label',
          enable: true,
          text: 'Your Name',
          class: 'pg-form-field-label'
        },
        styles: {}
      }
    },
    input: {
      type: 'object',
      default: {
        options: {
          type: 'text',
          placeholder: 'Write your name',
          value: '',
          name: '',
          required: false,
          disabled: false,
          minLength: null,
          maxLength: null,
          readonly: false,
          cols: null,
          rows: 3,
          autocomplete: false,
          autofocus: false,
          wrap: false,
          spellcheck: false,
          autocorrect: false,
          id: '',
          class: '',
          postion: 'afterLabel' // beforeLabel, afterLabel, insideLabel

        },
        styles: {}
      }
    },
    inputWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        }
      }
    },
    labelWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          class: ''
        },
        styles: {}
      }
    },
    errorWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          enable: true,
          text: '',
          position: 'afterInput',
          class: ''
        },
        styles: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: [],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var label = attributes.label;
    var input = attributes.input;
    var inputWrap = attributes.inputWrap;
    var errorWrap = attributes.errorWrap;
    var labelWrap = attributes.labelWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var labelSelector = blockClass + ' label';
    var textareaSelector = blockClass + ' textarea';
    var labelWrapSelector = blockClass + ' .label-wrap';
    var inputWrapSelector = blockClass + ' .input-wrap';
    var errorWrapSelector = blockClass + ' .error-wrap';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onBulkAddLabel(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, label);
      obj[sudoScource] = cssObj;
      setAttributes({
        label: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInput(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, textareaSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInput(sudoScource, key) {
      var object = myStore.deletePropertyDeep(input, [sudoScource, key, breakPointX]);
      setAttributes({
        input: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, textareaSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInput(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, input);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        input: object
      });
    }

    function onBulkAddInput(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, input);
      obj[sudoScource] = cssObj;
      setAttributes({
        input: obj
      });
      var selector = myStore.getElementSelector(sudoScource, textareaSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleLabelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(labelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        labelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, labelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        labelWrap: object
      });
    }

    function onBulkAddLabelWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, labelWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        labelWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, labelWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInputWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInputWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(inputWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        inputWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInputWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, inputWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        inputWrap: object
      });
    }

    function onBulkAddInputWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, inputWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        inputWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, inputWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleErrorWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleErrorWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(errorWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        errorWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleErrorWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, errorWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        errorWrap: object
      });
    }

    function onBulkAddErrorWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, errorWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        errorWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, errorWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-form-field-text`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
        console.log(wrapper);
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: labelWrap,
      onChange: onChangeStyleLabelWrap,
      onAdd: onAddStyleLabelWrap,
      onRemove: onRemoveStyleLabelWrap,
      onBulkAdd: onBulkAddLabelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Enable?",
      help: label.options.enable ? 'Label Enabled' : 'Label Disabled.',
      checked: label.options.enable ? true : false,
      onChange: e => {
        var options = { ...label.options,
          enable: label.options.enable ? false : true
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: label.options.text,
      onChange: newVal => {
        var options = { ...label.options,
          text: newVal
        };
        setAttributes({
          label: { ...label,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel,
      onBulkAdd: onBulkAddLabel
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Textarea",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Textarea Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: inputWrap,
      onChange: onChangeStyleInputWrap,
      onAdd: onAddStyleInputWrap,
      onRemove: onRemoveStyleInputWrap,
      onBulkAdd: onBulkAddInputWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Textarea",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Default Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.value,
      onChange: newVal => {
        var options = { ...input.options,
          value: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Field Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.name,
      onChange: newVal => {
        var options = { ...input.options,
          name: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Placeholder"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.placeholder,
      onChange: newVal => {
        var options = { ...input.options,
          placeholder: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Cols"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.cols,
      onChange: newVal => {
        var options = { ...input.options,
          cols: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "rows"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.rows,
      onChange: newVal => {
        var options = { ...input.options,
          rows: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Max Length"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.maxLength,
      onChange: newVal => {
        var options = { ...input.options,
          maxLength: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Min Length"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: input.options.minLength,
      onChange: newVal => {
        var options = { ...input.options,
          minLength: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Readonly?",
      help: input.options.readonly ? 'Readonly Enabled' : 'Readonly Disabled.',
      checked: input.options.readonly ? true : false,
      onChange: e => {
        var options = { ...input.options,
          readonly: input.options.readonly ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Required?",
      help: input.options.required ? 'Required Enabled' : 'Required Disabled.',
      checked: input.options.required ? true : false,
      onChange: e => {
        var options = { ...input.options,
          required: input.options.required ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Disabled?",
      help: input.options.disabled ? 'Enabled' : 'Disabled.',
      checked: input.options.disabled ? true : false,
      onChange: e => {
        var options = { ...input.options,
          disabled: input.options.disabled ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Autocomplete?",
      help: input.options.autocomplete ? 'Enabled' : 'Disabled.',
      checked: input.options.autocomplete ? true : false,
      onChange: e => {
        var options = { ...input.options,
          autocomplete: input.options.autocomplete ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Spellcheck?",
      help: input.options.spellcheck ? 'Enabled' : 'Disabled.',
      checked: input.options.spellcheck ? true : false,
      onChange: e => {
        var options = { ...input.options,
          spellcheck: input.options.spellcheck ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      className: "my-3",
      label: "Auto correct?",
      help: input.options.autocorrect ? 'Enabled' : 'Disabled.',
      checked: input.options.autocorrect ? true : false,
      onChange: e => {
        var options = { ...input.options,
          autocorrect: input.options.autocorrect ? false : true
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: input,
      onChange: onChangeStyleInput,
      onAdd: onAddStyleInput,
      onRemove: onRemoveStyleInput,
      onBulkAdd: onBulkAddInput
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Error Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Error Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: errorWrap.options.text,
      onChange: newVal => {
        var options = { ...errorWrap.options,
          text: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: errorWrap.options.position,
      options: [{
        label: 'None',
        value: ''
      }, {
        label: 'afterlabel',
        value: 'afterlabel'
      }, {
        label: 'afterInput',
        value: 'afterInput'
      }],
      onChange: newVal => {
        var options = { ...errorWrap.options,
          position: newVal
        };
        setAttributes({
          errorWrap: { ...errorWrap,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: errorWrap,
      onChange: onChangeStyleErrorWrap,
      onAdd: onAddStyleErrorWrap,
      onRemove: onRemoveStyleErrorWrap,
      onBulkAdd: onBulkAddErrorWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "label-wrap"
    }, label.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, label.options.text), errorWrap.options.position == 'afterlabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "input-wrap"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("textarea", {
      placeholder: input.options.placeholder,
      name: input.options.name,
      required: input.options.required,
      disabled: input.options.disabled,
      readonly: input.options.readonly,
      onChange: ev => {
        var newVal = ev.target.value;
        var options = { ...input.options,
          value: newVal
        };
        setAttributes({
          input: { ...input,
            options: options
          }
        });
      }
    }, input.options.value), errorWrap.options.position == 'afterInput' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "error-wrap"
    }, errorWrap.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/form-wrap/index.js":
/*!***************************************!*\
  !*** ./src/blocks/form-wrap/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./variations */ "./src/blocks/form-wrap/variations.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");


















const {
  RawHTML
} = wp.element;















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/form-wrap", {
  apiVersion: 2,
  title: "Form Wrap",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "4.28",
      y: "1.77",
      width: "27.45",
      height: "6.34",
      rx: "0.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M31.15,8.68H4.85A1.14,1.14,0,0,1,3.7,7.53V2.34A1.15,1.15,0,0,1,4.85,1.19h26.3A1.15,1.15,0,0,1,32.3,2.34V7.53A1.14,1.14,0,0,1,31.15,8.68Zm0-1.16v0Zm0-5.18H4.85V7.53H31.14Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "4.28",
      y: "14.73",
      width: "27.45",
      height: "7.06",
      rx: "0.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M31.15,22.38H4.85A1.15,1.15,0,0,1,3.7,21.22V15.31a1.15,1.15,0,0,1,1.15-1.16h26.3a1.15,1.15,0,0,1,1.15,1.16v5.91A1.15,1.15,0,0,1,31.15,22.38Zm0-1.16v0Zm0-5.91H4.85v5.91H31.14Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "4.28",
      y: "28.06",
      width: "27.45",
      height: "7.06",
      rx: "0.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#fff",
      d: "M20.86,31.54a.26.26,0,0,0-.05-.12L19.1,29.71a.25.25,0,1,0-.35.35L20,31.35H14.17a.25.25,0,1,0,0,.49H20l-1.29,1.29a.24.24,0,0,0,0,.35.23.23,0,0,0,.17.07.26.26,0,0,0,.18-.07l1.71-1.71a.29.29,0,0,0,.07-.18h0S20.86,31.56,20.86,31.54Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    form: {
      type: 'object',
      default: {
        options: {
          class: '',
          type: 'contactForm'
        },
        styles: {}
      }
    },
    visible: {
      type: 'object',
      default: {}
    },
    onSubmit: {
      type: 'object',
      default: {}
    },
    onProcess: {
      type: 'object',
      default: {}
    },
    afterSubmit: {
      type: 'object',
      default: {}
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ['post-grid/popupId'],
  providesContext: {
    'post-grid/formId': 'blockId'
  },
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var form = attributes.form;
    var visible = attributes.visible;
    var onSubmit = attributes.onSubmit;
    var onProcess = attributes.onProcess;
    var afterSubmit = attributes.afterSubmit;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__.applyFilters)('isProFeature', true);
    var [userRoles, setuserRoles] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({});
    var [postTypes, setpostTypes] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({});
    var [postStatuses, setpostStatuses] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({});
    var [enableDatePicker, setenableDatePicker] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    var [fluentcrmLists, setfluentcrmLists] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null);
    var [fluentcrmTags, setfluentcrmTags] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var formSelector = blockClass + ' form';
    const {
      replaceInnerBlocks
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useDispatch)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store);
    const hasInnerBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store).getBlocks(clientId).length > 0, [clientId]); //console.log(JSON.stringify(wp.data.select(blockEditorStore).getBlocks(clientId)));

    var visbleArgsBasic = {
      userLogged: {
        label: 'User Logged',
        description: 'Show when user logged-in(any user)',
        args: {
          id: 'userLogged',
          value: ''
        }
      },
      userNotLogged: {
        label: 'User Not Logged',
        description: 'Show when user Not logged-in.',
        args: {
          id: 'userNotLogged',
          value: ''
        }
      },
      userRoles: {
        label: 'User Roles',
        description: 'Show when user has specific roles.',
        args: {
          id: 'userRoles',
          roles: []
        }
      },
      isYears: {
        label: 'is Years',
        description: 'Show when specific Years',
        args: {
          id: 'isYears',
          value: '',
          values: '',
          compare: '='
        },
        isPro: true
      },
      isMonths: {
        label: 'is Months',
        description: 'Show when specific months',
        args: {
          id: 'isMonths',
          value: '',
          values: [],
          compare: '='
        },
        isPro: true
      },
      weekDays: {
        label: 'is Week day',
        description: 'Show when specific week days',
        args: {
          id: 'weekDays',
          value: '',
          values: [],
          compare: '='
        },
        isPro: true
      },
      isHours: {
        label: 'is Hours',
        description: 'Show when specific hours',
        args: {
          id: 'isHours',
          value: '',
          values: [],
          compare: '='
        },
        isPro: true
      },
      //isMinutes: { label: 'is Minutes', description: 'Show when specific Minutes', args: { id: 'isMinutes', value: '', values: [], compare: '=' }, isPro:true },
      isDate: {
        label: 'is Date',
        description: 'Show when specific date',
        args: {
          id: 'isDate',
          value: '',
          values: [],
          compare: '='
        },
        isPro: true
      } // submitCount: { label: 'Submit Count', description: 'Visible under specific submit count', args: { id: 'submitCount', value: '' }, isPro:true },

    };
    let visbleArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__.applyFilters)('pgFormvisbleArgs', visbleArgsBasic);
    var onSubmitArgs = {
      validation: {
        label: 'Validation',
        description: 'Validate form fields',
        args: {
          id: 'validation',
          messages: []
        }
      },
      submitConfirm: {
        label: 'Submit Confirm',
        description: 'confirm form submit',
        args: {
          id: 'submitConfirm',
          messages: []
        }
      } //sendMail: { label: 'Send Mail', description: 'Send Mail', args: { id: 'sendMail', mailTo: '', bcc: '', fromEmail: '', fromName: '', replyTo: "", replyToName: '', successMessage: '', failedMessage: '', } },
      // createUser: { label: 'Create User', description: 'Create User', args: { id: 'createUser', value: '' } },
      // loginUser: { label: 'Login User', description: 'Login User', args: { id: 'loginUser', value: '' } },
      // createPostTerm: { label: 'Create Post Term', description: 'Create Post Term', args: { id: 'createPostTerm', postId: '', postType: '', taxonomy: '', hierarchical: '', } },
      // updatePostMeta: { label: 'Create Post Thumbnail', description: 'Create Post Thumbnail', args: { id: 'updatePostMeta', postId: '', } },
      // updateOption: { label: 'Update Option', description: 'Update Option', args: { id: 'updateOption', value: '' } },
      // redirectToURL: { label: 'Update Option', description: 'Update Option', args: { id: 'updateOption', value: '' } },
      // redirectToPost: { label: 'Update Option', description: 'Update Option', args: { id: 'updateOption', value: '' } },

    }; //let onSubmitArgs = applyFilters('post-grid/form-wrap/onSubmitArgs', onSubmitArgsBasic);

    var afterSubmitArgs = {
      showResponse: {
        label: 'Show Response',
        description: 'Show Response Message',
        args: {
          id: 'showResponse',
          message: ''
        }
      },
      redirectToURL: {
        label: 'Redirect To URL',
        description: 'Redirect To URL',
        args: {
          id: 'redirectToURL',
          value: ''
        }
      },
      refreshPage: {
        label: 'Refresh Page',
        description: 'Refresh Page',
        args: {
          id: 'refreshPage',
          delay: ''
        }
      },
      //loggedOut: { label: 'Logged Out', description: 'Logged out current user', args: { id: 'loggedOut', message: '' } },
      //loggedIn: { label: 'Logged In', description: 'Logged in user', args: { id: 'loggedIn', message: '' } },
      loggedOut: {
        label: 'Logged Out',
        description: 'Logged out current user',
        args: {
          id: 'loggedOut',
          redirect: ''
        }
      },
      hideForm: {
        label: 'Hide Form',
        description: 'Hide Form',
        args: {
          id: 'hideForm',
          message: ''
        }
      },
      clearForm: {
        label: 'Clear Form',
        description: 'Clear Form',
        args: {
          id: 'clearForm',
          message: ''
        }
      },
      hidePopup: {
        label: 'Hide Popup',
        description: 'Hide Popup',
        args: {
          id: 'hidePopup',
          message: ''
        }
      } //delay: { label: 'Delay', description: 'Delay', args: { id: 'delay', delay: 1000 } },

    };
    var onProcessArgs = {
      // Contact Form
      sendMail: {
        label: 'Send Mail',
        description: 'Send Mail',
        args: {
          id: 'sendMail',
          mailTo: '',
          bcc: ''
        }
      },
      emailBcc: {
        label: 'Send BCC',
        description: 'Send BCC',
        args: {
          id: 'emailBcc',
          message: ''
        }
      },
      emailCopyUser: {
        label: 'Email Copy User',
        description: 'Email Copy User',
        args: {
          id: 'emailCopyUser',
          message: ''
        }
      },
      autoReply: {
        label: 'Auto Reply',
        description: 'Auto Reply',
        args: {
          id: 'autoReply',
          message: ''
        }
      },
      // Login Form
      loggedInUser: {
        label: 'Logged in user',
        description: 'Logged in user',
        args: {
          id: 'loggedInUser',
          message: ''
        }
      },
      // Register Form
      registerUser: {
        label: 'Register user',
        description: 'Register user',
        args: {
          id: 'registerUser',
          message: ''
        }
      },
      //registerUserMail: { label: 'Register user mail', description: 'Register user mail', args: { id: 'registerUserMail', mailTo: '', bcc: '', } },
      // Post Submit form
      postSubmit: {
        label: 'Create Post',
        description: 'Create Post',
        args: {
          id: 'postSubmit',
          postType: ''
        }
      },
      commentSubmit: {
        label: 'Comment Submit',
        description: 'Comment Submit',
        args: {
          id: 'commentSubmit',
          loginRequired: false
        }
      },
      termSubmit: {
        label: 'Term Submit',
        description: 'Term Submit',
        args: {
          id: 'termSubmit',
          postType: ''
        }
      },
      // For All type form
      createEntry: {
        label: 'Create Entry',
        description: 'Create Entry',
        args: {
          id: 'createEntry',
          message: ''
        }
      },
      newsletterSubmit: {
        label: 'Newsletter Submit',
        description: 'Newsletter Submit',
        args: {
          id: 'newsletterSubmit',
          message: ''
        }
      },
      // third-parties
      fluentcrmAddContact: {
        label: 'Fluentcrm - Add Contact',
        description: 'Add to Fluentcrm Contacts list',
        args: {
          id: 'fluentcrmAddContact',
          lists: [],
          tags: [],
          message: ''
        }
      }
    };
    var formTypeArgs = {
      contactForm: {
        label: 'Contact Form',
        description: 'Contact Form',
        args: {
          id: 'contactForm'
        }
      },
      loginForm: {
        label: 'Login Form',
        description: 'Login Form',
        args: {
          id: 'loginForm'
        }
      },
      registerForm: {
        label: 'Register Form',
        description: 'Register Form',
        args: {
          id: 'registerForm'
        }
      },
      postSubmitForm: {
        label: 'Post Submit Form',
        description: 'Post Submit Form',
        args: {
          id: 'postSubmitForm'
        }
      },
      // postUpdateForm: { label: 'Post Update Form', description: 'Post Update Form', args: { id: 'postUpdateForm', } },
      termSubmitForm: {
        label: 'Term Submit Form',
        description: 'Term Submit Form',
        args: {
          id: 'termSubmitForm'
        }
      },
      // termUpdateForm: { label: 'Term Update Form', description: 'Term Update Form', args: { id: 'termUpdateForm', } },
      // postMetaUpdate: { label: 'Post Meta Update', description: 'Post Meta Update', args: { id: 'postMetaUpdate', } },
      commentSubmit: {
        label: 'Comment Submit Form',
        description: 'Post Comment Submit Form',
        args: {
          id: 'commentSubmit'
        }
      },
      // postCommentUpdateForm: { label: 'Post Comment Update Form', description: 'Post Comment Update Form', args: { id: 'postCommentUpdateForm', } },
      // fileUploadForm: { label: 'File Upload Form', description: 'File Upload Form', args: { id: 'fileUploadForm', } },
      //newsletterForm: { label: 'Newsletter Form', description: 'Newsletter Form', args: { id: 'newsletterForm', } },
      optInForm: {
        label: 'Opt-In Form',
        description: 'Opt-In Form',
        args: {
          id: 'optInForm'
        }
      },
      postFilter: {
        label: 'Post Filter',
        description: 'Post Filter',
        args: {
          id: 'postFilter'
        }
      },
      appointmentForm: {
        label: 'Appointment Form',
        description: 'Appointment Form',
        args: {
          id: 'appointmentForm'
        }
      }
    };
    var monthsNum = {
      1: {
        label: 'January',
        value: 1
      },
      2: {
        label: 'February',
        value: 2
      },
      3: {
        label: 'March',
        value: 3
      },
      4: {
        label: 'April',
        value: 4
      },
      5: {
        label: 'May',
        value: 5
      },
      6: {
        label: 'June',
        value: 6
      },
      7: {
        label: 'July',
        value: 7
      },
      8: {
        label: 'August',
        value: 8
      },
      9: {
        label: 'September',
        value: 9
      },
      10: {
        label: 'October',
        value: 10
      },
      11: {
        label: 'November',
        value: 11
      },
      12: {
        label: 'December',
        value: 12
      }
    };
    var weekDayNumn = {
      0: {
        label: 'Sunday',
        value: 0
      },
      1: {
        label: 'Monday',
        value: 1
      },
      2: {
        label: 'Tuesday',
        value: 2
      },
      3: {
        label: 'Wednesday',
        value: 3
      },
      4: {
        label: 'Thursday',
        value: 4
      },
      5: {
        label: 'Friday',
        value: 5
      },
      6: {
        label: 'Saturday',
        value: 6
      }
    };
    var hoursNum = {
      0: {
        label: '12AM',
        value: 0
      },
      1: {
        label: '1AM',
        value: 1
      },
      2: {
        label: '2AM',
        value: 2
      },
      3: {
        label: '3AM',
        value: 3
      },
      4: {
        label: '4AM',
        value: 4
      },
      5: {
        label: '5AM',
        value: 5
      },
      6: {
        label: '6AM',
        value: 6
      },
      7: {
        label: '7AM',
        value: 7
      },
      8: {
        label: '8AM',
        value: 8
      },
      9: {
        label: '9AM',
        value: 9
      },
      10: {
        label: '10AM',
        value: 10
      },
      11: {
        label: '11AM',
        value: 11
      },
      12: {
        label: '12PM',
        value: 12
      },
      13: {
        label: '1PM',
        value: 13
      },
      14: {
        label: '2PM',
        value: 14
      },
      15: {
        label: '3PM',
        value: 15
      },
      16: {
        label: '4PM',
        value: 16
      },
      17: {
        label: '5PM',
        value: 17
      },
      18: {
        label: '6PM',
        value: 18
      },
      19: {
        label: '7PM',
        value: 19
      },
      20: {
        label: '8PM',
        value: 20
      },
      21: {
        label: '9PM',
        value: 21
      },
      22: {
        label: '10PM',
        value: 22
      },
      23: {
        label: '11PM',
        value: 23
      }
    };
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default()({
        path: '/post-grid/v2/user_roles_list',
        method: 'POST',
        data: {}
      }).then(res => {
        var roles = res.roles == undefined ? [] : res.roles;
        var rolesX = {};
        Object.entries(roles).map(role => {
          var index = role[0];
          var val = role[1];
          rolesX[index] = {
            label: val,
            value: index
          };
        });
        setuserRoles(rolesX);
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default()({
        path: '/post-grid/v2/post_types',
        method: 'POST',
        data: {}
      }).then(res => {
        var types = [];
        Object.entries(res).map(x => {
          var postTypeId = x[0];
          var postTypeLabel = x[1];
          types.push({
            label: postTypeLabel,
            value: postTypeId
          });
        });
        setpostTypes(types);
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default()({
        path: '/post-grid/v2/get_post_statuses',
        method: 'POST',
        data: {}
      }).then(res => {
        var types = [];
        Object.entries(res).map(x => {
          var postTypeId = x[0];
          var postTypeLabel = x[1];
          types.push({
            label: postTypeLabel,
            value: postTypeId
          });
        });
        setpostStatuses(types);
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default()({
        path: '/post-grid/v2/fluentcrm_lists',
        method: 'POST',
        data: {}
      }).then(res => {
        var lists = {};
        Object.entries(res).map(x => {
          var id = x[0];
          var listData = x[1];
          lists[listData.slug] = {
            label: listData.title,
            slug: listData.slug,
            id: id
          };
        });
        console.log(lists);
        setfluentcrmLists(lists);
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default()({
        path: '/post-grid/v2/fluentcrm_tags',
        method: 'POST',
        data: {}
      }).then(res => {
        var tags = {};
        Object.entries(res).map(x => {
          var id = x[0];
          var listData = x[1];
          tags[listData.slug] = {
            label: listData.title,
            slug: listData.slug,
            id: id
          };
        });
        setfluentcrmTags(tags);
      });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);

    function onFormSubmit(ev) {
      console.log(ev);
      ev.preventDefault();
      return false;
    }

    var RemoveVisibleGroup = function (_ref) {
      let {
        title,
        index
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var visibleX = { ...visible
          };
          delete visibleX[index];
          setAttributes({
            visible: visibleX
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, title));
    };

    var RemoveVisibleArg = function (_ref2) {
      let {
        title,
        index,
        groupId
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var visibleX = { ...visible
          };
          visibleX[groupId].args.splice(index, 1);
          setAttributes({
            visible: visibleX
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, title));
    };

    var RemoveOnSubmitArg = function (_ref3) {
      let {
        title,
        index
      } = _ref3;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var onSubmitX = { ...onSubmit
          };
          delete onSubmitX[index];
          setAttributes({
            onSubmit: onSubmitX
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, title));
    };

    var RemoveonProcessArg = function (_ref4) {
      let {
        title,
        index
      } = _ref4;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var onProcessX = { ...onProcess
          };
          delete onProcessX[index];
          setAttributes({
            onProcess: onProcessX
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, title));
    };

    var RemoveAfterSubmitArg = function (_ref5) {
      let {
        title,
        index
      } = _ref5;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var afterSubmitX = { ...afterSubmit
          };
          delete afterSubmitX[index];
          setAttributes({
            afterSubmit: afterSubmitX
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, title));
    };

    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleForm(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, form);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        form: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, formSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleForm(sudoScource, key) {
      var object = myStore.deletePropertyDeep(form, [sudoScource, key, breakPointX]);
      setAttributes({
        form: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, formSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleForm(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, form);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        form: object
      });
    }

    function onBulkAddForm(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, form);
      obj[sudoScource] = cssObj;
      setAttributes({
        form: obj
      });
      var selector = myStore.getElementSelector(sudoScource, formSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    const ALLOWED_BLOCKS = [];
    const MY_TEMPLATE = [['form-field-input', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-form-wrap `
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      //allowedBlocks: ALLOWED_BLOCKS,
      //template: MY_TEMPLATE,
      orientation: 'horizontal',
      templateInsertUpdatesSelection: true,
      renderAppender: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.ButtonBlockAppender
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Form Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: formTypeArgs[form.options == undefined ? form.type : form.options.type] == undefined ? 'Form Type' : formTypeArgs[form.options == undefined ? form.type : form.options.type].label,
      options: formTypeArgs,
      onChange: (option, index) => {
        //setAttributes({ form: { ...form, type: index } });
        var options = { ...form.options,
          type: index
        };
        setAttributes({
          form: { ...form,
            options: options
          }
        }); //console.log(wp.data.select(blockEditorStore).getBlocks(clientId));
      },
      values: ""
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
        console.log(wrapper);
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Form Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: form,
      onChange: onChangeStyleForm,
      onAdd: onAddStyleForm,
      onRemove: onRemoveStyleForm,
      onBulkAdd: onBulkAddForm
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Visiblity",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 p-2 px-4 text-white inline-block cursor-pointer rounded-sm",
      onClick: ev => {
        var visibleX = { ...visible
        };
        var index = Object.entries(visibleX).length;
        visibleX[index] = {
          logic: 'OR',
          title: '',
          args: []
        };
        setAttributes({
          visible: visibleX
        });
      }
    }, "Add Group"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "my-4"
    }, Object.entries(visible).map((group, groupIndex) => {
      var groupId = group[0];
      var groupData = group[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
        title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleGroup, {
          title: groupIndex,
          index: groupId
        }),
        initialOpen: false
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "my-3"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
        position: "bottom right",
        variant: "secondary",
        buttonTitle: 'Add Condition',
        options: visbleArgs,
        onChange: (option, index) => {
          var visibleX = { ...visible
          };
          visibleX[groupId]['args'].push(option.args);
          setAttributes({
            visible: visibleX
          });
        },
        values: ""
      })), visible[groupId]['args'] != undefined && visible[groupId]['args'].map((item, index) => {
        var id = item.id; //console.log(item);

        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, id == 'userLogged' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition."), id == 'userNotLogged' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition."), id == 'userRoles' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
          position: "bottom right",
          variant: "secondary",
          buttonTitle: 'Add Role',
          options: userRoles,
          onChange: (option, i) => {
            var visibleX = { ...visible
            };
            var roles = item.roles;
            roles.push(option.value);
            visibleX[groupId]['args'][index].roles = roles;
            setAttributes({
              visible: visibleX
            });
          },
          value: item.roles
        }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, Object.entries(item.roles).map((x, k) => {
          var roleId = x[1];
          console.log(k);
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
            className: "mb-4"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, roleId), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
            className: "bg-red-500 p-1 cursor-pointer",
            onClick: ev => {
              var visibleX = { ...visible
              }; //var roles = item.roles;
              //roles.push(option.value);

              visibleX[groupId]['args'][index].roles.splice(k, 1);
              setAttributes({
                visible: visibleX
              });
            }
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
            fill: "#fff",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
          })));
        }))), id == 'userCapabilities' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition."), (id == 'isYears' || id == 'isMinutes') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "From"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.from,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['from'] = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        })), item.compare == 'between' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, " Please use comma separate values "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, "Ex: 2022,2023")), item.compare == 'exist' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, " Please use comma separate values "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, "Ex: 2022,2023,2025")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Compare"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
          label: "",
          value: item.compare,
          options: [{
            label: '=',
            value: '='
          }, {
            label: '!=',
            value: '!='
          }, {
            label: '>',
            value: '>'
          }, {
            label: '<',
            value: '<'
          }, {
            label: '>=',
            value: '>='
          }, {
            label: '<=',
            value: '<='
          }, {
            label: 'between',
            value: 'between'
          }, {
            label: 'exist',
            value: 'exist'
          }],
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['compare'] = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'isMonths' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Compare"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
          label: "",
          value: item.compare,
          options: [{
            label: '=',
            value: '='
          }, {
            label: '!=',
            value: '!='
          }, {
            label: '>',
            value: '>'
          }, {
            label: '<',
            value: '<'
          }, {
            label: '>=',
            value: '>='
          }, {
            label: '<=',
            value: '<='
          }, {
            label: 'between',
            value: 'between'
          }, {
            label: 'exist',
            value: 'exist'
          }],
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['compare'] = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        })), (item.compare == '=' || item.compare == '!=' || item.compare == '>' || item.compare == '<' || item.compare == '>=' || item.compare == '<=') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Values"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
          position: "bottom right",
          variant: "secondary",
          buttonTitle: item.value.length == 0 ? 'Choose Month' : monthsNum[item.value].label,
          options: monthsNum,
          onChange: (option, optionIndex) => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['value'] = option.value;
            setAttributes({
              visible: visibleX
            });
          },
          value: item.value
        }))), (item.compare == 'between' || item.compare == 'exist') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Values"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
          position: "bottom right",
          variant: "secondary",
          buttonTitle: 'Choose Month',
          options: monthsNum,
          onChange: (option, optionIndex) => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['values'].push(option.value);
            setAttributes({
              visible: visibleX
            });
          },
          value: item.values
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, item.values.map((x, i) => {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
            className: "flex justify-between my-1"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, monthsNum[x].label), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
            className: "bg-red-500 text-white p-1 cursor-pointer hover:",
            onClick: ev => {
              var visibleX = { ...visible
              };
              item.values.splice(i, 1);
              visibleX[groupId]['args'][index]['values'] = item.values;
              setAttributes({
                visible: visibleX
              });
            }
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
            fill: "#fff",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
          })));
        })))), id == 'weekDays' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Compare"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
          label: "",
          value: item.compare,
          options: [{
            label: '=',
            value: '='
          }, {
            label: '!=',
            value: '!='
          }, {
            label: '>',
            value: '>'
          }, {
            label: '<',
            value: '<'
          }, {
            label: '>=',
            value: '>='
          }, {
            label: '<=',
            value: '<='
          }, {
            label: 'between',
            value: 'between'
          }, {
            label: 'exist',
            value: 'exist'
          }],
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['compare'] = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        })), (item.compare == '=' || item.compare == '!=' || item.compare == '>' || item.compare == '<' || item.compare == '>=' || item.compare == '<=') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Values"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
          position: "bottom right",
          variant: "secondary",
          buttonTitle: item.value.length == 0 ? 'Choose Day' : weekDayNumn[item.value].label,
          options: weekDayNumn,
          onChange: (option, optionIndex) => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['value'] = option.value;
            setAttributes({
              visible: visibleX
            });
          },
          value: item.value
        }))), (item.compare == 'between' || item.compare == 'exist') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Values"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
          position: "bottom right",
          variant: "secondary",
          buttonTitle: 'Choose Days',
          options: weekDayNumn,
          onChange: (option, optionIndex) => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['values'].push(option.value);
            setAttributes({
              visible: visibleX
            });
          },
          value: item.values
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, item.values.map((x, i) => {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
            className: "flex justify-between my-1"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, weekDayNumn[x].label), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
            className: "bg-red-500 text-white p-1 cursor-pointer hover:",
            onClick: ev => {
              var visibleX = { ...visible
              };
              item.values.splice(i, 1);
              visibleX[groupId]['args'][index]['values'] = item.values;
              setAttributes({
                visible: visibleX
              });
            }
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
            fill: "#fff",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
          })));
        })))), id == 'isHours' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Compare"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
          label: "",
          value: item.compare,
          options: [{
            label: '=',
            value: '='
          }, {
            label: '!=',
            value: '!='
          }, {
            label: '>',
            value: '>'
          }, {
            label: '<',
            value: '<'
          }, {
            label: '>=',
            value: '>='
          }, {
            label: '<=',
            value: '<='
          }, {
            label: 'between',
            value: 'between'
          }, {
            label: 'exist',
            value: 'exist'
          }],
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['compare'] = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        })), (item.compare == '=' || item.compare == '!=' || item.compare == '>' || item.compare == '<' || item.compare == '>=' || item.compare == '<=') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Values"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
          position: "bottom right",
          variant: "secondary",
          buttonTitle: item.value.length == 0 ? 'Choose Hours' : hoursNum[item.value].label,
          options: hoursNum,
          onChange: (option, optionIndex) => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['value'] = option.value;
            setAttributes({
              visible: visibleX
            });
          },
          value: item.value
        }))), (item.compare == 'between' || item.compare == 'exist') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Values"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
          position: "bottom right",
          variant: "secondary",
          buttonTitle: 'Choose Month',
          options: hoursNum,
          onChange: (option, optionIndex) => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['values'].push(option.value);
            setAttributes({
              visible: visibleX
            });
          },
          value: item.values
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, item.values.map((x, i) => {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
            className: "flex justify-between my-1"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, hoursNum[x].label), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
            className: "bg-red-500 text-white p-1 cursor-pointer hover:",
            onClick: ev => {
              var visibleX = { ...visible
              };
              item.values.splice(i, 1);
              visibleX[groupId]['args'][index]['values'] = item.values;
              setAttributes({
                visible: visibleX
              });
            }
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
            fill: "#fff",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
          })));
        })))), id == 'isDate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Compare"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
          label: "",
          value: item.compare,
          options: [{
            label: '=',
            value: '='
          }, {
            label: '!=',
            value: '!='
          }, {
            label: '>',
            value: '>'
          }, {
            label: '<',
            value: '<'
          }, {
            label: '>=',
            value: '>='
          }, {
            label: '<=',
            value: '<='
          }, {
            label: 'between',
            value: 'between'
          }, {
            label: 'exist',
            value: 'exist'
          }],
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['compare'] = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        })), (item.compare == '=' || item.compare == '!=' || item.compare == '>' || item.compare == '<' || item.compare == '>=' || item.compare == '<=') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Values"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Button, {
          className: enableDatePicker ? "!bg-gray-400" : '',
          onClick: ev => {
            setenableDatePicker(prev => !prev);
          }
        }, item.value.length == 0 ? "Choose Date" : item.value)), enableDatePicker && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Popover, {
          position: "bottom left "
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: "p-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.DatePicker, {
          onChange: newDate => {
            console.log(newDate);
            const dateFull = new Date(newDate);
            let day = dateFull.getDate();
            let month = dateFull.getMonth() + 1;
            let year = dateFull.getFullYear();
            var dateStr = year + '-' + month + '-' + day;
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['value'] = dateStr;
            setAttributes({
              visible: visibleX
            });
          },
          is12Hour: true
        })))), (item.compare == 'between' || item.compare == 'exist') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Values"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Button, {
          className: enableDatePicker ? "!bg-gray-400" : '',
          onClick: ev => {
            setenableDatePicker(prev => !prev);
          }
        }, "Choose Date")), enableDatePicker && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Popover, {
          position: "bottom left "
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: "p-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.DatePicker, {
          onChange: newDate => {
            console.log(newDate);
            const dateFull = new Date(newDate);
            let day = dateFull.getDate();
            let month = dateFull.getMonth() + 1;
            let year = dateFull.getFullYear();
            var dateStr = year + '-' + month + '-' + day;
            console.log(dateStr);
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index]['values'].push(dateStr);
            setAttributes({
              visible: visibleX
            });
          },
          is12Hour: true
        }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, item.values.map((x, i) => {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
            className: "flex justify-between my-1"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
            className: "bg-red-500 text-white p-1 cursor-pointer hover:",
            onClick: ev => {
              var visibleX = { ...visible
              };
              item.values.splice(i, 1);
              visibleX[groupId]['args'][index]['values'] = item.values;
              setAttributes({
                visible: visibleX
              });
            }
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
            fill: "#fff",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
          })));
        })))), id == 'submitCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition.")));
      }));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "On Submit",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: 'Add Action',
      options: onSubmitArgs,
      onChange: (option, index) => {
        var onSubmitX = { ...onSubmit
        };
        var index = Object.entries(onSubmitX).length;
        onSubmitX[index] = option.args;
        setAttributes({
          onSubmit: onSubmitX
        });
      },
      values: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "my-4"
    }, Object.entries(onSubmit).map(group => {
      var groupIndex = group[0];
      var groupData = group[1];
      var id = groupData.id;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
        title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveOnSubmitArg, {
          title: onSubmitArgs[id] == undefined ? id : onSubmitArgs[id].label,
          index: groupIndex
        }),
        initialOpen: false
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, id == 'validation' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition."), id == 'submitConfirm' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition.")));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "On Process",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: 'Add Action',
      options: onProcessArgs,
      onChange: (option, index) => {
        var onProcessX = { ...onProcess
        };
        var index = Object.entries(onProcessX).length;
        onProcessX[index] = option.args;
        setAttributes({
          onProcess: onProcessX
        });
      },
      values: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "my-4"
    }, Object.entries(onProcess).map(group => {
      var groupIndex = group[0];
      var groupData = group[1];
      var id = groupData.id;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
        title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveonProcessArg, {
          title: onProcessArgs[id] == undefined ? id : onProcessArgs[id].label,
          index: groupIndex
        }),
        initialOpen: false
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, id == 'sendMail' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Subject"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.subject,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['subject'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Mail To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.mailTo,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['mailTo'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "BCC"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.bcc,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['bcc'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Email Footer"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.footer,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['footer'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'emailBcc' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Mail To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.mailTo,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['mailTo'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Mail from"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.fromEmail,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['fromEmail'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Mail From Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.fromName,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['fromName'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Reply To Email"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.replyTo,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['replyTo'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Reply To Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.replyToName,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['replyToName'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Email Footer"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.footer,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['footer'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'emailCopyUser' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Mail from"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.fromEmail,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['fromEmail'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Mail From Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.fromName,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['fromName'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Reply To Email"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.replyTo,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['replyTo'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Reply To Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.replyToName,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['replyToName'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Email Footer"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.footer,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['footer'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'createEntry' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'autoReply' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Mail from"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.fromEmail,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['fromEmail'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Mail From Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.fromName,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['fromName'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Reply To Email"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.replyTo,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['replyTo'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Reply To Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.replyToName,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['replyToName'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.message,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['message'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Email Footer"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.footer,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['footer'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'loggedInUser' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'registerUser' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'postSubmit' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Post Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: groupData.postType,
        options: postTypes,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['postType'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Post Status"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: groupData.postStatus,
        options: postStatuses,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['postStatus'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Comment Status"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: groupData.commentStatus,
        options: [{
          label: 'Open',
          value: 'open'
        }, {
          label: 'Closed',
          value: 'closed'
        }],
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['commentStatus'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Ping Status"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: groupData.pingStatus,
        options: [{
          label: 'Open',
          value: 'open'
        }, {
          label: 'Closed',
          value: 'closed'
        }],
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['pingStatus'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Create Author by Email?",
        help: groupData.authorByEmail ? 'Enabled' : 'Disabled.',
        checked: groupData.authorByEmail ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['authorByEmail'] = groupData.authorByEmail ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'commentSubmit' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Status"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
        label: "",
        value: groupData.status,
        options: [{
          label: 'Approve',
          value: '1'
        }, {
          label: 'Hold',
          value: '0'
        }, {
          label: 'Spam',
          value: 'spam'
        }, {
          label: 'Trash',
          value: 'trash'
        }],
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['status'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.type == undefined || groupData.type.length == 0 ? 'comment' : groupData.type,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['type'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Login Required?",
        help: groupData.loginRequired ? 'Enabled' : 'Disabled.',
        checked: groupData.loginRequired ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['loginRequired'] = groupData.loginRequired ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'termSubmit' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        value: groupData.taxonomy,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['taxonomy'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'fluentcrmAddContact' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Fluent-CRM Lists"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
        position: "bottom right",
        variant: "secondary",
        buttonTitle: "Choose",
        options: fluentcrmLists,
        onChange: (option, index) => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['lists'].push({
            slug: option.slug,
            id: option.id
          });
          setAttributes({
            onProcess: onProcessX
          });
        },
        values: ""
      })), Object.entries(onProcess[groupIndex]['lists']).map((x, i) => {
        var listIndex = x[0];
        var listData = x[1];
        var slug = x[1].slug;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: "border my-3 flex items-center"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
          className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
          onClick: ev => {
            var onProcessX = { ...onProcess
            };
            delete onProcessX[groupIndex]['lists'].splice(i, 1);
            setAttributes({
              onProcess: onProcessX
            });
          }
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, fluentcrmLists == null ? "" : fluentcrmLists[slug].label));
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Fluent-CRM Tags"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
        position: "bottom right",
        variant: "secondary",
        buttonTitle: "Choose",
        options: fluentcrmTags,
        onChange: (option, index) => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['tags'].push({
            slug: option.slug,
            id: option.id
          });
          setAttributes({
            onProcess: onProcessX
          });
        },
        values: ""
      })), Object.entries(onProcess[groupIndex]['tags']).map((x, i) => {
        var listIndex = x[0];
        var listData = x[1];
        var slug = x[1].slug;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: "border my-3 flex items-center"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
          className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
          onClick: ev => {
            var onProcessX = { ...onProcess
            };
            delete onProcessX[groupIndex]['tags'].splice(i, 1);
            setAttributes({
              onProcess: onProcessX
            });
          }
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, fluentcrmTags == null ? "" : fluentcrmTags[slug].label));
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }))), id == 'newsletterSubmit' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
        label: "Show On Response?",
        help: groupData.showOnResponse ? 'Enabled' : 'Disabled.',
        checked: groupData.showOnResponse ? true : false,
        onChange: e => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['showOnResponse'] = groupData.showOnResponse ? false : true;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), groupData.showOnResponse && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Success Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.successMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['successMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Error Message"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.errorMessage,
        onChange: newVal => {
          var onProcessX = { ...onProcess
          };
          onProcessX[groupIndex]['errorMessage'] = newVal;
          setAttributes({
            onProcess: onProcessX
          });
        }
      })))));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "After Submit",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: 'Add Action',
      options: afterSubmitArgs,
      onChange: (option, index) => {
        var afterSubmitX = { ...afterSubmit
        };
        var index = Object.entries(afterSubmitX).length;
        afterSubmitX[index] = option.args;
        setAttributes({
          afterSubmit: afterSubmitX
        });
      },
      values: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "my-4"
    }, Object.entries(afterSubmit).map(group => {
      var groupIndex = group[0];
      var groupData = group[1];
      var id = groupData.id;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
        title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveAfterSubmitArg, {
          title: afterSubmitArgs[id] == undefined ? id : afterSubmitArgs[id].label,
          index: groupIndex
        }),
        initialOpen: false
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, id == 'showResponse' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, "Show response messages."), id == 'loggedOut' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "mb-4"
      }, "Logged out current user")), id == 'redirectToURL' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Redirect URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
        value: groupData.url,
        onChange: newVal => {
          var afterSubmitX = { ...afterSubmit
          };
          afterSubmitX[groupIndex]['url'] = newVal;
          setAttributes({
            afterSubmit: afterSubmitX
          });
        }
      }))), id == 'refreshPage' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Delay"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        type: "number",
        value: groupData.delay,
        onChange: newVal => {
          var afterSubmitX = { ...afterSubmit
          };
          afterSubmitX[groupIndex]['delay'] = newVal;
          setAttributes({
            afterSubmit: afterSubmitX
          });
        }
      }))), id == 'delay' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "mb-4"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Delay"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
        className: "mr-2",
        type: "number",
        value: groupData.time,
        onChange: newVal => {
          var afterSubmitX = { ...afterSubmit
          };
          afterSubmitX[groupIndex]['time'] = newVal;
          setAttributes({
            afterSubmit: afterSubmitX
          });
        }
      })))));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: ""
    }, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400  hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)([['post-grid/text', {}]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_17__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 pb-8  cursor-pointer bg-gray-200 hover:bg-gray-400 relative",
        onClick: ev => {
          if (variation.isPro) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var atts = variation.atts;
          var form = { ...atts.form
          };
          var wrapper = { ...atts.wrapper
          };
          var visible = { ...atts.visible
          };
          var onSubmit = { ...atts.onSubmit
          };
          var onProcess = { ...atts.onProcess
          };
          var afterSubmit = { ...atts.afterSubmit
          };
          var blockCssY = { ...atts.blockCssY
          };
          var customCss = { ...atts.customCss
          };
          var blockCssObj = {};
          blockCssObj[wrapperSelector] = wrapper;
          blockCssObj[formSelector] = form;
          setAttributes({
            form: form,
            wrapper: wrapper,
            visible: visible,
            onSubmit: onSubmit,
            onProcess: onProcess,
            afterSubmit: afterSubmit,
            customCss: customCss
          });
          var blockCssRules = myStore.getBlockCssRules(blockCssObj);
          console.log(blockCssRules);
          var items = { ...blockCssY.items,
            ...blockCssRules
          };
          setAttributes({
            blockCssY: {
              items: items
            }
          });
          replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)(variation.innerBlocks), true);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "absolute bottom-0 left-0 py-3 w-full text-center"
      }, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("form", {
      onSubmit: onFormSubmit
    }, innerBlocksProps.children))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-form-wrap`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/form-wrap/variations.js":
/*!********************************************!*\
  !*** ./src/blocks/form-wrap/variations.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__);


/**
 * WordPress dependencies
 */


let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('isProFeature', true);
/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: 'contact-form-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Contact Form'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Contact Form'),
  isPro: false,
  atts: {
    form: {
      "type": "contactForm",
      "styles": {
        "gridTemplateColumns": {
          "Desktop": "1fr "
        },
        "gap": {
          "Desktop": "1em"
        },
        "display": {
          "Desktop": "grid"
        }
      },
      "options": {
        "type": "contactForm"
      }
    },
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "gridTemplateColumns": {},
        "gap": {},
        "display": {}
      }
    },
    visible: {},
    onSubmit: {
      "0": {
        "id": "validation",
        "messages": []
      },
      "1": {
        "id": "submitConfirm",
        "messages": []
      }
    },
    onProcess: {
      "0": {
        "id": "sendMail",
        "mailTo": "",
        "bcc": "",
        "footer": "",
        "subject": "",
        "showOnResponse": true
      },
      "3": {
        "id": "createEntry",
        "message": "",
        "showOnResponse": false
      }
    },
    afterSubmit: {
      "0": {
        "id": "showResponse",
        "message": ""
      }
    },
    blockId: "pg9d6a07354523",
    blockCssY: {
      "items": {
        ".pg9d6a07354523": {
          "grid-template-columns": {},
          "gap": {},
          "display": {}
        },
        ".pg9d6a07354523 form": {
          "grid-template-columns": {
            "Desktop": "1fr "
          },
          "gap": {
            "Desktop": "1em"
          },
          "display": {
            "Desktop": "grid"
          }
        }
      }
    }
  },
  innerBlocks: [['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your name",
        "value": "",
        "name": "full_name",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Name should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg8539be28243d",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {
          "background-color": {
            "Desktop": "#ececec"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "width": {
            "Desktop": "100%"
          }
        },
        ".pg8539be28243d .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Email",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your mail address",
        "value": "",
        "name": "email",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Email should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg9a328fd54a2e",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg9a328fd54a2e input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pg9a328fd54a2e .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Mail Subject",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your subject",
        "value": "",
        "name": "subject",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Subject should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pgfe443c9f4725",
    blockCssY: {
      "items": {
        ".pgfe443c9f4725 .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        },
        ".pgfe443c9f4725 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }], ['post-grid/form-field-textarea', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {}
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {}
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Write Your Message",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your name",
        "value": "",
        "name": "message",
        "required": false,
        "disabled": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "cols": null,
        "rows": 3,
        "autocomplete": false,
        "autofocus": false,
        "wrap": false,
        "spellcheck": false,
        "autocorrect": false,
        "id": "",
        "class": "",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Message should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg434b1c8af09e",
    blockCssY: {
      "items": {
        ".pg434b1c8af09e textarea": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": false,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "submit",
        "placeholder": "Write your name",
        "value": "Submit",
        "name": "",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#51557E"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        },
        "color": {
          "Desktop": "#ffffff"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pg4670520d9df5",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg4670520d9df5 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#51557E"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "color": {
            "Desktop": "#ffffff"
          }
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 365.15 244.63"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "2.57",
    y: "4.63",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M360.38,39.07H4.77a3.2,3.2,0,0,1-3.2-3.19V6.83a3.21,3.21,0,0,1,3.2-3.2H360.38a3.2,3.2,0,0,1,3.19,3.2V35.88A3.19,3.19,0,0,1,360.38,39.07ZM4.77,5.63a1.2,1.2,0,0,0-1.2,1.2V35.88a1.19,1.19,0,0,0,1.2,1.19H360.38a1.19,1.19,0,0,0,1.19-1.19V6.83a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "2.57",
    y: "53.1",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M360.38,87.54H4.77a3.2,3.2,0,0,1-3.2-3.2v-29a3.2,3.2,0,0,1,3.2-3.2H360.38a3.19,3.19,0,0,1,3.19,3.2v29A3.19,3.19,0,0,1,360.38,87.54ZM4.77,54.1a1.2,1.2,0,0,0-1.2,1.2v29a1.2,1.2,0,0,0,1.2,1.2H360.38a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "2.57",
    y: "100.74",
    width: "360",
    height: "86.66",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M360.38,188.4H4.77a3.21,3.21,0,0,1-3.2-3.2V102.93a3.2,3.2,0,0,1,3.2-3.19H360.38a3.19,3.19,0,0,1,3.19,3.19V185.2A3.2,3.2,0,0,1,360.38,188.4ZM4.77,101.74a1.19,1.19,0,0,0-1.2,1.19V185.2a1.2,1.2,0,0,0,1.2,1.2H360.38a1.19,1.19,0,0,0,1.19-1.2V102.93a1.19,1.19,0,0,0-1.19-1.19Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M20.78,21.08H17.64V24h3.5v.87H16.6V16.79H21v.88H17.64v2.55h3.14Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M22.46,20.64c0-.6,0-1.09,0-1.57h.92l.05.94h0a2,2,0,0,1,1.83-1.07,1.71,1.71,0,0,1,1.64,1.16h0a2.42,2.42,0,0,1,.65-.75,2,2,0,0,1,1.28-.41c.77,0,1.91.5,1.91,2.52v3.41h-1V21.59c0-1.12-.41-1.79-1.26-1.79a1.38,1.38,0,0,0-1.25,1,2.11,2.11,0,0,0-.08.53v3.58h-1V21.4c0-.93-.41-1.6-1.21-1.6a1.45,1.45,0,0,0-1.31,1.06,1.4,1.4,0,0,0-.08.51v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M35.69,24.87l-.09-.73h0a2.17,2.17,0,0,1-1.78.87A1.65,1.65,0,0,1,32,23.34c0-1.4,1.24-2.17,3.49-2.16v-.12a1.2,1.2,0,0,0-1.32-1.34,2.9,2.9,0,0,0-1.51.43l-.24-.7a3.6,3.6,0,0,1,1.9-.51c1.78,0,2.21,1.21,2.21,2.37v2.17a7.31,7.31,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.94.94,0,0,0,1,1,1.45,1.45,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M39.43,17.44a.62.62,0,0,1-.67.65.63.63,0,0,1-.64-.65.65.65,0,0,1,.66-.66A.63.63,0,0,1,39.43,17.44Zm-1.17,7.43v-5.8h1.05v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M41.06,16.36h1.06v8.51H41.06Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M16.45,72.07a3.68,3.68,0,0,0,1.87.53C19.39,72.6,20,72,20,71.22s-.43-1.19-1.52-1.61c-1.32-.47-2.13-1.15-2.13-2.29A2.32,2.32,0,0,1,19,65.13a3.73,3.73,0,0,1,1.79.39l-.29.85A3.24,3.24,0,0,0,18.94,66c-1.11,0-1.53.66-1.53,1.21,0,.76.49,1.13,1.61,1.56,1.37.53,2.06,1.19,2.06,2.37s-.92,2.33-2.83,2.33A4.25,4.25,0,0,1,16.19,73Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M27.33,71.76c0,.6,0,1.13.05,1.58h-.93l-.06-1h0a2.16,2.16,0,0,1-1.92,1.08c-.91,0-2-.5-2-2.54V67.54H23.5v3.21c0,1.1.33,1.85,1.29,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.1-.54V67.54h1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29,73.34c0-.39.05-1,.05-1.5v-7h1v3.64h0a2.14,2.14,0,0,1,2-1.06c1.44,0,2.46,1.19,2.45,3,0,2.07-1.31,3.1-2.6,3.1A2.06,2.06,0,0,1,30,72.38h0l-.05,1ZM30.13,71a2.3,2.3,0,0,0,.05.39,1.63,1.63,0,0,0,1.58,1.23c1.11,0,1.77-.9,1.77-2.23,0-1.16-.6-2.16-1.73-2.16a1.7,1.7,0,0,0-1.61,1.3,2.34,2.34,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M34.5,75a1.75,1.75,0,0,0,1.15-.44c.29-.34.4-.79.4-2.19V67.54H37.1V72.8a3.22,3.22,0,0,1-.69,2.39,2.68,2.68,0,0,1-1.8.66Zm2.72-9.11a.61.61,0,0,1-.66.64.63.63,0,0,1-.64-.64.64.64,0,0,1,.67-.66A.62.62,0,0,1,37.22,65.91Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M39.42,70.63a1.86,1.86,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.69,2.69,0,0,1-2.86-2.92c0-1.76,1-3.13,2.72-3.13a2.45,2.45,0,0,1,2.4,2.73,4.68,4.68,0,0,1,0,.49Zm3.09-.76a1.49,1.49,0,0,0-1.46-1.71,1.75,1.75,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M49,73.13a3.94,3.94,0,0,1-1.66.33,2.76,2.76,0,0,1-2.9-3,3,3,0,0,1,3.12-3.08,3.45,3.45,0,0,1,1.47.3l-.24.81a2.54,2.54,0,0,0-1.23-.27,2.19,2.19,0,0,0,0,4.36,2.86,2.86,0,0,0,1.29-.29Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M51.65,65.87v1.67h1.51v.8H51.65v3.13c0,.72.2,1.13.79,1.13a2.68,2.68,0,0,0,.61-.07l.05.79a2.73,2.73,0,0,1-.94.14A1.47,1.47,0,0,1,51,73a2.15,2.15,0,0,1-.4-1.51V68.34h-.9v-.8h.9V66.15Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M23.41,115.34c-.06-1.13-.13-2.48-.12-3.49h0c-.27,1-.61,2-1,3.07l-1.42,3.92H20L18.71,115c-.39-1.14-.71-2.18-.94-3.14h0c0,1-.09,2.36-.16,3.57l-.21,3.47h-1l.56-8.08h1.34l1.38,3.91c.33,1,.61,1.88.81,2.72h0c.2-.82.49-1.7.85-2.72l1.44-3.91h1.33l.5,8.08h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M26.87,116.18a1.85,1.85,0,0,0,2,2,3.83,3.83,0,0,0,1.61-.3l.18.76a4.72,4.72,0,0,1-1.94.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,4.88,4.88,0,0,1,0,.49Zm3.09-.76a1.5,1.5,0,0,0-1.46-1.71,1.74,1.74,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M32.15,117.81a2.79,2.79,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1.05-.37-1.54-1-1.54-1.64a1.8,1.8,0,0,1,2-1.71,2.9,2.9,0,0,1,1.42.36l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.38,1.53.89,1.53,1.75,0,1-.8,1.74-2.17,1.74a3.34,3.34,0,0,1-1.64-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M36.9,117.81a2.79,2.79,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.54-1-1.54-1.64a1.8,1.8,0,0,1,2-1.71,2.9,2.9,0,0,1,1.42.36l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.38,1.53.89,1.53,1.75,0,1-.79,1.74-2.17,1.74a3.27,3.27,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M45,118.89l-.08-.73h0a2.17,2.17,0,0,1-1.77.86,1.66,1.66,0,0,1-1.78-1.66c0-1.41,1.25-2.18,3.49-2.16v-.12a1.2,1.2,0,0,0-1.32-1.35,2.93,2.93,0,0,0-1.51.43l-.24-.69a3.64,3.64,0,0,1,1.91-.52c1.77,0,2.2,1.21,2.2,2.38v2.17a8.4,8.4,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.45.18-2.45,1.31a.93.93,0,0,0,1,1,1.43,1.43,0,0,0,1.4-1,1,1,0,0,0,.06-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M52.58,113.09c0,.41,0,.88,0,1.59v3.37a3.35,3.35,0,0,1-.82,2.65,3.08,3.08,0,0,1-2.11.7,3.79,3.79,0,0,1-1.94-.48l.27-.81a3.25,3.25,0,0,0,1.7.46c1.08,0,1.87-.56,1.87-2v-.65h0a2.09,2.09,0,0,1-1.85,1A2.6,2.6,0,0,1,47.16,116,2.79,2.79,0,0,1,49.78,113a2,2,0,0,1,1.81,1h0l0-.87Zm-1.09,2.29a1.44,1.44,0,0,0-.06-.48A1.53,1.53,0,0,0,50,113.78c-1,0-1.72.85-1.72,2.2,0,1.14.57,2.08,1.71,2.08A1.54,1.54,0,0,0,51.41,117a1.81,1.81,0,0,0,.08-.56Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.88,116.18a1.85,1.85,0,0,0,2,2,3.75,3.75,0,0,0,1.6-.3l.18.76a4.63,4.63,0,0,1-1.93.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,2.81,2.81,0,0,1,0,.49Zm3.09-.76a1.5,1.5,0,0,0-1.46-1.71,1.74,1.74,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#414042",
    x: "2.57",
    y: "204.92",
    width: "180",
    height: "35.07",
    rx: "3.24"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M75.27,224.71a3.68,3.68,0,0,0,1.87.53c1.07,0,1.69-.57,1.69-1.38s-.43-1.19-1.52-1.61c-1.32-.47-2.14-1.15-2.14-2.29a2.33,2.33,0,0,1,2.62-2.19,3.77,3.77,0,0,1,1.79.39l-.29.85a3.33,3.33,0,0,0-1.54-.38c-1.1,0-1.52.66-1.52,1.21,0,.76.49,1.13,1.61,1.56,1.36.53,2.06,1.19,2.06,2.38s-.92,2.32-2.83,2.32a4.25,4.25,0,0,1-2.06-.51Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M86.15,224.4c0,.6,0,1.13,0,1.58h-.94L85.2,225h0a2.2,2.2,0,0,1-1.92,1.07c-.91,0-2-.5-2-2.54v-3.39h1v3.21c0,1.11.34,1.85,1.3,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.09-.54v-3.56h1.06Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M87.86,226c0-.39,0-1,0-1.5v-7h1v3.64h0a2.16,2.16,0,0,1,2-1.06c1.44,0,2.46,1.2,2.45,3,0,2.07-1.31,3.1-2.6,3.1a2.07,2.07,0,0,1-2-1.09h0l0,1ZM89,223.66a1.58,1.58,0,0,0,0,.38,1.62,1.62,0,0,0,1.58,1.23c1.1,0,1.76-.9,1.76-2.23,0-1.16-.6-2.16-1.72-2.16a1.69,1.69,0,0,0-1.61,1.3,1.71,1.71,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M94.73,221.75c0-.6,0-1.09,0-1.57h.93l0,.93h0a2,2,0,0,1,1.83-1.06,1.71,1.71,0,0,1,1.64,1.16h0a2.35,2.35,0,0,1,.65-.76,2,2,0,0,1,1.28-.4c.77,0,1.91.5,1.91,2.51V226h-1V222.7c0-1.12-.41-1.79-1.26-1.79a1.36,1.36,0,0,0-1.25,1,1.64,1.64,0,0,0-.08.53V226h-1V222.5c0-.92-.41-1.59-1.21-1.59A1.45,1.45,0,0,0,95.85,222a1.5,1.5,0,0,0-.09.52V226h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M105.92,218.55a.66.66,0,0,1-1.31,0,.64.64,0,0,1,.66-.66A.63.63,0,0,1,105.92,218.55ZM104.74,226v-5.8h1.06V226Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M108.82,218.51v1.67h1.51v.8h-1.51v3.13c0,.72.2,1.13.79,1.13a2.6,2.6,0,0,0,.61-.07l0,.79a2.67,2.67,0,0,1-.93.14,1.44,1.44,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51V221h-.9v-.8h.9v-1.39Z"
  }))
}, {
  name: 'appointment-form-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Appointment Form'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Appointment Form'),
  isPro: false,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "gridTemplateColumns": {},
        "gap": {},
        "display": {}
      }
    },
    "form": {
      "type": "appointmentForm",
      "styles": {
        "gridTemplateColumns": {
          "Desktop": "1fr "
        },
        "gap": {
          "Desktop": "1em"
        },
        "display": {
          "Desktop": "grid"
        }
      },
      "options": {
        "type": "appointmentForm"
      }
    },
    "visible": {},
    "onSubmit": {
      "0": {
        "id": "validation",
        "messages": []
      },
      "1": {
        "id": "submitConfirm",
        "messages": []
      }
    },
    "onProcess": {
      "0": {
        "id": "sendMail",
        "mailTo": "",
        "bcc": "",
        "footer": "",
        "subject": "",
        "showOnResponse": true
      },
      "3": {
        "id": "createEntry",
        "message": "",
        "showOnResponse": false
      }
    },
    "afterSubmit": {
      "0": {
        "id": "showResponse",
        "message": ""
      }
    },
    "blockId": "pge431be43ba93",
    "customCss": {},
    "blockCssY": {
      "items": {
        ".pg9d6a07354523": {
          "grid-template-columns": {},
          "gap": {},
          "display": {}
        },
        ".pg9d6a07354523 form": {
          "grid-template-columns": {
            "Desktop": "1fr "
          },
          "gap": {
            "Desktop": "1em"
          },
          "display": {
            "Desktop": "grid"
          }
        },
        ".pge431be43ba93": {
          "grid-template-columns": {},
          "gap": {},
          "display": {}
        },
        ".pge431be43ba93 form": {
          "grid-template-columns": {
            "Desktop": "1fr "
          },
          "gap": {
            "Desktop": "1em"
          },
          "display": {
            "Desktop": "grid"
          }
        }
      }
    }
  },
  innerBlocks: [['post-grid/form-field-input', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    "labelWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    "label": {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    "input": {
      "options": {
        "type": "text",
        "placeholder": "Write your name",
        "value": "",
        "name": "full_name",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    "inputWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    "errorWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Name should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    "blockId": "pg8539be28243d",
    "blockCssY": {
      "items": {
        ".pg8539be28243d input": {
          "background-color": {
            "Desktop": "#ececec"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "width": {
            "Desktop": "100%"
          }
        },
        ".pg8539be28243d .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    "labelWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    "label": {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Email",
        "class": "pg-form-field-label"
      }
    },
    "input": {
      "options": {
        "type": "text",
        "placeholder": "Write your mail address",
        "value": "",
        "name": "email",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    "inputWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    "errorWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Email should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    "blockId": "pg9a328fd54a2e",
    "blockCssY": {
      "items": {
        ".pg8539be28243d input": {},
        ".pg9a328fd54a2e input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pg9a328fd54a2e .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-textarea', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {}
    },
    "label": {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Write Your Message",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    "input": {
      "options": {
        "type": "text",
        "placeholder": "Write your name",
        "value": "",
        "name": "message",
        "required": false,
        "disabled": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "cols": null,
        "rows": 3,
        "autocomplete": false,
        "autofocus": false,
        "wrap": false,
        "spellcheck": false,
        "autocorrect": false,
        "id": "",
        "class": "",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    "inputWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    "labelWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {}
    },
    "errorWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Message should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    "blockId": "pg434b1c8af09e",
    "blockCssY": {
      "items": {
        ".pg434b1c8af09e textarea": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    "labelWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    "label": {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": false,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    "input": {
      "options": {
        "type": "submit",
        "placeholder": "Write your name",
        "value": "Submit",
        "name": "",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#51557E"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        },
        "color": {
          "Desktop": "#ffffff"
        }
      }
    },
    "inputWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    "errorWrap": {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    "blockId": "pg4670520d9df5",
    "blockCssY": {
      "items": {
        ".pg8539be28243d input": {},
        ".pg4670520d9df5 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#51557E"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "color": {
            "Desktop": "#ffffff"
          }
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 365.15 244.63"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "2.57",
    y: "4.63",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M360.38,39.07H4.77a3.2,3.2,0,0,1-3.2-3.19V6.83a3.21,3.21,0,0,1,3.2-3.2H360.38a3.2,3.2,0,0,1,3.19,3.2V35.88A3.19,3.19,0,0,1,360.38,39.07ZM4.77,5.63a1.2,1.2,0,0,0-1.2,1.2V35.88a1.19,1.19,0,0,0,1.2,1.19H360.38a1.19,1.19,0,0,0,1.19-1.19V6.83a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "2.57",
    y: "53.1",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M360.38,87.54H4.77a3.2,3.2,0,0,1-3.2-3.2v-29a3.2,3.2,0,0,1,3.2-3.2H360.38a3.19,3.19,0,0,1,3.19,3.2v29A3.19,3.19,0,0,1,360.38,87.54ZM4.77,54.1a1.2,1.2,0,0,0-1.2,1.2v29a1.2,1.2,0,0,0,1.2,1.2H360.38a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "2.57",
    y: "100.74",
    width: "360",
    height: "86.66",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M360.38,188.4H4.77a3.21,3.21,0,0,1-3.2-3.2V102.93a3.2,3.2,0,0,1,3.2-3.19H360.38a3.19,3.19,0,0,1,3.19,3.19V185.2A3.2,3.2,0,0,1,360.38,188.4ZM4.77,101.74a1.19,1.19,0,0,0-1.2,1.19V185.2a1.2,1.2,0,0,0,1.2,1.2H360.38a1.19,1.19,0,0,0,1.19-1.2V102.93a1.19,1.19,0,0,0-1.19-1.19Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M20.78,21.08H17.64V24h3.5v.87H16.6V16.79H21v.88H17.64v2.55h3.14Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M22.46,20.64c0-.6,0-1.09,0-1.57h.92l.05.94h0a2,2,0,0,1,1.83-1.07,1.71,1.71,0,0,1,1.64,1.16h0a2.42,2.42,0,0,1,.65-.75,2,2,0,0,1,1.28-.41c.77,0,1.91.5,1.91,2.52v3.41h-1V21.59c0-1.12-.41-1.79-1.26-1.79a1.38,1.38,0,0,0-1.25,1,2.11,2.11,0,0,0-.08.53v3.58h-1V21.4c0-.93-.41-1.6-1.21-1.6a1.45,1.45,0,0,0-1.31,1.06,1.4,1.4,0,0,0-.08.51v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M35.69,24.87l-.09-.73h0a2.17,2.17,0,0,1-1.78.87A1.65,1.65,0,0,1,32,23.34c0-1.4,1.24-2.17,3.49-2.16v-.12a1.2,1.2,0,0,0-1.32-1.34,2.9,2.9,0,0,0-1.51.43l-.24-.7a3.6,3.6,0,0,1,1.9-.51c1.78,0,2.21,1.21,2.21,2.37v2.17a7.31,7.31,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.94.94,0,0,0,1,1,1.45,1.45,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M39.43,17.44a.62.62,0,0,1-.67.65.63.63,0,0,1-.64-.65.65.65,0,0,1,.66-.66A.63.63,0,0,1,39.43,17.44Zm-1.17,7.43v-5.8h1.05v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M41.06,16.36h1.06v8.51H41.06Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M16.45,72.07a3.68,3.68,0,0,0,1.87.53C19.39,72.6,20,72,20,71.22s-.43-1.19-1.52-1.61c-1.32-.47-2.13-1.15-2.13-2.29A2.32,2.32,0,0,1,19,65.13a3.73,3.73,0,0,1,1.79.39l-.29.85A3.24,3.24,0,0,0,18.94,66c-1.11,0-1.53.66-1.53,1.21,0,.76.49,1.13,1.61,1.56,1.37.53,2.06,1.19,2.06,2.37s-.92,2.33-2.83,2.33A4.25,4.25,0,0,1,16.19,73Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M27.33,71.76c0,.6,0,1.13.05,1.58h-.93l-.06-1h0a2.16,2.16,0,0,1-1.92,1.08c-.91,0-2-.5-2-2.54V67.54H23.5v3.21c0,1.1.33,1.85,1.29,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.1-.54V67.54h1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29,73.34c0-.39.05-1,.05-1.5v-7h1v3.64h0a2.14,2.14,0,0,1,2-1.06c1.44,0,2.46,1.19,2.45,3,0,2.07-1.31,3.1-2.6,3.1A2.06,2.06,0,0,1,30,72.38h0l-.05,1ZM30.13,71a2.3,2.3,0,0,0,.05.39,1.63,1.63,0,0,0,1.58,1.23c1.11,0,1.77-.9,1.77-2.23,0-1.16-.6-2.16-1.73-2.16a1.7,1.7,0,0,0-1.61,1.3,2.34,2.34,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M34.5,75a1.75,1.75,0,0,0,1.15-.44c.29-.34.4-.79.4-2.19V67.54H37.1V72.8a3.22,3.22,0,0,1-.69,2.39,2.68,2.68,0,0,1-1.8.66Zm2.72-9.11a.61.61,0,0,1-.66.64.63.63,0,0,1-.64-.64.64.64,0,0,1,.67-.66A.62.62,0,0,1,37.22,65.91Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M39.42,70.63a1.86,1.86,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.69,2.69,0,0,1-2.86-2.92c0-1.76,1-3.13,2.72-3.13a2.45,2.45,0,0,1,2.4,2.73,4.68,4.68,0,0,1,0,.49Zm3.09-.76a1.49,1.49,0,0,0-1.46-1.71,1.75,1.75,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M49,73.13a3.94,3.94,0,0,1-1.66.33,2.76,2.76,0,0,1-2.9-3,3,3,0,0,1,3.12-3.08,3.45,3.45,0,0,1,1.47.3l-.24.81a2.54,2.54,0,0,0-1.23-.27,2.19,2.19,0,0,0,0,4.36,2.86,2.86,0,0,0,1.29-.29Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M51.65,65.87v1.67h1.51v.8H51.65v3.13c0,.72.2,1.13.79,1.13a2.68,2.68,0,0,0,.61-.07l.05.79a2.73,2.73,0,0,1-.94.14A1.47,1.47,0,0,1,51,73a2.15,2.15,0,0,1-.4-1.51V68.34h-.9v-.8h.9V66.15Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M23.41,115.34c-.06-1.13-.13-2.48-.12-3.49h0c-.27,1-.61,2-1,3.07l-1.42,3.92H20L18.71,115c-.39-1.14-.71-2.18-.94-3.14h0c0,1-.09,2.36-.16,3.57l-.21,3.47h-1l.56-8.08h1.34l1.38,3.91c.33,1,.61,1.88.81,2.72h0c.2-.82.49-1.7.85-2.72l1.44-3.91h1.33l.5,8.08h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M26.87,116.18a1.85,1.85,0,0,0,2,2,3.83,3.83,0,0,0,1.61-.3l.18.76a4.72,4.72,0,0,1-1.94.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,4.88,4.88,0,0,1,0,.49Zm3.09-.76a1.5,1.5,0,0,0-1.46-1.71,1.74,1.74,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M32.15,117.81a2.79,2.79,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1.05-.37-1.54-1-1.54-1.64a1.8,1.8,0,0,1,2-1.71,2.9,2.9,0,0,1,1.42.36l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.38,1.53.89,1.53,1.75,0,1-.8,1.74-2.17,1.74a3.34,3.34,0,0,1-1.64-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M36.9,117.81a2.79,2.79,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.54-1-1.54-1.64a1.8,1.8,0,0,1,2-1.71,2.9,2.9,0,0,1,1.42.36l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.38,1.53.89,1.53,1.75,0,1-.79,1.74-2.17,1.74a3.27,3.27,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M45,118.89l-.08-.73h0a2.17,2.17,0,0,1-1.77.86,1.66,1.66,0,0,1-1.78-1.66c0-1.41,1.25-2.18,3.49-2.16v-.12a1.2,1.2,0,0,0-1.32-1.35,2.93,2.93,0,0,0-1.51.43l-.24-.69a3.64,3.64,0,0,1,1.91-.52c1.77,0,2.2,1.21,2.2,2.38v2.17a8.4,8.4,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.45.18-2.45,1.31a.93.93,0,0,0,1,1,1.43,1.43,0,0,0,1.4-1,1,1,0,0,0,.06-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M52.58,113.09c0,.41,0,.88,0,1.59v3.37a3.35,3.35,0,0,1-.82,2.65,3.08,3.08,0,0,1-2.11.7,3.79,3.79,0,0,1-1.94-.48l.27-.81a3.25,3.25,0,0,0,1.7.46c1.08,0,1.87-.56,1.87-2v-.65h0a2.09,2.09,0,0,1-1.85,1A2.6,2.6,0,0,1,47.16,116,2.79,2.79,0,0,1,49.78,113a2,2,0,0,1,1.81,1h0l0-.87Zm-1.09,2.29a1.44,1.44,0,0,0-.06-.48A1.53,1.53,0,0,0,50,113.78c-1,0-1.72.85-1.72,2.2,0,1.14.57,2.08,1.71,2.08A1.54,1.54,0,0,0,51.41,117a1.81,1.81,0,0,0,.08-.56Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.88,116.18a1.85,1.85,0,0,0,2,2,3.75,3.75,0,0,0,1.6-.3l.18.76a4.63,4.63,0,0,1-1.93.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,2.81,2.81,0,0,1,0,.49Zm3.09-.76a1.5,1.5,0,0,0-1.46-1.71,1.74,1.74,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#414042",
    x: "2.57",
    y: "204.92",
    width: "180",
    height: "35.07",
    rx: "3.24"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M75.27,224.71a3.68,3.68,0,0,0,1.87.53c1.07,0,1.69-.57,1.69-1.38s-.43-1.19-1.52-1.61c-1.32-.47-2.14-1.15-2.14-2.29a2.33,2.33,0,0,1,2.62-2.19,3.77,3.77,0,0,1,1.79.39l-.29.85a3.33,3.33,0,0,0-1.54-.38c-1.1,0-1.52.66-1.52,1.21,0,.76.49,1.13,1.61,1.56,1.36.53,2.06,1.19,2.06,2.38s-.92,2.32-2.83,2.32a4.25,4.25,0,0,1-2.06-.51Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M86.15,224.4c0,.6,0,1.13,0,1.58h-.94L85.2,225h0a2.2,2.2,0,0,1-1.92,1.07c-.91,0-2-.5-2-2.54v-3.39h1v3.21c0,1.11.34,1.85,1.3,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.09-.54v-3.56h1.06Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M87.86,226c0-.39,0-1,0-1.5v-7h1v3.64h0a2.16,2.16,0,0,1,2-1.06c1.44,0,2.46,1.2,2.45,3,0,2.07-1.31,3.1-2.6,3.1a2.07,2.07,0,0,1-2-1.09h0l0,1ZM89,223.66a1.58,1.58,0,0,0,0,.38,1.62,1.62,0,0,0,1.58,1.23c1.1,0,1.76-.9,1.76-2.23,0-1.16-.6-2.16-1.72-2.16a1.69,1.69,0,0,0-1.61,1.3,1.71,1.71,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M94.73,221.75c0-.6,0-1.09,0-1.57h.93l0,.93h0a2,2,0,0,1,1.83-1.06,1.71,1.71,0,0,1,1.64,1.16h0a2.35,2.35,0,0,1,.65-.76,2,2,0,0,1,1.28-.4c.77,0,1.91.5,1.91,2.51V226h-1V222.7c0-1.12-.41-1.79-1.26-1.79a1.36,1.36,0,0,0-1.25,1,1.64,1.64,0,0,0-.08.53V226h-1V222.5c0-.92-.41-1.59-1.21-1.59A1.45,1.45,0,0,0,95.85,222a1.5,1.5,0,0,0-.09.52V226h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M105.92,218.55a.66.66,0,0,1-1.31,0,.64.64,0,0,1,.66-.66A.63.63,0,0,1,105.92,218.55ZM104.74,226v-5.8h1.06V226Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M108.82,218.51v1.67h1.51v.8h-1.51v3.13c0,.72.2,1.13.79,1.13a2.6,2.6,0,0,0,.61-.07l0,.79a2.67,2.67,0,0,1-.93.14,1.44,1.44,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51V221h-.9v-.8h.9v-1.39Z"
  }))
}, {
  name: 'login-form-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Login Form'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Login Form'),
  atts: {
    form: {
      "styles": {
        "gridTemplateColumns": {
          "Desktop": "1fr "
        },
        "gap": {
          "Desktop": "1em"
        },
        "display": {
          "Desktop": "grid"
        }
      },
      "options": {
        "type": "loginForm"
      }
    },
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "gridTemplateColumns": {},
        "gap": {},
        "display": {}
      }
    },
    visible: {},
    onSubmit: {
      "0": {
        "id": "validation",
        "messages": []
      },
      "1": {
        "id": "submitConfirm",
        "messages": []
      }
    },
    onProcess: {
      "0": {
        "id": "loggedInUser",
        "message": "",
        "showOnResponse": true
      },
      "1": {
        "id": "createEntry",
        "message": ""
      }
    },
    afterSubmit: {
      "1": {
        "id": "redirectToURL",
        "value": ""
      }
    },
    blockId: "pg9d6a07354523",
    blockCssY: {
      "items": {
        ".pg9d6a07354523": {
          "grid-template-columns": {},
          "gap": {},
          "display": {}
        },
        ".pg9d6a07354523 form": {
          "grid-template-columns": {
            "Desktop": "1fr "
          },
          "gap": {
            "Desktop": "1em"
          },
          "display": {
            "Desktop": "grid"
          }
        }
      }
    }
  },
  isPro: false,
  innerBlocks: [['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {
        "margin": {
          "Desktop": "0px 0px 10px 0px"
        }
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Username/Email",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "",
        "value": "admin",
        "name": "username",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Email should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg9a328fd54a2e",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg9a328fd54a2e input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pg9a328fd54a2e .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        },
        ".pg9a328fd54a2e .label-wrap": {
          "margin": {
            "Desktop": "0px 0px 10px 0px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {
        "margin": {
          "Desktop": "0px 0px 10px 0px"
        }
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Password",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "password",
        "placeholder": "",
        "value": "123456",
        "name": "password",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Name should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg8539be28243d",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {
          "background-color": {
            "Desktop": "#ececec"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "width": {
            "Desktop": "100%"
          }
        },
        ".pg8539be28243d .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        },
        ".pg8539be28243d .label-wrap": {
          "margin": {
            "Desktop": "0px 0px 10px 0px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        }
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {
        "order": {
          "Desktop": "10"
        },
        "margin": {
          "Desktop": "0px 0px 0px 10px"
        }
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Remember?",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "checkbox",
        "placeholder": "Write your name",
        "value": "",
        "name": "remember",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pgfaeb744b8370",
    blockCssY: {
      "items": {
        ".pgfaeb744b8370": {
          "display": {
            "Desktop": "flex"
          }
        },
        ".pgfaeb744b8370 .label-wrap": {
          "order": {
            "Desktop": "10"
          },
          "margin": {
            "Desktop": "0px 0px 0px 10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": false,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "submit",
        "placeholder": "Write your name",
        "value": "Login",
        "name": "",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pg4670520d9df5",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg4670520d9df5 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 368.13 244.63"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "55.12",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,89.55H6.26a3.19,3.19,0,0,1-3.19-3.19v-29a3.19,3.19,0,0,1,3.19-3.19H361.87a3.19,3.19,0,0,1,3.19,3.19V86.36A3.19,3.19,0,0,1,361.87,89.55ZM6.26,56.12a1.19,1.19,0,0,0-1.19,1.19V86.36a1.19,1.19,0,0,0,1.19,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19v-29a1.19,1.19,0,0,0-1.19-1.19Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "103.58",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,138H6.26a3.19,3.19,0,0,1-3.19-3.2v-29a3.19,3.19,0,0,1,3.19-3.2H361.87a3.19,3.19,0,0,1,3.19,3.2v29A3.19,3.19,0,0,1,361.87,138ZM6.26,104.58a1.19,1.19,0,0,0-1.19,1.2v29A1.19,1.19,0,0,0,6.26,136H361.87a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M22.27,71.57H19.13v2.91h3.5v.88H18.09V67.27h4.36v.88H19.13V70.7h3.14Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M24,71.12c0-.6,0-1.09-.05-1.57h.92l.05.94h0a2,2,0,0,1,1.82-1.07,1.71,1.71,0,0,1,1.64,1.16h0a2.39,2.39,0,0,1,.64-.75,2,2,0,0,1,1.29-.41c.76,0,1.9.5,1.9,2.52v3.42h-1V72.07c0-1.11-.41-1.79-1.26-1.79a1.37,1.37,0,0,0-1.24,1,1.73,1.73,0,0,0-.09.53v3.59h-1V71.88c0-.92-.41-1.6-1.21-1.6a1.45,1.45,0,0,0-1.31,1.06,1.4,1.4,0,0,0-.08.51v3.51H24Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M37.18,75.36l-.09-.74h0a2.16,2.16,0,0,1-1.78.87,1.65,1.65,0,0,1-1.77-1.67c0-1.4,1.25-2.17,3.49-2.16v-.12a1.19,1.19,0,0,0-1.32-1.34,2.93,2.93,0,0,0-1.51.43l-.24-.69a3.52,3.52,0,0,1,1.91-.52c1.77,0,2.2,1.21,2.2,2.37V74a8.44,8.44,0,0,0,.1,1.4Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.94.94,0,0,0,1,1,1.43,1.43,0,0,0,1.4-1A1,1,0,0,0,37,73.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M40.92,67.92a.62.62,0,0,1-.67.65.63.63,0,0,1-.63-.65.64.64,0,0,1,.66-.66A.62.62,0,0,1,40.92,67.92Zm-1.17,7.44V69.55h1v5.81Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M42.56,66.84h1v8.52h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M53.18,72.41a2.84,2.84,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.78-3,2.83,2.83,0,0,1,2.88-3.08A2.74,2.74,0,0,1,53.18,72.41Zm-4.6.06c0,1.27.73,2.23,1.76,2.23s1.77-1,1.77-2.26c0-1-.5-2.23-1.74-2.23S48.58,71.36,48.58,72.47Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.52,71.36c0-.68,0-1.27-.05-1.81h.93l0,1.14h0a1.74,1.74,0,0,1,1.61-1.27,1,1,0,0,1,.3,0v1a1.88,1.88,0,0,0-.36,0,1.49,1.49,0,0,0-1.42,1.36,3.37,3.37,0,0,0,0,.49v3.1h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M62.07,67.27v4.79c0,1.81.8,2.58,1.88,2.58s2-.8,2-2.58V67.27h1V72c0,2.48-1.3,3.5-3.06,3.5S61,74.54,61,72V67.27Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M68.54,74.28a2.79,2.79,0,0,0,1.39.42c.76,0,1.12-.39,1.12-.87s-.3-.78-1.08-1.06c-1-.38-1.53-1-1.53-1.65a1.79,1.79,0,0,1,2-1.7,2.91,2.91,0,0,1,1.43.36l-.26.77a2.22,2.22,0,0,0-1.19-.34c-.63,0-1,.36-1,.79s.34.7,1.1,1c1,.38,1.52.88,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M74,72.65a1.85,1.85,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76a4.84,4.84,0,0,1-1.93.36A2.7,2.7,0,0,1,73,72.55c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4.92,4.92,0,0,1,0,.5Zm3.09-.76a1.5,1.5,0,0,0-1.46-1.72A1.75,1.75,0,0,0,74,71.89Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M79.44,71.36c0-.68,0-1.27,0-1.81h.92l0,1.14h0A1.75,1.75,0,0,1,82,69.42a1,1,0,0,1,.3,0v1a1.88,1.88,0,0,0-.36,0,1.5,1.5,0,0,0-1.42,1.36,3.47,3.47,0,0,0,0,.49v3.1h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M83.42,71.12c0-.6,0-1.09,0-1.57h.93l.06,1h0a2.13,2.13,0,0,1,1.92-1.09c.8,0,2,.48,2,2.47v3.47H87.3V72c0-.94-.35-1.72-1.34-1.72a1.51,1.51,0,0,0-1.42,1.08,1.55,1.55,0,0,0-.07.5v3.49h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M93.29,75.36l-.08-.74h0a2.16,2.16,0,0,1-1.78.87,1.65,1.65,0,0,1-1.77-1.67c0-1.4,1.25-2.17,3.49-2.16v-.12a1.19,1.19,0,0,0-1.32-1.34,2.93,2.93,0,0,0-1.51.43L90,69.94A3.55,3.55,0,0,1,92,69.42c1.77,0,2.2,1.21,2.2,2.37V74a8.44,8.44,0,0,0,.1,1.4Zm-.16-3c-1.15,0-2.45.18-2.45,1.31a.93.93,0,0,0,1,1,1.43,1.43,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M95.86,71.12c0-.6,0-1.09,0-1.57h.92l0,.94h0a2,2,0,0,1,1.82-1.07,1.71,1.71,0,0,1,1.64,1.16h0a2.42,2.42,0,0,1,.65-.75,1.93,1.93,0,0,1,1.28-.41c.77,0,1.91.5,1.91,2.52v3.42h-1V72.07c0-1.11-.4-1.79-1.25-1.79a1.38,1.38,0,0,0-1.25,1,1.73,1.73,0,0,0-.09.53v3.59h-1V71.88c0-.92-.4-1.6-1.21-1.6A1.45,1.45,0,0,0,97,71.34a1.4,1.4,0,0,0-.08.51v3.51h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M106.46,72.65a1.85,1.85,0,0,0,2,2,3.75,3.75,0,0,0,1.6-.3l.18.76a4.8,4.8,0,0,1-1.93.36,2.69,2.69,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4.36,4.36,0,0,1,0,.5Zm3.09-.76a1.51,1.51,0,0,0-1.46-1.72,1.75,1.75,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M18.09,115.83a12.57,12.57,0,0,1,2-.15,3.34,3.34,0,0,1,2.27.67,2.18,2.18,0,0,1,.71,1.69,2.38,2.38,0,0,1-.63,1.73,3.34,3.34,0,0,1-2.47.89,3.58,3.58,0,0,1-.84-.08v3.24h-1Zm1,3.9a3.52,3.52,0,0,0,.87.09c1.25,0,2-.61,2-1.73s-.75-1.58-1.9-1.58a4.36,4.36,0,0,0-1,.08Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M27.34,123.82l-.08-.73h0a2.15,2.15,0,0,1-1.78.86,1.65,1.65,0,0,1-1.77-1.66c0-1.41,1.25-2.17,3.49-2.16V120a1.2,1.2,0,0,0-1.32-1.35,2.84,2.84,0,0,0-1.51.44l-.24-.7a3.61,3.61,0,0,1,1.91-.51c1.77,0,2.2,1.21,2.2,2.37v2.17a8.32,8.32,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.93.93,0,0,0,1,1,1.42,1.42,0,0,0,1.4-1,.92.92,0,0,0,.06-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29.76,122.74a2.76,2.76,0,0,0,1.4.42c.76,0,1.12-.38,1.12-.86s-.3-.78-1.08-1.07c-1-.37-1.53-1-1.53-1.64a1.78,1.78,0,0,1,2-1.7,2.83,2.83,0,0,1,1.43.36l-.27.76a2.25,2.25,0,0,0-1.18-.33c-.63,0-1,.36-1,.79s.34.69,1.1,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M34.52,122.74a2.69,2.69,0,0,0,1.39.42c.77,0,1.12-.38,1.12-.86s-.29-.78-1.07-1.07c-1.05-.37-1.54-1-1.54-1.64a1.79,1.79,0,0,1,2-1.7,2.81,2.81,0,0,1,1.43.36l-.26.76a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M39.83,118l.77,3c.17.65.32,1.25.43,1.85h0c.13-.59.32-1.22.51-1.84l1-3h.89l.9,2.9c.21.7.38,1.31.51,1.9h0a19.29,19.29,0,0,1,.44-1.89l.83-2.91h1l-1.87,5.8h-1l-.88-2.77a17.16,17.16,0,0,1-.52-1.9h0a19.58,19.58,0,0,1-.53,1.91l-.94,2.76h-1L38.75,118Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M53.38,120.87A2.83,2.83,0,0,1,50.49,124a2.76,2.76,0,0,1-2.79-3,2.84,2.84,0,0,1,2.88-3.08A2.75,2.75,0,0,1,53.38,120.87Zm-4.61.06c0,1.27.73,2.23,1.76,2.23s1.77-.94,1.77-2.25c0-1-.49-2.23-1.74-2.23S48.77,119.83,48.77,120.93Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.71,119.83c0-.68,0-1.27-.05-1.81h.93l0,1.14h.05a1.75,1.75,0,0,1,1.61-1.27,1.39,1.39,0,0,1,.3,0v1a1.32,1.32,0,0,0-.36,0,1.5,1.5,0,0,0-1.42,1.36,3.47,3.47,0,0,0,0,.49v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M63.53,115.31v7c0,.52,0,1.11,0,1.5h-.95l-.05-1h0a2.16,2.16,0,0,1-2,1.13c-1.4,0-2.48-1.18-2.48-3,0-1.93,1.18-3.11,2.6-3.11a1.94,1.94,0,0,1,1.75.88h0v-3.46Zm-1.06,5.07a2.18,2.18,0,0,0,0-.44,1.56,1.56,0,0,0-1.53-1.23c-1.09,0-1.74,1-1.74,2.25s.58,2.14,1.72,2.14a1.6,1.6,0,0,0,1.55-1.26,2.09,2.09,0,0,0,0-.45Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#414042",
    x: "4.06",
    y: "154.44",
    width: "180",
    height: "35.07",
    rx: "3.24"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M80.88,167.42h1.05v7.2h3.45v.88h-4.5Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M91.6,172.55a2.83,2.83,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.79-3,2.84,2.84,0,0,1,2.88-3.09A2.76,2.76,0,0,1,91.6,172.55Zm-4.61.06c0,1.27.73,2.23,1.76,2.23s1.77-1,1.77-2.25c0-1-.49-2.23-1.74-2.23S87,171.51,87,172.61Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M97.93,169.7c0,.42-.05.88-.05,1.59v3.37a3.35,3.35,0,0,1-.82,2.65A3.08,3.08,0,0,1,95,178a3.79,3.79,0,0,1-1.94-.48l.27-.81a3.25,3.25,0,0,0,1.7.46c1.08,0,1.87-.56,1.87-2v-.64h0a2.09,2.09,0,0,1-1.85,1,2.6,2.6,0,0,1-2.47-2.83,2.79,2.79,0,0,1,2.62-3.09,2,2,0,0,1,1.81,1h0l.05-.87ZM96.84,172a1.44,1.44,0,0,0-.06-.48,1.53,1.53,0,0,0-1.47-1.12c-1,0-1.73.85-1.73,2.2,0,1.14.57,2.08,1.71,2.08a1.54,1.54,0,0,0,1.47-1.08,1.81,1.81,0,0,0,.08-.56Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M100.74,168.06a.62.62,0,0,1-.67.65.65.65,0,0,1,0-1.3A.62.62,0,0,1,100.74,168.06Zm-1.17,7.44v-5.8h1.05v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M102.37,171.27c0-.6,0-1.09,0-1.57h.93l.06,1h0a2.12,2.12,0,0,1,1.92-1.1c.8,0,2,.48,2,2.48v3.46h-1.06v-3.35c0-.93-.35-1.71-1.34-1.71a1.5,1.5,0,0,0-1.42,1.08,1.45,1.45,0,0,0-.07.49v3.49h-1.06Z"
  }))
}, {
  name: 'registration-form-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Registration Form'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Registration Form'),
  atts: {
    form: {
      "styles": {
        "gridTemplateColumns": {
          "Desktop": "1fr "
        },
        "gap": {
          "Desktop": "1em"
        },
        "display": {
          "Desktop": "grid"
        }
      },
      "options": {
        "type": "registerForm"
      }
    },
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "gridTemplateColumns": {},
        "gap": {},
        "display": {}
      }
    },
    visible: {},
    onSubmit: {
      "0": {
        "id": "validation",
        "messages": []
      },
      "1": {
        "id": "submitConfirm",
        "messages": []
      }
    },
    onProcess: {
      "0": {
        "id": "registerUser",
        "message": "",
        "showOnResponse": true
      },
      "1": {
        "id": "createEntry",
        "message": "",
        "showOnResponse": false
      }
    },
    afterSubmit: {
      "0": {
        "id": "showResponse",
        "message": ""
      }
    },
    blockId: "pg9d6a07354523",
    blockCssY: {
      "items": {
        ".pg9d6a07354523": {
          "grid-template-columns": {},
          "gap": {},
          "display": {}
        },
        ".pg9d6a07354523 form": {
          "grid-template-columns": {
            "Desktop": "1fr "
          },
          "gap": {
            "Desktop": "1em"
          },
          "display": {
            "Desktop": "grid"
          }
        }
      }
    }
  },
  isPro: false,
  innerBlocks: [['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {
        "margin": {
          "Desktop": "0px 0px 10px 0px"
        }
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Email ",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "",
        "value": "admin",
        "name": "email",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Email should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg9a328fd54a2e",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg9a328fd54a2e input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pg9a328fd54a2e .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        },
        ".pg9a328fd54a2e .label-wrap": {
          "margin": {
            "Desktop": "0px 0px 10px 0px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {
        "margin": {
          "Desktop": "0px 0px 10px 0px"
        }
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Password",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "password",
        "placeholder": "",
        "value": "123456",
        "name": "password",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Name should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg8539be28243d",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {
          "background-color": {
            "Desktop": "#ececec"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "width": {
            "Desktop": "100%"
          }
        },
        ".pg8539be28243d .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        },
        ".pg8539be28243d .label-wrap": {
          "margin": {
            "Desktop": "0px 0px 10px 0px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {
        "margin": {
          "Desktop": "0px 0px 10px 0px"
        }
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Confirm Password",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "password",
        "placeholder": "",
        "value": "",
        "name": "password_confirm",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Name should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg8539be28243a",
    blockCssY: {
      "items": {
        ".pg8539be28243a input": {
          "background-color": {
            "Desktop": "#ececec"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "width": {
            "Desktop": "100%"
          }
        },
        ".pg8539be28243a .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        },
        ".pg8539be28243a .label-wrap": {
          "margin": {
            "Desktop": "0px 0px 10px 0px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": false,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "submit",
        "placeholder": "",
        "value": "Register",
        "name": "",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pg4670520d9df5",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg4670520d9df5 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 368.13 244.63"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "32.08",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#414042",
    d: "M361.87,66.52H6.26a3.21,3.21,0,0,1-3.2-3.2v-29a3.2,3.2,0,0,1,3.2-3.2H361.87a3.19,3.19,0,0,1,3.19,3.2v29A3.2,3.2,0,0,1,361.87,66.52ZM6.26,33.08a1.2,1.2,0,0,0-1.2,1.2v29a1.2,1.2,0,0,0,1.2,1.2H361.87a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "80.55",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#414042",
    d: "M361.87,115H6.26a3.2,3.2,0,0,1-3.2-3.19V82.74a3.2,3.2,0,0,1,3.2-3.19H361.87a3.19,3.19,0,0,1,3.19,3.19v29.05A3.19,3.19,0,0,1,361.87,115ZM6.26,81.55a1.19,1.19,0,0,0-1.2,1.19v29.05A1.19,1.19,0,0,0,6.26,113H361.87a1.19,1.19,0,0,0,1.19-1.19V82.74a1.19,1.19,0,0,0-1.19-1.19Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#414042",
    x: "4.27",
    y: "177.48",
    width: "180",
    height: "35.07",
    rx: "3.24"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M22.27,48.53H19.13v2.92h3.5v.87H18.09V44.24h4.36v.87H19.13v2.56h3.14Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M24,48.09c0-.6,0-1.09-.05-1.57h.92l.05.93h0a2,2,0,0,1,1.82-1.07,1.71,1.71,0,0,1,1.64,1.17h0a2.33,2.33,0,0,1,.64-.76,2,2,0,0,1,1.29-.41c.76,0,1.9.51,1.9,2.52v3.42h-1V49c0-1.11-.41-1.78-1.26-1.78a1.35,1.35,0,0,0-1.24,1,1.61,1.61,0,0,0-.09.52v3.59h-1V48.84c0-.92-.41-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1,1.49,1.49,0,0,0-.08.52v3.5H24Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M37.18,52.32l-.08-.73h0a2.19,2.19,0,0,1-1.78.86,1.65,1.65,0,0,1-1.77-1.66c0-1.41,1.25-2.18,3.49-2.16v-.12a1.2,1.2,0,0,0-1.32-1.35,2.84,2.84,0,0,0-1.51.44l-.24-.7a3.61,3.61,0,0,1,1.91-.52c1.77,0,2.2,1.22,2.2,2.38v2.17a8.4,8.4,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.93.93,0,0,0,1,1,1.44,1.44,0,0,0,1.4-1,1,1,0,0,0,.06-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M40.92,44.88a.62.62,0,0,1-.67.65.63.63,0,0,1-.63-.65.63.63,0,0,1,.66-.65A.62.62,0,0,1,40.92,44.88Zm-1.17,7.44v-5.8h1v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M42.56,43.81h1v8.51h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M18.09,92.8a12.38,12.38,0,0,1,2-.16,3.29,3.29,0,0,1,2.27.68A2.18,2.18,0,0,1,23.07,95a2.36,2.36,0,0,1-.63,1.72,3.34,3.34,0,0,1-2.47.89,3.61,3.61,0,0,1-.84-.07v3.24h-1Zm1,3.9a3.58,3.58,0,0,0,.87.08c1.25,0,2-.61,2-1.73s-.75-1.58-1.9-1.58a4.21,4.21,0,0,0-1,.09Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M27.34,100.79l-.08-.73h0a2.19,2.19,0,0,1-1.78.86,1.65,1.65,0,0,1-1.77-1.67c0-1.4,1.25-2.17,3.49-2.16V97a1.19,1.19,0,0,0-1.32-1.34,2.93,2.93,0,0,0-1.51.43l-.24-.69A3.52,3.52,0,0,1,26,94.85c1.77,0,2.2,1.21,2.2,2.38V99.4a8.4,8.4,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.94.94,0,0,0,1,1,1.43,1.43,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29.76,99.71a2.86,2.86,0,0,0,1.4.42c.76,0,1.12-.39,1.12-.87s-.3-.78-1.08-1.06c-1-.38-1.53-1-1.53-1.65a1.79,1.79,0,0,1,2-1.7,2.94,2.94,0,0,1,1.43.36l-.27.77a2.15,2.15,0,0,0-1.18-.34c-.63,0-1,.36-1,.79s.34.7,1.1,1c1,.38,1.52.88,1.52,1.75s-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M34.52,99.71a2.79,2.79,0,0,0,1.39.42c.77,0,1.12-.39,1.12-.87s-.3-.78-1.07-1.06c-1.05-.38-1.54-1-1.54-1.65a1.79,1.79,0,0,1,2-1.7,2.91,2.91,0,0,1,1.43.36l-.26.77a2.22,2.22,0,0,0-1.19-.34c-.62,0-1,.36-1,.79s.35.7,1.1,1c1,.38,1.52.88,1.52,1.75s-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M39.83,95l.77,3c.17.65.32,1.25.43,1.85h0c.13-.59.32-1.21.51-1.84l1-3h.89l.9,2.9c.21.7.38,1.31.51,1.9h0a18.49,18.49,0,0,1,.44-1.88L46.14,95h1l-1.87,5.81h-1L43.47,98A17.33,17.33,0,0,1,43,96.11h0A19.79,19.79,0,0,1,42.4,98l-.94,2.76h-1L38.75,95Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M53.38,97.84a2.84,2.84,0,0,1-2.89,3.08,2.77,2.77,0,0,1-2.79-3,2.84,2.84,0,0,1,2.88-3.08A2.75,2.75,0,0,1,53.38,97.84Zm-4.61.06c0,1.27.73,2.23,1.76,2.23s1.77-.95,1.77-2.26c0-1-.49-2.23-1.74-2.23S48.77,96.79,48.77,97.9Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.71,96.79c0-.68,0-1.27-.05-1.81h.93l0,1.14h.05a1.75,1.75,0,0,1,1.61-1.27,1,1,0,0,1,.3,0v1a1.94,1.94,0,0,0-.36,0A1.49,1.49,0,0,0,55.8,97.2a3.6,3.6,0,0,0,0,.49v3.1h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M63.53,92.27v7c0,.51,0,1.1,0,1.5h-.95l-.05-1h0a2.15,2.15,0,0,1-2,1.14c-1.4,0-2.48-1.19-2.48-3,0-1.93,1.18-3.12,2.6-3.12a1.93,1.93,0,0,1,1.75.89h0V92.27Zm-1.06,5.08a2.22,2.22,0,0,0,0-.45,1.56,1.56,0,0,0-1.53-1.22c-1.09,0-1.74,1-1.74,2.24s.58,2.15,1.72,2.15a1.6,1.6,0,0,0,1.55-1.26,2.25,2.25,0,0,0,0-.46Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "129.01",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#414042",
    d: "M361.87,163.45H6.26a3.2,3.2,0,0,1-3.2-3.2v-29a3.21,3.21,0,0,1,3.2-3.2H361.87a3.2,3.2,0,0,1,3.19,3.2v29A3.19,3.19,0,0,1,361.87,163.45ZM6.26,130a1.2,1.2,0,0,0-1.2,1.2v29a1.2,1.2,0,0,0,1.2,1.2H361.87a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M18.09,141.27a11.33,11.33,0,0,1,2-.16,3.34,3.34,0,0,1,2.27.67,2.19,2.19,0,0,1,.71,1.69,2.38,2.38,0,0,1-.63,1.73,3.34,3.34,0,0,1-2.47.89,4.25,4.25,0,0,1-.84-.07v3.23h-1Zm1,3.89a3.52,3.52,0,0,0,.87.09c1.25,0,2-.61,2-1.73s-.75-1.58-1.9-1.58a4.36,4.36,0,0,0-1,.08Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M27.34,149.25l-.08-.73h0a2.17,2.17,0,0,1-1.78.87,1.65,1.65,0,0,1-1.77-1.67c0-1.41,1.25-2.17,3.49-2.16v-.12a1.19,1.19,0,0,0-1.32-1.34,2.84,2.84,0,0,0-1.51.43l-.24-.7a3.61,3.61,0,0,1,1.91-.51c1.77,0,2.2,1.21,2.2,2.37v2.17a8.24,8.24,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.94.94,0,0,0,1,1,1.42,1.42,0,0,0,1.4-1,.92.92,0,0,0,.06-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29.76,148.17a2.76,2.76,0,0,0,1.4.42c.76,0,1.12-.38,1.12-.86s-.3-.78-1.08-1.07c-1-.37-1.53-.94-1.53-1.64a1.78,1.78,0,0,1,2-1.7,2.83,2.83,0,0,1,1.43.36l-.27.76a2.25,2.25,0,0,0-1.18-.33c-.63,0-1,.36-1,.79s.34.7,1.1,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74A3.33,3.33,0,0,1,29.5,149Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M34.52,148.17a2.69,2.69,0,0,0,1.39.42c.77,0,1.12-.38,1.12-.86s-.3-.78-1.07-1.07c-1.05-.37-1.54-.94-1.54-1.64a1.79,1.79,0,0,1,2-1.7,2.81,2.81,0,0,1,1.43.36l-.26.76a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.7,1.1,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M39.83,143.45l.77,3c.17.65.32,1.25.43,1.85h0c.13-.59.32-1.22.51-1.84l1-3h.89l.9,2.9c.21.7.38,1.31.51,1.9h0a19.29,19.29,0,0,1,.44-1.89l.83-2.91h1l-1.87,5.8h-1l-.88-2.77a16.58,16.58,0,0,1-.52-1.9h0a19.58,19.58,0,0,1-.53,1.91l-.94,2.76h-1l-1.75-5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M53.38,146.3a2.84,2.84,0,0,1-2.89,3.09,2.77,2.77,0,0,1-2.79-3,2.84,2.84,0,0,1,2.88-3.08A2.75,2.75,0,0,1,53.38,146.3Zm-4.61.06c0,1.27.73,2.23,1.76,2.23s1.77-.94,1.77-2.25c0-1-.49-2.23-1.74-2.23S48.77,145.26,48.77,146.36Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.71,145.26c0-.68,0-1.27-.05-1.81h.93l0,1.14h.05a1.75,1.75,0,0,1,1.61-1.27,1.39,1.39,0,0,1,.3,0v1a1.32,1.32,0,0,0-.36,0,1.5,1.5,0,0,0-1.42,1.36,3.47,3.47,0,0,0,0,.49v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M63.53,140.74v7c0,.52,0,1.11,0,1.5h-.95l-.05-1h0a2.17,2.17,0,0,1-2,1.14c-1.4,0-2.48-1.19-2.48-2.95,0-1.94,1.18-3.12,2.6-3.12a1.94,1.94,0,0,1,1.75.88h0v-3.46Zm-1.06,5.07a2.18,2.18,0,0,0,0-.44,1.57,1.57,0,0,0-1.53-1.23c-1.09,0-1.74,1-1.74,2.25s.58,2.14,1.72,2.14a1.59,1.59,0,0,0,1.55-1.26,2.09,2.09,0,0,0,0-.45Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M73.51,149a5.2,5.2,0,0,1-2.13.38,3.78,3.78,0,0,1-4-4.09A4,4,0,0,1,71.61,141a4.2,4.2,0,0,1,1.91.36l-.25.85a3.8,3.8,0,0,0-1.63-.34,3,3,0,0,0-3.15,3.34,2.94,2.94,0,0,0,3.1,3.25,4.1,4.1,0,0,0,1.71-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M79.91,146.3A2.84,2.84,0,0,1,77,149.39a2.76,2.76,0,0,1-2.78-3,2.83,2.83,0,0,1,2.87-3.08A2.75,2.75,0,0,1,79.91,146.3Zm-4.61.06c0,1.27.74,2.23,1.77,2.23s1.76-.94,1.76-2.25c0-1-.49-2.23-1.74-2.23S75.3,145.26,75.3,146.36Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M81.24,145c0-.6,0-1.09,0-1.57h.93l.06,1h0a2.13,2.13,0,0,1,1.92-1.09c.8,0,2,.48,2,2.47v3.46H85.13v-3.34c0-.94-.35-1.72-1.34-1.72a1.5,1.5,0,0,0-1.42,1.08,1.45,1.45,0,0,0-.07.49v3.49H81.24Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M88,149.25v-5H87.2v-.8H88v-.31a2.32,2.32,0,0,1,2.53-2.53A2.88,2.88,0,0,1,92,141l-.3.8a2.23,2.23,0,0,0-1.23-.33c-1.11,0-1.43.78-1.43,1.7v.29h3.37v5.8H91.38v-5H89.06v5Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M94.18,145.26c0-.68,0-1.27-.05-1.81h.93l0,1.14h0a1.74,1.74,0,0,1,1.61-1.27,1.39,1.39,0,0,1,.3,0v1a1.32,1.32,0,0,0-.36,0,1.49,1.49,0,0,0-1.42,1.36,3.37,3.37,0,0,0,0,.49v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M98.15,145c0-.6,0-1.09-.05-1.57H99l0,.93h0a2,2,0,0,1,1.82-1.06,1.72,1.72,0,0,1,1.65,1.16h0a2.46,2.46,0,0,1,.65-.76,2,2,0,0,1,1.28-.4c.77,0,1.91.5,1.91,2.52v3.41h-1V146c0-1.12-.41-1.79-1.26-1.79a1.36,1.36,0,0,0-1.25,1,1.69,1.69,0,0,0-.08.53v3.58h-1v-3.48c0-.92-.41-1.59-1.22-1.59a1.44,1.44,0,0,0-1.3,1.06,1.4,1.4,0,0,0-.09.51v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M77.11,190.56a10.58,10.58,0,0,1,2-.17,3.36,3.36,0,0,1,2.34.66,2,2,0,0,1,.63,1.54,2.13,2.13,0,0,1-1.52,2.06v0a2,2,0,0,1,1.19,1.63,12.89,12.89,0,0,0,.62,2.22H81.29a11,11,0,0,1-.54-1.94c-.24-1.11-.67-1.53-1.62-1.57h-1v3.51h-1Zm1,3.68h1.07c1.11,0,1.82-.61,1.82-1.53s-.76-1.5-1.86-1.51a4.3,4.3,0,0,0-1,.09Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M84.16,195.82a1.87,1.87,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76a4.84,4.84,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.73-3.13a2.46,2.46,0,0,1,2.4,2.73,4,4,0,0,1,0,.49Zm3.1-.75a1.51,1.51,0,0,0-1.47-1.72,1.77,1.77,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M94.59,192.73c0,.42,0,.89,0,1.6v3.37a3.36,3.36,0,0,1-.83,2.65,3.11,3.11,0,0,1-2.11.69,3.78,3.78,0,0,1-1.93-.48l.26-.8a3.32,3.32,0,0,0,1.71.45c1.08,0,1.87-.56,1.87-2v-.65h0a2.05,2.05,0,0,1-1.84,1,2.59,2.59,0,0,1-2.47-2.83,2.78,2.78,0,0,1,2.61-3.08,1.92,1.92,0,0,1,1.81,1h0l0-.88ZM93.5,195a1.8,1.8,0,0,0-.06-.48A1.53,1.53,0,0,0,92,193.43c-1,0-1.73.85-1.73,2.19,0,1.14.58,2.09,1.72,2.09a1.54,1.54,0,0,0,1.46-1.08,1.88,1.88,0,0,0,.09-.57Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M97.4,191.1a.66.66,0,0,1-1.31,0,.65.65,0,0,1,.66-.66A.63.63,0,0,1,97.4,191.1Zm-1.18,7.44v-5.81h1.06v5.81Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M98.89,197.46a2.79,2.79,0,0,0,1.39.42c.76,0,1.12-.39,1.12-.87s-.3-.78-1.07-1.07c-1-.37-1.54-.94-1.54-1.64a1.79,1.79,0,0,1,2-1.7,2.91,2.91,0,0,1,1.43.36l-.26.77a2.22,2.22,0,0,0-1.19-.34c-.63,0-1,.36-1,.79s.34.7,1.1,1c1,.38,1.52.88,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M105.05,191.06v1.67h1.51v.8h-1.51v3.13c0,.72.21,1.13.8,1.13a2.26,2.26,0,0,0,.61-.07l0,.79a2.39,2.39,0,0,1-.93.15,1.46,1.46,0,0,1-1.14-.45,2.15,2.15,0,0,1-.41-1.51v-3.17h-.9v-.8h.9v-1.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M111,198.54l-.09-.74h0a2.17,2.17,0,0,1-1.78.87A1.65,1.65,0,0,1,107.3,197c0-1.4,1.25-2.17,3.49-2.16v-.12a1.19,1.19,0,0,0-1.32-1.34,2.93,2.93,0,0,0-1.51.43l-.24-.7a3.6,3.6,0,0,1,1.9-.51c1.78,0,2.21,1.21,2.21,2.37v2.17a7.49,7.49,0,0,0,.1,1.4Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.94.94,0,0,0,1,1,1.45,1.45,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M113.54,194.54c0-.68,0-1.27-.05-1.81h.92l0,1.14h0a1.74,1.74,0,0,1,1.6-1.27,1.32,1.32,0,0,1,.3,0v1a1.71,1.71,0,0,0-.36,0,1.48,1.48,0,0,0-1.41,1.36,2.38,2.38,0,0,0,0,.49v3.1h-1Z"
  }))
}, {
  name: 'comment-form-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Comment Form'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Comment Form'),
  atts: {
    form: {
      "type": "commentSubmit",
      "styles": {
        "gridTemplateColumns": {
          "Desktop": "1fr "
        },
        "gap": {
          "Desktop": "1em"
        },
        "display": {
          "Desktop": "grid"
        }
      }
    },
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "gridTemplateColumns": {},
        "gap": {},
        "display": {}
      }
    },
    visible: {},
    onSubmit: {
      "0": {
        "id": "validation",
        "messages": []
      },
      "1": {
        "id": "submitConfirm",
        "messages": []
      }
    },
    onProcess: {
      "0": {
        "id": "commentSubmit",
        "postType": "",
        "showOnResponse": true,
        "successMessage": "",
        "errorMessage": "",
        "status": "0"
      },
      "1": {
        "id": "createEntry",
        "message": ""
      }
    },
    afterSubmit: {
      "0": {
        "id": "showResponse",
        "message": ""
      }
    },
    blockId: "pg9d6a07354523",
    blockCssY: {
      "items": {
        ".pg9d6a07354523": {
          "grid-template-columns": {},
          "gap": {},
          "display": {}
        },
        ".pg9d6a07354523 form": {
          "grid-template-columns": {
            "Desktop": "1fr "
          },
          "gap": {
            "Desktop": "1em"
          },
          "display": {
            "Desktop": "grid"
          }
        }
      }
    }
  },
  isPro: false,
  innerBlocks: [['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your name",
        "value": "",
        "name": "name",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ededed"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pge76e79d1e452",
    blockCssY: {
      "items": {
        ".pge76e79d1e452 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ededed"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pge76e79d1e452 .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Email",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your mail address",
        "value": "",
        "name": "email",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ededed"
        },
        "width": {
          "Desktop": "99%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Email should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg9a328fd54a2e",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg9a328fd54a2e input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ededed"
          },
          "width": {
            "Desktop": "99%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pg9a328fd54a2e .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Website URL",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "",
        "value": "",
        "name": "url",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ededed"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Website URL should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg8539be28243d",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {
          "background-color": {
            "Desktop": "#ededed"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "width": {
            "Desktop": "100%"
          }
        },
        ".pg8539be28243d .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-textarea', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {}
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {}
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Comment",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "",
        "value": "",
        "name": "comment",
        "required": false,
        "disabled": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "cols": null,
        "rows": 3,
        "autocomplete": false,
        "autofocus": false,
        "wrap": false,
        "spellcheck": false,
        "autocorrect": false,
        "id": "",
        "class": "",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ededed"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Comment should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pgeeea0720d517",
    blockCssY: {
      "items": {
        ".pgd6ed3e1cdfbd textarea": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pgd6ed3e1cdfbd .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        },
        ".pgeeea0720d517 textarea": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ededed"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": false,
        "text": "Your Name",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "submit",
        "placeholder": "Write your name",
        "value": "Submit",
        "name": "",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#51557E"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "99%"
        },
        "color": {
          "Desktop": "#ffffff"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pg4670520d9df5",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg4670520d9df5 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#51557E"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "99%"
          },
          "color": {
            "Desktop": "#ffffff"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": false,
        "text": "",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "hidden",
        "placeholder": "Write your name",
        "value": "",
        "name": "post_id",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "includeMailBody": true,
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel",
        "valueSource": "postID"
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pg614afd61f278",
    blockCssY: {
      "items": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 368.13 299.66"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.07",
    y: "8.02",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,42.46H6.26a3.2,3.2,0,0,1-3.2-3.19V10.22A3.21,3.21,0,0,1,6.26,7H361.87a3.2,3.2,0,0,1,3.19,3.2V39.27A3.19,3.19,0,0,1,361.87,42.46ZM6.26,9a1.2,1.2,0,0,0-1.2,1.2V39.27a1.19,1.19,0,0,0,1.2,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19V10.22A1.19,1.19,0,0,0,361.87,9Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.07",
    y: "104.96",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,139.39H6.26a3.2,3.2,0,0,1-3.2-3.19v-29A3.2,3.2,0,0,1,6.26,104H361.87a3.19,3.19,0,0,1,3.19,3.19v29A3.19,3.19,0,0,1,361.87,139.39ZM6.26,106a1.19,1.19,0,0,0-1.2,1.19v29a1.19,1.19,0,0,0,1.2,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19v-29a1.19,1.19,0,0,0-1.19-1.19Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.07",
    y: "152.59",
    width: "360",
    height: "86.66",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,240.25H6.26a3.2,3.2,0,0,1-3.2-3.19V154.79a3.21,3.21,0,0,1,3.2-3.2H361.87a3.2,3.2,0,0,1,3.19,3.2v82.27A3.19,3.19,0,0,1,361.87,240.25ZM6.26,153.59a1.2,1.2,0,0,0-1.2,1.2v82.27a1.19,1.19,0,0,0,1.2,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19V154.79a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M19.89,28.27V24.84l-2.56-4.66h1.19l1.14,2.23c.31.61.55,1.11.8,1.67h0c.23-.53.5-1.06.81-1.67l1.17-2.23h1.18l-2.71,4.64v3.45Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M28.89,25.32A2.84,2.84,0,0,1,26,28.4a2.76,2.76,0,0,1-2.79-3,2.83,2.83,0,0,1,2.88-3.08A2.75,2.75,0,0,1,28.89,25.32Zm-4.61.05c0,1.28.73,2.24,1.76,2.24s1.77-.95,1.77-2.26c0-1-.5-2.23-1.74-2.23S24.28,24.27,24.28,25.37Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M35.08,26.68c0,.6,0,1.13.05,1.59h-.94l-.06-.95h0a2.19,2.19,0,0,1-1.92,1.08c-.91,0-2-.51-2-2.55V22.46h1.06v3.22c0,1.1.34,1.84,1.3,1.84A1.47,1.47,0,0,0,34,26V22.46h1.06Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M36.83,24.27c0-.68,0-1.27,0-1.81h.93l0,1.14h0a1.75,1.75,0,0,1,1.61-1.27,1.39,1.39,0,0,1,.3,0v1a1.88,1.88,0,0,0-.36,0,1.5,1.5,0,0,0-1.42,1.36,3.47,3.47,0,0,0,0,.49v3.1H36.83Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M43.34,28.27V20.18h1.13l2.6,4.09a23.83,23.83,0,0,1,1.45,2.63h0c-.1-1.08-.12-2.07-.12-3.33V20.18h1v8.09h-1l-2.57-4.11a27.32,27.32,0,0,1-1.51-2.69h0c.06,1,.08,2,.08,3.33v3.46Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.41,28.27l-.08-.74h0a2.15,2.15,0,0,1-1.77.87,1.66,1.66,0,0,1-1.78-1.67c0-1.4,1.25-2.17,3.49-2.16v-.12a1.19,1.19,0,0,0-1.32-1.34,2.93,2.93,0,0,0-1.51.43l-.24-.7a3.63,3.63,0,0,1,1.91-.51c1.77,0,2.2,1.21,2.2,2.37v2.17a8.44,8.44,0,0,0,.1,1.4Zm-.16-3c-1.15,0-2.45.18-2.45,1.31a.93.93,0,0,0,1,1,1.43,1.43,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M57,24c0-.6,0-1.09,0-1.57h.93l0,.94h0a2,2,0,0,1,1.82-1.07,1.74,1.74,0,0,1,1.65,1.16h0a2.42,2.42,0,0,1,.65-.75,2,2,0,0,1,1.28-.41c.77,0,1.91.5,1.91,2.52v3.42h-1V25c0-1.12-.41-1.79-1.26-1.79a1.38,1.38,0,0,0-1.25,1,1.74,1.74,0,0,0-.08.53v3.59h-1V24.79c0-.93-.4-1.6-1.21-1.6a1.43,1.43,0,0,0-1.3,1.06,1.4,1.4,0,0,0-.09.51v3.51H57Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M67.58,25.56a1.85,1.85,0,0,0,2,2,3.75,3.75,0,0,0,1.6-.3l.18.76a4.8,4.8,0,0,1-1.93.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,2.85,2.85,0,0,1,0,.5Zm3.09-.76a1.51,1.51,0,0,0-1.46-1.72,1.75,1.75,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.07",
    y: "56.49",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,90.93H6.26a3.2,3.2,0,0,1-3.2-3.2v-29a3.2,3.2,0,0,1,3.2-3.2H361.87a3.19,3.19,0,0,1,3.19,3.2v29A3.19,3.19,0,0,1,361.87,90.93ZM6.26,57.49a1.2,1.2,0,0,0-1.2,1.2v29a1.2,1.2,0,0,0,1.2,1.2H361.87a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M22.27,72.94H19.13v2.92h3.5v.87H18.09V68.65h4.36v.87H19.13v2.56h3.14Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M24,72.5c0-.6,0-1.09-.05-1.57h.92l.05.93h0a2,2,0,0,1,1.82-1.07A1.71,1.71,0,0,1,28.38,72h0a2.33,2.33,0,0,1,.64-.76,2,2,0,0,1,1.29-.41c.76,0,1.9.51,1.9,2.52v3.42h-1V73.45c0-1.12-.41-1.79-1.26-1.79a1.35,1.35,0,0,0-1.24,1,1.63,1.63,0,0,0-.09.53v3.58h-1V73.25c0-.92-.41-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1,1.49,1.49,0,0,0-.08.52v3.5H24Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M37.18,76.73,37.1,76h0a2.16,2.16,0,0,1-1.78.86,1.65,1.65,0,0,1-1.77-1.66C33.51,73.79,34.76,73,37,73v-.12a1.2,1.2,0,0,0-1.32-1.35,2.84,2.84,0,0,0-1.51.44l-.24-.7a3.61,3.61,0,0,1,1.91-.52c1.77,0,2.2,1.22,2.2,2.38v2.17a8.32,8.32,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.93.93,0,0,0,1,1,1.44,1.44,0,0,0,1.4-1,1,1,0,0,0,.06-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M40.92,69.3a.65.65,0,0,1-1.3,0,.64.64,0,0,1,.66-.66A.62.62,0,0,1,40.92,69.3Zm-1.17,7.43v-5.8h1v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M42.56,68.22h1v8.51h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M49.27,74.19l-.83,2.54H47.36l2.74-8.08h1.26l2.76,8.08H53l-.87-2.54Zm2.66-.82-.8-2.32c-.18-.53-.3-1-.42-1.48h0c-.12.48-.25,1-.41,1.46l-.79,2.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M60.14,68.22v7c0,.52,0,1.11,0,1.5h-.94l0-1h0a2.14,2.14,0,0,1-2,1.14c-1.4,0-2.48-1.18-2.48-3,0-1.93,1.19-3.12,2.6-3.12a2,2,0,0,1,1.76.89h0V68.22Zm-1,5.07a1.65,1.65,0,0,0-.05-.44,1.54,1.54,0,0,0-1.52-1.23c-1.09,0-1.74,1-1.74,2.25S56.35,76,57.49,76A1.59,1.59,0,0,0,59,74.75a1.64,1.64,0,0,0,.05-.45Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M66.91,68.22v7c0,.52,0,1.11,0,1.5H66l0-1h0a2.14,2.14,0,0,1-2,1.14c-1.4,0-2.48-1.18-2.48-3,0-1.93,1.19-3.12,2.6-3.12a1.93,1.93,0,0,1,1.75.89h0V68.22Zm-1,5.07a1.65,1.65,0,0,0,0-.44,1.55,1.55,0,0,0-1.52-1.23c-1.09,0-1.74,1-1.74,2.25S63.12,76,64.26,76a1.59,1.59,0,0,0,1.55-1.26,1.64,1.64,0,0,0,0-.45Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M68.67,72.74c0-.69,0-1.27,0-1.81h.92l0,1.14h0a1.75,1.75,0,0,1,1.6-1.28,1.28,1.28,0,0,1,.3,0v1a1.23,1.23,0,0,0-.36,0,1.47,1.47,0,0,0-1.41,1.36,2.38,2.38,0,0,0-.05.49v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M73.06,74a1.86,1.86,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,4.68,4.68,0,0,1,0,.49Zm3.09-.75a1.49,1.49,0,0,0-1.46-1.72,1.75,1.75,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M78.34,75.65a2.69,2.69,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.54-1-1.54-1.64a1.8,1.8,0,0,1,2-1.71,2.9,2.9,0,0,1,1.42.36l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.39,1.53.89,1.53,1.75,0,1-.79,1.74-2.17,1.74a3.27,3.27,0,0,1-1.63-.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M83.09,75.65a2.72,2.72,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.53-1-1.53-1.64a1.79,1.79,0,0,1,2-1.71,2.94,2.94,0,0,1,1.43.36l-.27.77A2.29,2.29,0,0,0,85,71.59c-.62,0-1,.36-1,.79s.35.69,1.11,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.3,3.3,0,0,1-1.63-.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M19.41,125.2l-2.05-8.09h1.1l1,4.09c.24,1,.46,2,.6,2.8h0c.14-.81.39-1.76.66-2.81l1.08-4.08h1.09l1,4.11c.23,1,.44,1.91.56,2.77h0c.17-.89.4-1.79.65-2.8l1.07-4.08h1.07l-2.29,8.09H23.85l-1-4.21a23.2,23.2,0,0,1-.53-2.64h0a24.73,24.73,0,0,1-.62,2.64L20.5,125.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M28.4,122.49a1.85,1.85,0,0,0,2,2,3.75,3.75,0,0,0,1.6-.3l.18.76a4.63,4.63,0,0,1-1.93.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,2.81,2.81,0,0,1,0,.49Zm3.09-.76A1.5,1.5,0,0,0,30,120a1.74,1.74,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M33.77,125.2c0-.4,0-1,0-1.5v-7h1v3.65h0a2.15,2.15,0,0,1,2-1.07c1.44,0,2.46,1.2,2.44,3,0,2.08-1.3,3.11-2.6,3.11a2.06,2.06,0,0,1-1.94-1.09h0l0,1Zm1.09-2.33a2.32,2.32,0,0,0,0,.38,1.63,1.63,0,0,0,1.59,1.24c1.1,0,1.76-.9,1.76-2.23,0-1.16-.6-2.16-1.73-2.16a1.69,1.69,0,0,0-1.61,1.3,2.34,2.34,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M40.5,124.12a2.86,2.86,0,0,0,1.4.42c.76,0,1.12-.39,1.12-.87s-.3-.78-1.08-1.06c-1-.37-1.53-1-1.53-1.65a1.79,1.79,0,0,1,2-1.7,2.91,2.91,0,0,1,1.43.36l-.27.77a2.15,2.15,0,0,0-1.18-.34c-.63,0-1,.36-1,.79s.34.7,1.1,1c1,.38,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M46.58,117.76a.63.63,0,0,1-.68.65.63.63,0,0,1-.63-.65.64.64,0,0,1,.66-.66A.63.63,0,0,1,46.58,117.76ZM45.4,125.2v-5.81h1.06v5.81Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M49.48,117.73v1.66H51v.81H49.48v3.13c0,.72.2,1.12.79,1.12a2.15,2.15,0,0,0,.61-.07l0,.79a2.42,2.42,0,0,1-.93.15,1.45,1.45,0,0,1-1.14-.45,2.13,2.13,0,0,1-.41-1.51V120.2h-.9v-.81h.9V118Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M52.7,122.49a1.85,1.85,0,0,0,2,2,3.75,3.75,0,0,0,1.6-.3l.18.76a4.63,4.63,0,0,1-1.93.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,2.81,2.81,0,0,1,0,.49Zm3.09-.76A1.5,1.5,0,0,0,54.33,120a1.74,1.74,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M61.74,117.11v4.79c0,1.81.81,2.58,1.89,2.58s2-.79,2-2.58v-4.79h1.06v4.72c0,2.48-1.31,3.5-3.06,3.5s-2.9-1-2.9-3.45v-4.77Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M68.46,117.22a10.77,10.77,0,0,1,2-.17,3.36,3.36,0,0,1,2.34.66,2.05,2.05,0,0,1,.63,1.54,2.12,2.12,0,0,1-1.52,2.06v0A2,2,0,0,1,73.1,123a13,13,0,0,0,.63,2.22H72.65a11.07,11.07,0,0,1-.54-1.93c-.24-1.12-.67-1.54-1.62-1.57h-1v3.5H68.46Zm1.05,3.68h1.06c1.12,0,1.83-.61,1.83-1.53s-.76-1.5-1.86-1.51a4.84,4.84,0,0,0-1,.09Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M74.92,117.11h1v7.21h3.46v.88h-4.5Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M19.41,170.75l-2.05-8.09h1.1l1,4.09c.24,1,.46,2,.6,2.8h0c.14-.81.39-1.77.66-2.81l1.08-4.08h1.09l1,4.1c.23,1,.44,1.92.56,2.78h0c.17-.89.4-1.79.65-2.8l1.07-4.08h1.07l-2.29,8.09H23.85l-1-4.21a23.2,23.2,0,0,1-.53-2.64h0a24.73,24.73,0,0,1-.62,2.64l-1.15,4.21Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M28,166.75c0-.68,0-1.27-.05-1.81h.93l0,1.14h0a1.75,1.75,0,0,1,1.61-1.27,1,1,0,0,1,.3,0v1a1.94,1.94,0,0,0-.36,0,1.49,1.49,0,0,0-1.42,1.35,3.47,3.47,0,0,0,0,.49v3.1H28Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M33.16,163.31a.62.62,0,0,1-.67.65.63.63,0,0,1-.64-.65.65.65,0,0,1,.66-.66A.63.63,0,0,1,33.16,163.31ZM32,170.75v-5.81H33v5.81Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M36.06,163.28v1.66h1.51v.81H36.06v3.13c0,.72.21,1.12.79,1.12a2.29,2.29,0,0,0,.62-.07l.05.79a2.48,2.48,0,0,1-.94.15,1.46,1.46,0,0,1-1.14-.45,2.13,2.13,0,0,1-.41-1.51v-3.16h-.9v-.81H35v-1.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M39.28,168a1.86,1.86,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76a4.84,4.84,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4.92,4.92,0,0,1,0,.5Zm3.09-.76a1.49,1.49,0,0,0-1.46-1.71,1.75,1.75,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M48.53,170.75v-3.43L46,162.66h1.18l1.14,2.23c.31.62.55,1.11.81,1.67h0c.23-.53.5-1.05.82-1.67l1.16-2.23H52.3l-2.71,4.64v3.45Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M57.53,167.8a2.84,2.84,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.78-3,2.83,2.83,0,0,1,2.87-3.08A2.75,2.75,0,0,1,57.53,167.8Zm-4.61.06c0,1.27.74,2.23,1.77,2.23s1.76-1,1.76-2.26c0-1-.49-2.23-1.74-2.23S52.92,166.75,52.92,167.86Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M63.72,169.16c0,.6,0,1.13.05,1.59h-.94l-.06-.95h0a2.19,2.19,0,0,1-1.92,1.08c-.91,0-2-.51-2-2.54v-3.4h1.05v3.22c0,1.1.34,1.84,1.3,1.84a1.52,1.52,0,0,0,1.39-1,1.49,1.49,0,0,0,.1-.54v-3.56h1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M65.48,166.75c0-.68,0-1.27,0-1.81h.92l0,1.14h0a1.74,1.74,0,0,1,1.6-1.27.91.91,0,0,1,.3,0v1a1.86,1.86,0,0,0-.36,0,1.47,1.47,0,0,0-1.41,1.35,2.38,2.38,0,0,0,0,.49v3.1h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M77.63,170.48a5.18,5.18,0,0,1-2.14.39,3.78,3.78,0,0,1-4-4.09,4,4,0,0,1,4.22-4.25,4.4,4.4,0,0,1,1.92.36l-.25.85a3.85,3.85,0,0,0-1.63-.33,3,3,0,0,0-3.16,3.33A2.94,2.94,0,0,0,75.71,170a4.22,4.22,0,0,0,1.7-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M84,167.8a2.84,2.84,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.78-3,2.83,2.83,0,0,1,2.88-3.08A2.74,2.74,0,0,1,84,167.8Zm-4.6.06c0,1.27.73,2.23,1.76,2.23s1.77-1,1.77-2.26c0-1-.5-2.23-1.74-2.23S79.42,166.75,79.42,167.86Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M85.36,166.51c0-.6,0-1.09,0-1.57h.93l0,.94h0a2,2,0,0,1,1.82-1.07A1.74,1.74,0,0,1,89.79,166h0a2.42,2.42,0,0,1,.65-.75,2,2,0,0,1,1.28-.41c.77,0,1.91.5,1.91,2.52v3.42h-1v-3.29c0-1.11-.41-1.79-1.26-1.79a1.38,1.38,0,0,0-1.25,1,1.74,1.74,0,0,0-.08.53v3.59H89v-3.48c0-.92-.4-1.6-1.21-1.6a1.45,1.45,0,0,0-1.31,1.06,1.67,1.67,0,0,0-.08.52v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M95.37,166.51c0-.6,0-1.09-.05-1.57h.92l.05.94h0a2,2,0,0,1,1.82-1.07A1.71,1.71,0,0,1,99.79,166h0a2.29,2.29,0,0,1,.65-.75,1.93,1.93,0,0,1,1.28-.41c.77,0,1.91.5,1.91,2.52v3.42h-1v-3.29c0-1.11-.4-1.79-1.26-1.79a1.38,1.38,0,0,0-1.24,1,1.73,1.73,0,0,0-.09.53v3.59H99v-3.48c0-.92-.41-1.6-1.21-1.6a1.45,1.45,0,0,0-1.31,1.06,1.42,1.42,0,0,0-.08.52v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M106,168a1.86,1.86,0,0,0,2,2,3.76,3.76,0,0,0,1.61-.3l.18.76a4.84,4.84,0,0,1-1.93.36,2.69,2.69,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4.36,4.36,0,0,1,0,.5Zm3.1-.76a1.5,1.5,0,0,0-1.47-1.71,1.76,1.76,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M111.39,166.51c0-.6,0-1.09,0-1.57h.94l.06,1h0a2.14,2.14,0,0,1,1.92-1.09c.8,0,2,.48,2,2.47v3.47h-1.06V167.4c0-.94-.34-1.71-1.34-1.71a1.48,1.48,0,0,0-1.41,1.07,1.54,1.54,0,0,0-.08.5v3.49h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M119.27,163.28v1.66h1.51v.81h-1.51v3.13c0,.72.2,1.12.79,1.12a2.15,2.15,0,0,0,.61-.07l0,.79a2.42,2.42,0,0,1-.93.15,1.46,1.46,0,0,1-1.14-.45,2.13,2.13,0,0,1-.41-1.51v-3.16h-.9v-.81h.9v-1.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#414042",
    x: "4.07",
    y: "256.56",
    width: "180",
    height: "35.07",
    rx: "3.24"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M50.47,276.35a3.72,3.72,0,0,0,1.88.53c1.06,0,1.69-.57,1.69-1.38s-.44-1.19-1.53-1.61c-1.32-.47-2.13-1.15-2.13-2.29A2.32,2.32,0,0,1,53,269.41a3.73,3.73,0,0,1,1.79.39l-.29.85a3.24,3.24,0,0,0-1.53-.38c-1.11,0-1.53.66-1.53,1.21,0,.76.5,1.13,1.61,1.56,1.37.53,2.06,1.19,2.06,2.37s-.92,2.33-2.83,2.33a4.25,4.25,0,0,1-2.06-.51Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M61.36,276c0,.6,0,1.13,0,1.58h-.93l-.06-.95h0a2.16,2.16,0,0,1-1.91,1.08c-.92,0-2-.5-2-2.54v-3.39h1.06V275c0,1.1.33,1.85,1.29,1.85a1.52,1.52,0,0,0,1.39-1,1.37,1.37,0,0,0,.1-.54v-3.56h1.06Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M63.06,277.62c0-.39,0-1,0-1.5v-7h1v3.64h0a2.15,2.15,0,0,1,2-1.06c1.44,0,2.46,1.19,2.44,3,0,2.07-1.3,3.1-2.6,3.1a2.06,2.06,0,0,1-1.94-1.09h0l0,1Zm1.09-2.33a2.3,2.3,0,0,0,0,.39,1.64,1.64,0,0,0,1.59,1.23c1.1,0,1.76-.9,1.76-2.23,0-1.16-.6-2.16-1.73-2.16a1.7,1.7,0,0,0-1.61,1.3,2.34,2.34,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M69.94,273.39c0-.6,0-1.09,0-1.57h.92l0,.93h0a2,2,0,0,1,1.82-1.06,1.7,1.7,0,0,1,1.64,1.16h0a2.35,2.35,0,0,1,.65-.76,2,2,0,0,1,1.28-.4c.77,0,1.91.5,1.91,2.51v3.42h-1v-3.28c0-1.12-.4-1.79-1.26-1.79a1.36,1.36,0,0,0-1.24,1,1.63,1.63,0,0,0-.09.53v3.58h-1v-3.48c0-.92-.41-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1.05,1.49,1.49,0,0,0-.08.52v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M81.12,270.19a.62.62,0,0,1-.67.64.63.63,0,0,1-.64-.64.64.64,0,0,1,.66-.66A.62.62,0,0,1,81.12,270.19ZM80,277.62v-5.8h1v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M84,270.15v1.67h1.51v.8H84v3.13c0,.72.2,1.13.79,1.13a2.68,2.68,0,0,0,.61-.07l0,.79a2.73,2.73,0,0,1-.94.14,1.45,1.45,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51v-3.17H82.1v-.8H83v-1.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M95,277.36a5.29,5.29,0,0,1-2.14.38,3.77,3.77,0,0,1-4-4.09,4,4,0,0,1,4.22-4.24,4.26,4.26,0,0,1,1.92.36l-.25.85a3.85,3.85,0,0,0-1.64-.34,3,3,0,0,0-3.15,3.34A2.94,2.94,0,0,0,93,276.87a4.24,4.24,0,0,0,1.7-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M101.35,274.67a2.83,2.83,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.78-3,2.83,2.83,0,0,1,2.88-3.08A2.75,2.75,0,0,1,101.35,274.67Zm-4.6.06c0,1.27.73,2.23,1.76,2.23s1.76-.95,1.76-2.25c0-1-.49-2.23-1.74-2.23S96.75,273.63,96.75,274.73Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M102.69,273.39c0-.6,0-1.09,0-1.57h.92l0,.93h0a2,2,0,0,1,1.82-1.06,1.7,1.7,0,0,1,1.64,1.16h0a2.33,2.33,0,0,1,.64-.76,2,2,0,0,1,1.29-.4c.76,0,1.9.5,1.9,2.51v3.42h-1v-3.28c0-1.12-.41-1.79-1.26-1.79a1.35,1.35,0,0,0-1.24,1,1.63,1.63,0,0,0-.09.53v3.58h-1v-3.48c0-.92-.41-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1.05,1.49,1.49,0,0,0-.08.52v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M112.69,273.39c0-.6,0-1.09,0-1.57h.92l.05.93h0a2,2,0,0,1,1.83-1.06,1.7,1.7,0,0,1,1.64,1.16h0a2.35,2.35,0,0,1,.65-.76,2,2,0,0,1,1.28-.4c.77,0,1.91.5,1.91,2.51v3.42h-1v-3.28c0-1.12-.41-1.79-1.26-1.79a1.36,1.36,0,0,0-1.25,1,2,2,0,0,0-.08.53v3.58h-1v-3.48c0-.92-.41-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1.05,1.5,1.5,0,0,0-.09.52v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M123.29,274.91a1.86,1.86,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.69,2.69,0,0,1-2.86-2.92c0-1.76,1-3.13,2.72-3.13a2.45,2.45,0,0,1,2.4,2.73,4.68,4.68,0,0,1,0,.49Zm3.09-.75a1.49,1.49,0,0,0-1.46-1.72,1.75,1.75,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M128.71,273.39c0-.6,0-1.09,0-1.57h.93l.06,1h0a2.09,2.09,0,0,1,1.91-1.09c.81,0,2.06.47,2.06,2.47v3.46H132.6v-3.34c0-.94-.35-1.72-1.34-1.72a1.5,1.5,0,0,0-1.42,1.08,1.45,1.45,0,0,0-.07.49v3.49h-1.06Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M136.6,270.15v1.67h1.51v.8H136.6v3.13c0,.72.2,1.13.79,1.13a2.68,2.68,0,0,0,.61-.07l.05.79a2.73,2.73,0,0,1-.94.14,1.45,1.45,0,0,1-1.14-.44,2.15,2.15,0,0,1-.4-1.51v-3.17h-.9v-.8h.9v-1.39Z"
  }))
}, {
  name: 'term-submit-form-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Term Submission Form'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Term Submission Form'),
  atts: {
    form: {
      "styles": {
        "gridTemplateColumns": {
          "Desktop": "1fr "
        },
        "gap": {
          "Desktop": "1em"
        },
        "display": {
          "Desktop": "grid"
        }
      },
      "options": {
        "type": "termSubmitForm"
      }
    },
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "gridTemplateColumns": {},
        "gap": {},
        "display": {}
      }
    },
    visible: {},
    onSubmit: {
      "0": {
        "id": "validation",
        "messages": []
      },
      "1": {
        "id": "submitConfirm",
        "messages": []
      }
    },
    onProcess: {
      "0": {
        "id": "termSubmit",
        "postType": "",
        "showOnResponse": true,
        "taxonomy": "category"
      },
      "1": {
        "id": "createEntry",
        "message": ""
      }
    },
    afterSubmit: {
      "0": {
        "id": "showResponse",
        "message": ""
      },
      "1": {
        "id": "clearForm",
        "message": ""
      }
    },
    blockId: "pg9d6a07354523",
    blockCssY: {
      "items": {
        ".pg9d6a07354523": {
          "grid-template-columns": {},
          "gap": {},
          "display": {}
        },
        ".pg9d6a07354523 form": {
          "grid-template-columns": {
            "Desktop": "1fr "
          },
          "gap": {
            "Desktop": "1em"
          },
          "display": {
            "Desktop": "grid"
          }
        }
      }
    }
  },
  isPro: false,
  innerBlocks: [['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Term Title",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "",
        "value": "",
        "name": "term_title",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Term title should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg8539be28243d",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {
          "background-color": {
            "Desktop": "#ececec"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "width": {
            "Desktop": "100%"
          }
        },
        ".pg8539be28243d .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Term Slug",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "",
        "value": "",
        "name": "term_slug",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pgbba272b1931d",
    blockCssY: {
      "items": {
        ".pgbba272b1931d input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {}
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {}
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Term Description",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "",
        "value": "",
        "name": "term_description",
        "required": false,
        "disabled": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "cols": null,
        "rows": 3,
        "autocomplete": false,
        "autofocus": false,
        "wrap": false,
        "spellcheck": false,
        "autocorrect": false,
        "id": "",
        "class": "",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Term description should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockCssY: {
      "items": {
        ".pgd6ed3e1cdfbd textarea": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pgd6ed3e1cdfbd .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-textarea', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Email",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your mail address",
        "value": "",
        "name": "email",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Email should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg9a328fd54a2e",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg9a328fd54a2e input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pg9a328fd54a2e .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        },
        ".pg9a328fd54a2e textarea": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": false,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "submit",
        "placeholder": "Write your name",
        "value": "Submit",
        "name": "",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#51557E"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        },
        "color": {
          "Desktop": "#ffffff"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pg4670520d9df5",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg4670520d9df5 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#51557E"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "color": {
            "Desktop": "#ffffff"
          }
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 368.13 244.63"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "4.63",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,39.07H6.26a3.19,3.19,0,0,1-3.19-3.19V6.83a3.2,3.2,0,0,1,3.19-3.2H361.87a3.2,3.2,0,0,1,3.19,3.2V35.88A3.19,3.19,0,0,1,361.87,39.07ZM6.26,5.63a1.19,1.19,0,0,0-1.19,1.2V35.88a1.19,1.19,0,0,0,1.19,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19V6.83a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "53.1",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,87.54H6.26a3.2,3.2,0,0,1-3.19-3.2v-29a3.19,3.19,0,0,1,3.19-3.2H361.87a3.19,3.19,0,0,1,3.19,3.2v29A3.2,3.2,0,0,1,361.87,87.54ZM6.26,54.1a1.19,1.19,0,0,0-1.19,1.2v29a1.19,1.19,0,0,0,1.19,1.2H361.87a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "100.74",
    width: "360",
    height: "86.66",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,188.4H6.26a3.2,3.2,0,0,1-3.19-3.2V102.93a3.19,3.19,0,0,1,3.19-3.19H361.87a3.19,3.19,0,0,1,3.19,3.19V185.2A3.2,3.2,0,0,1,361.87,188.4ZM6.26,101.74a1.19,1.19,0,0,0-1.19,1.19V185.2a1.19,1.19,0,0,0,1.19,1.2H361.87a1.19,1.19,0,0,0,1.19-1.2V102.93a1.19,1.19,0,0,0-1.19-1.19Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#414042",
    x: "4.27",
    y: "204.92",
    width: "180",
    height: "35.07",
    rx: "3.24"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M19.62,17.68H17.16v-.89h6v.89H20.68v7.2H19.62Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M23.75,22.16a1.87,1.87,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76A4.84,4.84,0,0,1,25.6,25a2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.73-3.13a2.46,2.46,0,0,1,2.4,2.73,4,4,0,0,1,0,.49Zm3.1-.75a1.51,1.51,0,0,0-1.47-1.72,1.77,1.77,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29.18,20.88c0-.68,0-1.27-.05-1.81h.92l0,1.14h.05a1.74,1.74,0,0,1,1.6-1.27,1.32,1.32,0,0,1,.3,0v1a1.79,1.79,0,0,0-.36,0,1.48,1.48,0,0,0-1.41,1.36,2.38,2.38,0,0,0-.05.49v3.1h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M33.15,20.64c0-.6,0-1.09,0-1.57H34l0,.94h0a2,2,0,0,1,1.82-1.07,1.71,1.71,0,0,1,1.64,1.16h0a2.42,2.42,0,0,1,.65-.75,1.93,1.93,0,0,1,1.28-.41c.77,0,1.91.5,1.91,2.52v3.42h-1V21.59c0-1.12-.4-1.79-1.26-1.79a1.38,1.38,0,0,0-1.24,1,1.73,1.73,0,0,0-.09.53v3.59h-1V21.4c0-.93-.41-1.6-1.21-1.6a1.45,1.45,0,0,0-1.31,1.06,1.4,1.4,0,0,0-.08.51v3.51h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M46.78,17.68H44.32v-.89h6v.89H47.83v7.2h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M52.2,17.44a.62.62,0,0,1-.67.65.63.63,0,0,1-.63-.65.64.64,0,0,1,.66-.66A.62.62,0,0,1,52.2,17.44ZM51,24.88V19.07h1v5.81Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M55.11,17.4v1.67h1.51v.8H55.11V23c0,.72.2,1.13.79,1.13a2.15,2.15,0,0,0,.61-.07l.05.79a2.48,2.48,0,0,1-.94.15,1.47,1.47,0,0,1-1.14-.45,2.15,2.15,0,0,1-.4-1.51V19.87h-.9v-.8h.9V17.68Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M57.81,16.36h1v8.52h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M61.23,22.16a1.86,1.86,0,0,0,2,2,3.83,3.83,0,0,0,1.61-.3l.18.76a4.9,4.9,0,0,1-1.94.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4.49,4.49,0,0,1,0,.49Zm3.09-.75a1.5,1.5,0,0,0-1.46-1.72,1.75,1.75,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M19.62,66.15H17.16v-.89h6v.89H20.68v7.19H19.62Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M23.75,70.63a1.87,1.87,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.73-3.13a2.47,2.47,0,0,1,2.4,2.74,4.15,4.15,0,0,1,0,.49Zm3.1-.75a1.51,1.51,0,0,0-1.47-1.72,1.76,1.76,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29.18,69.35c0-.69,0-1.27-.05-1.81h.92l0,1.14h.05a1.75,1.75,0,0,1,1.6-1.28,1.28,1.28,0,0,1,.3,0v1a1.28,1.28,0,0,0-.36,0,1.47,1.47,0,0,0-1.41,1.36,2.38,2.38,0,0,0-.05.49v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M33.15,69.11c0-.6,0-1.09,0-1.57H34l0,.93h0a2,2,0,0,1,1.82-1.07,1.71,1.71,0,0,1,1.64,1.17h0a2.35,2.35,0,0,1,.65-.76,2,2,0,0,1,1.28-.41c.77,0,1.91.51,1.91,2.52v3.42h-1V70.06c0-1.12-.4-1.79-1.26-1.79a1.36,1.36,0,0,0-1.24,1,1.63,1.63,0,0,0-.09.53v3.58h-1V69.86c0-.92-.41-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1,1.49,1.49,0,0,0-.08.52v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M45.59,72.07a3.68,3.68,0,0,0,1.87.53c1.07,0,1.69-.57,1.69-1.38s-.43-1.19-1.52-1.61c-1.32-.47-2.13-1.15-2.13-2.29a2.32,2.32,0,0,1,2.61-2.19,3.73,3.73,0,0,1,1.79.39l-.29.85A3.25,3.25,0,0,0,48.07,66c-1.1,0-1.52.66-1.52,1.21,0,.76.49,1.13,1.61,1.56,1.37.53,2.06,1.19,2.06,2.37s-.92,2.33-2.83,2.33A4.25,4.25,0,0,1,45.33,73Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M51.62,64.83h1.05v8.51H51.62Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M59.31,71.76c0,.6,0,1.13,0,1.58h-.93l-.06-1h0a2.16,2.16,0,0,1-1.92,1.08c-.91,0-2-.5-2-2.54V67.54h1.06v3.21c0,1.1.33,1.85,1.29,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.1-.54V67.54h1.06Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M66.06,67.54c0,.42,0,.88,0,1.59V72.5a3.35,3.35,0,0,1-.82,2.65,3.09,3.09,0,0,1-2.12.7,3.78,3.78,0,0,1-1.93-.48l.27-.81a3.25,3.25,0,0,0,1.7.46c1.08,0,1.87-.56,1.87-2v-.64h0a2.08,2.08,0,0,1-1.85,1,2.6,2.6,0,0,1-2.47-2.83,2.79,2.79,0,0,1,2.61-3.09,2,2,0,0,1,1.82,1h0l0-.87ZM65,69.83a1.44,1.44,0,0,0-.06-.48,1.53,1.53,0,0,0-1.48-1.12c-1,0-1.72.85-1.72,2.2,0,1.14.57,2.08,1.71,2.08a1.54,1.54,0,0,0,1.47-1.08,1.81,1.81,0,0,0,.08-.56Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M19.62,111.69H17.16v-.88h6v.88H20.68v7.2H19.62Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M23.75,116.18a1.86,1.86,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76a4.67,4.67,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.73-3.13a2.47,2.47,0,0,1,2.4,2.74,4.35,4.35,0,0,1,0,.49Zm3.1-.76a1.5,1.5,0,0,0-1.47-1.71,1.76,1.76,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29.18,114.9c0-.69,0-1.27-.05-1.81h.92l0,1.13h.05a1.75,1.75,0,0,1,1.6-1.27,1.28,1.28,0,0,1,.3,0v1a1.86,1.86,0,0,0-.36,0,1.47,1.47,0,0,0-1.41,1.35,2.57,2.57,0,0,0-.05.5v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M33.15,114.66c0-.6,0-1.1,0-1.57H34l0,.93h0A2,2,0,0,1,35.93,113a1.71,1.71,0,0,1,1.64,1.17h0a2.35,2.35,0,0,1,.65-.76,2,2,0,0,1,1.28-.41c.77,0,1.91.51,1.91,2.52v3.42h-1V115.6c0-1.11-.4-1.78-1.26-1.78a1.36,1.36,0,0,0-1.24,1,1.61,1.61,0,0,0-.09.52v3.59h-1v-3.48c0-.92-.41-1.59-1.21-1.59a1.44,1.44,0,0,0-1.31,1.05,1.49,1.49,0,0,0-.08.52v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M45.74,110.91a15.77,15.77,0,0,1,2.21-.16,4.65,4.65,0,0,1,3.28,1,3.74,3.74,0,0,1,1.14,2.91,4.25,4.25,0,0,1-1.17,3.14A5,5,0,0,1,47.63,119a16.84,16.84,0,0,1-1.89-.09Zm1,7.15a6.32,6.32,0,0,0,1,.06,3.11,3.11,0,0,0,3.45-3.43c0-1.9-1.07-3.12-3.28-3.12a5.89,5.89,0,0,0-1.22.11Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.33,116.18a1.85,1.85,0,0,0,2,2,3.83,3.83,0,0,0,1.61-.3l.18.76a4.72,4.72,0,0,1-1.94.36,2.69,2.69,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,4.88,4.88,0,0,1,0,.49Zm3.09-.76A1.5,1.5,0,0,0,56,113.71a1.74,1.74,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M59.61,117.81a2.79,2.79,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.54-1-1.54-1.64a1.79,1.79,0,0,1,2-1.71,2.91,2.91,0,0,1,1.43.36l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.38,1.53.89,1.53,1.75,0,1-.8,1.74-2.18,1.74a3.33,3.33,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M68.64,118.67A3.78,3.78,0,0,1,67,119a2.76,2.76,0,0,1-2.89-3A3,3,0,0,1,67.2,113a3.45,3.45,0,0,1,1.47.3l-.24.81a2.53,2.53,0,0,0-1.23-.28,2,2,0,0,0-2,2.2,2,2,0,0,0,2,2.17,3,3,0,0,0,1.29-.29Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M69.88,114.9c0-.69,0-1.27,0-1.81h.93l0,1.13h0A1.75,1.75,0,0,1,72.45,113a1.36,1.36,0,0,1,.3,0v1a1.94,1.94,0,0,0-.36,0A1.47,1.47,0,0,0,71,115.3a3.68,3.68,0,0,0,0,.5v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M75,111.45a.66.66,0,0,1-1.31,0,.65.65,0,0,1,.66-.66A.63.63,0,0,1,75,111.45Zm-1.18,7.44v-5.8h1.06v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M76.66,115c0-.74,0-1.34,0-1.89h1l0,1h0A2.28,2.28,0,0,1,79.69,113c1.41,0,2.46,1.19,2.46,3,0,2.09-1.27,3.12-2.64,3.12a2,2,0,0,1-1.78-.91h0v3.15h-1Zm1,1.55a2.82,2.82,0,0,0,0,.43,1.63,1.63,0,0,0,1.58,1.23c1.12,0,1.77-.91,1.77-2.24,0-1.16-.61-2.16-1.73-2.16a1.7,1.7,0,0,0-1.6,1.31,2,2,0,0,0-.07.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M84.76,111.42v1.67h1.51v.8H84.76V117c0,.72.2,1.13.79,1.13a2.08,2.08,0,0,0,.61-.08l0,.8a2.69,2.69,0,0,1-.94.14,1.5,1.5,0,0,1-1.14-.44,2.22,2.22,0,0,1-.4-1.51v-3.17h-.9v-.8h.9v-1.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M88.63,111.45a.62.62,0,0,1-.67.65.63.63,0,0,1-.63-.65.64.64,0,0,1,.66-.66A.62.62,0,0,1,88.63,111.45Zm-1.17,7.44v-5.8h1.05v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M95.52,115.94A2.83,2.83,0,0,1,92.63,119a2.76,2.76,0,0,1-2.78-3A2.84,2.84,0,0,1,92.73,113,2.75,2.75,0,0,1,95.52,115.94Zm-4.61.06c0,1.27.74,2.23,1.77,2.23s1.76-1,1.76-2.25c0-1-.49-2.23-1.74-2.23S90.91,114.9,90.91,116Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M96.86,114.66c0-.6,0-1.1,0-1.57h.93l.06,1h0A2.13,2.13,0,0,1,99.75,113c.8,0,2,.48,2,2.47v3.47h-1.06v-3.35c0-.93-.35-1.71-1.34-1.71A1.5,1.5,0,0,0,98,114.91a1.45,1.45,0,0,0-.07.49v3.49h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M77,224.71a3.68,3.68,0,0,0,1.87.53c1.07,0,1.69-.57,1.69-1.38s-.43-1.19-1.52-1.61c-1.32-.47-2.13-1.15-2.13-2.29a2.32,2.32,0,0,1,2.61-2.19,3.73,3.73,0,0,1,1.79.39L81,219a3.25,3.25,0,0,0-1.54-.38c-1.1,0-1.52.66-1.52,1.21,0,.76.49,1.13,1.61,1.56,1.37.53,2.06,1.19,2.06,2.37s-.92,2.33-2.83,2.33a4.25,4.25,0,0,1-2.06-.51Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M87.84,224.4c0,.6,0,1.13,0,1.58H87L86.9,225h0A2.18,2.18,0,0,1,85,226.11c-.91,0-2-.5-2-2.54v-3.39H84v3.21c0,1.1.33,1.85,1.29,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.1-.54v-3.56h1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M89.55,226c0-.39,0-1,0-1.5v-7h1v3.64h0a2.15,2.15,0,0,1,2-1.07c1.44,0,2.46,1.2,2.45,3,0,2.07-1.31,3.1-2.6,3.1A2.06,2.06,0,0,1,90.55,225h0l-.05,1Zm1.09-2.33a2.3,2.3,0,0,0,0,.39,1.63,1.63,0,0,0,1.58,1.23c1.11,0,1.77-.9,1.77-2.23,0-1.16-.6-2.16-1.73-2.16a1.7,1.7,0,0,0-1.61,1.3,2.34,2.34,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M96.43,221.75c0-.6,0-1.09-.05-1.57h.92l0,.93h0A2,2,0,0,1,99.21,220a1.71,1.71,0,0,1,1.64,1.17h0a2.21,2.21,0,0,1,.64-.76,2,2,0,0,1,1.29-.41c.76,0,1.9.51,1.9,2.52V226h-1v-3.29c0-1.11-.41-1.78-1.26-1.78a1.34,1.34,0,0,0-1.24,1,1.63,1.63,0,0,0-.09.53V226h-1V222.5c0-.92-.41-1.59-1.21-1.59A1.45,1.45,0,0,0,97.54,222a1.49,1.49,0,0,0-.08.52V226h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M107.61,218.55a.62.62,0,0,1-.67.64.63.63,0,0,1-.64-.64.64.64,0,0,1,.66-.66A.62.62,0,0,1,107.61,218.55ZM106.43,226v-5.8h1.06V226Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M110.51,218.51v1.67H112v.8h-1.51v3.13c0,.72.21,1.13.79,1.13a2.78,2.78,0,0,0,.62-.07l0,.79a2.73,2.73,0,0,1-.94.14,1.49,1.49,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51V221h-.9v-.8h.9v-1.39Z"
  }))
}, {
  name: 'post-submission-form',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Post Submission Form'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Post Submission Form'),
  isPro: false,
  atts: {
    form: {
      "styles": {
        "gridTemplateColumns": {
          "Desktop": "1fr "
        },
        "gap": {
          "Desktop": "1em"
        },
        "display": {
          "Desktop": "grid"
        }
      },
      "options": {
        "type": "postSubmitForm"
      }
    },
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "gridTemplateColumns": {},
        "gap": {},
        "display": {}
      }
    },
    visible: {},
    onSubmit: {
      "0": {
        "id": "validation",
        "messages": []
      },
      "1": {
        "id": "submitConfirm",
        "messages": []
      }
    },
    onProcess: {
      "0": {
        "id": "postSubmit",
        "postType": "post",
        "showOnResponse": true,
        "postStatus": "pending",
        "commentStatus": "closed",
        "pingStatus": "closed",
        "authorByEmail": true
      },
      "1": {
        "id": "createEntry",
        "message": ""
      }
    },
    afterSubmit: {
      "0": {
        "id": "showResponse",
        "message": ""
      },
      "1": {
        "id": "refreshPage",
        "delay": "2000"
      }
    },
    blockId: "pg9d6a07354523",
    blockCssY: {
      "items": {
        ".pg9d6a07354523": {
          "grid-template-columns": {},
          "gap": {},
          "display": {}
        },
        ".pg9d6a07354523 form": {
          "grid-template-columns": {
            "Desktop": "1fr "
          },
          "gap": {
            "Desktop": "1em"
          },
          "display": {
            "Desktop": "grid"
          }
        }
      }
    }
  },
  innerBlocks: [['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Post Title",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "",
        "value": "",
        "name": "post_title",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Post title should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg8539be28243d",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {
          "background-color": {
            "Desktop": "#ececec"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "width": {
            "Desktop": "100%"
          }
        },
        ".pg8539be28243d .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-textarea', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Email",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your mail address",
        "value": "",
        "name": "email",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Email should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg9a328fd54a2e",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg9a328fd54a2e input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pg9a328fd54a2e .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        },
        ".pg9a328fd54a2e textarea": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }], ['post-grid/form-field-checkbox', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {}
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Post Category",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "value": null,
        "name": "post_categories",
        "required": false,
        "disabled": false,
        "multiple": false,
        "autofocus": null,
        "readonly": false,
        "args": {
          "0": {
            "label": "Category 1",
            "value": "category1",
            "readonly": false
          },
          "1": {
            "label": "Category 2",
            "value": "category2",
            "readonly": false
          },
          "2": {
            "label": "Category 3",
            "value": "category3",
            "readonly": false
          }
        },
        "argsSrc": {
          "src": "taxonomy"
        },
        "id": "",
        "class": "pg-form-field-checkbox",
        "postion": "afterLabel"
      },
      "styles": {}
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {}
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      },
      "styles": {}
    },
    blockId: "pgd631f4eba415",
    blockCssY: {
      "items": {}
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Post Tags",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "comma separate, ex: Tag 1, Tag 2",
        "value": "",
        "name": "post_tags",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pgbba272b1931d",
    blockCssY: {
      "items": {
        ".pgbba272b1931d input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        }
      }
    }
  }], ['post-grid/form-field-file', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {}
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      },
      "styles": {}
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Post Featured Image",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your name",
        "value": "",
        "name": "post_thumbnail",
        "required": false,
        "disabled": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "multiple": false,
        "maxCount": 3,
        "maxSize": null,
        "fileTypes": [".jpg", ".jpeg", ".png", ".gif", ".pdf"],
        "id": "",
        "class": "pg-form-field-file",
        "postion": "afterLabel"
      },
      "styles": {}
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      },
      "styles": {}
    },
    blockId: "pg95dcb32704af",
    blockCssY: {
      "items": {}
    }
  }], ['post-grid/form-field-textarea', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Email",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your mail address",
        "value": "",
        "name": "email",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Email should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg9a328fd54a2e",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg9a328fd54a2e input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pg9a328fd54a2e .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": false,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "submit",
        "placeholder": "Write your name",
        "value": "Submit",
        "name": "",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#51557E"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        },
        "color": {
          "Desktop": "#ffffff"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pg4670520d9df5",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg4670520d9df5 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#51557E"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "color": {
            "Desktop": "#ffffff"
          }
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 368.13 299.66"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.07",
    y: "8.02",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,42.46H6.26a3.2,3.2,0,0,1-3.2-3.19V10.22A3.21,3.21,0,0,1,6.26,7H361.87a3.2,3.2,0,0,1,3.19,3.2V39.27A3.19,3.19,0,0,1,361.87,42.46ZM6.26,9a1.2,1.2,0,0,0-1.2,1.2V39.27a1.19,1.19,0,0,0,1.2,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19V10.22A1.19,1.19,0,0,0,361.87,9Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.07",
    y: "104.96",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,139.39H6.26a3.2,3.2,0,0,1-3.2-3.19v-29A3.2,3.2,0,0,1,6.26,104H361.87a3.19,3.19,0,0,1,3.19,3.19v29A3.19,3.19,0,0,1,361.87,139.39ZM6.26,106a1.19,1.19,0,0,0-1.2,1.19v29a1.19,1.19,0,0,0,1.2,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19v-29a1.19,1.19,0,0,0-1.19-1.19Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.07",
    y: "152.59",
    width: "360",
    height: "86.66",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,240.25H6.26a3.2,3.2,0,0,1-3.2-3.19V154.79a3.21,3.21,0,0,1,3.2-3.2H361.87a3.2,3.2,0,0,1,3.19,3.2v82.27A3.19,3.19,0,0,1,361.87,240.25ZM6.26,153.59a1.2,1.2,0,0,0-1.2,1.2v82.27a1.19,1.19,0,0,0,1.2,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19V154.79a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M18.09,20.28a11.33,11.33,0,0,1,2-.16,3.34,3.34,0,0,1,2.27.67,2.19,2.19,0,0,1,.71,1.69,2.37,2.37,0,0,1-.63,1.73A3.34,3.34,0,0,1,20,25.1a3.61,3.61,0,0,1-.84-.07v3.24h-1Zm1,3.9a3.58,3.58,0,0,0,.87.08c1.25,0,2-.61,2-1.73S21.27,21,20.12,21a5.05,5.05,0,0,0-1,.08Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29.39,25.32A2.84,2.84,0,0,1,26.5,28.4a2.76,2.76,0,0,1-2.78-3,2.83,2.83,0,0,1,2.88-3.08A2.75,2.75,0,0,1,29.39,25.32Zm-4.61.06c0,1.27.74,2.23,1.77,2.23s1.76-.95,1.76-2.26c0-1-.49-2.23-1.74-2.23S24.78,24.27,24.78,25.38Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M30.58,27.19a2.79,2.79,0,0,0,1.39.42c.77,0,1.13-.39,1.13-.87S32.8,26,32,25.68c-1-.38-1.54-.95-1.54-1.65a1.8,1.8,0,0,1,2-1.7,2.9,2.9,0,0,1,1.42.36l-.26.77a2.22,2.22,0,0,0-1.19-.34c-.62,0-1,.36-1,.79s.35.7,1.11,1c1,.38,1.52.88,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.27,3.27,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M36.75,20.79v1.67h1.51v.8H36.75v3.13c0,.72.2,1.13.79,1.13a2.21,2.21,0,0,0,.61-.07l.05.79a2.48,2.48,0,0,1-.94.15,1.47,1.47,0,0,1-1.14-.45,2.15,2.15,0,0,1-.4-1.51V23.26h-.9v-.8h.9V21.07Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M43.07,21.07H40.61v-.89h6v.89H44.13v7.2H43.07Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M48.5,20.83a.63.63,0,0,1-.68.65.63.63,0,0,1-.63-.65.64.64,0,0,1,.66-.66A.63.63,0,0,1,48.5,20.83Zm-1.18,7.44V22.46h1.06v5.81Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M51.4,20.79v1.67h1.51v.8H51.4v3.13c0,.72.2,1.13.79,1.13a2.15,2.15,0,0,0,.61-.07l.05.79a2.42,2.42,0,0,1-.93.15,1.45,1.45,0,0,1-1.14-.45,2.15,2.15,0,0,1-.41-1.51V23.26h-.9v-.8h.9V21.07Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.1,19.75h1.06v8.52H54.1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M57.52,25.55a1.86,1.86,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76a4.84,4.84,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4.49,4.49,0,0,1,0,.49Zm3.09-.75a1.5,1.5,0,0,0-1.46-1.72,1.76,1.76,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.07",
    y: "56.49",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,90.93H6.26a3.2,3.2,0,0,1-3.2-3.2v-29a3.2,3.2,0,0,1,3.2-3.2H361.87a3.19,3.19,0,0,1,3.19,3.2v29A3.19,3.19,0,0,1,361.87,90.93ZM6.26,57.49a1.2,1.2,0,0,0-1.2,1.2v29a1.2,1.2,0,0,0,1.2,1.2H361.87a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M17.94,75.46a3.72,3.72,0,0,0,1.88.53c1.06,0,1.69-.57,1.69-1.38S21.07,73.42,20,73c-1.32-.47-2.13-1.15-2.13-2.29a2.32,2.32,0,0,1,2.61-2.19,3.73,3.73,0,0,1,1.79.39l-.29.85a3.24,3.24,0,0,0-1.53-.38c-1.11,0-1.53.66-1.53,1.21,0,.76.5,1.13,1.61,1.56,1.37.53,2.06,1.19,2.06,2.37s-.92,2.33-2.83,2.33a4.25,4.25,0,0,1-2.06-.51Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M24.63,74a1.86,1.86,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.72,4.72,0,0,1-1.94.36,2.69,2.69,0,0,1-2.85-2.92c0-1.76,1-3.13,2.72-3.13a2.45,2.45,0,0,1,2.4,2.73,4.68,4.68,0,0,1,0,.49Zm3.09-.76a1.5,1.5,0,0,0-1.46-1.71,1.74,1.74,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M30.05,68.22h1.06v8.51H30.05Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M33.47,74a1.87,1.87,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.69,2.69,0,0,1-2.86-2.92c0-1.76,1-3.13,2.73-3.13a2.46,2.46,0,0,1,2.4,2.73,4.15,4.15,0,0,1,0,.49Zm3.1-.76a1.5,1.5,0,0,0-1.47-1.71,1.76,1.76,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M43,76.52a3.9,3.9,0,0,1-1.66.33,2.76,2.76,0,0,1-2.89-3,2.94,2.94,0,0,1,3.12-3.08,3.44,3.44,0,0,1,1.46.3l-.24.81a2.5,2.5,0,0,0-1.22-.27,2.18,2.18,0,0,0,0,4.36,2.86,2.86,0,0,0,1.29-.29Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M45.7,69.26v1.67h1.51v.8H45.7v3.13c0,.72.2,1.13.79,1.13a2.6,2.6,0,0,0,.61-.07l0,.79a2.67,2.67,0,0,1-.93.14,1.44,1.44,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51V71.73h-.9v-.8h.9V69.54Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M56.63,76.47a5.25,5.25,0,0,1-2.14.38,3.78,3.78,0,0,1-4-4.09,4,4,0,0,1,4.22-4.24,4.26,4.26,0,0,1,1.92.36l-.25.85a3.84,3.84,0,0,0-1.63-.34,3,3,0,0,0-3.16,3.34A2.94,2.94,0,0,0,54.71,76a4.21,4.21,0,0,0,1.7-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M61,76.73,61,76h0a2.13,2.13,0,0,1-1.77.86,1.65,1.65,0,0,1-1.78-1.66c0-1.41,1.25-2.17,3.49-2.16v-.12a1.2,1.2,0,0,0-1.32-1.35A2.84,2.84,0,0,0,58,72l-.24-.7a3.63,3.63,0,0,1,1.91-.51c1.78,0,2.21,1.21,2.21,2.37v2.17A8.39,8.39,0,0,0,62,76.73Zm-.15-3c-1.15,0-2.46.18-2.46,1.31a.93.93,0,0,0,1,1,1.45,1.45,0,0,0,1.41-1,1.36,1.36,0,0,0,.06-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M64.83,69.26v1.67h1.51v.8H64.83v3.13c0,.72.2,1.13.79,1.13a2.68,2.68,0,0,0,.61-.07l0,.79a2.73,2.73,0,0,1-.94.14,1.45,1.45,0,0,1-1.14-.44,2.15,2.15,0,0,1-.4-1.51V71.73h-.9v-.8h.9V69.54Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M68,74a1.87,1.87,0,0,0,2,2,3.92,3.92,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36A2.69,2.69,0,0,1,67,73.93c0-1.76,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4.15,4.15,0,0,1,0,.49Zm3.1-.76a1.5,1.5,0,0,0-1.47-1.71,1.74,1.74,0,0,0-1.61,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M78.47,70.93c0,.42,0,.88,0,1.59v3.37a3.31,3.31,0,0,1-.83,2.65,3.06,3.06,0,0,1-2.11.7,3.78,3.78,0,0,1-1.93-.48l.26-.81a3.31,3.31,0,0,0,1.71.46c1.08,0,1.87-.56,1.87-2v-.64h0a2.08,2.08,0,0,1-1.85,1,2.6,2.6,0,0,1-2.47-2.83,2.78,2.78,0,0,1,2.61-3.08,1.92,1.92,0,0,1,1.81,1h0l0-.87Zm-1.09,2.29a1.44,1.44,0,0,0-.06-.48,1.53,1.53,0,0,0-1.48-1.12c-1,0-1.73.85-1.73,2.2,0,1.14.58,2.08,1.72,2.08a1.52,1.52,0,0,0,1.46-1.08,1.82,1.82,0,0,0,.09-.56Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M85.43,73.78a2.83,2.83,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.78-3,2.83,2.83,0,0,1,2.87-3.08A2.75,2.75,0,0,1,85.43,73.78Zm-4.61.06c0,1.27.74,2.23,1.77,2.23s1.76-.95,1.76-2.25c0-1-.49-2.23-1.74-2.23S80.82,72.74,80.82,73.84Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M86.76,72.74c0-.69,0-1.27,0-1.81h.92l0,1.14h0a1.75,1.75,0,0,1,1.61-1.27,1.39,1.39,0,0,1,.3,0v1a1.32,1.32,0,0,0-.36,0,1.49,1.49,0,0,0-1.42,1.36,3.47,3.47,0,0,0,0,.49v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M91.91,69.3a.62.62,0,0,1-.67.64.63.63,0,0,1-.64-.64.64.64,0,0,1,.66-.66A.62.62,0,0,1,91.91,69.3Zm-1.18,7.43v-5.8h1.06v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M93.4,75.65a2.69,2.69,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.54-1-1.54-1.64a1.79,1.79,0,0,1,2-1.7,2.9,2.9,0,0,1,1.42.35l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.39,1.53.89,1.53,1.75,0,1-.79,1.74-2.17,1.74a3.27,3.27,0,0,1-1.63-.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M22.27,121.41H19.13v2.91h3.5v.88H18.09v-8.09h4.36V118H19.13v2.55h3.14Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M24,121c0-.6,0-1.09-.05-1.57h.92l.05.94h0a2,2,0,0,1,1.82-1.07,1.71,1.71,0,0,1,1.64,1.16h0a2.39,2.39,0,0,1,.64-.75,2,2,0,0,1,1.29-.41c.76,0,1.9.5,1.9,2.52v3.42h-1v-3.29c0-1.11-.41-1.79-1.26-1.79a1.37,1.37,0,0,0-1.24,1,1.73,1.73,0,0,0-.09.53v3.59h-1v-3.48c0-.92-.41-1.6-1.21-1.6A1.56,1.56,0,0,0,25,121.7v3.5H24Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M37.18,125.2l-.08-.73h0a2.19,2.19,0,0,1-1.78.86,1.65,1.65,0,0,1-1.77-1.67c0-1.4,1.25-2.17,3.49-2.16v-.12A1.19,1.19,0,0,0,35.68,120a2.93,2.93,0,0,0-1.51.43l-.24-.69a3.52,3.52,0,0,1,1.91-.52c1.77,0,2.2,1.21,2.2,2.38v2.17a8.4,8.4,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.3a.94.94,0,0,0,1,1,1.44,1.44,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M40.92,117.76a.62.62,0,0,1-.67.65.63.63,0,0,1-.63-.65.64.64,0,0,1,.66-.66A.62.62,0,0,1,40.92,117.76Zm-1.17,7.44v-5.81h1v5.81Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M42.56,116.68h1v8.52h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M49.27,122.66l-.83,2.54H47.36l2.74-8.09h1.26l2.76,8.09H53l-.87-2.54Zm2.66-.82-.8-2.33c-.18-.52-.3-1-.42-1.47h0c-.12.48-.25,1-.41,1.46l-.79,2.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M60.14,116.68v7c0,.51,0,1.1,0,1.5h-.94l0-1h0a2.14,2.14,0,0,1-2,1.14c-1.4,0-2.48-1.19-2.48-3,0-1.93,1.19-3.12,2.6-3.12a2,2,0,0,1,1.76.89h0v-3.47Zm-1,5.08a1.68,1.68,0,0,0-.05-.45,1.54,1.54,0,0,0-1.52-1.22c-1.09,0-1.74,1-1.74,2.24s.57,2.15,1.71,2.15A1.59,1.59,0,0,0,59,123.22a1.71,1.71,0,0,0,.05-.46Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M66.91,116.68v7c0,.51,0,1.1,0,1.5H66l0-1h0a2.14,2.14,0,0,1-2,1.14c-1.4,0-2.48-1.19-2.48-3,0-1.93,1.19-3.12,2.6-3.12a1.93,1.93,0,0,1,1.75.89h0v-3.47Zm-1,5.08a1.68,1.68,0,0,0,0-.45,1.55,1.55,0,0,0-1.52-1.22c-1.09,0-1.74,1-1.74,2.24s.57,2.15,1.71,2.15a1.59,1.59,0,0,0,1.55-1.26,1.71,1.71,0,0,0,0-.46Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M68.67,121.2c0-.68,0-1.27,0-1.81h.92l0,1.14h0a1.74,1.74,0,0,1,1.6-1.27.91.91,0,0,1,.3,0v1a1.79,1.79,0,0,0-.36,0,1.47,1.47,0,0,0-1.41,1.35,2.46,2.46,0,0,0-.05.49v3.1h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M73.06,122.49a1.86,1.86,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76a4.67,4.67,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,4.88,4.88,0,0,1,0,.49Zm3.09-.76A1.49,1.49,0,0,0,74.69,120a1.75,1.75,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M78.34,124.12a2.79,2.79,0,0,0,1.39.42c.77,0,1.13-.39,1.13-.86s-.3-.79-1.08-1.07c-1-.37-1.54-1-1.54-1.65a1.8,1.8,0,0,1,2-1.7,2.9,2.9,0,0,1,1.42.36l-.26.77a2.22,2.22,0,0,0-1.19-.34c-.62,0-1,.36-1,.79s.35.7,1.1,1c1,.38,1.53.89,1.53,1.75,0,1-.79,1.74-2.17,1.74a3.27,3.27,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M83.09,124.12a2.82,2.82,0,0,0,1.39.42c.77,0,1.13-.39,1.13-.86s-.3-.79-1.08-1.07c-1-.37-1.53-1-1.53-1.65a1.79,1.79,0,0,1,2-1.7,2.94,2.94,0,0,1,1.43.36l-.27.77a2.19,2.19,0,0,0-1.19-.34c-.62,0-1,.36-1,.79s.35.7,1.11,1c1,.38,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.3,3.3,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M18.09,162.76a12.38,12.38,0,0,1,2-.16,3.34,3.34,0,0,1,2.27.67,2.22,2.22,0,0,1,.71,1.7,2.36,2.36,0,0,1-.63,1.72,3.34,3.34,0,0,1-2.47.89,3.61,3.61,0,0,1-.84-.07v3.24h-1Zm1,3.9a3.58,3.58,0,0,0,.87.08c1.25,0,2-.61,2-1.73s-.75-1.58-1.9-1.58a5.05,5.05,0,0,0-1,.08Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M29.39,167.8a2.84,2.84,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.78-3,2.83,2.83,0,0,1,2.88-3.08A2.75,2.75,0,0,1,29.39,167.8Zm-4.61.06c0,1.27.74,2.23,1.77,2.23s1.76-1,1.76-2.26c0-1-.49-2.23-1.74-2.23S24.78,166.75,24.78,167.86Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M30.58,169.67a2.79,2.79,0,0,0,1.39.42c.77,0,1.13-.39,1.13-.87s-.3-.78-1.08-1.06c-1-.38-1.54-.95-1.54-1.65a1.8,1.8,0,0,1,2-1.7,2.9,2.9,0,0,1,1.42.36l-.26.77a2.22,2.22,0,0,0-1.19-.34c-.62,0-1,.36-1,.79s.35.7,1.11,1c1,.38,1.52.88,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.27,3.27,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M36.75,163.27v1.67h1.51v.81H36.75v3.13c0,.72.2,1.12.79,1.12a2.21,2.21,0,0,0,.61-.07l.05.79a2.48,2.48,0,0,1-.94.15,1.47,1.47,0,0,1-1.14-.45,2.13,2.13,0,0,1-.4-1.51v-3.16h-.9v-.81h.9v-1.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M47.68,170.48a5.05,5.05,0,0,1-2.14.39,3.77,3.77,0,0,1-4-4.09,4,4,0,0,1,4.22-4.25,4.4,4.4,0,0,1,1.92.36l-.25.85a3.85,3.85,0,0,0-1.63-.33,3,3,0,0,0-3.16,3.33A2.94,2.94,0,0,0,45.76,170a4.25,4.25,0,0,0,1.7-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M54.07,167.8a2.84,2.84,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.78-3,2.83,2.83,0,0,1,2.88-3.08A2.74,2.74,0,0,1,54.07,167.8Zm-4.6.06c0,1.27.73,2.23,1.76,2.23s1.76-1,1.76-2.26c0-1-.49-2.23-1.74-2.23S49.47,166.75,49.47,167.86Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M55.41,166.51c0-.6,0-1.09,0-1.57h.94l.06,1h0a2.14,2.14,0,0,1,1.92-1.09c.8,0,2.05.48,2.05,2.47v3.47H59.29V167.4c0-.93-.34-1.71-1.34-1.71a1.5,1.5,0,0,0-1.41,1.07,1.54,1.54,0,0,0-.08.5v3.49H55.41Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M63.29,163.27v1.67H64.8v.81H63.29v3.13c0,.72.21,1.12.79,1.12a2.15,2.15,0,0,0,.61-.07l0,.79a2.39,2.39,0,0,1-.93.15,1.46,1.46,0,0,1-1.14-.45,2.13,2.13,0,0,1-.41-1.51v-3.16h-.9v-.81h.9v-1.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M66.51,168a1.85,1.85,0,0,0,2,2,3.83,3.83,0,0,0,1.61-.3l.18.76a4.72,4.72,0,0,1-1.94.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4.92,4.92,0,0,1,0,.5Zm3.09-.76a1.5,1.5,0,0,0-1.46-1.71,1.74,1.74,0,0,0-1.62,1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M71.93,166.51c0-.6,0-1.09-.05-1.57h.94l.06,1h0a2.14,2.14,0,0,1,1.92-1.09c.81,0,2.05.48,2.05,2.47v3.47H75.82V167.4c0-.93-.35-1.71-1.35-1.71a1.5,1.5,0,0,0-1.41,1.07,1.55,1.55,0,0,0-.07.5v3.49H71.93Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M79.81,163.27v1.67h1.52v.81H79.81v3.13c0,.72.21,1.12.8,1.12a2.21,2.21,0,0,0,.61-.07l0,.79a2.48,2.48,0,0,1-.94.15,1.46,1.46,0,0,1-1.14-.45,2.13,2.13,0,0,1-.41-1.51v-3.16h-.9v-.81h.9v-1.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#414042",
    x: "4.07",
    y: "256.56",
    width: "180",
    height: "35.07",
    rx: "3.24"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M64.79,276.35a3.68,3.68,0,0,0,1.87.53c1.07,0,1.69-.57,1.69-1.38s-.43-1.19-1.52-1.61c-1.32-.47-2.14-1.15-2.14-2.29a2.33,2.33,0,0,1,2.62-2.19,3.73,3.73,0,0,1,1.79.39l-.29.85a3.29,3.29,0,0,0-1.54-.38c-1.1,0-1.52.66-1.52,1.21,0,.76.49,1.13,1.61,1.56,1.36.53,2.06,1.19,2.06,2.37s-.92,2.33-2.83,2.33a4.13,4.13,0,0,1-2.06-.52Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M75.67,276c0,.6,0,1.13,0,1.58h-.94l-.06-.95h0a2.19,2.19,0,0,1-1.92,1.08c-.91,0-2-.5-2-2.54v-3.39h1V275c0,1.1.34,1.85,1.3,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.1-.54v-3.56h1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M77.38,277.62c0-.4.05-1,.05-1.5v-7h1v3.64h0a2.18,2.18,0,0,1,2-1.07c1.44,0,2.46,1.2,2.45,3,0,2.07-1.31,3.1-2.6,3.1a2.08,2.08,0,0,1-1.95-1.09h0l0,1Zm1.09-2.33a1.6,1.6,0,0,0,0,.39,1.62,1.62,0,0,0,1.58,1.23c1.1,0,1.76-.9,1.76-2.23,0-1.16-.6-2.16-1.72-2.16a1.7,1.7,0,0,0-1.61,1.3,2.34,2.34,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M84.25,273.39c0-.6,0-1.09,0-1.57h.92l.05.93h0A2,2,0,0,1,87,271.68a1.71,1.71,0,0,1,1.64,1.17h0a2.35,2.35,0,0,1,.65-.76,2,2,0,0,1,1.28-.41c.77,0,1.91.51,1.91,2.52v3.42h-1v-3.28c0-1.12-.41-1.79-1.26-1.79a1.36,1.36,0,0,0-1.25,1,2,2,0,0,0-.08.53v3.58h-1v-3.48c0-.92-.41-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1.05,1.49,1.49,0,0,0-.08.52v3.5h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M95.44,270.18a.66.66,0,0,1-1.31,0,.64.64,0,0,1,.66-.65A.62.62,0,0,1,95.44,270.18Zm-1.18,7.44v-5.8h1.06v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M98.34,270.15v1.67h1.51v.8H98.34v3.13c0,.72.21,1.13.79,1.13a2.6,2.6,0,0,0,.61-.07l.05.79a2.63,2.63,0,0,1-.93.14,1.45,1.45,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51v-3.17h-.9v-.8h.9v-1.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M103.62,269.63a12.81,12.81,0,0,1,2-.15,3.31,3.31,0,0,1,2.26.67,2.15,2.15,0,0,1,.71,1.69,2.42,2.42,0,0,1-.62,1.73,3.4,3.4,0,0,1-2.47.88,3.56,3.56,0,0,1-.84-.07v3.24h-1Zm1,3.9a3.38,3.38,0,0,0,.86.09c1.26,0,2-.62,2-1.73s-.76-1.59-1.91-1.59a4.11,4.11,0,0,0-1,.09Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M114.92,274.67a2.83,2.83,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.78-3,2.84,2.84,0,0,1,2.88-3.09A2.75,2.75,0,0,1,114.92,274.67Zm-4.6.06c0,1.27.73,2.23,1.76,2.23s1.76-.95,1.76-2.25c0-1-.49-2.23-1.74-2.23S110.32,273.63,110.32,274.73Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M116.11,276.54a2.76,2.76,0,0,0,1.4.42c.76,0,1.12-.38,1.12-.86s-.3-.78-1.08-1.07c-1-.37-1.53-.95-1.53-1.64a1.79,1.79,0,0,1,2-1.71,2.94,2.94,0,0,1,1.43.36l-.27.77a2.25,2.25,0,0,0-1.18-.33c-.63,0-1,.36-1,.79s.34.69,1.1,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M122.28,270.15v1.67h1.51v.8h-1.51v3.13c0,.72.2,1.13.79,1.13a2.6,2.6,0,0,0,.61-.07l0,.79a2.67,2.67,0,0,1-.93.14,1.45,1.45,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51v-3.17h-.9v-.8h.9v-1.39Z"
  }))
}, // {
//     name: 'reviews-form-1',
//     title: __('Reviews Form'),
//     description: __('Reviews Form'),
//     isPro: false,
//     innerBlocks: [
//         ['post-grid/form-field-input', {}],
//         ['post-grid/form-field-input', {}],
//     ],
//     scope: ['block'],
//     icon: (
//         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 368.13 299.66"><rect fill="#bcbec0" x="4.06" y="47.99" width="360" height="33.44" rx="2.2" /><path fill="#343738" d="M361.87,82.42H6.26a3.19,3.19,0,0,1-3.19-3.19V50.18A3.19,3.19,0,0,1,6.26,47H361.87a3.2,3.2,0,0,1,3.2,3.19V79.23A3.2,3.2,0,0,1,361.87,82.42ZM6.26,49a1.19,1.19,0,0,0-1.19,1.19V79.23a1.19,1.19,0,0,0,1.19,1.19H361.87a1.19,1.19,0,0,0,1.2-1.19V50.18a1.19,1.19,0,0,0-1.2-1.19Z" /><path fill="#231f20" d="M19.89,68.23V64.8l-2.56-4.66h1.19l1.14,2.23c.31.61.55,1.11.8,1.67h0c.23-.53.5-1.06.81-1.67l1.17-2.23h1.18l-2.71,4.64v3.45Z" /><path fill="#231f20" d="M28.89,65.28A2.84,2.84,0,0,1,26,68.36a2.76,2.76,0,0,1-2.79-3,2.84,2.84,0,0,1,2.88-3.08A2.75,2.75,0,0,1,28.89,65.28Zm-4.61.06c0,1.27.73,2.23,1.76,2.23s1.77-.95,1.77-2.26c0-1-.49-2.23-1.74-2.23S24.28,64.23,24.28,65.34Z" /><path fill="#231f20" d="M35.08,66.64c0,.6,0,1.13.05,1.59h-.94l-.06-1h0a2.19,2.19,0,0,1-1.92,1.08c-.91,0-2-.51-2-2.54v-3.4h1v3.22c0,1.1.34,1.84,1.3,1.84a1.53,1.53,0,0,0,1.39-1A1.49,1.49,0,0,0,34,66V62.42h1.06Z" /><path fill="#231f20" d="M36.83,64.23c0-.68,0-1.27,0-1.81h.93l0,1.14h0a1.75,1.75,0,0,1,1.61-1.27,1,1,0,0,1,.3,0v1a1.88,1.88,0,0,0-.36,0,1.5,1.5,0,0,0-1.42,1.36,3.47,3.47,0,0,0,0,.49v3.1H36.83Z" /><path fill="#231f20" d="M43.34,68.23V60.14h1.14l2.59,4.09a23.83,23.83,0,0,1,1.45,2.63h0c-.09-1.08-.12-2.07-.12-3.33V60.14h1v8.09H48.35l-2.57-4.11a27.32,27.32,0,0,1-1.51-2.69h0c.06,1,.08,2,.08,3.33v3.46Z" /><path fill="#231f20" d="M54.41,68.23l-.08-.74h0a2.15,2.15,0,0,1-1.77.87,1.66,1.66,0,0,1-1.78-1.67c0-1.4,1.25-2.17,3.49-2.16v-.12a1.19,1.19,0,0,0-1.32-1.34,2.93,2.93,0,0,0-1.51.43l-.24-.69a3.55,3.55,0,0,1,1.91-.52c1.77,0,2.2,1.21,2.2,2.37v2.17a8.44,8.44,0,0,0,.1,1.4Zm-.16-3c-1.15,0-2.45.18-2.45,1.31a.93.93,0,0,0,1,1,1.45,1.45,0,0,0,1.41-1,1.33,1.33,0,0,0,0-.34Z" /><path fill="#231f20" d="M57,64c0-.6,0-1.09,0-1.57h.93l0,.94h0a2,2,0,0,1,1.82-1.07,1.72,1.72,0,0,1,1.65,1.16h0a2.42,2.42,0,0,1,.65-.75,2,2,0,0,1,1.28-.41c.77,0,1.91.5,1.91,2.52v3.42h-1V64.94c0-1.12-.41-1.79-1.26-1.79a1.38,1.38,0,0,0-1.25,1,1.74,1.74,0,0,0-.08.53v3.59h-1V64.75c0-.93-.41-1.6-1.22-1.6a1.43,1.43,0,0,0-1.3,1.06,1.4,1.4,0,0,0-.09.51v3.51H57Z" /><path fill="#231f20" d="M67.58,65.52a1.85,1.85,0,0,0,2,2,3.75,3.75,0,0,0,1.6-.3l.18.76a4.8,4.8,0,0,1-1.93.36,2.7,2.7,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13A2.46,2.46,0,0,1,71.69,65a2.85,2.85,0,0,1,0,.5Zm3.09-.76A1.5,1.5,0,0,0,69.21,63a1.75,1.75,0,0,0-1.62,1.72Z" /><rect fill="#bcbec0" x="4.06" y="96.45" width="360" height="33.44" rx="2.2" /><path fill="#343738" d="M361.87,130.89H6.26a3.19,3.19,0,0,1-3.19-3.2v-29a3.19,3.19,0,0,1,3.19-3.2H361.87a3.2,3.2,0,0,1,3.2,3.2v29A3.2,3.2,0,0,1,361.87,130.89ZM6.26,97.45a1.19,1.19,0,0,0-1.19,1.2v29a1.19,1.19,0,0,0,1.19,1.2H361.87a1.2,1.2,0,0,0,1.2-1.2v-29a1.2,1.2,0,0,0-1.2-1.2Z" /><path fill="#231f20" d="M22.28,112.9H19.13v2.92h3.5v.87H18.09v-8.08h4.36v.87H19.13V112h3.15Z" /><path fill="#231f20" d="M24,112.46c0-.6,0-1.09-.05-1.57h.92l.05.93h0a2,2,0,0,1,1.82-1.06,1.71,1.71,0,0,1,1.64,1.16h0a2.44,2.44,0,0,1,.64-.76,2,2,0,0,1,1.29-.4c.77,0,1.9.5,1.9,2.51v3.42h-1v-3.28c0-1.12-.4-1.79-1.26-1.79a1.35,1.35,0,0,0-1.24,1,1.63,1.63,0,0,0-.09.53v3.58h-1v-3.48c0-.92-.41-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1,1.49,1.49,0,0,0-.08.52v3.5H24Z" /><path fill="#231f20" d="M37.18,116.69,37.1,116h0a2.15,2.15,0,0,1-1.78.86,1.65,1.65,0,0,1-1.77-1.66c0-1.41,1.25-2.17,3.49-2.16v-.12a1.19,1.19,0,0,0-1.32-1.34,2.84,2.84,0,0,0-1.51.43l-.24-.7a3.61,3.61,0,0,1,1.91-.51c1.77,0,2.2,1.21,2.2,2.37v2.17a8.32,8.32,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.45.18-2.45,1.31a.93.93,0,0,0,1,1,1.43,1.43,0,0,0,1.4-1,.92.92,0,0,0,.06-.33Z" /><path fill="#231f20" d="M40.92,109.26a.65.65,0,0,1-1.3,0,.64.64,0,0,1,.66-.66A.62.62,0,0,1,40.92,109.26Zm-1.17,7.43v-5.8h1v5.8Z" /><path fill="#231f20" d="M42.56,108.18h1v8.51h-1Z" /><path fill="#231f20" d="M49.28,114.15l-.84,2.54H47.36l2.74-8.08h1.26l2.76,8.08H53l-.87-2.54Zm2.65-.82-.8-2.32a15.27,15.27,0,0,1-.41-1.48h0c-.12.48-.25,1-.41,1.47l-.79,2.33Z" /><path fill="#231f20" d="M60.15,108.18v7c0,.52,0,1.11,0,1.5h-.94l0-1h0a2.13,2.13,0,0,1-2,1.14c-1.41,0-2.49-1.18-2.49-2.95,0-1.93,1.19-3.11,2.61-3.11a2,2,0,0,1,1.75.88h0v-3.46Zm-1.06,5.07a1.65,1.65,0,0,0-.05-.44,1.54,1.54,0,0,0-1.52-1.23c-1.09,0-1.74,1-1.74,2.25S56.36,116,57.5,116a1.67,1.67,0,0,0,1.59-1.71Z" /><path fill="#231f20" d="M66.91,108.18v7c0,.52,0,1.11,0,1.5H66l0-1h0a2.14,2.14,0,0,1-2,1.14c-1.4,0-2.48-1.18-2.48-2.95,0-1.93,1.19-3.11,2.6-3.11a1.94,1.94,0,0,1,1.75.88h0v-3.46Zm-1,5.07a1.65,1.65,0,0,0,0-.44,1.54,1.54,0,0,0-1.52-1.23c-1.09,0-1.74,1-1.74,2.25s.57,2.14,1.71,2.14a1.67,1.67,0,0,0,1.6-1.71Z" /><path fill="#231f20" d="M68.67,112.7c0-.68,0-1.27,0-1.81h.92l0,1.14h0a1.74,1.74,0,0,1,1.61-1.27,1.23,1.23,0,0,1,.29,0v1a1.2,1.2,0,0,0-.35,0,1.47,1.47,0,0,0-1.42,1.36,3.37,3.37,0,0,0-.05.49v3.09h-1Z" /><path fill="#231f20" d="M73.06,114a1.86,1.86,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.69,2.69,0,0,1-2.86-2.92c0-1.76,1-3.13,2.73-3.13a2.45,2.45,0,0,1,2.39,2.73,4.68,4.68,0,0,1,0,.49Zm3.1-.75a1.51,1.51,0,0,0-1.47-1.72,1.75,1.75,0,0,0-1.62,1.72Z" /><path fill="#231f20" d="M78.34,115.61a2.69,2.69,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.54-.95-1.54-1.64a1.79,1.79,0,0,1,2-1.7,2.83,2.83,0,0,1,1.43.36l-.27.76a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.11,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.3,3.3,0,0,1-1.63-.39Z" /><path fill="#231f20" d="M83.09,115.61a2.75,2.75,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.53-.95-1.53-1.64a1.78,1.78,0,0,1,2-1.7,2.83,2.83,0,0,1,1.43.36l-.27.76a2.25,2.25,0,0,0-1.18-.33c-.63,0-1,.36-1,.79s.35.69,1.11,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.3,3.3,0,0,1-1.63-.39Z" /><rect fill="#bcbec0" x="4.06" y="147.2" width="360" height="86.66" rx="2.2" /><path fill="#343738" d="M361.87,234.86H6.26a3.2,3.2,0,0,1-3.19-3.2V149.39a3.19,3.19,0,0,1,3.19-3.19H361.87a3.2,3.2,0,0,1,3.2,3.19v82.27A3.21,3.21,0,0,1,361.87,234.86ZM6.26,148.2a1.19,1.19,0,0,0-1.19,1.19v82.27a1.19,1.19,0,0,0,1.19,1.2H361.87a1.2,1.2,0,0,0,1.2-1.2V149.39a1.2,1.2,0,0,0-1.2-1.19Z" /><path fill="#231f20" d="M19.41,165.35l-2.05-8.08h1.1l1,4.09c.24,1,.46,2,.6,2.79h0c.14-.8.39-1.76.66-2.8l1.08-4.08h1.09l1,4.1c.23,1,.44,1.92.56,2.77h0c.16-.89.39-1.79.64-2.79l1.07-4.08h1.07l-2.29,8.08H23.85l-1-4.21a22.78,22.78,0,0,1-.53-2.64h0a26.42,26.42,0,0,1-.63,2.64l-1.15,4.21Z" /><path fill="#231f20" d="M28,161.36c0-.69,0-1.27,0-1.81h.92l0,1.14h0a1.76,1.76,0,0,1,1.61-1.28,1.36,1.36,0,0,1,.3,0v1a1.32,1.32,0,0,0-.36,0,1.47,1.47,0,0,0-1.41,1.36,2.38,2.38,0,0,0-.05.49v3.09H28Z" /><path fill="#231f20" d="M33.16,157.91a.62.62,0,0,1-.67.65.63.63,0,0,1-.64-.65.64.64,0,0,1,.66-.65A.62.62,0,0,1,33.16,157.91ZM32,165.35v-5.8H33v5.8Z" /><path fill="#231f20" d="M36.06,157.88v1.67h1.52v.8H36.06v3.13c0,.72.21,1.13.8,1.13a2.68,2.68,0,0,0,.61-.07l.05.79a2.73,2.73,0,0,1-.94.14,1.45,1.45,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51v-3.17h-.9v-.8H35v-1.39Z" /><path fill="#231f20" d="M39.28,162.64a1.86,1.86,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.73-3.13a2.46,2.46,0,0,1,2.39,2.74,4.68,4.68,0,0,1,0,.49Zm3.09-.76a1.49,1.49,0,0,0-1.46-1.71,1.75,1.75,0,0,0-1.62,1.71Z" /><path fill="#231f20" d="M48.53,165.35v-3.43L46,157.27h1.18l1.14,2.23c.32.61.56,1.1.81,1.67h0c.23-.53.51-1.06.82-1.67l1.16-2.23H52.3l-2.71,4.64v3.44Z" /><path fill="#231f20" d="M57.53,162.4a2.83,2.83,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.78-3,2.84,2.84,0,0,1,2.88-3.09A2.76,2.76,0,0,1,57.53,162.4Zm-4.61.06c0,1.27.74,2.23,1.77,2.23s1.76-.95,1.76-2.25c0-1-.49-2.23-1.74-2.23S52.92,161.36,52.92,162.46Z" /><path fill="#231f20" d="M63.72,163.77c0,.6,0,1.13.05,1.58h-.94l0-.95h0a2.19,2.19,0,0,1-1.92,1.08c-.91,0-2-.5-2-2.54v-3.39h1.05v3.21c0,1.1.34,1.85,1.3,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.1-.54v-3.56h1Z" /><path fill="#231f20" d="M65.48,161.36c0-.69,0-1.27,0-1.81h.92l0,1.14h0a1.75,1.75,0,0,1,1.6-1.28,1.28,1.28,0,0,1,.3,0v1a1.23,1.23,0,0,0-.36,0,1.47,1.47,0,0,0-1.41,1.36,2.38,2.38,0,0,0,0,.49v3.09h-1Z" /><path fill="#231f20" d="M77.63,165.09a5.2,5.2,0,0,1-2.13.38,3.78,3.78,0,0,1-4-4.09,4,4,0,0,1,4.22-4.24,4.22,4.22,0,0,1,1.92.36l-.25.85a3.84,3.84,0,0,0-1.63-.34,3,3,0,0,0-3.15,3.34,2.94,2.94,0,0,0,3.1,3.25,4.21,4.21,0,0,0,1.7-.34Z" /><path fill="#231f20" d="M84,162.4a2.83,2.83,0,0,1-2.89,3.08,2.76,2.76,0,0,1-2.79-3,2.84,2.84,0,0,1,2.88-3.09A2.76,2.76,0,0,1,84,162.4Zm-4.61.06c0,1.27.73,2.23,1.76,2.23s1.77-.95,1.77-2.25c0-1-.5-2.23-1.74-2.23S79.42,161.36,79.42,162.46Z" /><path fill="#231f20" d="M85.36,161.12c0-.6,0-1.09,0-1.57h.93l0,.93h0a2,2,0,0,1,1.82-1.07,1.72,1.72,0,0,1,1.65,1.17h0a2.35,2.35,0,0,1,.65-.76,2,2,0,0,1,1.28-.41c.77,0,1.91.51,1.91,2.52v3.42h-1v-3.28c0-1.12-.41-1.79-1.26-1.79a1.36,1.36,0,0,0-1.25,1,1.64,1.64,0,0,0-.08.53v3.58H89v-3.48c0-.92-.41-1.59-1.22-1.59a1.43,1.43,0,0,0-1.3,1.05,1.5,1.5,0,0,0-.09.52v3.5h-1Z" /><path fill="#231f20" d="M95.37,161.12c0-.6,0-1.09-.05-1.57h.92l.05.93h0a2,2,0,0,1,1.82-1.07,1.71,1.71,0,0,1,1.64,1.17h0a2.35,2.35,0,0,1,.65-.76,2,2,0,0,1,1.28-.41c.77,0,1.91.51,1.91,2.52v3.42h-1v-3.28c0-1.12-.4-1.79-1.25-1.79a1.36,1.36,0,0,0-1.25,1,1.63,1.63,0,0,0-.09.53v3.58H99v-3.48c0-.92-.4-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1.05,1.49,1.49,0,0,0-.08.52v3.5h-1Z" /><path fill="#231f20" d="M106,162.64a1.87,1.87,0,0,0,2,2,3.92,3.92,0,0,0,1.61-.3l.18.75a4.63,4.63,0,0,1-1.93.36,2.69,2.69,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.47,2.47,0,0,1,2.4,2.74,4.15,4.15,0,0,1,0,.49Zm3.1-.76a1.5,1.5,0,0,0-1.46-1.71,1.74,1.74,0,0,0-1.62,1.71Z" /><path fill="#231f20" d="M111.39,161.12c0-.6,0-1.09,0-1.57h.94l.06,1h0a2.13,2.13,0,0,1,1.92-1.1c.8,0,2,.48,2,2.47v3.47h-1V162c0-.93-.35-1.71-1.35-1.71a1.5,1.5,0,0,0-1.41,1.08,1.45,1.45,0,0,0-.07.49v3.49h-1.06Z" /><path fill="#231f20" d="M119.27,157.88v1.67h1.51v.8h-1.51v3.13c0,.72.21,1.13.79,1.13a2.78,2.78,0,0,0,.62-.07l0,.79a2.63,2.63,0,0,1-.93.14,1.45,1.45,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51v-3.17h-.9v-.8h.9v-1.39Z" /><rect fill="#414042" x="4.06" y="251.17" width="180" height="35.07" rx="3.24" /><path fill="#fff" d="M50.48,271a3.75,3.75,0,0,0,1.87.52c1.06,0,1.69-.56,1.69-1.38s-.43-1.18-1.52-1.6c-1.32-.47-2.14-1.16-2.14-2.29A2.33,2.33,0,0,1,53,264a3.6,3.6,0,0,1,1.79.4l-.29.85a3.11,3.11,0,0,0-1.53-.39c-1.1,0-1.52.66-1.52,1.22,0,.75.49,1.12,1.6,1.55,1.37.53,2.07,1.19,2.07,2.38s-.93,2.33-2.83,2.33a4.18,4.18,0,0,1-2.07-.52Z" /><path fill="#fff" d="M61.36,270.64c0,.6,0,1.13,0,1.59h-.94l-.06-1h0a2.19,2.19,0,0,1-1.92,1.08c-.91,0-2-.51-2-2.54v-3.4h1.06v3.22c0,1.1.34,1.84,1.29,1.84a1.54,1.54,0,0,0,1.4-1,1.49,1.49,0,0,0,.09-.54v-3.56h1.06Z" /><path fill="#fff" d="M63.06,272.23c0-.4,0-1,0-1.5v-7h1v3.65h0a2.15,2.15,0,0,1,2-1.07c1.44,0,2.46,1.2,2.45,3,0,2.08-1.31,3.11-2.61,3.11a2.07,2.07,0,0,1-1.94-1.09h0l0,1Zm1.1-2.33a2.33,2.33,0,0,0,0,.38,1.65,1.65,0,0,0,1.59,1.24c1.1,0,1.76-.9,1.76-2.23,0-1.17-.6-2.16-1.73-2.16a1.69,1.69,0,0,0-1.61,1.29,2.55,2.55,0,0,0,0,.44Z" /><path fill="#fff" d="M69.94,268c0-.6,0-1.09,0-1.57h.92l0,.94h0a2,2,0,0,1,1.82-1.07,1.74,1.74,0,0,1,1.65,1.16h0a2.42,2.42,0,0,1,.65-.75,1.93,1.93,0,0,1,1.28-.41c.77,0,1.91.5,1.91,2.52v3.42h-1v-3.29c0-1.11-.41-1.79-1.26-1.79a1.38,1.38,0,0,0-1.25,1,1.74,1.74,0,0,0-.08.53v3.59h-1v-3.48c0-.92-.4-1.6-1.21-1.6a1.45,1.45,0,0,0-1.31,1.06,1.4,1.4,0,0,0-.08.51v3.51h-1Z" /><path fill="#fff" d="M81.12,264.79a.65.65,0,1,1-1.3,0,.64.64,0,0,1,.66-.66A.62.62,0,0,1,81.12,264.79ZM80,272.23v-5.81h1v5.81Z" /><path fill="#fff" d="M84,264.75v1.67h1.51v.8H84v3.14c0,.72.2,1.12.79,1.12a2.21,2.21,0,0,0,.61-.07l0,.79a2.48,2.48,0,0,1-.94.15,1.47,1.47,0,0,1-1.14-.45,2.13,2.13,0,0,1-.4-1.51v-3.17h-.9v-.8H83V265Z" /><path fill="#fff" d="M89.31,264.25a10.66,10.66,0,0,1,2-.17,3.32,3.32,0,0,1,2.34.66,2,2,0,0,1,.63,1.54,2.13,2.13,0,0,1-1.52,2.06v0A2,2,0,0,1,94,270a12.89,12.89,0,0,0,.62,2.22H93.49a11,11,0,0,1-.54-1.94c-.24-1.11-.67-1.53-1.62-1.57h-1v3.51h-1Zm1,3.68h1.07c1.11,0,1.82-.61,1.82-1.53s-.75-1.5-1.86-1.51a4.3,4.3,0,0,0-1,.09Z" /><path fill="#fff" d="M99.09,272.23,99,271.5h0a2.16,2.16,0,0,1-1.77.86,1.65,1.65,0,0,1-1.77-1.67c0-1.4,1.24-2.17,3.49-2.16v-.12a1.2,1.2,0,0,0-1.32-1.34,3,3,0,0,0-1.52.43l-.24-.69a3.55,3.55,0,0,1,1.91-.52c1.78,0,2.21,1.21,2.21,2.37v2.17a8.52,8.52,0,0,0,.09,1.4Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.94.94,0,0,0,1,1,1.45,1.45,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z" /><path fill="#fff" d="M102.88,264.75v1.67h1.51v.8h-1.51v3.14c0,.72.2,1.12.79,1.12a2.15,2.15,0,0,0,.61-.07l0,.79a2.44,2.44,0,0,1-.94.15,1.47,1.47,0,0,1-1.14-.45,2.13,2.13,0,0,1-.4-1.51v-3.17H101v-.8h.9V265Z" /><path fill="#fff" d="M106.75,264.79a.62.62,0,0,1-.67.65.63.63,0,0,1-.63-.65.64.64,0,0,1,.66-.66A.62.62,0,0,1,106.75,264.79Zm-1.17,7.44v-5.81h1v5.81Z" /><path fill="#fff" d="M108.39,268c0-.6,0-1.09,0-1.57h.94l0,1h0a2.14,2.14,0,0,1,1.92-1.09c.8,0,2,.48,2,2.47v3.47h-1.06v-3.35c0-.94-.34-1.72-1.34-1.72a1.51,1.51,0,0,0-1.42,1.08,1.89,1.89,0,0,0-.07.5v3.49h-1Z" /><path fill="#fff" d="M120.05,266.42c0,.42,0,.89,0,1.6v3.37a3.32,3.32,0,0,1-.83,2.65,3.06,3.06,0,0,1-2.11.69,3.68,3.68,0,0,1-1.93-.48l.26-.8a3.31,3.31,0,0,0,1.71.46c1.08,0,1.87-.57,1.87-2v-.65h0a2.08,2.08,0,0,1-1.85,1,2.59,2.59,0,0,1-2.47-2.83,2.79,2.79,0,0,1,2.61-3.08,1.92,1.92,0,0,1,1.81,1h0l0-.88ZM119,268.71a1.47,1.47,0,0,0-.06-.48,1.53,1.53,0,0,0-1.48-1.11c-1,0-1.73.85-1.73,2.19,0,1.14.58,2.09,1.72,2.09a1.54,1.54,0,0,0,1.46-1.08,1.82,1.82,0,0,0,.09-.56Z" /><path fill="#f2ba65" d="M13.69,13.92l1.62,5a.72.72,0,0,0,.69.49h5.23a.73.73,0,0,1,.43,1.31l-4.24,3.07a.73.73,0,0,0-.26.81l1.62,5a.72.72,0,0,1-1.11.8l-4.24-3.07a.69.69,0,0,0-.84,0L8.35,30.36a.72.72,0,0,1-1.11-.8l1.62-5a.73.73,0,0,0-.26-.81L4.36,20.7a.73.73,0,0,1,.43-1.31H10a.73.73,0,0,0,.69-.49l1.62-5A.71.71,0,0,1,13.69,13.92Z" /><path fill="#f2ba65" d="M39,13.92l1.62,5a.71.71,0,0,0,.68.49h5.24A.72.72,0,0,1,47,20.7l-4.24,3.07a.74.74,0,0,0-.26.81l1.62,5a.72.72,0,0,1-1.11.8l-4.23-3.07a.71.71,0,0,0-.85,0l-4.24,3.07a.71.71,0,0,1-1.1-.8l1.62-5a.74.74,0,0,0-.26-.81L29.67,20.7a.72.72,0,0,1,.42-1.31h5.24A.71.71,0,0,0,36,18.9l1.62-5A.72.72,0,0,1,39,13.92Z" /><path fill="#f2ba65" d="M64.3,13.92l1.62,5a.72.72,0,0,0,.69.49h5.23a.73.73,0,0,1,.43,1.31L68,23.77a.73.73,0,0,0-.26.81l1.62,5a.72.72,0,0,1-1.11.8L64,27.29a.69.69,0,0,0-.84,0L59,30.36a.72.72,0,0,1-1.11-.8l1.62-5a.73.73,0,0,0-.26-.81L55,20.7a.73.73,0,0,1,.43-1.31h5.23a.72.72,0,0,0,.69-.49l1.62-5A.71.71,0,0,1,64.3,13.92Z" /><path fill="#f2ba65" d="M89.61,13.92l1.62,5a.71.71,0,0,0,.68.49h5.24a.72.72,0,0,1,.42,1.31l-4.24,3.07a.74.74,0,0,0-.26.81l1.62,5a.71.71,0,0,1-1.1.8l-4.24-3.07a.71.71,0,0,0-.85,0l-4.23,3.07a.72.72,0,0,1-1.11-.8l1.62-5a.74.74,0,0,0-.26-.81L80.28,20.7a.72.72,0,0,1,.42-1.31h5.24a.71.71,0,0,0,.68-.49l1.62-5A.72.72,0,0,1,89.61,13.92Z" /><path fill="#f2ba65" d="M114.91,13.92l1.62,5a.73.73,0,0,0,.69.49h5.23a.73.73,0,0,1,.43,1.31l-4.24,3.07a.73.73,0,0,0-.26.81l1.62,5a.72.72,0,0,1-1.11.8l-4.24-3.07a.69.69,0,0,0-.84,0l-4.24,3.07a.72.72,0,0,1-1.11-.8l1.62-5a.73.73,0,0,0-.26-.81l-4.24-3.07a.73.73,0,0,1,.43-1.31h5.23a.72.72,0,0,0,.69-.49l1.62-5A.71.71,0,0,1,114.91,13.92Z" /></svg>
//     ),
// },
// {
//     name: 'form-10',
//     title: __('Job Application Form'),
//     description: __('Job Application Form'),
//     isPro: false,
//     innerBlocks: [
//         ['post-grid/form-field-input', {}],
//         ['post-grid/form-field-input', {}],
//     ],
//     scope: ['block'],
//     icon: (
//         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 80"><rect fill="#1d4ed8" x="41.67" y="13.33" width="76.67" height="23.34" /><rect fill="#1d4ed8" x="41.67" y="43.33" width="76.67" height="23.34" /></svg>
//     ),
// },
{
  name: 'form-11',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('OptIn form'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('OptIn form'),
  isPro: false,
  atts: {
    form: {
      "type": "optInForm",
      "styles": {
        "gridTemplateColumns": {
          "Desktop": "1fr "
        },
        "gap": {
          "Desktop": "1em"
        },
        "display": {
          "Desktop": "grid"
        }
      },
      "options": {
        "type": "optInForm"
      }
    },
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "gridTemplateColumns": {},
        "gap": {},
        "display": {}
      }
    },
    visible: {},
    onSubmit: {
      "0": {
        "id": "validation",
        "messages": []
      },
      "1": {
        "id": "submitConfirm",
        "messages": []
      }
    },
    onProcess: {
      "0": {
        "id": "fluentcrmAddContact",
        "lists": [],
        "tags": [],
        "message": "",
        "showOnResponse": false
      }
    },
    afterSubmit: {
      "0": {
        "id": "showMessage",
        "message": ""
      }
    },
    blockId: "pg9d6a07354523",
    blockCssY: {
      "items": {
        ".pg9d6a07354523": {
          "grid-template-columns": {},
          "gap": {},
          "display": {}
        },
        ".pg9d6a07354523 form": {
          "grid-template-columns": {
            "Desktop": "1fr "
          },
          "gap": {
            "Desktop": "1em"
          },
          "display": {
            "Desktop": "grid"
          }
        }
      }
    }
  },
  innerBlocks: [['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Email",
        "class": "pg-form-field-label"
      },
      "styles": {}
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "Write your mail address",
        "value": "",
        "name": "email",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Email should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg9a328fd54a2e",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg9a328fd54a2e input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#ececec"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          }
        },
        ".pg9a328fd54a2e .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": true,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "text",
        "placeholder": "",
        "value": "",
        "name": "first_name",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#ececec"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "Name should not empty",
        "position": "afterInput",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#c02121"
        },
        "marginTop": {
          "Desktop": "10px"
        }
      }
    },
    blockId: "pg8539be28243d",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {
          "background-color": {
            "Desktop": "#ececec"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "width": {
            "Desktop": "100%"
          }
        },
        ".pg8539be28243d .error-wrap": {
          "color": {
            "Desktop": "#c02121"
          },
          "margin-top": {
            "Desktop": "10px"
          }
        }
      }
    }
  }], ['post-grid/form-field-input', {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      }
    },
    labelWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    label: {
      "options": {
        "tag": "label",
        "for": "label",
        "enable": false,
        "text": "Your Name",
        "class": "pg-form-field-label"
      }
    },
    input: {
      "options": {
        "type": "submit",
        "placeholder": "Write your name",
        "value": "Submit",
        "name": "",
        "required": false,
        "disabled": false,
        "size": false,
        "minLength": null,
        "maxLength": null,
        "readonly": false,
        "step": null,
        "pattern": null,
        "patternCustom": "",
        "max": null,
        "min": null,
        "checked": false,
        "autocomplete": false,
        "id": "",
        "class": "pg-form-field-input",
        "postion": "afterLabel"
      },
      "styles": {
        "border": {
          "Desktop": "1px solid #b5b5b5"
        },
        "borderRadius": {
          "Desktop": "0px 0px 0px 0px"
        },
        "padding": {
          "Desktop": "5px 10px 5px 10px"
        },
        "backgroundColor": {
          "Desktop": "#51557E"
        },
        "width": {
          "Desktop": "100%"
        },
        "maxWidth": {
          "Desktop": "100%"
        },
        "color": {
          "Desktop": "#ffffff"
        }
      }
    },
    inputWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "class": ""
      }
    },
    errorWrap: {
      "options": {
        "tag": "div",
        "enable": true,
        "text": "",
        "position": "afterInput",
        "class": ""
      }
    },
    blockId: "pg4670520d9df5",
    blockCssY: {
      "items": {
        ".pg8539be28243d input": {},
        ".pg4670520d9df5 input": {
          "border": {
            "Desktop": "1px solid #b5b5b5"
          },
          "border-radius": {
            "Desktop": "0px 0px 0px 0px"
          },
          "padding": {
            "Desktop": "5px 10px 5px 10px"
          },
          "background-color": {
            "Desktop": "#51557E"
          },
          "width": {
            "Desktop": "100%"
          },
          "max-width": {
            "Desktop": "100%"
          },
          "color": {
            "Desktop": "#ffffff"
          }
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 368.13 244.63"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "55.12",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,89.55H6.26a3.2,3.2,0,0,1-3.2-3.19v-29a3.2,3.2,0,0,1,3.2-3.19H361.87a3.19,3.19,0,0,1,3.19,3.19V86.36A3.19,3.19,0,0,1,361.87,89.55ZM6.26,56.12a1.19,1.19,0,0,0-1.2,1.19V86.36a1.19,1.19,0,0,0,1.2,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19v-29a1.19,1.19,0,0,0-1.19-1.19Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "4.06",
    y: "103.58",
    width: "360",
    height: "33.44",
    rx: "2.2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#343738",
    d: "M361.87,138H6.26a3.2,3.2,0,0,1-3.2-3.2v-29a3.2,3.2,0,0,1,3.2-3.2H361.87a3.19,3.19,0,0,1,3.19,3.2v29A3.19,3.19,0,0,1,361.87,138ZM6.26,104.58a1.2,1.2,0,0,0-1.2,1.2v29a1.2,1.2,0,0,0,1.2,1.2H361.87a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M18.09,67.27h4.35v.88H19.13v2.68h3.06v.87H19.13v3.66h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M28.33,73.77c0,.6,0,1.13.05,1.59h-.93l-.06-1h0a2.16,2.16,0,0,1-1.92,1.08c-.91,0-2-.51-2-2.54v-3.4H24.5v3.22c0,1.1.33,1.84,1.29,1.84a1.52,1.52,0,0,0,1.39-1,1.49,1.49,0,0,0,.1-.54V69.55h1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M30.09,66.84h1.05v8.52H30.09Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M32.92,66.84H34v8.52H32.92Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M38.33,75.36V67.27h1.14l2.59,4.09A22.28,22.28,0,0,1,43.51,74h0c-.1-1.08-.12-2.07-.12-3.33V67.27h1v8.09h-1l-2.57-4.11a25.42,25.42,0,0,1-1.51-2.69h0c.06,1,.09,2,.09,3.33v3.46Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M49.41,75.36l-.09-.74h0a2.17,2.17,0,0,1-1.78.87,1.65,1.65,0,0,1-1.77-1.67c0-1.4,1.24-2.17,3.49-2.16v-.12a1.2,1.2,0,0,0-1.32-1.34,2.9,2.9,0,0,0-1.51.43l-.24-.69a3.51,3.51,0,0,1,1.9-.52c1.78,0,2.21,1.21,2.21,2.37V74a7.49,7.49,0,0,0,.1,1.4Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.94.94,0,0,0,1,1,1.45,1.45,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M52,71.12c0-.6,0-1.09,0-1.57h.92l0,.94h0a2,2,0,0,1,1.82-1.07,1.71,1.71,0,0,1,1.64,1.16h0a2.39,2.39,0,0,1,.64-.75,2,2,0,0,1,1.29-.41c.76,0,1.9.5,1.9,2.52v3.42h-1V72.07c0-1.11-.41-1.79-1.26-1.79a1.37,1.37,0,0,0-1.24,1,1.73,1.73,0,0,0-.09.53v3.59h-1V71.88c0-.92-.41-1.6-1.21-1.6a1.45,1.45,0,0,0-1.31,1.06,1.4,1.4,0,0,0-.08.51v3.51H52Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M62.57,72.65a1.86,1.86,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76a4.84,4.84,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.73-3.13a2.46,2.46,0,0,1,2.4,2.73,4.36,4.36,0,0,1,0,.5Zm3.1-.76a1.51,1.51,0,0,0-1.47-1.72,1.77,1.77,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M22.27,120H19.13V123h3.5v.87H18.09v-8.08h4.36v.87H19.13v2.56h3.14Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M24,119.59c0-.6,0-1.09-.05-1.57h.92l.05.93h0a2,2,0,0,1,1.82-1.06,1.71,1.71,0,0,1,1.64,1.16h0a2.44,2.44,0,0,1,.64-.76,2,2,0,0,1,1.29-.4c.76,0,1.9.5,1.9,2.51v3.42h-1v-3.28c0-1.12-.41-1.79-1.26-1.79a1.35,1.35,0,0,0-1.24,1,1.63,1.63,0,0,0-.09.53v3.58h-1v-3.48c0-.92-.41-1.59-1.21-1.59a1.45,1.45,0,0,0-1.31,1,1.49,1.49,0,0,0-.08.52v3.5H24Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M37.18,123.82l-.08-.73h0a2.15,2.15,0,0,1-1.78.86,1.65,1.65,0,0,1-1.77-1.66c0-1.41,1.25-2.17,3.49-2.16V120a1.2,1.2,0,0,0-1.32-1.35,2.84,2.84,0,0,0-1.51.44l-.24-.7a3.61,3.61,0,0,1,1.91-.51c1.77,0,2.2,1.21,2.2,2.37v2.17a8.32,8.32,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.31a.93.93,0,0,0,1,1,1.42,1.42,0,0,0,1.4-1,.92.92,0,0,0,.06-.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M40.92,116.39a.65.65,0,0,1-1.3,0,.64.64,0,0,1,.66-.66A.62.62,0,0,1,40.92,116.39Zm-1.17,7.43V118h1v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M42.56,115.31h1v8.51h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M49.28,121.28l-.84,2.54H47.36l2.74-8.08h1.26l2.76,8.08H53l-.87-2.54Zm2.65-.82-.8-2.32c-.18-.53-.3-1-.42-1.48h0c-.12.48-.25,1-.41,1.47l-.79,2.33Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M60.15,115.31v7c0,.52,0,1.11,0,1.5h-.94l0-1h0a2.14,2.14,0,0,1-2,1.13c-1.41,0-2.49-1.18-2.49-3,0-1.93,1.19-3.11,2.6-3.11a2,2,0,0,1,1.76.88h0v-3.46Zm-1.06,5.07a1.65,1.65,0,0,0-.05-.44,1.54,1.54,0,0,0-1.52-1.23c-1.09,0-1.74,1-1.74,2.25s.58,2.14,1.72,2.14a1.67,1.67,0,0,0,1.59-1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M66.91,115.31v7c0,.52,0,1.11,0,1.5H66l0-1h0A2.15,2.15,0,0,1,64,124c-1.4,0-2.48-1.18-2.48-3,0-1.93,1.19-3.11,2.6-3.11a1.94,1.94,0,0,1,1.75.88h0v-3.46Zm-1,5.07a1.65,1.65,0,0,0,0-.44,1.55,1.55,0,0,0-1.52-1.23c-1.09,0-1.74,1-1.74,2.25s.57,2.14,1.71,2.14a1.67,1.67,0,0,0,1.6-1.71Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M68.67,119.83c0-.68,0-1.27,0-1.81h.92l0,1.14h0a1.74,1.74,0,0,1,1.6-1.27,1.32,1.32,0,0,1,.3,0v1a1.23,1.23,0,0,0-.36,0,1.48,1.48,0,0,0-1.41,1.36,3.37,3.37,0,0,0-.05.49v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M73.06,121.11a1.86,1.86,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36A2.69,2.69,0,0,1,72.05,121c0-1.76,1-3.13,2.72-3.13a2.45,2.45,0,0,1,2.4,2.73,4.68,4.68,0,0,1,0,.49Zm3.09-.75a1.49,1.49,0,0,0-1.46-1.72,1.75,1.75,0,0,0-1.62,1.72Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M78.34,122.74a2.69,2.69,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.54-1-1.54-1.64a1.79,1.79,0,0,1,2-1.7,2.79,2.79,0,0,1,1.42.36l-.26.76a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.11,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.27,3.27,0,0,1-1.63-.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#231f20",
    d: "M83.09,122.74a2.72,2.72,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.53-1-1.53-1.64a1.78,1.78,0,0,1,2-1.7,2.83,2.83,0,0,1,1.43.36l-.27.76a2.28,2.28,0,0,0-1.18-.33c-.63,0-1,.36-1,.79s.35.69,1.11,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.3,3.3,0,0,1-1.63-.39Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#414042",
    x: "4.06",
    y: "154.44",
    width: "180",
    height: "35.07",
    rx: "3.24"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M70.28,174.23a3.68,3.68,0,0,0,1.87.53c1.07,0,1.69-.57,1.69-1.38s-.43-1.19-1.52-1.61c-1.32-.47-2.13-1.15-2.13-2.29a2.32,2.32,0,0,1,2.61-2.19,3.73,3.73,0,0,1,1.79.39l-.29.85a3.25,3.25,0,0,0-1.54-.38c-1.1,0-1.52.66-1.52,1.21,0,.76.49,1.13,1.61,1.56,1.36.53,2.06,1.19,2.06,2.37s-.92,2.33-2.83,2.33A4.13,4.13,0,0,1,70,175.1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M81.16,173.92c0,.6,0,1.12,0,1.58h-.94l-.06-.95h0a2.19,2.19,0,0,1-1.92,1.08c-.91,0-2-.5-2-2.54V169.7h1v3.21c0,1.1.34,1.85,1.3,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.1-.54V169.7h1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M82.87,175.5c0-.4,0-1,0-1.5v-7h1v3.64h0a2.18,2.18,0,0,1,2-1.07c1.44,0,2.46,1.2,2.45,3,0,2.07-1.31,3.1-2.6,3.1a2.08,2.08,0,0,1-2-1.09h0l0,1ZM84,173.17a1.6,1.6,0,0,0,.05.39,1.62,1.62,0,0,0,1.58,1.23c1.1,0,1.76-.9,1.76-2.23,0-1.16-.6-2.16-1.72-2.16A1.7,1.7,0,0,0,84,171.7a2.34,2.34,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M89.6,174.42a2.79,2.79,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1-.37-1.54-.95-1.54-1.64a1.8,1.8,0,0,1,2-1.71,2.87,2.87,0,0,1,1.42.36l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.11,1c1,.38,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.27,3.27,0,0,1-1.63-.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M98.63,175.29a3.9,3.9,0,0,1-1.66.33,2.76,2.76,0,0,1-2.89-3,2.94,2.94,0,0,1,3.12-3.08,3.44,3.44,0,0,1,1.46.3l-.24.81a2.48,2.48,0,0,0-1.22-.28,2.19,2.19,0,0,0,0,4.37,3,3,0,0,0,1.29-.29Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M99.87,171.51c0-.69,0-1.27-.05-1.81h.93l0,1.13h0a1.76,1.76,0,0,1,1.61-1.27,1.36,1.36,0,0,1,.3,0v1a1.32,1.32,0,0,0-.36,0,1.49,1.49,0,0,0-1.42,1.35,3.75,3.75,0,0,0,0,.5v3.09h-1Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M105,168.06a.62.62,0,0,1-.67.65.65.65,0,0,1,0-1.3A.62.62,0,0,1,105,168.06Zm-1.18,7.44v-5.8h1.06v5.8Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M106.6,175.5c0-.4.05-1,.05-1.5v-7h1v3.64h0a2.15,2.15,0,0,1,2-1.07c1.44,0,2.46,1.2,2.45,3,0,2.07-1.31,3.1-2.61,3.1a2.06,2.06,0,0,1-1.94-1.09h0l0,1Zm1.1-2.33a2.34,2.34,0,0,0,0,.39,1.64,1.64,0,0,0,1.59,1.23c1.1,0,1.76-.9,1.76-2.23,0-1.16-.6-2.16-1.73-2.16a1.68,1.68,0,0,0-1.6,1.3,1.71,1.71,0,0,0-.06.43Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M114.07,172.79a1.85,1.85,0,0,0,2,2,3.83,3.83,0,0,0,1.61-.3l.18.76a4.72,4.72,0,0,1-1.94.36,2.69,2.69,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,4.88,4.88,0,0,1,0,.49Zm3.09-.76a1.5,1.5,0,0,0-1.46-1.71,1.74,1.74,0,0,0-1.62,1.71Z"
  }))
} //  {
//         name: 'form-12',
//         title: __('File Upload form'),
//         description: __('File Upload form'),
//         isPro: false,
//         atts: {
//             wrapper: { "options": { "tag": "div", "class": "" }, "styles": { "gridTemplateColumns": { "Desktop": "1fr " }, "gap": { "Desktop": "1em" }, "display": { "Desktop": "flex" }, "borderRadius": { "Desktop": "50px 50px 50px 50px" }, "backgroundColor": { "Desktop": "#774360" }, "color": { "Desktop": "#ffffff" }, "padding": {}, "alignItems": { "Desktop": "center" }, "justifyContent": { "Desktop": "space-between" } } }, visible: {}, onSubmit: { "0": { "id": "validation", "messages": [] }, "1": { "id": "submitConfirm", "messages": [] } }, onProcess: { "0": { "id": "newsletterSubmit", "message": "", "showOnResponse": true }, "1": { "id": "createEntry", "message": "" } }, afterSubmit: { "0": { "id": "showMessage", "message": "" } }, blockId: "pg7e7c9a6760f3", blockCssY: { "items": { ".pg9d6a07354523 form": { "grid-template-columns": { "Desktop": "1fr " }, "gap": { "Desktop": "1em" }, "display": { "Desktop": "grid" } }, ".pg7e7c9a6760f3": { "grid-template-columns": { "Desktop": "1fr " }, "gap": { "Desktop": "1em" }, "display": { "Desktop": "flex" }, "background-color": { "Desktop": "#774360" }, "border-radius": { "Desktop": "50px 50px 50px 50px" }, "color": { "Desktop": "#ffffff" }, "padding": {}, "align-items": { "Desktop": "center" }, "justify-content": { "Desktop": "space-between" } } } },
//         },
//         innerBlocks: [
//             ['post-grid/form-field-input', {
//                 wrapper: { "options": { "tag": "div", "class": "" }, "styles": { "margin": { "Desktop": "0px 0px 0px 30px" } } }, labelWrap: { "options": { "tag": "div", "enable": true, "class": "" } }, label: { "options": { "tag": "label", "for": "label", "enable": false, "text": "Your Email", "class": "pg-form-field-label" } }, input: { "options": { "type": "text", "placeholder": "Write your mail address", "value": "", "name": "email", "required": false, "disabled": false, "size": false, "minLength": null, "maxLength": null, "readonly": false, "step": null, "pattern": null, "patternCustom": "", "max": null, "min": null, "checked": false, "autocomplete": false, "id": "", "class": "pg-form-field-input", "postion": "afterLabel" }, "styles": { "border": { "Desktop": "0px solid #b5b5b5" }, "borderRadius": { "Desktop": "0px 0px 0px 0px" }, "padding": { "Desktop": "10px 20px 10px 20px" }, "backgroundColor": { "Desktop": "#774360" }, "width": {}, "maxWidth": {}, "color": { "Desktop": "#ffffff" } }, "focus": { "backgroundColor": { "Desktop": "#774360" }, "color": { "Desktop": "#ffffff" } } }, inputWrap: { "options": { "tag": "div", "enable": true, "class": "" } }, errorWrap: { "options": { "tag": "div", "enable": true, "text": "Email should not empty", "position": "", "class": "" }, "styles": { "color": { "Desktop": "#c02121" }, "marginTop": { "Desktop": "10px" } } },
//             }],
//             ['post-grid/form-field-input', {
//                 wrapper: { "options": { "tag": "div", "class": "" } }, labelWrap: { "options": { "tag": "div", "enable": true, "class": "" } }, label: { "options": { "tag": "label", "for": "label", "enable": false, "text": "Your Name", "class": "pg-form-field-label" } }, input: { "options": { "type": "submit", "placeholder": "Write your name", "value": "Submit", "name": "", "required": false, "disabled": false, "size": false, "minLength": null, "maxLength": null, "readonly": false, "step": null, "pattern": null, "patternCustom": "", "max": null, "min": null, "checked": false, "autocomplete": false, "id": "", "class": "pg-form-field-input", "postion": "afterLabel" }, "styles": { "border": { "Desktop": "0px solid #b5b5b5" }, "borderRadius": { "Desktop": "50px 50px 50px 50px" }, "padding": { "Desktop": "13px 50px 13px 50px" }, "backgroundColor": { "Desktop": "#DFBB9D" }, "width": { "Desktop": "100%" }, "maxWidth": { "Desktop": "100%" }, "color": { "Desktop": "#ffffff" } } }, inputWrap: { "options": { "tag": "div", "enable": true, "class": "" } }, errorWrap: { "options": { "tag": "div", "enable": true, "text": "", "position": "afterInput", "class": "" } },
//             }],
//         ],
//         scope: ['block'],
//         icon: (
//             <svg  xmlns="http://www.w3.org/2000/svg" viewBox="0 0 368.13 244.63"><rect fill="#bcbec0" x="4.07" y="4.63" width="360" height="33.44" rx="2.2"/><path fill="#343738" d="M361.87,39.07H6.26a3.2,3.2,0,0,1-3.2-3.19V6.83a3.21,3.21,0,0,1,3.2-3.2H361.87a3.2,3.2,0,0,1,3.19,3.2V35.88A3.19,3.19,0,0,1,361.87,39.07ZM6.26,5.63a1.2,1.2,0,0,0-1.2,1.2V35.88a1.19,1.19,0,0,0,1.2,1.19H361.87a1.19,1.19,0,0,0,1.19-1.19V6.83a1.19,1.19,0,0,0-1.19-1.2Z"/><rect fill="#bcbec0" x="4.07" y="53.1" width="360" height="33.44" rx="2.2"/><path fill="#343738" d="M361.87,87.54H6.26a3.21,3.21,0,0,1-3.2-3.2v-29a3.2,3.2,0,0,1,3.2-3.2H361.87a3.19,3.19,0,0,1,3.19,3.2v29A3.2,3.2,0,0,1,361.87,87.54ZM6.26,54.1a1.2,1.2,0,0,0-1.2,1.2v29a1.2,1.2,0,0,0,1.2,1.2H361.87a1.19,1.19,0,0,0,1.19-1.2v-29a1.19,1.19,0,0,0-1.19-1.2Z"/><rect fill="#bcbec0" x="4.07" y="100.74" width="360" height="86.66" rx="2.2"/><path fill="#343738" d="M361.87,188.4H6.26a3.21,3.21,0,0,1-3.2-3.2V102.93a3.2,3.2,0,0,1,3.2-3.19H361.87a3.19,3.19,0,0,1,3.19,3.19V185.2A3.2,3.2,0,0,1,361.87,188.4ZM6.26,101.74a1.19,1.19,0,0,0-1.2,1.19V185.2a1.2,1.2,0,0,0,1.2,1.2H361.87a1.19,1.19,0,0,0,1.19-1.2V102.93a1.19,1.19,0,0,0-1.19-1.19Z"/><rect fill="#414042" x="4.27" y="204.92" width="180" height="35.07" rx="3.24"/><rect fill="#414042" x="269.6" y="59.23" width="86.61" height="21.4" rx="3.24"/><path fill="#231f20" d="M24.9,21.32c-.06-1.12-.13-2.48-.12-3.48h0c-.27.94-.61,1.95-1,3.07L22.3,24.83h-.79L20.2,21c-.38-1.14-.71-2.19-.94-3.14h0c0,1-.08,2.36-.16,3.57l-.21,3.47h-1l.57-8.09h1.33l1.38,3.91c.33,1,.61,1.88.81,2.72h0c.2-.81.49-1.7.85-2.72l1.44-3.91h1.33l.5,8.09h-1Z"/><path fill="#231f20" d="M28.36,22.16a1.86,1.86,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76a4.84,4.84,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4.49,4.49,0,0,1,0,.49Zm3.09-.75A1.5,1.5,0,0,0,30,19.69a1.76,1.76,0,0,0-1.62,1.72Z"/><path fill="#231f20" d="M38.8,16.36v7c0,.51,0,1.1,0,1.5H37.9l0-1h0a2.16,2.16,0,0,1-2,1.14c-1.41,0-2.49-1.19-2.49-3,0-1.93,1.19-3.12,2.61-3.12a2,2,0,0,1,1.75.89h0V16.36Zm-1.06,5.07a1.65,1.65,0,0,0-.05-.44,1.54,1.54,0,0,0-1.52-1.22c-1.09,0-1.74,1-1.74,2.24s.58,2.15,1.72,2.15a1.59,1.59,0,0,0,1.54-1.26,1.71,1.71,0,0,0,.05-.46Z"/><path fill="#231f20" d="M41.73,17.44a.66.66,0,0,1-1.31,0,.65.65,0,0,1,.66-.66A.63.63,0,0,1,41.73,17.44Zm-1.18,7.44V19.07h1.06v5.81Z"/><path fill="#231f20" d="M46.57,24.88l-.08-.74h0a2.14,2.14,0,0,1-1.77.87,1.66,1.66,0,0,1-1.78-1.67c0-1.4,1.25-2.17,3.49-2.16v-.12a1.19,1.19,0,0,0-1.31-1.34,3,3,0,0,0-1.52.43l-.24-.7a3.63,3.63,0,0,1,1.91-.51c1.78,0,2.21,1.21,2.21,2.37v2.17a8.52,8.52,0,0,0,.09,1.4Zm-.15-3c-1.15,0-2.46.18-2.46,1.31a.94.94,0,0,0,1,1,1.45,1.45,0,0,0,1.41-1,1.35,1.35,0,0,0,.06-.34Z"/><path fill="#231f20" d="M52.77,17.68H50.31v-.89h6v.89H53.82v7.2h-1Z"/><path fill="#231f20" d="M58.19,17.44a.62.62,0,0,1-.67.65.63.63,0,0,1-.64-.65.65.65,0,0,1,.66-.66A.63.63,0,0,1,58.19,17.44ZM57,24.88V19.07h1v5.81Z"/><path fill="#231f20" d="M61.1,17.4v1.67h1.51v.8H61.1V23c0,.72.2,1.13.79,1.13a2.21,2.21,0,0,0,.61-.07l0,.79a2.48,2.48,0,0,1-.94.15,1.46,1.46,0,0,1-1.14-.45A2.15,2.15,0,0,1,60.06,23V19.87h-.9v-.8h.9V17.68Z"/><path fill="#231f20" d="M63.8,16.36h1v8.52h-1Z"/><path fill="#231f20" d="M67.22,22.16a1.86,1.86,0,0,0,2,2,3.75,3.75,0,0,0,1.6-.3l.18.76a4.8,4.8,0,0,1-1.93.36,2.69,2.69,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.73,4,4,0,0,1,0,.49Zm3.09-.75a1.51,1.51,0,0,0-1.46-1.72,1.75,1.75,0,0,0-1.62,1.72Z"/><path fill="#231f20" d="M23.74,73.08a5.25,5.25,0,0,1-2.14.38,3.77,3.77,0,0,1-4-4.09,4,4,0,0,1,4.22-4.24,4.26,4.26,0,0,1,1.92.36l-.25.85A3.84,3.84,0,0,0,21.87,66a3,3,0,0,0-3.16,3.34,2.94,2.94,0,0,0,3.11,3.25,4.24,4.24,0,0,0,1.7-.34Z"/><path fill="#231f20" d="M25,64.83h1.06v3.62h0a2,2,0,0,1,.76-.75,2.16,2.16,0,0,1,1.08-.3c.78,0,2,.48,2,2.49v3.45H28.9V70c0-.94-.35-1.73-1.34-1.73a1.51,1.51,0,0,0-1.42,1.06,1.26,1.26,0,0,0-.07.5v3.5H25Z"/><path fill="#231f20" d="M36.93,70.39A2.83,2.83,0,0,1,34,73.47a2.76,2.76,0,0,1-2.79-3,2.84,2.84,0,0,1,2.88-3.09A2.76,2.76,0,0,1,36.93,70.39Zm-4.61.06c0,1.27.73,2.23,1.76,2.23s1.77-1,1.77-2.25c0-1-.5-2.23-1.74-2.23S32.32,69.35,32.32,70.45Z"/><path fill="#231f20" d="M38.12,72.26a2.69,2.69,0,0,0,1.39.42c.77,0,1.12-.38,1.12-.86s-.3-.78-1.07-1.07c-1.05-.37-1.54-1-1.54-1.64a1.79,1.79,0,0,1,2-1.71,2.91,2.91,0,0,1,1.43.36l-.26.77A2.32,2.32,0,0,0,40,68.2c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.39,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.39Z"/><path fill="#231f20" d="M42.87,72.26a2.69,2.69,0,0,0,1.39.42c.77,0,1.13-.38,1.13-.86s-.3-.78-1.08-1.07c-1.05-.37-1.54-1-1.54-1.64a1.8,1.8,0,0,1,2-1.71,2.9,2.9,0,0,1,1.42.36l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.62,0-1,.36-1,.79s.35.69,1.1,1c1,.39,1.53.89,1.53,1.75,0,1-.8,1.74-2.17,1.74a3.34,3.34,0,0,1-1.64-.39Z"/><path fill="#231f20" d="M48.35,70.63a1.87,1.87,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.73-3.13a2.47,2.47,0,0,1,2.4,2.74,4.15,4.15,0,0,1,0,.49Zm3.1-.75A1.51,1.51,0,0,0,50,68.16a1.76,1.76,0,0,0-1.62,1.72Z"/><path fill="#231f20" d="M56.36,65.26h4.35v.87H57.4v2.69h3.06v.86H57.4v3.66h-1Z"/><path fill="#231f20" d="M63,65.91a.66.66,0,0,1-1.31,0,.64.64,0,0,1,.66-.66A.62.62,0,0,1,63,65.91Zm-1.18,7.43v-5.8h1.06v5.8Z"/><path fill="#231f20" d="M64.66,64.83h1.06v8.51H64.66Z"/><path fill="#231f20" d="M68.08,70.63a1.86,1.86,0,0,0,2,2,4,4,0,0,0,1.61-.3l.18.75a4.67,4.67,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,4.68,4.68,0,0,1,0,.49Zm3.09-.75a1.49,1.49,0,0,0-1.46-1.72,1.75,1.75,0,0,0-1.62,1.72Z"/><path fill="#231f20" d="M24.9,115.34c-.06-1.13-.13-2.48-.12-3.49h0c-.28,1-.62,2-1,3.07l-1.43,3.92h-.79L20.2,115c-.38-1.14-.71-2.18-.94-3.14h0c0,1-.08,2.36-.16,3.57l-.21,3.47h-1l.57-8.08h1.33l1.38,3.91c.33,1,.61,1.88.81,2.72h0c.2-.82.49-1.7.85-2.72l1.44-3.91h1.33l.5,8.08h-1Z"/><path fill="#231f20" d="M28.36,116.18a1.85,1.85,0,0,0,2,2,3.8,3.8,0,0,0,1.61-.3l.18.76a4.67,4.67,0,0,1-1.93.36,2.7,2.7,0,0,1-2.86-2.93c0-1.75,1-3.13,2.73-3.13a2.46,2.46,0,0,1,2.39,2.74,4.88,4.88,0,0,1,0,.49Zm3.09-.76A1.49,1.49,0,0,0,30,113.71a1.75,1.75,0,0,0-1.62,1.71Z"/><path fill="#231f20" d="M38.8,110.38v7c0,.52,0,1.1.05,1.5h-1l0-1h0a2.16,2.16,0,0,1-2,1.14c-1.41,0-2.49-1.18-2.49-3,0-1.93,1.19-3.12,2.61-3.12a2,2,0,0,1,1.75.89h0v-3.46Zm-1.06,5.07a1.77,1.77,0,0,0-.05-.45,1.54,1.54,0,0,0-1.52-1.22c-1.09,0-1.74,1-1.74,2.24s.58,2.15,1.72,2.15a1.59,1.59,0,0,0,1.54-1.26,1.64,1.64,0,0,0,.05-.45Z"/><path fill="#231f20" d="M41.73,111.45a.66.66,0,0,1-1.31,0,.65.65,0,0,1,.66-.66A.63.63,0,0,1,41.73,111.45Zm-1.18,7.44v-5.8h1.06v5.8Z"/><path fill="#231f20" d="M46.57,118.89l-.08-.73h0a2.16,2.16,0,0,1-1.77.86,1.66,1.66,0,0,1-1.78-1.66c0-1.41,1.25-2.18,3.49-2.16v-.12a1.2,1.2,0,0,0-1.31-1.35,3,3,0,0,0-1.52.43l-.24-.69a3.64,3.64,0,0,1,1.91-.52c1.78,0,2.21,1.21,2.21,2.38v2.17a8.47,8.47,0,0,0,.09,1.39Zm-.15-3c-1.15,0-2.46.18-2.46,1.3a.94.94,0,0,0,1,1,1.45,1.45,0,0,0,1.4-1,1.36,1.36,0,0,0,.06-.33Z"/><path fill="#231f20" d="M51.72,110.91a16,16,0,0,1,2.22-.16,4.65,4.65,0,0,1,3.28,1,3.74,3.74,0,0,1,1.14,2.91,4.25,4.25,0,0,1-1.17,3.14A5,5,0,0,1,53.62,119a17.16,17.16,0,0,1-1.9-.09Zm1.05,7.15a6.25,6.25,0,0,0,1,.06,3.11,3.11,0,0,0,3.45-3.43c0-1.9-1.07-3.12-3.28-3.12a5.82,5.82,0,0,0-1.22.11Z"/><path fill="#231f20" d="M60.32,116.18a1.85,1.85,0,0,0,2,2,3.75,3.75,0,0,0,1.6-.3l.18.76a4.63,4.63,0,0,1-1.93.36,2.69,2.69,0,0,1-2.85-2.93c0-1.75,1-3.13,2.72-3.13a2.46,2.46,0,0,1,2.4,2.74,2.81,2.81,0,0,1,0,.49Zm3.09-.76A1.5,1.5,0,0,0,62,113.71a1.74,1.74,0,0,0-1.62,1.71Z"/><path fill="#231f20" d="M65.6,117.81a2.79,2.79,0,0,0,1.39.42c.76,0,1.12-.38,1.12-.86s-.3-.78-1.07-1.07c-1.05-.37-1.54-1-1.54-1.64a1.79,1.79,0,0,1,2-1.71,2.91,2.91,0,0,1,1.43.36l-.26.77a2.32,2.32,0,0,0-1.19-.33c-.63,0-1,.36-1,.79s.34.69,1.1,1c1,.38,1.52.89,1.52,1.75,0,1-.79,1.74-2.17,1.74a3.33,3.33,0,0,1-1.63-.4Z"/><path fill="#231f20" d="M74.63,118.67A3.81,3.81,0,0,1,73,119a2.76,2.76,0,0,1-2.89-3A3,3,0,0,1,73.19,113a3.4,3.4,0,0,1,1.46.3l-.24.81a2.45,2.45,0,0,0-1.22-.28,2,2,0,0,0-2,2.2,2,2,0,0,0,2,2.17,3,3,0,0,0,1.3-.29Z"/><path fill="#231f20" d="M75.87,114.9c0-.69,0-1.27-.05-1.81h.92l0,1.13h0a1.75,1.75,0,0,1,1.6-1.27,1.28,1.28,0,0,1,.3,0v1a1.79,1.79,0,0,0-.36,0A1.47,1.47,0,0,0,77,115.3a2.57,2.57,0,0,0,0,.5v3.09h-1Z"/><path fill="#231f20" d="M81,111.45a.63.63,0,0,1-.68.65.63.63,0,0,1-.63-.65.64.64,0,0,1,.66-.66A.63.63,0,0,1,81,111.45Zm-1.18,7.44v-5.8H80.9v5.8Z"/><path fill="#231f20" d="M82.65,115c0-.74,0-1.34-.05-1.89h1l0,1h0A2.27,2.27,0,0,1,85.68,113c1.4,0,2.46,1.19,2.46,3,0,2.09-1.27,3.12-2.64,3.12a2,2,0,0,1-1.79-.91h0v3.15h-1Zm1,1.55a2,2,0,0,0,0,.43,1.63,1.63,0,0,0,1.58,1.23c1.12,0,1.76-.91,1.76-2.24,0-1.16-.61-2.16-1.72-2.16a1.7,1.7,0,0,0-1.6,1.31,2,2,0,0,0-.07.43Z"/><path fill="#231f20" d="M90.75,111.42v1.67h1.51v.8H90.75V117c0,.72.2,1.13.79,1.13a2.13,2.13,0,0,0,.61-.08l0,.8a2.73,2.73,0,0,1-.94.14,1.49,1.49,0,0,1-1.14-.44,2.17,2.17,0,0,1-.4-1.51v-3.17h-.9v-.8h.9v-1.4Z"/><path fill="#231f20" d="M94.62,111.45a.65.65,0,1,1-1.3,0,.64.64,0,0,1,.66-.66A.62.62,0,0,1,94.62,111.45Zm-1.17,7.44v-5.8h1v5.8Z"/><path fill="#231f20" d="M101.51,115.94A2.83,2.83,0,0,1,98.62,119a2.76,2.76,0,0,1-2.78-3A2.83,2.83,0,0,1,98.71,113,2.75,2.75,0,0,1,101.51,115.94ZM96.9,116c0,1.27.73,2.23,1.77,2.23s1.76-1,1.76-2.25c0-1-.49-2.23-1.74-2.23S96.9,114.9,96.9,116Z"/><path fill="#231f20" d="M102.84,114.66c0-.6,0-1.1,0-1.57h.93l.06,1h0a2.14,2.14,0,0,1,1.92-1.09c.81,0,2,.48,2,2.47v3.47h-1v-3.35c0-.93-.35-1.71-1.34-1.71a1.5,1.5,0,0,0-1.42,1.08,1.45,1.45,0,0,0-.07.49v3.49h-1.06Z"/><path fill="#fff" d="M77,224.71a3.68,3.68,0,0,0,1.87.53c1.07,0,1.69-.57,1.69-1.38s-.43-1.19-1.52-1.61c-1.32-.47-2.13-1.15-2.13-2.29a2.32,2.32,0,0,1,2.61-2.19,3.73,3.73,0,0,1,1.79.39L81,219a3.25,3.25,0,0,0-1.54-.38c-1.1,0-1.52.66-1.52,1.21,0,.76.49,1.13,1.61,1.56,1.37.53,2.06,1.19,2.06,2.37s-.92,2.33-2.83,2.33a4.25,4.25,0,0,1-2.06-.51Z"/><path fill="#fff" d="M87.84,224.4c0,.6,0,1.13,0,1.58H87L86.9,225h0A2.18,2.18,0,0,1,85,226.11c-.91,0-2-.5-2-2.54v-3.39H84v3.21c0,1.1.33,1.85,1.29,1.85a1.52,1.52,0,0,0,1.39-1,1.57,1.57,0,0,0,.1-.54v-3.56h1Z"/><path fill="#fff" d="M89.55,226c0-.39,0-1,0-1.5v-7h1v3.64h0a2.15,2.15,0,0,1,2-1.07c1.44,0,2.46,1.2,2.45,3,0,2.07-1.31,3.1-2.6,3.1A2.06,2.06,0,0,1,90.55,225h0l-.05,1Zm1.09-2.33a2.3,2.3,0,0,0,0,.39,1.63,1.63,0,0,0,1.58,1.23c1.11,0,1.77-.9,1.77-2.23,0-1.16-.6-2.16-1.73-2.16a1.7,1.7,0,0,0-1.61,1.3,2.34,2.34,0,0,0-.06.43Z"/><path fill="#fff" d="M96.43,221.75c0-.6,0-1.09-.05-1.57h.92l0,.93h0A2,2,0,0,1,99.21,220a1.71,1.71,0,0,1,1.64,1.17h0a2.33,2.33,0,0,1,.64-.76,2,2,0,0,1,1.29-.41c.76,0,1.9.51,1.9,2.52V226h-1v-3.29c0-1.11-.41-1.78-1.26-1.78a1.34,1.34,0,0,0-1.24,1,1.63,1.63,0,0,0-.09.53V226h-1V222.5c0-.92-.41-1.59-1.21-1.59A1.45,1.45,0,0,0,97.54,222a1.49,1.49,0,0,0-.08.52V226h-1Z"/><path fill="#fff" d="M107.61,218.55a.62.62,0,0,1-.67.64.63.63,0,0,1-.64-.64.64.64,0,0,1,.66-.66A.62.62,0,0,1,107.61,218.55ZM106.43,226v-5.8h1.06V226Z"/><path fill="#fff" d="M110.51,218.51v1.67H112v.8h-1.51v3.13c0,.72.21,1.13.8,1.13a2.76,2.76,0,0,0,.61-.07l0,.79a2.63,2.63,0,0,1-.93.14,1.49,1.49,0,0,1-1.14-.44,2.15,2.15,0,0,1-.41-1.51V221h-.9v-.8h.9v-1.39Z"/><path fill="#fff" d="M285.85,65.37v4.78c0,1.81.8,2.58,1.88,2.58s2-.79,2-2.58V65.37h1.06v4.71c0,2.48-1.31,3.5-3.06,3.5s-2.91-1-2.91-3.45V65.37Z"/><path fill="#fff" d="M292.53,69.54c0-.74,0-1.34,0-1.9h.94l.05,1h0a2.27,2.27,0,0,1,2.06-1.13c1.4,0,2.46,1.19,2.46,2.95,0,2.09-1.27,3.12-2.64,3.12a2,2,0,0,1-1.79-.91h0v3.15h-1.05Zm1.05,1.55a2,2,0,0,0,.05.43,1.62,1.62,0,0,0,1.58,1.23c1.11,0,1.76-.91,1.76-2.24,0-1.16-.61-2.16-1.73-2.16a1.68,1.68,0,0,0-1.59,1.31,1.55,1.55,0,0,0-.07.43Z"/><path fill="#fff" d="M299.36,64.93h1.06v8.52h-1.06Z"/><path fill="#fff" d="M307.45,70.5a2.83,2.83,0,0,1-2.89,3.08,2.77,2.77,0,0,1-2.79-3,2.84,2.84,0,0,1,2.88-3.08A2.75,2.75,0,0,1,307.45,70.5Zm-4.61.06c0,1.27.73,2.23,1.76,2.23s1.77-1,1.77-2.26c0-1-.49-2.23-1.74-2.23S302.84,69.46,302.84,70.56Z"/><path fill="#fff" d="M312,73.45l-.09-.73h0a2.19,2.19,0,0,1-1.78.86,1.65,1.65,0,0,1-1.77-1.67c0-1.4,1.24-2.17,3.49-2.15v-.12a1.21,1.21,0,0,0-1.32-1.35,2.9,2.9,0,0,0-1.51.43l-.24-.69a3.6,3.6,0,0,1,1.9-.52c1.78,0,2.21,1.21,2.21,2.38v2.17a7.44,7.44,0,0,0,.1,1.39Zm-.16-3c-1.15,0-2.46.18-2.46,1.3a.94.94,0,0,0,1,1,1.45,1.45,0,0,0,1.4-1,1,1,0,0,0,.06-.34Z"/><path fill="#fff" d="M319.58,64.93v7c0,.52,0,1.1.05,1.5h-.95l-.05-1h0a2.15,2.15,0,0,1-2,1.14c-1.4,0-2.48-1.19-2.48-3,0-1.93,1.18-3.12,2.6-3.12a1.93,1.93,0,0,1,1.75.89h0V64.93ZM318.52,70a2.35,2.35,0,0,0,0-.45A1.56,1.56,0,0,0,317,68.34c-1.09,0-1.74,1-1.74,2.24s.58,2.15,1.72,2.15a1.6,1.6,0,0,0,1.55-1.26,2.19,2.19,0,0,0,0-.46Z"/><path fill="#fff" d="M337.48,66.46l1.08-1.1v4.56a.48.48,0,0,0,.48.47.47.47,0,0,0,.47-.47V65.36l1.09,1.1a.48.48,0,0,0,.67,0h0a.47.47,0,0,0,0-.67h0l-1.9-1.9a.56.56,0,0,0-.15-.1.55.55,0,0,0-.36,0l-.16.1-1.9,1.9a.48.48,0,1,0,.68.68Zm5.83,3a.48.48,0,0,0-.48.48v1.9a.47.47,0,0,1-.47.47h-6.64a.47.47,0,0,1-.48-.47v-1.9a.48.48,0,1,0-.95,0v1.9a1.43,1.43,0,0,0,1.43,1.42h6.64a1.42,1.42,0,0,0,1.42-1.42v-1.9A.47.47,0,0,0,343.31,69.44Z"/></svg>
//         ),
//     },
];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/grid-wrap-item/index.js":
/*!********************************************!*\
  !*** ./src/blocks/grid-wrap-item/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");













const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/grid-wrap-item", {
  apiVersion: 2,
  title: "Grid Item",
  parent: ['post-grid/grid-wrap'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      id: "Layer_1",
      "data-name": "Layer 1",
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "14.58 11.45 13.45 11.45 13.45 9.46 15.43 9.46 15.43 10.6 14.58 10.6 14.58 11.45"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "17.14",
      y: "9.46",
      width: "1.71",
      height: "1.14"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "22.55 11.45 21.42 11.45 21.42 10.6 20.57 10.6 20.57 9.46 22.55 9.46 22.55 11.45"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M22.55,21.93H21.42V19.31h1.13Zm0-5.24H21.42V14.07h1.13Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "22.55 26.54 20.57 26.54 20.57 25.41 21.42 25.41 21.42 24.55 22.55 24.55 22.55 26.54"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "17.14",
      y: "25.41",
      width: "1.71",
      height: "1.14"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "15.43 26.54 13.45 26.54 13.45 24.55 14.58 24.55 14.58 25.41 15.43 25.41 15.43 26.54"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M14.58,21.93H13.45V19.31h1.13Zm0-5.24H13.45V14.07h1.13Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "19.07",
      width: "11.34",
      height: "7.47",
      transform: "translate(11.34 45.61) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "9.46",
      width: "11.34",
      height: "7.47",
      transform: "translate(11.34 26.39) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "24.66",
      y: "19.07",
      width: "11.34",
      height: "7.47",
      transform: "translate(60.66 45.61) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "24.66",
      y: "9.46",
      width: "11.34",
      height: "7.47",
      transform: "translate(60.66 26.39) rotate(180)"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'grid-item-wrap'
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss); //blockCssY.items = [];
      //blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'flex-grow': { "Desktop": "1" } };
      //blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'flex-basis': { "Desktop": "0" } };
      //setAttributes({ blockCssY: { items: blockCssY.items } });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);

    function generateElementSudoCss(obj) {
      var stylesObj = {};
      Object.entries(obj).map(args => {
        var sudoSrc = args[0];
        var sudoArgs = args[1];

        if (sudoSrc != 'options') {
          var selector = myStore.getElementSelector(sudoSrc, wrapperSelector); //console.log(selector);
          //console.log(sudoArgs);

          Object.entries(args[1]).map(x => {
            var attr = x[0];
            var cssPropty = myStore.cssAttrParse(attr);

            if (stylesObj[selector] == undefined) {
              stylesObj[selector] = {};
            }

            if (stylesObj[selector][cssPropty] == undefined) {
              stylesObj[selector][cssPropty] = {};
            }

            stylesObj[selector][cssPropty] = x[1];
          });
        } //console.log(stylesObj);

      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      }; //console.log(cssItemsX);

      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      //console.log(wrapper);
      //setAttributes({ customCss: customCss });
      ///myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      var elementCss = generateElementSudoCss(wrapper); //console.log(elementCss);
    }, [wrapper]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const MY_TEMPLATE = [//['core/paragraph', { placeholder: '', content: 'Hello Text...' }],
    ];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-grid-wrap-item border border-dashed`
    }); //const isParentOfSelectedBlock = useSelect((select) => select('core/block-editor').hasSelectedInnerBlock(clientId, true))

    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      //allowedBlocks: ALLOWED_BLOCKS,
      template: MY_TEMPLATE,
      //orientation: 'horizontal',
      templateInsertUpdatesSelection: true,
      renderAppender: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.ButtonBlockAppender
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, innerBlocksProps.children));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-grid-wrap-item`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null);
  }
});

/***/ }),

/***/ "./src/blocks/grid-wrap/index.js":
/*!***************************************!*\
  !*** ./src/blocks/grid-wrap/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./variations */ "./src/blocks/grid-wrap/variations.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");

















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/grid-wrap", {
  apiVersion: 2,
  title: "Grid Wrap",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      id: "Layer_1",
      "data-name": "Layer 1",
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "12.68",
      y: "9.9",
      width: "10.65",
      height: "16.2",
      transform: "translate(36 36) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "19.01",
      width: "10.65",
      height: "7.09",
      transform: "translate(10.65 45.11) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "9.9",
      width: "10.65",
      height: "7.09",
      transform: "translate(10.65 26.89) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "25.35",
      y: "19.01",
      width: "10.65",
      height: "7.09",
      transform: "translate(61.35 45.11) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "25.35",
      y: "9.9",
      width: "10.65",
      height: "7.09",
      transform: "translate(61.35 26.89) rotate(180)"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    const {
      replaceInnerBlocks
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useDispatch)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store);
    const hasInnerBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store).getBlocks(clientId).length > 0, [clientId]); //console.log(JSON.stringify(wp.data.select(blockEditorStore).getBlocks(clientId)));

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss); // blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'display': { "Desktop": "grid" } };
      // blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'gap': { "Desktop": "20px" } };
      // setAttributes({ blockCssY: { items: blockCssY.items } });
      //setAttributes({ wrapper: { ...wrapper, styles: { display: { Desktop: 'grid' }, gap: { Desktop: '20px' } } } });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function applyFlex(attr, newVal) {
      onChangeStyleWrapper('styles', newVal, attr);
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    const ALLOWED_BLOCKS = ['post-grid/grid-wrap-item'];
    const MY_TEMPLATE = [['post-grid/grid-wrap-item', {}], ['post-grid/grid-wrap-item', {}], ['post-grid/grid-wrap-item', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-grid-wrap `
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      allowedBlocks: ALLOWED_BLOCKS,
      //template: MY_TEMPLATE,
      orientation: 'horizontal',
      templateInsertUpdatesSelection: true //renderAppender: InnerBlocks.ButtonBlockAppender

    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
        console.log(wrapper);
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: ""
    }, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400 hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        var wrapperX = { ...wrapper,
          styles: {
            gridTemplateColumns: {
              Desktop: '1fr 1fr'
            },
            gap: {
              Desktop: '1em'
            },
            display: {
              Desktop: 'grid'
            }
          }
        };
        setAttributes({
          wrapper: wrapperX
        });
        var elementCss = myStore.generateElementCss(wrapperX, wrapperSelector);
        var itemsX = { ...blockCssY.items,
          ...elementCss
        };
        setAttributes({
          blockCssY: {
            items: itemsX
          }
        });
        myStore.generateBlockCss(blockCssY.items, blockId, customCss);
        replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)([['post-grid/grid-wrap-item', {
          "wrapper": {
            "options": {
              "tag": "div",
              "class": "grid-item-wrap"
            },
            "styles": {}
          }
        }], ['post-grid/grid-wrap-item', {
          "wrapper": {
            "options": {
              "tag": "div",
              "class": "grid-item-wrap"
            },
            "styles": {}
          }
        }]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_16__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 bg-gray-400 cursor-pointer hover:bg-gray-500 relative",
        onClick: ev => {
          if (variation.isPro) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var wrapperX = { ...wrapper,
            styles: variation.wrapObj.styles
          };
          setAttributes({
            wrapper: wrapperX
          });
          var elementCss = myStore.generateElementCss(wrapperX, wrapperSelector);
          var itemsX = { ...blockCssY.items,
            ...elementCss
          };
          setAttributes({
            blockCssY: {
              items: itemsX
            }
          });
          myStore.generateBlockCss(blockCssY.items, blockId, customCss);
          replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)(variation.innerBlocks), true);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, innerBlocksProps.children)));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-grid-wrap`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/grid-wrap/variations.js":
/*!********************************************!*\
  !*** ./src/blocks/grid-wrap/variations.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__);


/**
 * WordPress dependencies
 */


let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('isProFeature', true);
/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: 'layout-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-1'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-1'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-2',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-2'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-2'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "83.33 13.33 83.33 43.33 83.33 66.67 118.33 66.67 118.33 43.33 118.33 13.33 83.33 13.33"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "41.67 13.33 41.67 43.33 41.67 66.67 76.67 66.67 76.67 43.33 76.67 13.33 41.67 13.33"
  }))
}, {
  name: 'layout-3',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-3'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-3'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(201.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(160 49.99) rotate(180)"
  }))
}, {
  name: 'layout-4',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-4'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-4'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-5',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-5'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-5'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "41.67 13.33 41.67 43.33 41.67 66.67 76.67 66.67 76.67 43.33 76.67 13.33 41.67 13.33"
  }))
}, {
  name: 'layout-6',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-6'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-6'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '2'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "118.33 66.67 118.33 36.67 118.33 13.33 83.33 13.33 83.33 36.67 83.33 66.67 118.33 66.67"
  }))
}, {
  name: 'layout-7',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-7'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-7'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34"
  }))
}, {
  name: 'layout-8',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-8'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-8'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "20.83 13.33 20.83 43.33 20.83 66.67 55.83 66.67 55.83 43.33 55.83 13.33 20.83 13.33"
  }))
}, {
  name: 'layout-9',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-9'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-9'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '2'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "35",
    height: "53.35",
    transform: "translate(160 80) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 49.99) rotate(180)"
  }))
}, {
  name: 'layout-10',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-10'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-10'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "23.84",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(82.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "65.5",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(166.01 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "23.84",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(82.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "65.5",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(166.01 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "142.17 66.67 142.17 36.67 142.17 13.33 107.17 13.33 107.17 36.67 107.17 66.67 142.17 66.67"
  }))
}, {
  name: 'layout-11',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-11'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-11'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(160 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(118.33 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 49.99) rotate(180)"
  }))
}, {
  name: 'layout-12',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-12'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-12'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '2'
        },
        gridColumnEnd: {
          Desktop: '4'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(160 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(201.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 110.01) rotate(180)"
  }))
}, {
  name: 'layout-13',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-13'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-13'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(160 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 49.99) rotate(180)"
  }))
}, {
  name: 'layout-14',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-14'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-14'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '2'
        },
        gridColumnEnd: {
          Desktop: '4'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "43.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(201.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(160 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 49.99) rotate(180)"
  }))
}, {
  name: 'layout-15',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 15'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 15'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '3'
        },
        gridColumnEnd: {
          Desktop: '5'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "125",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-16',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 16'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 16'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "125",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  })),
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '3'
        },
        gridColumnEnd: {
          Desktop: '5'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block']
}, {
  name: 'layout-17',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 17'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 17'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "125",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "0 13.33 0 43.33 0 66.67 35 66.67 35 43.33 35 13.33 0 13.33"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "125",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "41.67 13.33 41.67 43.33 41.67 66.67 76.67 66.67 76.67 43.33 76.67 13.33 41.67 13.33"
  })),
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '2'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '2'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block']
}, {
  name: 'layout-18',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 18'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 18'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(35 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "160 66.67 160 36.67 160 13.33 125 13.33 125 36.67 125 66.67 160 66.67"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(35 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "118.33 66.67 118.33 36.67 118.33 13.33 83.33 13.33 83.33 36.67 83.33 66.67 118.33 66.67"
  })),
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '3'
        },
        gridColumnEnd: {
          Desktop: '4'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '4'
        },
        gridColumnEnd: {
          Desktop: '5'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block']
}, {
  name: 'layout-19',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-19'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-19'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '3'
        },
        gridColumnEnd: {
          Desktop: '4'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '4'
        },
        gridColumnEnd: {
          Desktop: '5'
        }
      }
    }
  }], ['post-grid/grid-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(35 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "160 66.67 160 36.67 160 13.33 125 13.33 125 36.67 125 66.67 160 66.67"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "118.33 66.67 118.33 36.67 118.33 13.33 83.33 13.33 83.33 36.67 83.33 66.67 118.33 66.67"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/icon/index.js":
/*!**********************************!*\
  !*** ./src/blocks/icon/index.js ***!
  \**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_11__);
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;
















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/icon", {
  apiVersion: 2,
  title: "Icon/Button/Link",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "11.51",
      width: "36",
      height: "12.98",
      rx: "1.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "15.67",
      y: "16.83",
      width: "17.18",
      height: "2.35",
      rx: "0.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "3.68",
      y: "16.83",
      width: "7.19",
      height: "2.35",
      rx: "0.5"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: '',
          attr: []
        },
        styles: {
          color: {
            Desktop: ''
          },
          borderRadius: {}
        }
      }
    },
    text: {
      type: 'object',
      default: {
        options: {
          enable: true,
          text: 'Custom Text',
          src: '',
          // siteTitle, tagline, siteUrl, currentYear, currentDate, postTitle
          linkTo: '',

          /*postUrl, homeUrl, authorUrl, authorLink, mailTo, custom, customField */
          linkToAuthorMeta: '',
          linkToCustomMeta: '',
          linkTarget: '_blank',
          customUrl: '',
          linkAttr: [],
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          enable: true,
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-check-circle',
          position: 'beforeText',

          /*before, after, prefix, postfix */
          class: 'text-icon'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    linkAttr: {
      "type": "array",
      "default": []
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var text = attributes.text;
    var icon = attributes.icon;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [currentPostContent, setCurrentpostContent] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'content', postId);
    const [customFields, setCustomFields] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    const textEnable = text.options.enable == undefined ? true : text.options.enable; // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    const textSelector = blockClass + ' .text';
    const iconSelector = blockClass + ' .text-icon';
    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';

    function getMetaField(metaKey) {
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7___default()({
        path: '/post-grid/v2/get_post_meta',
        method: 'POST',
        data: {
          postId: postId,
          meta_key: metaKey
        }
      }).then(res => {
        if (res['meta_value'] != undefined && res['meta_value'].length > 0) {
          customFields[metaKey] = res['meta_value'];
          setCustomFields({});
          setCustomFields(customFields);
        }
      });
    }

    var linkToArgsBasic = {
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_11__.applyFilters)('linkToArgs', linkToArgsBasic);
    var textSrcArgs = {
      siteTitle: {
        label: 'Site Title',
        value: 'siteTitle'
      },
      tagline: {
        label: 'Tag line',
        value: 'tagline'
      },
      siteUrl: {
        label: 'Site URL',
        value: 'siteUrl'
      },
      currentYear: {
        label: 'Current Year',
        value: 'currentYear'
      },
      currentDate: {
        label: 'Current Date',
        value: 'currentDate',
        isPro: true
      },
      postTitle: {
        label: 'Post Title',
        value: 'postTitle',
        isPro: true
      }
    }; //var textSrcArgs = applyFilters('textSrcArgs', textSrcArgsX);

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    const [linkPickerExcerpt, setLinkPickerExcerpt] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [linkPickerText, setLinkPickerText] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function setTextSrc(option, index) {
      var options = { ...text.options,
        src: option.value
      };
      setAttributes({
        text: { ...text,
          options: options
        }
      });
    }

    function setFieldLinkTo(option, index) {
      var options = { ...text.options,
        linkTo: option.value
      };
      setAttributes({
        text: { ...text,
          options: options
        }
      });
    }

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryText(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        text[sudoScource] = sudoScourceArgs;
      });
      var textX = Object.assign({}, text);
      setAttributes({
        text: textX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, textSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleText(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, text);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        text: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, textSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleText(sudoScource, key) {
      var object = myStore.deletePropertyDeep(text, [sudoScource, key, breakPointX]);
      setAttributes({
        text: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, textSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleText(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, text);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        text: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddText(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, text);
      obj[sudoScource] = cssObj;
      setAttributes({
        text: obj
      });
      var selector = myStore.getElementSelector(sudoScource, textSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddIcon(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, icon);
      obj[sudoScource] = cssObj;
      setAttributes({
        icon: obj
      });
      var selector = myStore.getElementSelector(sudoScource, iconSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPrefix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, prefix);
      obj[sudoScource] = cssObj;
      setAttributes({
        prefix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, prefixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPostfix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, postfix);
      obj[sudoScource] = cssObj;
      setAttributes({
        postfix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, postfixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    var [linkAttrItemsText, setlinkAttrItemsText] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    var [wrapAttrItems, setwrapAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var sdsd = {};
      text.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItemsText(sdsd);
    }, [text]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var sdsd = {};

      if (wrapper.options.attr != undefined) {
        wrapper.options.attr.map(x => {
          if (x.val) sdsd[x.id] = x.val;
        });
      }

      setwrapAttrItems(sdsd);
    }, [wrapper]);
    var postUrl = text.options.customUrl != undefined && text.options.customUrl.length > 0 ? text.options.customUrl : currentPostUrl;
    const CustomTag = `${wrapper.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-icon`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }, {
        label: 'BUTTON',
        value: 'button'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        if (wrapper.options.attr == undefined) {
          wrapper.options.attr = {};
        }

        var sdsd = wrapper.options.attr.concat({
          id: '',
          val: ''
        });
        var options = { ...wrapper.options,
          attr: sdsd
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }, "Add")), wrapper.options.attr != undefined && wrapper.options.attr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: wrapper.options.attr[i].id,
        onChange: newVal => {
          wrapper.options.attr[i].id = newVal;
          var ssdsd = wrapper.options.attr.concat([]);
          var options = { ...wrapper.options,
            attr: ssdsd
          };
          setAttributes({
            wrapper: { ...wrapper,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          wrapper.options.attr[i].val = newVal;
          var ssdsd = wrapper.options.attr.concat([]);
          var options = { ...wrapper.options,
            attr: ssdsd
          };
          setAttributes({
            wrapper: { ...wrapper,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          wrapper.options.attr.splice(i, 1);
          var ssdsd = wrapper.options.attr.concat([]);
          var options = { ...wrapper.options,
            attr: ssdsd
          };
          setAttributes({
            wrapper: { ...wrapper,
              options: options
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Text",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
      label: "Enable text?",
      help: textEnable ? 'Text enabled' : 'Text disabled.',
      checked: textEnable ? true : false,
      onChange: e => {
        var options = { ...text.options,
          enable: text.options.enable ? false : true
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Text Source"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_20__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: textSrcArgs,
      buttonTitle: textSrcArgs[text.options.src] == undefined ? 'Choose' : textSrcArgs[text.options.src].label,
      onChange: setTextSrc,
      values: []
    })), text.options.src != undefined && text.options.src.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: text.options.text,
      onChange: newVal => {
        var options = { ...text.options,
          text: newVal
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_20__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: linkToArgs[text.options.linkTo] == undefined ? 'Choose' : linkToArgs[text.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), text.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, text.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Author Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: text.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...text.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    })), text.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: text.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...text.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: text.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...text.options,
          linkTarget: newVal
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    }))), text.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: linkPickerText ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        setLinkPickerText(prev => !prev);
      }
    }), text.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
      onClick: ev => {
        var options = { ...text.options,
          customUrl: ''
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    }), linkPickerText && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.__experimentalLinkControl, {
      settings: [],
      value: text.options.customUrl,
      onChange: newVal => {
        var options = { ...text.options,
          customUrl: newVal.url
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        }); //setLinkPickerText(false)
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", text.options.customUrl.length != 0 ? text.options.customUrl : 'No link', " ")))), text.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = text.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...text.options,
          linkAttr: sdsd
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    }, "Add")), text.options.linkAttr != undefined && text.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: text.options.linkAttr[i].id,
        onChange: newVal => {
          text.options.linkAttr[i].id = newVal;
          var ssdsd = text.options.linkAttr.concat([]);
          var options = { ...text.options,
            linkAttr: ssdsd
          };
          setAttributes({
            text: { ...text,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          text.options.linkAttr[i].val = newVal;
          var ssdsd = text.options.linkAttr.concat([]);
          var options = { ...text.options,
            linkAttr: ssdsd
          };
          setAttributes({
            text: { ...text,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          text.options.linkAttr.splice(i, 1);
          var ssdsd = text.options.linkAttr.concat([]);
          var options = { ...text.options,
            linkAttr: ssdsd
          };
          setAttributes({
            text: { ...text,
              options: options
            }
          });
        }
      })));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: text,
      onChange: onChangeStyleText,
      onAdd: onAddStyleText,
      onRemove: onRemoveStyleText,
      onBulkAdd: onBulkAddText
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: text,
      onChange: onPickCssLibraryText
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_14__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Text',
        value: 'beforeText'
      }, {
        label: 'After Text',
        value: 'afterText'
      }, {
        label: 'Before Prefix',
        value: 'beforePrefix'
      }, {
        label: 'After Prefix',
        value: 'afterPrefix'
      }, {
        label: 'Before Postfix',
        value: 'beforePostfix'
      }, {
        label: 'After Postfix',
        value: 'afterPostfix'
      }, {
        label: 'Before Link',
        value: 'beforeLink'
      }, {
        label: 'After Link',
        value: 'afterLink'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon,
      onBulkAdd: onBulkAddIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: { ...prefix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix,
      onBulkAdd: onBulkAddPrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix,
      onBulkAdd: onBulkAddPostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, textSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Prefix Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Postfix Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_15__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_16__["default"], {
      utm: {
        utm_source: 'BlockReadMore',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, wrapAttrItems), icon.options.position == 'beforePrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'afterPrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), text.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforeLink' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "text",
      onClick: handleLinkClick
    }, linkAttrItemsText, {
      target: text.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforeText' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), textEnable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
      tagName: 'span',
      value: text.options.text,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: content => {
        var options = { ...text.options,
          text: content
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
    }), icon.options.position == 'afterText' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), icon.options.position == 'afterLink' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), text.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforeText' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), textEnable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
      className: "text",
      tagName: 'span',
      value: text.options.text,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: content => {
        var options = { ...text.options,
          text: content
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
    }), icon.options.position == 'afterText' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), text.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforeLink' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "text",
      onClick: handleLinkClick
    }, linkAttrItemsText, {
      target: text.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforeText' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), textEnable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
      tagName: 'span',
      value: text.options.text,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: content => {
        var options = { ...text.options,
          text: content
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
    }), icon.options.position == 'afterText' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), icon.options.position == 'afterLink' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), text.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforeText' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), textEnable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
      className: "text",
      tagName: 'span',
      value: text.options.text,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: content => {
        var options = { ...text.options,
          text: content
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
    }), icon.options.position == 'afterText' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/image-gallery-item/index.js":
/*!************************************************!*\
  !*** ./src/blocks/image-gallery-item/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");













const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/image-gallery-item", {
  apiVersion: 2,
  title: "Image Gallery Item",
  parent: ['post-grid/image-gallery'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      id: "Layer_1",
      "data-name": "Layer 1",
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "14.58 11.45 13.45 11.45 13.45 9.46 15.43 9.46 15.43 10.6 14.58 10.6 14.58 11.45"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "17.14",
      y: "9.46",
      width: "1.71",
      height: "1.14"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "22.55 11.45 21.42 11.45 21.42 10.6 20.57 10.6 20.57 9.46 22.55 9.46 22.55 11.45"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M22.55,21.93H21.42V19.31h1.13Zm0-5.24H21.42V14.07h1.13Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "22.55 26.54 20.57 26.54 20.57 25.41 21.42 25.41 21.42 24.55 22.55 24.55 22.55 26.54"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "17.14",
      y: "25.41",
      width: "1.71",
      height: "1.14"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "15.43 26.54 13.45 26.54 13.45 24.55 14.58 24.55 14.58 25.41 15.43 25.41 15.43 26.54"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M14.58,21.93H13.45V19.31h1.13Zm0-5.24H13.45V14.07h1.13Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "19.07",
      width: "11.34",
      height: "7.47",
      transform: "translate(11.34 45.61) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "9.46",
      width: "11.34",
      height: "7.47",
      transform: "translate(11.34 26.39) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "24.66",
      y: "19.07",
      width: "11.34",
      height: "7.47",
      transform: "translate(60.66 45.61) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "24.66",
      y: "9.46",
      width: "11.34",
      height: "7.47",
      transform: "translate(60.66 26.39) rotate(180)"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'grid-item-wrap'
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ['post-grid/galleryId', 'post-grid/lightbox'],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss); //blockCssY.items = [];
      //blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'flex-grow': { "Desktop": "1" } };
      //blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'flex-basis': { "Desktop": "0" } };
      //setAttributes({ blockCssY: { items: blockCssY.items } });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);

    function generateElementSudoCss(obj) {
      var stylesObj = {};
      Object.entries(obj).map(args => {
        var sudoSrc = args[0];
        var sudoArgs = args[1];

        if (sudoSrc != 'options') {
          var selector = myStore.getElementSelector(sudoSrc, wrapperSelector); //console.log(selector);
          //console.log(sudoArgs);

          Object.entries(args[1]).map(x => {
            var attr = x[0];
            var cssPropty = myStore.cssAttrParse(attr);

            if (stylesObj[selector] == undefined) {
              stylesObj[selector] = {};
            }

            if (stylesObj[selector][cssPropty] == undefined) {
              stylesObj[selector][cssPropty] = {};
            }

            stylesObj[selector][cssPropty] = x[1];
          });
        } //console.log(stylesObj);

      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      }; //console.log(cssItemsX);

      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      //console.log(wrapper);
      //setAttributes({ customCss: customCss });
      ///myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      var elementCss = generateElementSudoCss(wrapper); //console.log(elementCss);
    }, [wrapper]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const MY_TEMPLATE = [['post-grid/image', {
      "wrapper": {
        "options": {
          "tag": "",
          "class": "",
          "useAsBackground": "no"
        },
        "styles": {
          width: {
            Desktop: '100%'
          },
          height: {
            Desktop: '100% !important'
          },
          objectFit: {
            Desktop: 'cover'
          }
        }
      },
      "image": {
        "options": {
          imgSrcType: 'media',
          imgSrcMetaKey: '',
          imgSrcMetaKeyType: 'ID',
          imgSrcImgId: '',
          srcUrl: '',
          srcId: '',
          linkTo: '',
          linkToMetaKey: '',
          linkTocustomUrl: '',
          altTextSrc: 'imgAltText',
          altTextCustom: '',
          altTextMetaKey: '',
          titleTextSrc: 'imgTitle',
          titleTextCustom: '',
          titleTextMetaKey: '',
          linkTarget: '_blank',
          linkAttr: [],
          class: '',
          size: {
            "Desktop": "full",
            "Tablet": "full",
            "Mobile": "full"
          }
        },
        "styles": {
          width: {
            Desktop: '100%'
          },
          height: {
            Desktop: '100%'
          },
          objectFit: {
            Desktop: 'cover'
          }
        }
      },
      "lightbox": {
        "options": {
          "enable": false,
          "class": ""
        },
        "styles": {}
      }
    }]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-image-gallery-item border border-dashed`
    }); //const isParentOfSelectedBlock = useSelect((select) => select('core/block-editor').hasSelectedInnerBlock(clientId, true))

    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      //allowedBlocks: ALLOWED_BLOCKS,
      template: MY_TEMPLATE,
      //orientation: 'horizontal',
      templateInsertUpdatesSelection: true,
      renderAppender: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.ButtonBlockAppender
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, innerBlocksProps.children));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-image-gallery-item`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null);
  }
});

/***/ }),

/***/ "./src/blocks/image-gallery/index.js":
/*!*******************************************!*\
  !*** ./src/blocks/image-gallery/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./variations */ "./src/blocks/image-gallery/variations.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");


















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/image-gallery", {
  apiVersion: 2,
  title: "Image Gallery",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "0.62",
      y: "3.01",
      width: "16.33",
      height: "29.98"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "10.11 13.85 6.75 18.67 5.42 16.76 1.66 22.16 15.9 22.16 10.11 13.85"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "20.25",
      y: "1.81",
      width: "13.93",
      height: "16.33",
      transform: "translate(37.19 -17.24) rotate(90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "28.38 6.37 25.45 10.56 24.3 8.9 21.03 13.58 33.41 13.58 28.38 6.37"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "20.25",
      y: "17.86",
      width: "13.93",
      height: "16.33",
      transform: "translate(53.24 -1.19) rotate(90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "28.38 22.42 25.45 26.61 24.3 24.95 21.03 29.64 33.41 29.64 28.38 22.42"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    lightbox: {
      type: 'object',
      default: {
        options: {
          enable: true
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  //usesContext: [],
  providesContext: {
    'post-grid/galleryId': 'blockId',
    'post-grid/lightbox': 'lightbox'
  },
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var lightbox = attributes.lightbox;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__.applyFilters)('isProFeature', true); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    const {
      replaceInnerBlocks
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useDispatch)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store);
    const hasInnerBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store).getBlocks(clientId).length > 0, [clientId]); //console.log(JSON.stringify(wp.data.select(blockEditorStore).getBlocks(clientId)));

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss); // blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'display': { "Desktop": "grid" } };
      // blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'gap': { "Desktop": "20px" } };
      // setAttributes({ blockCssY: { items: blockCssY.items } });
      //setAttributes({ wrapper: { ...wrapper, styles: { display: { Desktop: 'grid' }, gap: { Desktop: '20px' } } } });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function applyFlex(attr, newVal) {
      onChangeStyleWrapper('styles', newVal, attr);
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    const ALLOWED_BLOCKS = ['post-grid/image-gallery-item'];
    const MY_TEMPLATE = [['post-grid/image-gallery-item', {}], ['post-grid/image-gallery-item', {}], ['post-grid/image-gallery-item', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-image-gallery `
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      allowedBlocks: ALLOWED_BLOCKS,
      //template: MY_TEMPLATE,
      orientation: 'horizontal',
      templateInsertUpdatesSelection: true //renderAppender: InnerBlocks.ButtonBlockAppender

    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
        console.log(wrapper);
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Lightbox",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Enable"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: lightbox.options.enable,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: 'True',
        value: 'true'
      }, {
        label: 'False',
        value: 'false'
      }],
      onChange: newVal => {
        var options = { ...lightbox.options,
          enable: newVal
        };
        setAttributes({
          lightbox: { ...lightbox,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: ""
    }, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400 hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        var wrapperX = { ...wrapper,
          styles: {
            gridTemplateColumns: {
              Desktop: '1fr 1fr'
            },
            gap: {
              Desktop: '1em'
            },
            display: {
              Desktop: 'grid'
            }
          }
        };
        setAttributes({
          wrapper: wrapperX
        });
        var elementCss = myStore.generateElementCss(wrapperX, wrapperSelector);
        var itemsX = { ...blockCssY.items,
          ...elementCss
        };
        setAttributes({
          blockCssY: {
            items: itemsX
          }
        });
        myStore.generateBlockCss(blockCssY.items, blockId, customCss);
        replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)([['post-grid/image-gallery-item', {
          "wrapper": {
            "options": {
              "tag": "div",
              "class": "grid-item-wrap"
            },
            "styles": {}
          }
        }], ['post-grid/image-gallery-item', {
          "wrapper": {
            "options": {
              "tag": "div",
              "class": "grid-item-wrap"
            },
            "styles": {}
          }
        }]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_17__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 bg-gray-400 cursor-pointer hover:bg-gray-500 relative",
        onClick: ev => {
          if (variation.isPro && isProFeature) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var wrapperX = { ...wrapper,
            styles: variation.wrapObj.styles
          };
          setAttributes({
            wrapper: wrapperX
          });
          var elementCss = myStore.generateElementCss(wrapperX, wrapperSelector);
          var itemsX = { ...blockCssY.items,
            ...elementCss
          };
          setAttributes({
            blockCssY: {
              items: itemsX
            }
          });
          myStore.generateBlockCss(blockCssY.items, blockId, customCss);
          replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)(variation.innerBlocks), true);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, innerBlocksProps.children)));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/image-gallery/variations.js":
/*!************************************************!*\
  !*** ./src/blocks/image-gallery/variations.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__);


/**
 * WordPress dependencies
 */


let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('isProFeature', true);
/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: 'layout-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-1'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-1'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr '
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-2',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-2'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-2'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "83.33 13.33 83.33 43.33 83.33 66.67 118.33 66.67 118.33 43.33 118.33 13.33 83.33 13.33"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "41.67 13.33 41.67 43.33 41.67 66.67 76.67 66.67 76.67 43.33 76.67 13.33 41.67 13.33"
  }))
}, {
  name: 'layout-3',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-3'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-3'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(201.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(160 49.99) rotate(180)"
  }))
}, {
  name: 'layout-4',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-4'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-4'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-5',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-5'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-5'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "41.67 13.33 41.67 43.33 41.67 66.67 76.67 66.67 76.67 43.33 76.67 13.33 41.67 13.33"
  }))
}, {
  name: 'layout-6',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-6'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-6'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr '
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '2'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "118.33 66.67 118.33 36.67 118.33 13.33 83.33 13.33 83.33 36.67 83.33 66.67 118.33 66.67"
  }))
}, {
  name: 'layout-7',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-7'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-7'),
  isPro: false,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34"
  }))
}, {
  name: 'layout-8',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-8'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-8'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "20.83 13.33 20.83 43.33 20.83 66.67 55.83 66.67 55.83 43.33 55.83 13.33 20.83 13.33"
  }))
}, {
  name: 'layout-9',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-9'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-9'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '2'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "35",
    height: "53.35",
    transform: "translate(160 80) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 49.99) rotate(180)"
  }))
}, {
  name: 'layout-10',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-10'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-10'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "23.84",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(82.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "65.5",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(166.01 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "23.84",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(82.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "65.5",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(166.01 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "142.17 66.67 142.17 36.67 142.17 13.33 107.17 13.33 107.17 36.67 107.17 66.67 142.17 66.67"
  }))
}, {
  name: 'layout-11',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-11'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-11'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(160 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(118.33 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 49.99) rotate(180)"
  }))
}, {
  name: 'layout-12',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-12'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-12'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '2'
        },
        gridColumnEnd: {
          Desktop: '4'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(160 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(201.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 110.01) rotate(180)"
  }))
}, {
  name: 'layout-13',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-13'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-13'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(160 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 49.99) rotate(180)"
  }))
}, {
  name: 'layout-14',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-14'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-14'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '2'
        },
        gridColumnEnd: {
          Desktop: '4'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "43.33",
    width: "76.67",
    height: "23.34",
    transform: "translate(201.67 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "20.83",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(76.67 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "62.5",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(160 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "104.17",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(243.33 49.99) rotate(180)"
  }))
}, {
  name: 'layout-15',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 15'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 15'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '3'
        },
        gridColumnEnd: {
          Desktop: '5'
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "125",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-16',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 16'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 16'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "125",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  })),
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '3'
        },
        gridColumnEnd: {
          Desktop: '5'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block']
}, {
  name: 'layout-17',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 17'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 17'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "125",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "13.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "0 13.33 0 43.33 0 66.67 35 66.67 35 43.33 35 13.33 0 13.33"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "125",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "83.33",
    y: "43.33",
    width: "35",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "41.67 13.33 41.67 43.33 41.67 66.67 76.67 66.67 76.67 43.33 76.67 13.33 41.67 13.33"
  })),
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '2'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '2'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block']
}, {
  name: 'layout-18',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 18'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('Layout 18'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(35 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "160 66.67 160 36.67 160 13.33 125 13.33 125 36.67 125 66.67 160 66.67"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(35 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 49.99) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "118.33 66.67 118.33 36.67 118.33 13.33 83.33 13.33 83.33 36.67 83.33 66.67 118.33 66.67"
  })),
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '3'
        },
        gridColumnEnd: {
          Desktop: '4'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '4'
        },
        gridColumnEnd: {
          Desktop: '5'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block']
}, {
  name: 'layout-19',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-19'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-19'),
  isPro: !isProFeature ? false : true,
  wrapObj: {
    "options": {
      "tag": "div",
      "class": "grid-item-wrap"
    },
    "styles": {
      gridTemplateColumns: {
        Desktop: '1fr 1fr 1fr 1fr'
      },
      gridTemplateRows: {
        Desktop: '400px 400px '
      },
      gap: {
        Desktop: '1em'
      },
      display: {
        Desktop: 'grid'
      }
    }
  },
  innerBlocks: [['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridColumnStart: {
          Desktop: '1'
        },
        gridColumnEnd: {
          Desktop: '3'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '3'
        },
        gridColumnEnd: {
          Desktop: '4'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {
        backgroundColor: {
          Desktop: '#2563eb24'
        },
        gridRowStart: {
          Desktop: '1'
        },
        gridRowEnd: {
          Desktop: '3'
        },
        gridColumnStart: {
          Desktop: '4'
        },
        gridColumnEnd: {
          Desktop: '5'
        }
      }
    }
  }], ['post-grid/image-gallery-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "grid-item-wrap"
      },
      "styles": {}
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(35 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "35",
    height: "23.34",
    transform: "translate(118.33 110.01) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "160 66.67 160 36.67 160 13.33 125 13.33 125 36.67 125 66.67 160 66.67"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
    fill: "#1d4ed8",
    points: "118.33 66.67 118.33 36.67 118.33 13.33 83.33 13.33 83.33 36.67 83.33 66.67 118.33 66.67"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/image/index.js":
/*!***********************************!*\
  !*** ./src/blocks/image/index.js ***!
  \***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_11__);
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_toggle__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/toggle */ "./src/components/toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./placeholder.jpg */ "./src/blocks/image/placeholder.jpg");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
















const {
  RawHTML
} = wp.element;




__webpack_require__(/*! fslightbox */ "./node_modules/fslightbox/index.js");














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/image", {
  apiVersion: 2,
  title: "Image",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M36,36H0V0H36ZM2.08,33.94H33.92V2.06H2.08Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "20.08 11.51 14.83 19.05 12.75 16.06 6.87 24.49 29.13 24.49 20.08 11.51"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: '',
          useAsBackground: 'no'
        },
        styles: {
          width: {
            Desktop: ''
          },
          height: {
            Desktop: ''
          },
          overflow: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    image: {
      type: 'object',
      default: {
        options: {
          imgSrcType: 'media',

          /*media, customField, customUrl, imgId */
          imgSrcMetaKey: '',
          imgSrcMetaKeyType: 'ID',
          //ID, URL,
          imgSrcImgId: '',
          srcUrl: '',
          srcId: '',
          linkTo: '',
          // postUrl, customField, authorUrl, authorLink, homeUrl, custom
          linkToMetaKey: '',
          linkTocustomUrl: '',
          altTextSrc: 'imgAltText',
          // imgAltText, imgTitle, imgCaption, imgDescription imgName, imgSlug, postTitle, excerpt, postSlug, customField, custom
          altTextCustom: '',
          altTextMetaKey: '',
          titleTextSrc: 'imgTitle',
          // imgAltText, imgTitle, imgCaption, imgDescription imgName, imgSlug, postTitle, excerpt, postSlug, customField, custom
          titleTextCustom: '',
          titleTextMetaKey: '',
          linkTarget: '_blank',
          linkAttr: [],
          class: '',
          size: {
            "Desktop": "full",
            "Tablet": "full",
            "Mobile": "full"
          }
        },
        styles: {
          width: {
            Desktop: '100%'
          },
          height: {
            Desktop: '100%'
          },
          filter: {},
          objectFit: {
            Desktop: 'cover'
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    lightbox: {
      type: 'object',
      default: {
        options: {
          enable: false
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId", "post-grid/galleryId", "post-grid/lightbox"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var galleryId = context['post-grid/galleryId'] == undefined ? null : context['post-grid/galleryId'];
    var galleryLightbox = context['post-grid/lightbox'] == undefined ? null : context['post-grid/lightbox'];
    let image = attributes.image;
    var wrapper = attributes.wrapper;
    var lightbox = attributes.lightbox;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [loading, setLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [linkPickerSrcUrl, setlinkPickerSrcUrl] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [postImage, setPostImage] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(null);
    const [imageObj, setImageObj] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); //{src:'', altText:'', sizes:{}}

    const [imageSizes, setImageSizes] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]);
    let filterArgsBasic = [{
      label: 'Blur',
      isPro: false,
      value: 'blur',
      val: '',
      unit: 'px'
    }, {
      label: 'Brightness',
      isPro: false,
      value: 'brightness',
      val: '10',
      unit: '%'
    }, {
      label: 'Contrast',
      isPro: true,
      value: 'contrast',
      val: '10',
      unit: '%'
    }, {
      label: 'Grayscale',
      isPro: true,
      value: 'grayscale',
      val: '10',
      unit: '%'
    }, {
      label: 'Hue-rotate',
      isPro: true,
      value: 'hue-rotate',
      val: '10',
      unit: 'deg'
    }, {
      label: 'Invert',
      isPro: true,
      value: 'invert',
      val: '10',
      unit: '%'
    }, {
      label: 'Opacity',
      isPro: true,
      value: 'opacity',
      val: '10',
      unit: '%'
    }, {
      label: 'Saturate',
      isPro: true,
      value: 'saturate',
      val: '10',
      unit: '%'
    }, {
      label: 'Sepia',
      value: 'sepia',
      val: '10',
      unit: '%'
    }];
    let filterArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('imageFilterArgs', filterArgsBasic);
    var linkToArgsBasic = {
      noUrl: {
        label: 'No URL',
        value: ''
      },
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('linkToArgs', linkToArgsBasic);
    var customTagArgsBasic = {
      h1: {
        label: 'H1',
        value: 'h1'
      },
      h2: {
        label: 'H2',
        value: 'h2'
      },
      h3: {
        label: 'H3',
        value: 'h3'
      },
      h4: {
        label: 'H4',
        value: 'h4'
      },
      h5: {
        label: 'H5',
        value: 'h5'
      },
      h6: {
        label: 'H6',
        value: 'h6'
      },
      span: {
        label: 'SPAN',
        value: 'span'
      },
      div: {
        label: 'DIV',
        value: 'div'
      },
      p: {
        label: 'P',
        value: 'p'
      }
    };
    let customTagArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('customTagArgs', customTagArgsBasic);
    var altTextSrcArgsBasic = {
      'none': {
        label: 'No Alt Text',
        value: ''
      },
      'imgAltText': {
        label: 'Image Alt Text',
        value: 'imgAltText'
      },
      'imgTitle': {
        label: 'Image Title',
        value: 'imgTitle'
      },
      'imgCaption': {
        label: 'Image Caption',
        value: 'imgCaption'
      },
      'imgDescription': {
        label: 'Image Description',
        value: 'imgDescription'
      },
      'imgSlug': {
        label: 'Image Slug',
        value: 'imgSlug'
      },
      'postTitle': {
        label: 'Post Title',
        value: 'postTitle'
      },
      'postSlug': {
        label: 'Post Slug',
        value: 'postSlug'
      },
      'excerpt': {
        label: 'Post Excerpt',
        value: 'excerpt',
        isPro: true
      },
      'customField': {
        label: 'Post Custom Field',
        value: 'customField',
        isPro: true
      },
      'custom': {
        label: 'Custom',
        value: 'custom',
        isPro: true
      }
    };
    let altTextSrcArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('altTextSrcArgs', altTextSrcArgsBasic);
    const ALLOWED_MEDIA_TYPES = ['image'];
    const [currentPostImageId, setCurrentPostImageId] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(image.options.srcId);
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      if (currentPostImageId.length != 0 && image.options.imgSrcType == 'media') {
        setLoading(true);
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_11___default()({
          path: '/wp/v2/media/' + currentPostImageId,
          method: 'POST',
          data: {
            id: currentPostImageId
          }
        }).then(res => {
          setPostImage(res);
          var options = { ...image.options,
            srcUrl: res.source_url,
            srcId: res.id
          };
          setAttributes({
            image: { ...image,
              options: options
            }
          });
          setLoading(false);
          var imgSizes = [];
          Object.keys(res.media_details.sizes).map(x => {
            var height = res.media_details.sizes[x].height;
            var width = res.media_details.sizes[x].width; //var crop = res[x].crop

            imgSizes.push({
              label: x + "(" + width + "*" + height + ")",
              value: x,
              height: height,
              width: width
            });
          });
          setImageSizes(imgSizes);
        }); // apiFetch({
        //   path: '/post-grid/v2/get_image_sizes',
        //   method: 'POST',
        //   data: {},
        // }).then((res) => {
        //   var imgSizes = [];
        //   Object.keys(res).map(x => {
        //     var height = res[x].height
        //     var width = res[x].width
        //     var crop = res[x].crop
        //     imgSizes.push({ label: x + "(" + width + "*" + height + ")", value: x, height: height, width: width, crop: crop });
        //   })
        //   setImageSizes(imgSizes)
        // });
      }
    }, [currentPostImageId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      if (image.options.imgSrcMetaKey.length != 0) {
        setLoading(true);
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_11___default()({
          path: '/post-grid/v2/get_post_meta',
          method: 'POST',
          data: {
            postId: postId,
            meta_key: image.options.imgSrcMetaKey,
            type: 'string',
            template: ''
          }
        }).then(res => {
          var metaKeyType = image.options.imgSrcMetaKeyType != undefined ? image.options.imgSrcMetaKeyType : 'ID';

          if (metaKeyType == 'ID') {
            setCurrentPostImageId(res.meta_value);
          } else {
            console.log(res.meta_value); //setPostImage(res)

            setPostImage({
              media_details: {
                sizes: {}
              },
              guid: {
                rendered: res.meta_value
              }
            });
          }

          setLoading(false);
        });
      }
    }, [image.options.imgSrcMetaKey, image.options.imgSrcMetaKeyType, image.options.imgSrcType]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      console.log(wrapper);
      var blockCssObj = {};
      blockCssObj[wrapperSelector] = wrapper;
      blockCssObj[imgSelector] = image; //setAttributes({ wrapper: wrapper, image: image, });

      var blockCssRules = myStore.getBlockCssRules(blockCssObj);
      var items = { ...blockCssY.items,
        ...blockCssRules
      };
      setAttributes({
        blockCssY: {
          items: items
        }
      });
    }, [wrapper]);

    function setFeaturedImageSize(option, index) {
      var newValuesObj = {};

      if (Object.keys(image.options.size).length == 0) {
        newValuesObj[breakPointX] = option.value;
      } else {
        newValuesObj = image.options.size;
        newValuesObj[breakPointX] = option.value;
      }

      var options = { ...image.options,
        size: newValuesObj
      };
      setAttributes({
        image: { ...image,
          options: options
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ image: image });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss); //blockCssY.items[imgSelector] = { ...blockCssY.items[imgSelector], 'width': { "Desktop": "100%" } };
      //blockCssY.items[imgSelector] = { ...blockCssY.items[imgSelector], 'height': { "Desktop": "auto" } };
      //setAttributes({ blockCssY: { items: blockCssY.items } });
    }, [clientId]); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var linkSelector = '';
    var imgSelector = '';

    if (wrapper.options.tag.length != 0) {
      var imgSelector = blockClass + ' img';

      if (image.options.linkTo.length > 0) {
        linkSelector = blockClass + ' a';
      } else {
        linkSelector = blockClass;
      }
    } else {
      linkSelector = blockClass;
      var imgSelector = 'img' + blockClass;
    }

    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function handleLinkClickX(ev, src) {
      if (lightbox.options.enable == true) {
        var lightboxHandle = new FsLightbox();
        lightboxHandle.props.sources = [src];
        lightboxHandle.open();
      }

      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryImage(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        image[sudoScource] = sudoScourceArgs;
      });
      var imageX = Object.assign({}, image);
      setAttributes({
        image: imageX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, imgSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleImage(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, image);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        image: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, imgSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleImage(sudoScource, key) {
      var object = myStore.deletePropertyDeep(image, [sudoScource, key, breakPointX]);
      setAttributes({
        image: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, imgSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleImage(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, image);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        image: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddImage(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, image);
      obj[sudoScource] = cssObj;
      setAttributes({
        image: obj
      });
      var selector = myStore.getElementSelector(sudoScource, imageSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
    }, [image]);

    var linkAttrObj = () => {
      var sdsd = {};
      image.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    var postUrl = image.options.linkTocustomUrl != undefined && image.options.linkTocustomUrl.length > 0 ? image.options.linkTocustomUrl : currentPostUrl;
    const CustomTag = `${wrapper.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-post-image`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Image Sources"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: image.options.imgSrcType,
      options: [{
        label: 'Media',
        value: 'media'
      }, {
        label: 'Custom Field',
        value: 'customField'
      }, {
        label: 'Image Source URL',
        value: 'customUrl'
      } // { label: 'Image ID', value: 'imgId' },
      ],
      onChange: newVal => {
        var options = { ...image.options,
          imgSrcType: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    })), image.options.srcUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
      src: image.options.srcUrl,
      alt: ""
    }), image.options.srcUrl.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
      src: _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__,
      alt: ""
    }), image.options.imgSrcType == 'media' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "mt-5",
      for: ""
    }, "Choose Image"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.MediaUploadCheck, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.MediaUpload, {
      class: "bg-blue-500",
      onSelect: media => {
        // media.id
        setCurrentPostImageId(media.id);
        var options = { ...image.options,
          srcUrl: media.url,
          srcId: media.id
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      },
      onClose: () => {},
      allowedTypes: ALLOWED_MEDIA_TYPES,
      value: image.options.srcId,
      render: _ref => {
        let {
          open
        } = _ref;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
          className: "my-3 bg-blue-500 text-white border border-solid border-gray-300 text-center w-full",
          onClick: open
        }, "Open Media Library");
      }
    }))), image.options.imgSrcType == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: image.options.imgSrcMetaKey,
      onChange: newVal => {
        var options = { ...image.options,
          imgSrcMetaKey: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Metakey Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: image.options.imgSrcMetaKeyType,
      options: [{
        label: 'ID',
        value: 'ID'
      }, {
        label: 'URL',
        value: 'URL'
      }],
      onChange: newVal => {
        var options = { ...image.options,
          imgSrcMetaKeyType: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    }))), image.options.imgSrcType == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Image URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: linkPickerSrcUrl ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
      onClick: ev => {
        setlinkPickerSrcUrl(prev => !prev);
      }
    }), image.options.srcUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
      onClick: ev => {
        var options = { ...image.options,
          srcUrl: ''
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
        setlinkPickerSrcUrl(false);
      }
    }), linkPickerSrcUrl && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.__experimentalLinkControl, {
      settings: [],
      value: image.options.srcUrl,
      onChange: newVal => {
        var options = { ...image.options,
          srcUrl: newVal.url
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
        setImageObj({ ...imageObj,
          src: newVal.url
        });
        setPostImage({ ...postImage,
          media_details: {
            sizes: {}
          },
          guid: {
            rendered: newVal.url
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Image Source URL:"), " ", image.options.srcUrl.length != 0 ? image.options.srcUrl : 'No link', " "))))), image.options.imgSrcType == 'imgId' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Image ID"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: image.options.imgSrcImgId,
      onChange: newVal => {
        var options = { ...image.options,
          imgSrcImgId: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: {
            styles: wrapper.styles,
            options: options
          }
        });
      }
    })), wrapper.options.tag.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Image as Background"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: wrapper.options.useAsBackground,
      options: [{
        label: 'No',
        value: 'no'
      }, {
        label: 'Yes',
        value: 'yes'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          useAsBackground: newVal
        };
        var styles = { ...wrapper.styles,
          backgroundImage: {}
        };

        if (newVal == 'no') {
          setAttributes({
            wrapper: { ...wrapper,
              options: options,
              styles: styles
            }
          });
          var itemsX = { ...blockCssY.items
          };
          itemsX[wrapperSelector] = { ...blockCssY.items[wrapperSelector],
            'background-image': {}
          };
          setAttributes({
            blockCssY: {
              items: itemsX
            }
          });
        }

        if (newVal == 'yes') {
          var newValuesObj = {};

          if (wrapper.styles.backgroundImage == undefined || Object.keys(wrapper.styles.backgroundImage).length == 0) {
            newValuesObj[breakPointX] = 'url("' + postImage.guid.rendered + '")';
          } else {
            newValuesObj = wrapper.styles.backgroundImage;
            newValuesObj[breakPointX] = 'url("' + postImage.guid.rendered + '")';
          }

          var styles = { ...wrapper.styles,
            backgroundImage: newValuesObj
          };
          setAttributes({
            wrapper: { ...wrapper,
              styles: styles,
              options: options
            }
          });
          var itemsX = { ...blockCssY.items
          };
          itemsX[wrapperSelector] = { ...blockCssY.items[wrapperSelector],
            'background-image': newValuesObj
          };
          setAttributes({
            blockCssY: {
              items: itemsX
            }
          });
        }
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Image",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (image.options.imgSrcType == 'media' || image.options.imgSrcType == 'customField') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Thumbnail Size"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: imageSizes,
      buttonTitle: "Choose",
      onChange: setFeaturedImageSize,
      values: image.options.size[breakPointX]
    })), image.options.size[breakPointX] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-400 text-white px-3 py-2 my-3"
    }, " ", image.options.size[breakPointX])), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: linkToArgs[image.options.linkTo] == undefined || image.options.linkTo.length == 0 ? 'Choose' : linkToArgs[image.options.linkTo].label,
      options: linkToArgs,
      onChange: (option, index) => {
        var options = { ...image.options,
          linkTo: option.value
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      },
      values: ""
    })), image.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: image.options.linkToMetaKey,
      onChange: newVal => {
        var options = { ...image.options,
          linkToMetaKey: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    })), image.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), image.options.linkTocustomUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
      onClick: ev => {
        var options = { ...image.options,
          linkTocustomUrl: ''
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.__experimentalLinkControl, {
      settings: [],
      value: image.options.linkTocustomUrl,
      onChange: newVal => {
        var options = { ...image.options,
          linkTocustomUrl: newVal.url
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", image.options.linkTocustomUrl.length != 0 ? image.options.linkTocustomUrl : 'No link', " ")))), image.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: image.options.linkTarget,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...image.options,
          linkTarget: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Alt Text Source"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: image.options.altTextSrc.length == 0 ? 'Choose' : altTextSrcArgs[image.options.altTextSrc].label,
      options: altTextSrcArgs,
      onChange: (option, index) => {
        var options = { ...image.options,
          altTextSrc: option.value
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      },
      values: ""
    })), image.options.altTextSrc == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Custom Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: 'Choose',
      options: [{
        label: 'Custom',
        value: ''
      }, {
        label: 'Yoast meta',
        value: '_yoast_wpseo_metadesc'
      }, {
        label: 'Rank Math meta',
        value: 'rank_math_description'
      }, {
        label: 'AIO SEO meta',
        value: '_aioseo_og_description'
      }, {
        label: 'SEOPress meta',
        value: '_seopress_titles_desc'
      }, {
        label: 'WP Meta SEO meta',
        value: '_metaseo_metadesc'
      }, {
        label: 'The SEO Framework meta',
        value: '_genesis_description'
      }, {
        label: 'SEO SIMPLE PACK meta',
        value: 'ssp_meta_description'
      }],
      onChange: (option, index) => {
        var options = { ...image.options,
          altTextMetaKey: option.value
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      },
      values: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: image.options.altTextMetaKey,
      onChange: newVal => {
        var options = { ...image.options,
          altTextMetaKey: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    }))), image.options.altTextSrc == 'custom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Alt Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: image.options.altTextCustom,
      onChange: newVal => {
        var options = { ...image.options,
          altTextCustom: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Title Text Source"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: image.options.titleTextSrc == undefined || image.options.titleTextSrc.length == 0 ? 'Choose' : altTextSrcArgs[image.options.titleTextSrc].label,
      options: altTextSrcArgs,
      onChange: (option, index) => {
        var options = { ...image.options,
          titleTextSrc: option.value
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      },
      values: ""
    })), image.options.titleTextSrc == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Custom Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: 'Choose',
      options: [{
        label: 'Custom',
        value: ''
      }, {
        label: 'Yoast meta',
        value: '_yoast_wpseo_metadesc'
      }, {
        label: 'Rank Math meta',
        value: 'rank_math_description'
      }, {
        label: 'AIO SEO meta',
        value: '_aioseo_og_description'
      }, {
        label: 'SEOPress meta',
        value: '_seopress_titles_desc'
      }, {
        label: 'WP Meta SEO meta',
        value: '_metaseo_metadesc'
      }, {
        label: 'The SEO Framework meta',
        value: '_genesis_description'
      }, {
        label: 'SEO SIMPLE PACK meta',
        value: 'ssp_meta_description'
      }],
      onChange: (option, index) => {
        var options = { ...image.options,
          titleTextMetaKey: option.value
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      },
      values: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: image.options.titleTextMetaKey,
      onChange: newVal => {
        var options = { ...image.options,
          titleTextMetaKey: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    }))), image.options.titleTextSrc == 'custom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Title Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: image.options.titleTextCustom,
      onChange: newVal => {
        var options = { ...image.options,
          titleTextCustom: newVal
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = image.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...image.options,
          linkAttr: sdsd
        };
        setAttributes({
          image: { ...image,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), image.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: image.options.linkAttr[i].id,
        onChange: newVal => {
          image.options.linkAttr[i].id = newVal;
          var ssdsd = image.options.linkAttr.concat([]);
          var options = { ...image.options,
            linkAttr: ssdsd
          };
          setAttributes({
            image: { ...image,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          image.options.linkAttr[i].val = newVal;
          var ssdsd = image.options.linkAttr.concat([]);
          var options = { ...image.options,
            linkAttr: ssdsd
          };
          setAttributes({
            image: { ...image,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          image.options.linkAttr.splice(i, 1);
          var ssdsd = image.options.linkAttr.concat([]);
          var options = { ...image.options,
            linkAttr: ssdsd
          };
          setAttributes({
            image: { ...image,
              options: options
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: image,
      onChange: onChangeStyleImage,
      onAdd: onAddStyleImage,
      onRemove: onRemoveStyleImage,
      onBulkAdd: onBulkAddImage
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: image,
      onChange: onPickCssLibraryImage
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Lightbox",
      initialOpen: false,
      className: galleryId != null ? 'hidden' : ''
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Enable"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: lightbox.options.enable,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: 'True',
        value: 'true'
      }, {
        label: 'False',
        value: 'false'
      }],
      onChange: newVal => {
        var options = { ...lightbox.options,
          enable: newVal
        };
        setAttributes({
          lightbox: { ...lightbox,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title link"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, linkSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockImage',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, loading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Spinner, null)), !loading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postImage != null && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.useAsBackground == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps), wrapper.options.useAsBackground == 'no' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, image.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      onClick: handleLinkClick
    }, blockProps, {
      href: postUrl,
      target: image.options.linkTarget
    }), postImage.media_details.sizes[image.options.size[breakPointX]] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: postImage.guid.rendered != undefined ? postImage.guid.rendered : '',
      alt: postImage.alt_text
    })), postImage.media_details.sizes[image.options.size[breakPointX]] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: postImage.media_details.sizes[image.options.size[breakPointX]].source_url,
      alt: postImage.alt_text
    }))), image.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postImage.media_details.sizes[image.options.size[breakPointX]] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, linkAttrItems, {
      src: postImage.guid.rendered != undefined ? postImage.guid.rendered : '',
      alt: postImage.alt_text
    })), postImage.media_details.sizes[image.options.size[breakPointX]] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, linkAttrItems, {
      src: postImage.media_details.sizes[image.options.size[breakPointX]].source_url,
      alt: postImage.alt_text
    })))), wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps, image.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      onClick: e => {
        handleLinkClickX(e, postImage.media_details.sizes[image.options.size[breakPointX]].source_url);
      },
      href: postUrl,
      target: image.options.linkTarget
    }, postImage.media_details.sizes[image.options.size[breakPointX]] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: postImage.media_details.sizes[image.options.size[breakPointX]].source_url,
      alt: postImage.alt_text
    })), postImage.media_details.sizes[image.options.size[breakPointX]] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: postImage.guid.rendered != undefined ? postImage.guid.rendered : '',
      alt: postImage.alt_text
    }))), image.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (image.options.imgSrcType == 'media' || image.options.imgSrcType == 'customField') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postImage.media_details.sizes[image.options.size[breakPointX]] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      onClick: e => {
        handleLinkClickX(e, postImage.media_details.sizes[image.options.size[breakPointX]].source_url);
      },
      src: postImage.media_details.sizes[image.options.size[breakPointX]] != undefined ? postImage.media_details.sizes[image.options.size[breakPointX]].source_url : '',
      alt: postImage.alt_text
    })), postImage.media_details.sizes[image.options.size[breakPointX]] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      onClick: e => {
        handleLinkClickX(e, postImage.media_details.sizes[image.options.size[breakPointX]].source_url);
      },
      src: postImage.guid.rendered != undefined ? postImage.guid.rendered : '',
      alt: postImage.alt_text
    }))))))), image.options.imgSrcType == 'customUrl' && image.options.srcUrl.length != 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, image.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      onClick: handleLinkClick
    }, blockProps, {
      href: postUrl,
      target: image.options.linkTarget
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: image.options.srcUrl,
      alt: image.options.altTextCustom
    }))), image.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, linkAttrItems, {
      src: image.options.srcUrl,
      alt: image.options.altTextCustom
    })))), wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps, image.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      onClick: e => {
        handleLinkClickX(e, image.options.srcUrl);
      },
      href: postUrl,
      target: image.options.linkTarget
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: image.options.srcUrl,
      alt: image.options.altTextCustom
    }))), image.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: image.options.srcUrl,
      alt: image.options.altTextCustom
    }))))))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/layer/index.js":
/*!***********************************!*\
  !*** ./src/blocks/layer/index.js ***!
  \***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");













const {
  RawHTML
} = wp.element;











var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/layer", {
  apiVersion: 2,
  title: "Layer",
  parent: ['post-grid/layers'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M35.39,11,18.6,1.36a1.22,1.22,0,0,0-1.2,0L.61,11A1.2,1.2,0,0,0,.16,12.6a1.22,1.22,0,0,0,.47.46l16.8,9a1.21,1.21,0,0,0,1.14,0l16.8-9a1.21,1.21,0,0,0,.49-1.63A1.25,1.25,0,0,0,35.39,11ZM18,19.64,3.68,12,18,3.78,32.32,12Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M18.58,28.35,34.8,19.43V16.69L18,25.93,1.2,16.69v2.74l16.22,8.92A1.2,1.2,0,0,0,18.58,28.35Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M1.2,26l16.24,8.66a1.17,1.17,0,0,0,1.12,0L34.8,26V23.28l-16.8,9-16.8-9Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          content: '',
          tag: 'div',
          class: 'pg-layers'
        },
        styles: {
          color: {
            Desktop: ''
          },
          position: {},
          zIndex: {},
          top: {},
          right: {},
          bottom: {},
          left: {}
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const MY_TEMPLATE = [['core/paragraph', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-layer`
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      __experimentalDirectInsert: true,
      templateInsertUpdatesSelection: true //renderAppender: InnerBlocks.ButtonBlockAppender

    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, innerBlocksProps.children));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null);
  }
});

/***/ }),

/***/ "./src/blocks/layers/index.js":
/*!************************************!*\
  !*** ./src/blocks/layers/index.js ***!
  \************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");

















const {
  RawHTML
} = wp.element;











var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/layers", {
  apiVersion: 2,
  title: "Layers",
  apiVersion: 2,
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M35.39,11,18.6,1.36a1.22,1.22,0,0,0-1.2,0L.61,11A1.2,1.2,0,0,0,.16,12.6a1.22,1.22,0,0,0,.47.46l16.8,9a1.21,1.21,0,0,0,1.14,0l16.8-9a1.21,1.21,0,0,0,.49-1.63A1.25,1.25,0,0,0,35.39,11ZM18,19.64,3.68,12,18,3.78,32.32,12Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M1.2,26l16.24,8.66a1.17,1.17,0,0,0,1.12,0L34.8,26V23.28l-16.8,9-16.8-9Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "4.05 20.94 1.2 19.35 1.09 16.6 5.2 18.89 4.05 20.94"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "8.42",
      y: "19.84",
      width: "2.36",
      height: "5.7",
      transform: "translate(-14.89 20.02) rotate(-60.84)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "18 28.73 14 26.5 15.15 24.44 18 26.03 20.85 24.44 22 26.5 18 28.73"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "23.55",
      y: "21.51",
      width: "5.7",
      height: "2.35",
      transform: "translate(-7.72 15.78) rotate(-29.24)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "31.95 20.94 30.8 18.89 34.8 16.65 34.8 19.35 31.95 20.94"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'pg-layers',
          linkTo: 'postUrl',

          /*postUrl, homeUrl, authorUrl, authorLink, mailTo, custom, customField */
          linkToAuthorMeta: '',
          linkToCustomMeta: '',
          linkTarget: '_blank',
          customUrl: ''
        },
        styles: {
          position: {}
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    const CustomTagWrapper = `${wrapper.options.tag}`;
    var postUrl = wrapper.options.customUrl != undefined && wrapper.options.customUrl.length > 0 ? wrapper.options.customUrl : currentPostUrl;
    var linkToArgsBasic = {
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__.applyFilters)('linkToArgs', linkToArgsBasic); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function setFieldLinkTo(option, index) {
      var options = { ...wrapper.options,
        linkTo: option.value
      };
      setAttributes({
        wrapper: { ...wrapper,
          options: options
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-layers`
    }); //const isParentOfSelectedBlock = useSelect((select) => select('core/block-editor').hasSelectedInnerBlock(clientId, true))

    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useInnerBlocksProps)(blockProps, {
      __experimentalDirectInsert: true,
      templateInsertUpdatesSelection: true,
      renderAppender: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InnerBlocks.ButtonBlockAppender
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'a',
        value: 'a'
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    })), wrapper.options.tag == 'a' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: wrapper.options.linkTo == undefined ? 'Choose' : linkToArgs[wrapper.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-500 p-2 my-3 text-white"
    }, linkToArgs[wrapper.options.linkTo] != undefined ? linkToArgs[wrapper.options.linkTo].label : ''), wrapper.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Author Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: wrapper.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...wrapper.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    })), wrapper.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: wrapper.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...wrapper.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    })), wrapper.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), wrapper.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
      onClick: ev => {
        var options = { ...wrapper.options,
          customUrl: ''
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.__experimentalLinkControl, {
      settings: [],
      value: wrapper.options.customUrl,
      onChange: newVal => {
        var options = { ...wrapper.options,
          customUrl: newVal.url
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", wrapper.options.customUrl.length != 0 ? wrapper.options.customUrl : 'No link', " ")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: wrapper.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          linkTarget: newVal
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_15__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag == 'a' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, innerBlocksProps, {
      onClick: handleLinkClick,
      href: postUrl,
      target: wrapper.options.linkTarget
    }), innerBlocksProps.children), wrapper.options.tag != 'a' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagWrapper, innerBlocksProps, innerBlocksProps.children)));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InnerBlocks.Content, null); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/list-nested-item/index.js":
/*!**********************************************!*\
  !*** ./src/blocks/list-nested-item/index.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");













const {
  RawHTML
} = wp.element;











var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/list-nested-item", {
  apiVersion: 2,
  title: "List item",
  apiVersion: 2,
  parent: ['post-grid/list-nested'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "12.87",
      y: "5.71",
      width: "23.13",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "8.41 3.02 3.51 7.93 1.41 5.83 0 7.24 3.51 10.74 9.82 4.43 8.41 3.02"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "12.87",
      y: "16.75",
      width: "23.13",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "12.87",
      y: "27.8",
      width: "23.13",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#fff",
      d: "M0,13.92v8H8v-8Zm1.87,6.14V15.78H6.15v4.28Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#fff",
      d: "M0,33H8V25H0Zm6.15-6.16V31.1H1.88V26.82Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          content: '',
          tag: 'div',
          class: 'pg-list-item'
        },
        styles: {
          color: {
            Desktop: ''
          },
          position: {},
          zIndex: {},
          top: {},
          right: {},
          bottom: {},
          left: {}
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const MY_TEMPLATE = [['core/paragraph', {
      content: 'Hello'
    }]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-layer`
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      __experimentalDirectInsert: true,
      templateInsertUpdatesSelection: true,
      template: MY_TEMPLATE //renderAppender: InnerBlocks.ButtonBlockAppender

    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", innerBlocksProps, innerBlocksProps.children));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-list-item`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null));
  }
});

/***/ }),

/***/ "./src/blocks/list-nested/index.js":
/*!*****************************************!*\
  !*** ./src/blocks/list-nested/index.js ***!
  \*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/list-nested", {
  apiVersion: 2,
  title: "List Nested",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 30.48 35.99"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "10.9",
      y: "2.27",
      width: "19.58",
      height: "1.99"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "7.12 0 2.97 4.15 1.19 2.38 0 3.57 2.97 6.54 8.31 1.19 7.12 0"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "10.9",
      y: "22.25",
      width: "19.58",
      height: "1.99"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "10.9",
      y: "31.6",
      width: "19.58",
      height: "1.99"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M2.77,19.86v6.78H9.55V19.86Zm1.58,5.2V21.44H8v3.62Z",
      transform: "translate(-2.76 -0.01)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M2.76,36H9.54V29.21H2.76ZM8,30.78V34.4H4.35V30.78Z",
      transform: "translate(-2.76 -0.01)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "17.05",
      y: "9.48",
      width: "11.06",
      height: "1.12"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "17.05",
      y: "14.76",
      width: "11.06",
      height: "1.12"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M13.66,8.13V12h3.83V8.13Zm.89,2.94V9H16.6v2.05Z",
      transform: "translate(-2.76 -0.01)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M13.66,17.24h3.83V13.41H13.66ZM16.6,14.3v2h-2v-2Z",
      transform: "translate(-2.76 -0.01)"
    }))
  },
  deprecated: [{
    attributes: {
      items: {
        type: 'array',
        default: [{
          text: '',
          icon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: 'fas fa-chevron-right'
          },
          styles: {}
        }]
      }
    }
  }],
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'ul',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {}
        }
      }
    },
    items: {
      type: 'array',
      default: [{
        text: '',
        icon: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-right'
        },
        styles: {}
      }]
    },
    itemsX: {
      type: 'object',
      default: {
        items: []
      }
    },
    item: {
      type: 'object',
      default: {
        options: {
          text: '',
          tag: 'li',
          counter: false,
          reversed: false,
          start: 1,
          type: '1',
          class: 'item'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-right',
          class: 'icon',
          positon: 'before'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var itemsX = attributes.itemsX;
    var wrapper = attributes.wrapper;
    var item = attributes.item;
    var items = attributes.items;
    var icon = attributes.icon;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    const [isOpen, setisOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var itemSelector = blockClass + ' .item';
    const iconSelector = blockClass + ' .icon';
    const CustomTagWrapper = `${wrapper.options.tag}`;
    const CustomTagItem = `${item.options.tag}`;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      console.log(itemsX);

      if (items.length > 0) {
        if (itemsX.items.length == 0) {
          setAttributes({
            itemsX: { ...itemsX,
              items: items
            }
          });
        }
      }
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var itemX = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: itemX.name,
        icon: itemX.icon,
        value: itemX.id
      });
    }

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryItem(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        item[sudoScource] = sudoScourceArgs;
      });
      var itemX = Object.assign({}, item);
      setAttributes({
        item: itemX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = sudoScource + '.' + attr + '.' + breakPointX;
      let obj = Object.assign({}, wrapper);
      const updatedObj = myStore.setPropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: updatedObj
      });
      var sudoScourceX = { ...updatedObj[sudoScource]
      };
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      sudoScourceX[attr][breakPointX] = newVal;

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[elementSelector][argAttr] = argAttrVal;
      });
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleItem(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, item);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        item: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItem(sudoScource, key) {
      var object = myStore.deletePropertyDeep(item, [sudoScource, key, breakPointX]);
      setAttributes({
        item: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItem(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, item);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        item: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = sudoScource + '.' + attr + '.' + breakPointX;
      let obj = Object.assign({}, icon);
      const updatedObj = myStore.setPropertyDeep(obj, path, newVal);
      setAttributes({
        icon: updatedObj
      });
      var sudoScourceX = { ...updatedObj[sudoScource]
      };
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      sudoScourceX[attr][breakPointX] = newVal;

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[elementSelector][argAttr] = argAttrVal;
      });
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const ALLOWED_BLOCKS = ['post-grid/list-nested-item'];
    const MY_TEMPLATE = [['post-grid/list-nested-item', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-list`,
      reversed: item.options.reversed ? 'reversed' : '',
      start: item.options.start
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      allowedBlocks: ALLOWED_BLOCKS,
      template: MY_TEMPLATE,
      orientation: 'horizontal',
      templateInsertUpdatesSelection: true //renderAppender: InnerBlocks.ButtonBlockAppender

    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2",
      title: "Items",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'Ul',
        value: 'ul'
      }, {
        label: 'Ol',
        value: 'ol'
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Items",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: item.options.tag,
      options: [{
        label: 'Choose',
        value: ''
      }, {
        label: 'li',
        value: 'li'
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...item.options,
          tag: newVal
        };
        setAttributes({
          item: { ...item,
            options: options
          }
        });
      }
    })), wrapper.options.tag == 'ol' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      label: "Reversed?",
      help: item.options.reversed ? 'Counter reversed?' : 'No reversed',
      checked: item.options.reversed ? true : false,
      onChange: e => {
        var options = { ...item.options,
          reversed: item.options.reversed ? false : true
        };
        setAttributes({
          item: { ...item,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Counter start with"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      value: item.options.start,
      onChange: newVal => {
        var options = { ...item.options,
          start: newVal
        };
        setAttributes({
          item: { ...item,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Ordered list type?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: item.options.type,
      options: [{
        label: 'Choose',
        value: ''
      }, {
        label: 'Decimal numbers (1, 2, 3, 4)',
        value: '1'
      }, {
        label: 'Alphabetically ordered list',
        value: 'a'
      }, {
        label: 'Alphabetically ordered list, uppercase',
        value: 'A'
      }, {
        label: 'Roman numbers, lowercase (i, ii, iii, iv)',
        value: 'i'
      }, {
        label: 'Roman numbers, uppercase (I, II, III, IV)',
        value: 'I'
      }],
      onChange: newVal => {
        var options = { ...item.options,
          type: newVal
        };
        setAttributes({
          item: { ...item,
            options: options
          }
        });
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: item,
      onChange: onChangeStyleItem,
      onAdd: onAddStyleItem,
      onRemove: onRemoveStyleItem
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: item,
      onChange: onPickCssLibraryItem
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_16__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: 'Left',
        value: 'left'
      }, {
        label: 'Before Text',
        value: 'before'
      }, {
        label: 'After Text',
        value: 'after'
      }, {
        label: 'Right',
        value: 'right'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagWrapper, innerBlocksProps, innerBlocksProps.children)));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-list`
    });
    const CustomTagWrapper = `${wrapper.options.tag}`;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagWrapper, blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null));
  }
});

/***/ }),

/***/ "./src/blocks/list/index.js":
/*!**********************************!*\
  !*** ./src/blocks/list/index.js ***!
  \**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
















const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/list", {
  apiVersion: 2,
  title: "List",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "12.87",
      y: "5.71",
      width: "23.13",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "8.41 3.02 3.51 7.93 1.41 5.83 0 7.24 3.51 10.74 9.82 4.43 8.41 3.02"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "12.87",
      y: "16.75",
      width: "23.13",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "12.87",
      y: "27.8",
      width: "23.13",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M0,13.92v8H8v-8Zm1.87,6.14V15.78H6.15v4.28Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M0,33H8V25H0Zm6.15-6.16V31.1H1.88V26.82Z"
    }))
  },
  deprecated: [{
    attributes: {
      items: {
        type: 'array',
        default: [{
          text: '',
          icon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: 'fas fa-chevron-right'
          },
          styles: {}
        }]
      }
    }
  }],
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'ul',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {}
        }
      }
    },
    items: {
      type: 'array',
      default: [{
        text: '',
        icon: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-right'
        },
        styles: {}
      }]
    },
    itemsX: {
      type: 'object',
      default: {
        items: []
      }
    },
    item: {
      type: 'object',
      default: {
        options: {
          text: '',
          tag: 'li',
          counter: false,
          reversed: false,
          start: 1,
          type: '1',
          class: 'item'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-right',
          class: 'icon',
          positon: 'before'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var itemsX = attributes.itemsX;
    var wrapper = attributes.wrapper;
    var item = attributes.item;
    var items = attributes.items;
    var icon = attributes.icon;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [isOpen, setisOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var itemSelector = blockClass + ' .item';
    const iconSelector = blockClass + ' .icon';
    const CustomTag = `${wrapper.options.tag}`;
    const CustomTagItem = `${item.options.tag}`;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      console.log(itemsX);

      if (items.length > 0) {
        if (itemsX.items.length == 0) {
          setAttributes({
            itemsX: { ...itemsX,
              items: items
            }
          });
        }
      }
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var itemX = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: itemX.name,
        icon: itemX.icon,
        value: itemX.id
      });
    }

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryItem(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        item[sudoScource] = sudoScourceArgs;
      });
      var itemX = Object.assign({}, item);
      setAttributes({
        item: itemX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = sudoScource + '.' + attr + '.' + breakPointX;
      let obj = Object.assign({}, wrapper);
      const updatedObj = myStore.setPropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: updatedObj
      });
      var sudoScourceX = { ...updatedObj[sudoScource]
      };
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      sudoScourceX[attr][breakPointX] = newVal;

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[elementSelector][argAttr] = argAttrVal;
      });
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleItem(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, item);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        item: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItem(sudoScource, key) {
      var object = myStore.deletePropertyDeep(item, [sudoScource, key, breakPointX]);
      setAttributes({
        item: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItem(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, item);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        item: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = sudoScource + '.' + attr + '.' + breakPointX;
      let obj = Object.assign({}, icon);
      const updatedObj = myStore.setPropertyDeep(obj, path, newVal);
      setAttributes({
        icon: updatedObj
      });
      var sudoScourceX = { ...updatedObj[sudoScource]
      };
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      sudoScourceX[attr][breakPointX] = newVal;

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[elementSelector][argAttr] = argAttrVal;
      });
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-list`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-blue-500 p-2 px-5 text-white my-4 text-center cursor-pointer",
      onClick: ev => {
        var itemsZ = { ...itemsX
        };
        var itemx = itemsZ.items.concat({
          text: '',
          icon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: 'fas fa-chevron-right'
          },
          styles: {}
        });
        setAttributes({
          itemsX: { ...itemsX,
            items: itemx
          }
        });
      }
    }, "Add List Item"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'Ul',
        value: 'ul'
      }, {
        label: 'Ol',
        value: 'ol'
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_22__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Items",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: item.options.tag,
      options: [{
        label: 'li',
        value: 'li'
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...item.options,
          tag: newVal
        };
        setAttributes({
          item: { ...item,
            options: options
          }
        });
      }
    })), wrapper.options.tag == 'ol' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
      label: "Reversed?",
      help: item.options.reversed ? 'Counter reversed?' : 'No reversed',
      checked: item.options.reversed ? true : false,
      onChange: e => {
        var options = { ...item.options,
          reversed: item.options.reversed ? false : true
        };
        setAttributes({
          item: { ...item,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Counter start with"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: item.options.start,
      onChange: newVal => {
        var options = { ...item.options,
          start: newVal
        };
        setAttributes({
          item: { ...item,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Ordered list type?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: item.options.type,
      options: [{
        label: 'Choose',
        value: ''
      }, {
        label: 'Decimal numbers (1, 2, 3, 4)',
        value: '1'
      }, {
        label: 'Alphabetically ordered list',
        value: 'a'
      }, {
        label: 'Alphabetically ordered list, uppercase',
        value: 'A'
      }, {
        label: 'Roman numbers, lowercase (i, ii, iii, iv)',
        value: 'i'
      }, {
        label: 'Roman numbers, uppercase (I, II, III, IV)',
        value: 'I'
      }],
      onChange: newVal => {
        var options = { ...item.options,
          type: newVal
        };
        setAttributes({
          item: { ...item,
            options: options
          }
        });
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: item,
      onChange: onChangeStyleItem,
      onAdd: onAddStyleItem,
      onRemove: onRemoveStyleItem
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_22__["default"], {
      blockId: blockId,
      obj: item,
      onChange: onPickCssLibraryItem
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_17__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: 'Before Text',
        value: 'before'
      }, {
        label: 'After Text',
        value: 'after'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_22__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      reversed: item.options.reversed ? 'reversed' : '',
      start: item.options.start
    }), itemsX.items != undefined && itemsX.items.map((itemX, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagItem, {
        className: ` ${item.options.class}`,
        onClick: ev => {
          var ssdsd = itemsX.items.concat([]); // setAttributes({ items: { items: ssdsd } });

          setAttributes({
            itemsX: { ...itemsX,
              items: ssdsd
            }
          });
        }
      }, icon.options.position == 'before' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "icon",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
        tagName: "div",
        className: "inline-block",
        value: itemX.text,
        allowedFormats: ['core/bold', 'core/italic', 'core/link'],
        onSplit: (value, isAfterOriginal) => {
          createBlock('core/paragraph', {
            content: value
          });
        },
        onChange: content => {
          var itemsZ = { ...itemsX
          };
          var item = { ...itemsZ.items[i],
            text: content
          };
          itemsZ.items[i] = item;
          setAttributes({
            itemsX: { ...itemsX,
              items: itemsZ.items
            }
          });
        },
        placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
      }), icon.options.position == 'after' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "icon",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-2 text-red-500  py-1 float-right icon-close",
        onClick: ev => {
          itemsX.items.splice(i, 1);
          var ssdsd = itemsX.items.concat([]); //setAttributes({ items: { items: ssdsd } })

          setAttributes({
            itemsX: { ...itemsX,
              items: ssdsd
            }
          });
          ev.preventDefault();
        }
      })));
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/menu-wrap-item/index.js":
/*!********************************************!*\
  !*** ./src/blocks/menu-wrap-item/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");













const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/menu-wrap-item", {
  apiVersion: 2,
  title: "Menu Item",
  parent: ['post-grid/menu-wrap'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "10.4",
      width: "7.49",
      height: "15.2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "28.51",
      y: "10.4",
      width: "7.49",
      height: "15.2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "25.18 26.5 22.47 26.5 22.47 24.7 23.37 24.7 23.37 23.79 25.18 23.79 25.18 26.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.51",
      y: "24.69",
      width: "2.98",
      height: "1.81"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "13.53 26.5 10.82 26.5 10.82 23.79 12.63 23.79 12.63 24.7 13.53 24.7 13.53 26.5"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "10.82",
      y: "16.07",
      width: "1.81",
      height: "3.86"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "12.63 12.21 10.82 12.21 10.82 9.5 13.53 9.5 13.53 11.3 12.63 11.3 12.63 12.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.51",
      y: "9.5",
      width: "2.98",
      height: "1.81"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "25.18 12.21 23.37 12.21 23.37 11.3 22.47 11.3 22.47 9.5 25.18 9.5 25.18 12.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "23.37",
      y: "16.07",
      width: "1.81",
      height: "3.86"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'li',
          class: 'flex-item-wrap',
          isActive: false
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    link: {
      type: 'object',
      default: {
        options: {
          class: '',
          text: '',
          url: ''
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    subMenuWrap: {
      type: 'object',
      default: {
        options: {
          class: '',
          type: ''
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          enable: true,
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-check-circle',
          position: 'beforeText',

          /*before, after, prefix, postfix */
          class: 'link-icon'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var link = attributes.link;
    var icon = attributes.icon;
    var subMenuWrap = attributes.subMenuWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var subMenuWrapSelector = blockClass + ' .subMenu';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);

    function generateElementSudoCss(obj) {
      var stylesObj = {};
      Object.entries(obj).map(args => {
        var sudoSrc = args[0];
        var sudoArgs = args[1];

        if (sudoSrc != 'options') {
          var selector = myStore.getElementSelector(sudoSrc, wrapperSelector); //console.log(selector);
          //console.log(sudoArgs);

          Object.entries(args[1]).map(x => {
            var attr = x[0];
            var cssPropty = myStore.cssAttrParse(attr);

            if (stylesObj[selector] == undefined) {
              stylesObj[selector] = {};
            }

            if (stylesObj[selector][cssPropty] == undefined) {
              stylesObj[selector][cssPropty] = {};
            }

            stylesObj[selector][cssPropty] = x[1];
          });
        } //console.log(stylesObj);

      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      }; //console.log(cssItemsX);

      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      //console.log(wrapper);
      //setAttributes({ customCss: customCss });
      ///myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      var elementCss = generateElementSudoCss(wrapper); //console.log(elementCss);
    }, [wrapper]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    } // 


    function onChangeStyleSubMenuWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, subMenuWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        subMenuWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, subMenuWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleSubMenuWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(subMenuWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        subMenuWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, subMenuWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleSubMenuWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, subMenuWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        subMenuWrap: object
      });
    }

    function onBulkAddSubMenuWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, subMenuWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        subMenuWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, subMenuWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const MY_TEMPLATE = [//['core/paragraph', { placeholder: '', content: 'Hello Text...' }],
    ];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-menu-wrap-item ${wrapper.options.isActive ? 'active' : ''}`
    }); //const isParentOfSelectedBlock = useSelect((select) => select('core/block-editor').hasSelectedInnerBlock(clientId, true))

    const ALLOWED_BLOCKS = ['post-grid/menu-wrap-item', 'post-grid/flex-wrap', 'post-grid/grid-wrap', 'post-grid/image'];
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      allowedBlocks: ALLOWED_BLOCKS,
      template: MY_TEMPLATE,
      //orientation: 'horizontal',
      templateInsertUpdatesSelection: true,
      renderAppender: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.ButtonBlockAppender
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Menu Label"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: link.options.text,
      onChange: newVal => {
        var options = { ...link.options,
          text: newVal
        };
        setAttributes({
          link: { ...link,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Menu URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
      className: "mr-2",
      value: link.options.url,
      onChange: newVal => {
        var options = { ...link.options,
          url: newVal
        };
        setAttributes({
          link: { ...link,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      label: "Menu Active?",
      help: wrapper.options.isActive ? 'Menu Active' : 'Menu Inactive.',
      checked: wrapper.options.isActive ? true : false,
      onChange: e => {
        var options = { ...wrapper.options,
          isActive: wrapper.options.isActive ? false : true
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Sub MenuWrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: subMenuWrap,
      onChange: onChangeStyleSubMenuWrap,
      onAdd: onAddStyleSubMenuWrap,
      onRemove: onRemoveStyleSubMenuWrap,
      onBulkAdd: onBulkAddSubMenuWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", innerBlocksProps, link.options.text.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
      className: "menuLink",
      href: link.options.url
    }, link.options.text), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ul", {
      className: "subMenu"
    }, innerBlocksProps.children)));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-menu-wrap-item`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null);
  }
});

/***/ }),

/***/ "./src/blocks/menu-wrap/index.js":
/*!***************************************!*\
  !*** ./src/blocks/menu-wrap/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./variations */ "./src/blocks/menu-wrap/variations.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");

















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/menu-wrap", {
  apiVersion: 2,
  title: "Menu Wrap",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "9.59",
      width: "8.29",
      height: "16.82"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "27.71",
      y: "9.59",
      width: "8.29",
      height: "16.82"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "11.05",
      y: "9.59",
      width: "13.9",
      height: "16.82"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          display: {
            Desktop: 'flex'
          }
        }
      }
    },
    menuWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'ul',
          class: ''
        },
        styles: {
          display: {
            Desktop: 'flex'
          }
        }
      }
    },
    subMenuWrap: {
      type: 'object',
      default: {
        options: {
          class: '',
          type: ''
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var menuWrap = attributes.menuWrap;
    var subMenuWrap = attributes.subMenuWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var menuWrapSelector = blockClass + ' .menu';
    var subMenuWrapSelector = blockClass + ' .subMenu';
    const {
      replaceInnerBlocks
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useDispatch)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store);
    const hasInnerBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store).getBlocks(clientId).length > 0, [clientId]); //console.log(JSON.stringify(wp.data.select(blockEditorStore).getBlocks(clientId)));

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss); // blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'display': { "Desktop": "flex" } };
      //blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'gap': { "Desktop": "1em" } };

      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      }); //setAttributes({ wrapper: { ...wrapper, styles: { display: { Desktop: 'flex' }, gap: { Desktop: '20px' } } } });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function applyFlex(attr, newVal) {
      onChangeStyleWrapper('styles', newVal, attr);
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    } //


    function onChangeStyleMenuWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, menuWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        menuWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, menuWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleMenuWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(menuWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        menuWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, menuWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleMenuWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, menuWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        menuWrap: object
      });
    }

    function onBulkAddMenuWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, menuWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        menuWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, menuWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleSubMenuWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, subMenuWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        subMenuWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, subMenuWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleSubMenuWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(subMenuWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        subMenuWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, subMenuWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleSubMenuWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, subMenuWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        subMenuWrap: object
      });
    }

    function onBulkAddSubMenuWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, subMenuWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        subMenuWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, subMenuWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    const ALLOWED_BLOCKS = ['post-grid/menu-wrap-item'];
    const MY_TEMPLATE = [['post-grid/menu-wrap-item', {}], ['post-grid/menu-wrap-item', {}], ['post-grid/menu-wrap-item', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-menu-wrap `
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      allowedBlocks: ALLOWED_BLOCKS,
      //template: MY_TEMPLATE,
      orientation: 'horizontal',
      templateInsertUpdatesSelection: true,
      renderAppender: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.ButtonBlockAppender
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Flex Options",
      initialOpen: true
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: "",
      className: "block my-3"
    }, "Justify Content"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "grid grid-cols-4 gap-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'flex-start' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'flex-start');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Flex Start"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "5.5",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "11.44",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "17.39",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'flex-end' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'flex-end');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Flex End"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "14.94",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "20.88",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "26.83",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'center' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'center');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "10.22",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "22.11",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'space-between' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'space-between');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space Between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "5.5",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "26.83",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'space-around' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'space-around');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space Around"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "7.34",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.12",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "24.9",
      y: "5.5",
      width: "3.67",
      height: "25"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.justifyContent == undefined ? "bg-[#5655ff]" : wrapper.styles.justifyContent[breakPointX] == 'space-evenly' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('justifyContent', 'space-evenly');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space Evenly"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "5.5",
      width: "3.67",
      height: "25"
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: "",
      className: "my-3 block"
    }, "Align Items"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "grid grid-cols-4 gap-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.alignItems == undefined ? "bg-[#5655ff]" : wrapper.styles.alignItems[breakPointX] == 'flex-start' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('alignItems', 'flex-start');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Flex Start"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "5.5",
      width: "3.67",
      height: "8.88"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "16.42"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "5.5",
      width: "3.67",
      height: "12.5"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.alignItems == undefined ? "bg-[#5655ff]" : wrapper.styles.alignItems[breakPointX] == 'flex-end' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('alignItems', 'flex-end');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Flex End"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "21.62",
      width: "3.67",
      height: "8.88",
      transform: "translate(50.08 52.12) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "14.08",
      width: "3.67",
      height: "16.42",
      transform: "translate(36 44.58) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "18",
      width: "3.67",
      height: "12.5",
      transform: "translate(21.92 48.5) rotate(180)"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.alignItems == undefined ? "bg-[#5655ff]" : wrapper.styles.alignItems[breakPointX] == 'center' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('alignItems', 'center');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "13.56",
      width: "3.67",
      height: "8.88",
      transform: "translate(50.08 36) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "9.79",
      width: "3.67",
      height: "16.42",
      transform: "translate(36 36) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "13.56",
      width: "3.67",
      height: "8.88",
      transform: "translate(21.92 36) rotate(180)"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.alignItems == undefined ? "bg-[#5655ff]" : wrapper.styles.alignItems[breakPointX] == 'stretch' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('alignItems', 'stretch');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Stretch"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "23.2",
      y: "9.79",
      width: "3.67",
      height: "16.42",
      transform: "translate(50.08 36) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "9.79",
      width: "3.67",
      height: "16.42",
      transform: "translate(36 36) rotate(180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "9.12",
      y: "9.79",
      width: "3.67",
      height: "16.42",
      transform: "translate(21.92 36) rotate(180)"
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: "",
      className: "my-3 block"
    }, "Flex Direction"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "grid grid-cols-4 gap-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexDirection == undefined ? "bg-[#5655ff]" : wrapper.styles.flexDirection[breakPointX] == 'row' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexDirection', 'row');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Row"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "5.5",
      y: "9.52",
      width: "3.67",
      height: "16.42"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "24.95 12.19 23.25 13.85 25.93 16.51 13.19 16.51 12.33 16.5 12.31 18.91 25.95 18.91 23.29 21.57 24.95 23.27 30.5 17.73 24.95 12.19"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexDirection == undefined ? "bg-[#5655ff]" : wrapper.styles.flexDirection[breakPointX] == 'row-reverse' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexDirection', 'row-reverse');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Row Reverse"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "26.83",
      y: "9.52",
      width: "3.67",
      height: "16.42",
      transform: "translate(57.33 35.45) rotate(-180)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "11.05 12.19 12.75 13.85 10.07 16.51 22.81 16.51 23.67 16.5 23.69 18.91 10.04 18.91 12.71 21.57 11.05 23.27 5.5 17.73 11.05 12.19"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexDirection == undefined ? "bg-[#5655ff]" : wrapper.styles.flexDirection[breakPointX] == 'column' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexDirection', 'column');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Column"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "20.45",
      width: "3.67",
      height: "16.42",
      transform: "translate(-10.66 46.66) rotate(-90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "23.54 11.05 21.88 12.75 19.21 10.07 19.21 22.81 19.22 23.67 16.82 23.69 16.81 10.04 14.16 12.71 12.46 11.05 18 5.5 23.54 11.05"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexDirection == undefined ? "bg-[#5655ff]" : wrapper.styles.flexDirection[breakPointX] == 'column-reverse' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexDirection', 'column-reverse');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Column-reverse"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "5.5",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "-0.87",
      width: "3.67",
      height: "16.42",
      transform: "translate(25.34 -10.66) rotate(90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "12.46 24.95 14.13 23.25 16.79 25.93 16.79 13.19 16.78 12.33 19.18 12.31 19.19 25.95 21.84 23.29 23.54 24.95 18 30.5 12.46 24.95"
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: "",
      className: "my-3 block"
    }, "Flex Wrap"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "grid grid-cols-4 gap-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexWrap == undefined ? "bg-[#5655ff]" : wrapper.styles.flexWrap[breakPointX] == 'wrap' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexWrap', 'wrap');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "6.08",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "1.95",
      width: "3.67",
      height: "25",
      transform: "translate(32.45 -3.55) rotate(90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "16.79 18.15 15.81 19.11 17.35 20.65 6.01 20.65 5.51 20.64 5.5 22.03 17.37 22.03 15.83 23.56 16.79 24.54 19.99 21.35 16.79 18.15"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexWrap == undefined ? "bg-[#5655ff]" : wrapper.styles.flexWrap[breakPointX] == 'wrap-reverse' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexWrap', 'wrap-reverse');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "6.08",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "10.21",
      width: "3.67",
      height: "25",
      transform: "translate(40.71 4.71) rotate(90)"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#fff",
      points: "8.7 19.01 9.68 18.05 8.14 16.51 19.48 16.51 19.98 16.51 19.99 15.13 8.12 15.12 9.66 13.6 8.7 12.61 5.5 15.81 8.7 19.01"
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: `hover:bg-[#3737c7] cursor-pointer ${wrapper.styles.flexWrap == undefined ? "bg-[#5655ff]" : wrapper.styles.flexWrap[breakPointX] == 'nowrap' ? "bg-[#1f1f8b]" : "bg-[#5655ff]"}`,
      onClick: ev => {
        applyFlex('flexWrap', 'nowrap');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.Tooltip, {
      text: "Space"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#5655ff",
      x: "5.5",
      y: "6.08",
      width: "25",
      height: "25"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#fff",
      x: "16.16",
      y: "5.5",
      width: "3.67",
      height: "25",
      transform: "translate(36) rotate(90)"
    })))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Menu Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: menuWrap,
      onChange: onChangeStyleMenuWrap,
      onAdd: onAddStyleMenuWrap,
      onRemove: onRemoveStyleMenuWrap,
      onBulkAdd: onBulkAddMenuWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Sub MenuWrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: subMenuWrap,
      onChange: onChangeStyleSubMenuWrap,
      onAdd: onAddStyleSubMenuWrap,
      onRemove: onRemoveStyleSubMenuWrap,
      onBulkAdd: onBulkAddSubMenuWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: ""
    }, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400 hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)([['post-grid/menu-wrap-item', {
          "wrapper": {
            "options": {
              "tag": "div",
              "class": "flex-item-wrap"
            },
            "styles": {
              "flexBasis": {
                "Desktop": "0"
              },
              "flexGrow": {
                "Desktop": "1"
              }
            }
          }
        }], ['post-grid/menu-wrap-item', {
          "wrapper": {
            "options": {
              "tag": "div",
              "class": "flex-item-wrap"
            },
            "styles": {
              "flexBasis": {
                "Desktop": "0"
              },
              "flexGrow": {
                "Desktop": "1"
              }
            }
          }
        }]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_16__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 bg-gray-400 cursor-pointer hover:bg-gray-500 relative",
        onClick: ev => {
          if (variation.isPro) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var atts = variation.atts;
          var wrapper = { ...atts.wrapper
          };
          var blockCssY = { ...atts.blockCssY
          };
          var customCss = { ...atts.customCss
          };
          var blockCssObj = {};
          blockCssObj[wrapperSelector] = wrapper;
          setAttributes({
            wrapper: wrapper,
            customCss: customCss
          });
          var blockCssRules = myStore.getBlockCssRules(blockCssObj);
          var items = { ...blockCssY.items,
            ...blockCssRules
          };
          setAttributes({
            blockCssY: {
              items: items
            }
          });
          replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)(variation.innerBlocks), true);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ul", {
      className: "menu"
    }, innerBlocksProps.children))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: ` ${blockId} pg-menu-wrap`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/menu-wrap/variations.js":
/*!********************************************!*\
  !*** ./src/blocks/menu-wrap/variations.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__);


/**
 * WordPress dependencies
 */


let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('isProFeature', true);
/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: '1-column',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('1 Col'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('1 Col'),
  isDefault: true,
  isPro: false,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "152.29",
    height: "82.57"
  }))
}, {
  name: '2-columns',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('2-columns'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('2-columns'),
  isPro: false,
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "119.78",
    width: "32.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "79.58",
    width: "72.71",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "72.71",
    height: "82.57"
  })),
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block']
}, {
  name: '3-columns',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('3-columns'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('3-columns'),
  isPro: false,
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "46.18",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "53.05",
    width: "99.24",
    height: "82.57"
  })),
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "46.18",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "53.05",
    width: "46.18",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "106.1",
    width: "46.18",
    height: "82.57"
  }))
}, {
  name: '4-columns',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('4-columns'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('4-columns'),
  isPro: false,
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "39.15",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "46.02",
    width: "60.25",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "113.14",
    width: "39.15",
    height: "82.57"
  })),
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "32.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "40.21",
    width: "31.66",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "80.41",
    width: "31.66",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "120.62",
    width: "31.66",
    height: "82.57"
  }))
}, {
  name: '5-columns',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('5-columns'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('5-columns'),
  isPro: false,
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "39.15",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "46.02",
    width: "60.25",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "113.14",
    width: "39.15",
    height: "82.57"
  })),
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexBasis": {
          "Desktop": "0"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "25.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "31.7",
    width: "25.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "63.4",
    width: "25.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "95.09",
    width: "25.5",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "126.79",
    width: "25.5",
    height: "82.57"
  }))
}, {
  name: '33-66',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('33-66'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('33-66'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "33%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "66%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "46.18",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "53.05",
    width: "99.24",
    height: "82.57"
  }))
}, {
  name: '66-33',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('66-33'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('66-33'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "66%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "33%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "99.24",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "106.1",
    width: "46.18",
    height: "82.57"
  }))
}, {
  name: '25-50-25',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('25-50-25'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('25-50-25'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "50%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "39.15",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "46.02",
    width: "60.25",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "113.14",
    width: "39.15",
    height: "82.57"
  }))
}, {
  name: '25-25-50',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('25-25-50'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('25-25-50'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "50%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "31.29",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "38.16",
    width: "31.29",
    height: "82.57"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "76.33",
    width: "75.96",
    height: "82.57"
  }))
}, {
  name: '50-25-25',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('50-25-25'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('50-25-25'),
  isDefault: true,
  isPro: !isProFeature ? false : true,
  atts: {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "menu-wrap"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "gap": {
          "Desktop": "1em"
        }
      }
    }
  },
  innerBlocks: [['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "50%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }], ['post-grid/menu-wrap-item', {
    "wrapper": {
      "options": {
        "tag": "div",
        "class": "flex-item-wrap"
      },
      "styles": {
        "width": {
          "Desktop": "25%"
        },
        "flexGrow": {
          "Desktop": "1"
        }
      }
    }
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    id: "Layer_1",
    "data-name": "Layer 1",
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 152.29 82.57"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "120.99",
    width: "31.29",
    height: "82.57",
    transform: "translate(273.28 82.57) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "82.83",
    width: "31.29",
    height: "82.57",
    transform: "translate(196.95 82.57) rotate(180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    width: "75.96",
    height: "82.57",
    transform: "translate(75.96 82.57) rotate(180)"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/number-counter/index.js":
/*!********************************************!*\
  !*** ./src/blocks/number-counter/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/number-counter", {
  apiVersion: 2,
  title: "Number Counter",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      id: "Layer_1",
      "data-name": "Layer 1",
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#8db1ff",
      d: "M19.4,10.05V9.24l1-1C22.91,5.89,24,4.64,24,3.18a1.73,1.73,0,0,0-1.92-1.9,3.33,3.33,0,0,0-2.06.82l-.42-.92a4.24,4.24,0,0,1,2.74-1,2.73,2.73,0,0,1,3,2.82c0,1.79-1.3,3.24-3.34,5.2l-.77.72V9h4.35v1.09Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M3.33,14.39h0l-1.69.91-.25-1,2.11-1.13H4.6v9.69H3.33Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M9.65,22.86v-.81l1-1c2.47-2.35,3.59-3.6,3.6-5.07a1.72,1.72,0,0,0-1.92-1.89,3.33,3.33,0,0,0-2.06.82L9.89,14a4.22,4.22,0,0,1,2.74-1,2.72,2.72,0,0,1,3,2.82c0,1.79-1.29,3.23-3.33,5.2l-.78.72v0h4.35v1.09Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19.83,21.41A4.36,4.36,0,0,0,22,22c1.69,0,2.21-1.07,2.2-1.88,0-1.35-1.24-1.94-2.51-1.94h-.73v-1h.73c1,0,2.16-.49,2.16-1.64,0-.77-.49-1.46-1.7-1.46a3.51,3.51,0,0,0-1.93.64l-.35-.95a4.64,4.64,0,0,1,2.54-.75c1.9,0,2.77,1.14,2.77,2.31a2.41,2.41,0,0,1-1.79,2.28v0a2.53,2.53,0,0,1,2.16,2.49c0,1.55-1.21,2.91-3.53,2.91a4.86,4.86,0,0,1-2.52-.66Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#8db1ff",
      d: "M22.93,35.81V33.17h-4.5V32.3l4.32-6.18h1.42v6h1.35v1H24.17v2.64Zm0-3.67V28.9c0-.5,0-1,0-1.52h0c-.3.57-.54,1-.81,1.43l-2.37,3.3v0Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M32.05,13.41,34.63,16l-.42.42-1.82-1.83,0,0v8h-.63V14.61L29.9,16.46,29.46,16Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    numberCount: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          start: 0,
          end: 500,
          duration: 1000,
          class: 'number-count'
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'far fa-calendar-alt',
          position: 'beforeCommentCount',

          /*before, after, prefix, postfix */
          class: 'number-count-icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: [],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    let numberCount = attributes.numberCount;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var icon = attributes.icon;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    var [commentCountEdited, setcommentCountEdited] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(numberCount.options.start); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var commentCountSelector = blockClass + ' .number-count';
    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';
    const iconSelector = blockClass + ' .number-count-icon';

    const counterAnim = function (qSelector) {
      let start = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
      let end = arguments.length > 2 ? arguments[2] : undefined;
      let duration = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1000;
      const target = document.querySelector(qSelector);
      let startTimestamp = null;

      const step = timestamp => {
        if (!startTimestamp) startTimestamp = timestamp;
        const progress = Math.min((timestamp - startTimestamp) / duration, 1);
        console.log('#####end', end);
        var numberX = progress * (end - start) + start;

        if (Number.isInteger(end)) {
          console.log('##integer');
          target.innerText = Math.floor(numberX);
        } else {
          console.log('##float');
          target.innerText = Number(numberX).toFixed(2);
        }

        if (progress < 1) {
          window.requestAnimationFrame(step);
        }
      };

      window.requestAnimationFrame(step);
    };

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var start = parseInt(numberCount.options.start);
      var end = Number.isInteger(numberCount.options.end) ? parseInt(numberCount.options.end) : parseFloat(numberCount.options.end);
      var duration = parseInt(numberCount.options.duration);
      counterAnim(commentCountSelector, start, end, duration);
    }, [numberCount]);

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryCommentCount(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        numberCount[sudoScource] = sudoScourceArgs;
      });
      var commentCountX = Object.assign({}, numberCount);
      setAttributes({
        numberCount: commentCountX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, commentCountSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleCommentCount(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, numberCount);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        numberCount: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, commentCountSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleCommentCount(sudoScource, key) {
      var object = myStore.deletePropertyDeep(numberCount, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, commentCountSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleCommentCount(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, numberCount);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        numberCount: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = sudoScource + '.' + attr + '.' + breakPointX;
      let obj = Object.assign({}, postfix);
      const updatedObj = myStore.setPropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: updatedObj
      });
      var sudoScourceX = { ...updatedObj[sudoScource]
      };
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      sudoScourceX[attr][breakPointX] = newVal;

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[elementSelector][argAttr] = argAttrVal;
      });
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    String.prototype.strtr = function (dic) {
      const str = this.toString(),
            makeToken = inx => `{{###~${inx}~###}}`,
            tokens = Object.keys(dic).map((key, inx) => ({
        key,
        val: dic[key],
        token: makeToken(inx)
      })),
            tokenizedStr = tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.key, "g"), entry.token), str);

      return tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.token, "g"), entry.val), tokenizedStr);
    };

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ numberCount: numberCount });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {}, [numberCount]);
    const CustomTag = `${wrapper.options.tag}`;
    const CustomTagPostTitle = `${numberCount.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-number-counter`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Number Count",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Start?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      type: "number",
      step: "0.01",
      className: "mr-2",
      value: numberCount.options.start,
      onChange: newVal => {
        var options = { ...numberCount.options,
          start: newVal
        };
        setAttributes({
          numberCount: { ...numberCount,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "End?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      type: "number",
      step: "0.01",
      className: "mr-2",
      value: numberCount.options.end,
      onChange: newVal => {
        var options = { ...numberCount.options,
          end: newVal
        };
        setAttributes({
          numberCount: { ...numberCount,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Duration?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      type: "number",
      className: "mr-2",
      value: numberCount.options.duration,
      onChange: newVal => {
        var options = { ...numberCount.options,
          duration: newVal
        };
        setAttributes({
          numberCount: { ...numberCount,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      label: "onScroll?",
      help: numberCount.options.onScroll ? 'Play on scroll' : 'Play on page load',
      checked: numberCount.options.onScroll ? true : false,
      onChange: e => {
        var options = { ...numberCount.options,
          onScroll: numberCount.options.onScroll ? false : true
        };
        setAttributes({
          numberCount: { ...numberCount,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: numberCount,
      onChange: onChangeStyleCommentCount,
      onAdd: onAddStyleCommentCount,
      onRemove: onRemoveStyleCommentCount
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: numberCount,
      onChange: onPickCssLibraryCommentCount
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_18__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Prefix',
        value: 'beforePrefix'
      }, {
        label: 'After Prefix',
        value: 'afterPrefix'
      }, {
        label: 'Before Postfix',
        value: 'beforePostfix'
      }, {
        label: 'After Postfix',
        value: 'afterPostfix'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: {
            styles: prefix.styles,
            options: options
          }
        }); // setAttributes({ prefix: { text: newVal, class: prefix.options.class, color: prefix.color, backgroundColor: prefix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        }); // setAttributes({ postfix: { text: newVal, class: prefix.options.class, color: postfix.color, backgroundColor: postfix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Title Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Title link"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, commentCountSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTag, blockProps, icon.options.position == 'beforePrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'afterPrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforeCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: numberCount.options.class
    }, commentCountEdited), icon.options.position == 'afterCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/popup/index.js":
/*!***********************************!*\
  !*** ./src/blocks/popup/index.js ***!
  \***********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./variations */ "./src/blocks/popup/variations.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var animate_css__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../../node_modules/animate.css/animate.css */ "./node_modules/animate.css/animate.css");


















const {
  RawHTML
} = wp.element;

















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/popup", {
  apiVersion: 2,
  title: "Popup",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "1.15",
      y: "8.69",
      width: "30.39",
      height: "23.64",
      rx: "0.73"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "28.84",
      cy: "9.69",
      r: "6.01"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#fff",
      d: "M29.21,9.69l2.25-2.26a.25.25,0,0,0,0-.37.27.27,0,0,0-.37,0L28.84,9.32,26.58,7.06a.26.26,0,1,0-.37.37l2.26,2.26-2.26,2.25a.27.27,0,0,0,0,.37.23.23,0,0,0,.18.08.24.24,0,0,0,.19-.08l2.26-2.25,2.25,2.25a.24.24,0,0,0,.19.08.22.22,0,0,0,.18-.08.25.25,0,0,0,0-.37Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    inner: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {}
      }
    },
    closeWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'span',
          class: '',
          animation: '',
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-right'
        },
        styles: {}
      }
    },
    visible: {
      type: 'object',
      default: {}
    },
    editMode: {
      "type": "boolean",
      "default": true
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  //usesContext: [],
  providesContext: {
    'post-grid/popupId': 'blockId'
  },
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var closeWrap = attributes.closeWrap;
    var inner = attributes.inner;
    var visible = attributes.visible;
    var editMode = attributes.editMode;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var closeWrapSelector = blockClass + " .close";
    var innerSelector = blockClass + " .inner";
    var closeAnimateArgs = {
      backOutDown: {
        label: 'backOutDown',
        value: 'backOutDown'
      },
      backOutLeft: {
        label: 'backOutLeft',
        value: 'backOutLeft'
      },
      backOutRight: {
        label: 'backOutRight',
        value: 'backOutRight'
      },
      backOutUp: {
        label: 'backOutUp',
        value: 'backOutUp'
      },
      bounceOut: {
        label: 'bounceOut',
        value: 'bounceOut'
      },
      bounceOutDown: {
        label: 'bounceOutDown',
        value: 'bounceOutDown'
      },
      bounceOutLeft: {
        label: 'bounceOutLeft',
        value: 'bounceOutLeft'
      },
      bounceOutRight: {
        label: 'bounceOutRight',
        value: 'bounceOutRight'
      },
      bounceOutUp: {
        label: 'bounceOutUp',
        value: 'bounceOutUp'
      },
      fadeOut: {
        label: 'fadeOut',
        value: 'fadeOut'
      },
      fadeOutDown: {
        label: 'fadeOutDown',
        value: 'fadeOutDown'
      },
      fadeOutDownBig: {
        label: 'fadeOutDownBig',
        value: 'fadeOutDownBig'
      },
      fadeOutLeft: {
        label: 'fadeOutLeft',
        value: 'fadeOutLeft'
      },
      fadeOutLeftBig: {
        label: 'fadeOutLeftBig',
        value: 'fadeOutLeftBig'
      },
      fadeOutRight: {
        label: 'fadeOutRight',
        value: 'fadeOutRight'
      },
      fadeOutRightBig: {
        label: 'fadeOutRightBig',
        value: 'fadeOutRightBig'
      },
      fadeOutUp: {
        label: 'fadeOutUp',
        value: 'fadeOutUp'
      },
      fadeOutUpBig: {
        label: 'fadeOutUpBig',
        value: 'fadeOutUpBig'
      },
      fadeOutTopLeft: {
        label: 'fadeOutTopLeft',
        value: 'fadeOutTopLeft'
      },
      fadeOutTopRight: {
        label: 'fadeOutTopRight',
        value: 'fadeOutTopRight'
      },
      fadeOutBottomRight: {
        label: 'fadeOutBottomRight',
        value: 'fadeOutBottomRight'
      },
      fadeOutBottomLeft: {
        label: 'fadeOutBottomLeft',
        value: 'fadeOutBottomLeft'
      },
      rotateOut: {
        label: 'rotateOut',
        value: 'rotateOut'
      },
      rotateOutDownLeft: {
        label: 'rotateOutDownLeft',
        value: 'rotateOutDownLeft'
      },
      rotateOutDownRight: {
        label: 'rotateOutDownRight',
        value: 'rotateOutDownRight'
      },
      rotateOutUpLeft: {
        label: 'rotateOutUpLeft',
        value: 'rotateOutUpLeft'
      },
      rotateOutUpRight: {
        label: 'rotateOutUpRight',
        value: 'rotateOutUpRight'
      },
      zoomOut: {
        label: 'zoomOut',
        value: 'zoomOut'
      },
      zoomOutDown: {
        label: 'zoomOutDown',
        value: 'zoomOutDown'
      },
      zoomOutLeft: {
        label: 'zoomOutLeft',
        value: 'zoomOutLeft'
      },
      zoomOutRight: {
        label: 'zoomOutRight',
        value: 'zoomOutRight'
      },
      zoomOutUp: {
        label: 'zoomOutUp',
        value: 'zoomOutUp'
      },
      slideOutDown: {
        label: 'slideOutDown',
        value: 'slideOutDown'
      },
      slideOutLeft: {
        label: 'slideOutLeft',
        value: 'slideOutLeft'
      },
      slideOutRight: {
        label: 'slideOutRight',
        value: 'slideOutRight'
      },
      slideOutUp: {
        label: 'slideOutUp',
        value: 'slideOutUp'
      }
    };
    var visbleArgsBasic = {
      initial: {
        label: 'Initial',
        description: 'Visble as soon as possible',
        args: {
          id: 'initial',
          value: 5
        }
      },
      delay: {
        label: 'Delay',
        description: 'Delay certain amount of time after page load.',
        args: {
          id: 'delay',
          value: 1000
        }
      },
      scrollParcent: {
        label: 'Scroll Parcent',
        description: 'After certain amount(parcent) of scroll',
        args: {
          id: 'scrollParcent',
          min: '30',
          max: 50
        },
        isPro: true
      },
      scrollFixed: {
        label: 'Scroll Fixed',
        description: 'After fixed amount of scroll',
        args: {
          id: 'scrollFixed',
          min: '30',
          max: 50
        },
        isPro: true
      },
      scrollEnd: {
        label: 'Scroll End',
        description: 'Scroll to end of page',
        args: {
          id: 'scrollEnd',
          min: '30',
          max: 50
        },
        isPro: true
      },
      scrollElement: {
        label: 'Scroll Element',
        description: 'Scroll to certain element by class or id',
        args: {
          id: 'scrollElement',
          value: ''
        },
        isPro: true
      },
      clickFirst: {
        label: 'Click First',
        description: 'After first click on page',
        args: {
          id: 'clickFirst',
          value: 1
        },
        isPro: true
      },
      clickCount: {
        label: 'Click Count',
        description: 'After certain amount of click on page',
        args: {
          id: 'clickCount',
          value: 5
        },
        isPro: true
      },
      clickRight: {
        label: 'Click Right',
        description: 'on right click',
        args: {
          id: 'clickRight',
          value: 0
        },
        isPro: true
      },
      onExit: {
        label: 'On Exit',
        description: 'before close browser tab.',
        args: {
          id: 'onExit',
          value: 1
        },
        isPro: true
      },
      clickElement: {
        label: 'Click Element',
        description: 'After click an element by id or class',
        args: {
          id: 'clickElement',
          value: ''
        },
        isPro: true
      },
      // onHover: { label: 'On Hover', description: 'Display popup on hover an element', args: { id: 'onHover', value: '' }, isPro: true },
      // isDevice: { label: 'Device', description: 'Display popup based on device', args: { id: 'isDevice', value: '' }, isPro: true },
      // isDate: { label: 'Is Date', description: 'Display popup based on date', args: { id: 'isDate', value: '', start: '', end: '' }, isPro: true },
      // visitCount: { label: 'Visit Count', description: 'Display popup based on date', args: { id: 'visitCount', value: '', compair: '' }, isPro: true },
      // isCountries: { label: 'Is Country', description: 'Display popup based on countries', args: { id: 'isCountries', value: '' }, isPro: true },
      // isBrowsers: { label: 'Is browsers', description: 'Display popup based on browsers', args: { id: 'isBrowsers', value: '' }, isPro: true },
      cookieExist: {
        label: 'Cookie Exist',
        description: 'If certain cookie exist',
        args: {
          id: 'cookieExist',
          value: ''
        },
        isPro: true
      },
      cookieNotExist: {
        label: 'Cookie Not Exist',
        description: 'If certain cookie not exist',
        args: {
          id: 'cookieNotExist',
          value: ''
        },
        isPro: true
      },
      userLogged: {
        label: 'User Logged',
        description: 'Show when user logged-in(any user)',
        args: {
          id: 'userLogged',
          value: ''
        },
        isPro: true
      },
      userIds: {
        label: 'User Ids',
        description: 'If user with certain id loggedin',
        args: {
          id: 'userIds',
          value: ''
        },
        isPro: true
      },
      // userRoles: { label: 'User Roles', description: 'Show when user has specific roles.', args: { id: 'userRoles', value: '' } },
      // userCapabilities: { label: 'User Capability', description: 'Show when user has specific capability.', args: { id: 'userCapabilities', Capabilities: [] } },
      // weekDays: { label: 'is Date', description: 'Show when specific week days', args: { id: 'weekDays', days: [] } },
      // isMonths: { label: 'is Months', description: 'Show when specific months', args: { id: 'isMonths', months: [] } },
      // isHours: { label: 'is Hours', description: 'Show when specific isHours', args: { id: 'isHours', hours: [] } },
      // postsIds: { label: 'Post Ids', description: 'Display popups on single post/page by ids', args: { id: 'postsIds', value: '' }, },
      // termIds: { label: 'Term Ids', description: 'Display popups on terms page by ids', args: { id: 'postsIds', value: '' }, },
      // authorIds: { label: 'Author Ids', description: 'Display popups on author page by ids', args: { id: 'postsIds', value: '' }, },
      // homePage: { label: 'Is Home', description: 'Display popups on home  page', args: { id: 'homePage', value: '' }, },
      // frontPage: { label: 'Is Home', description: 'Display popups on home  page', args: { id: 'frontPage', value: '' }, },
      // postsPage: { label: 'Is Posts Page', description: 'Display popups on blog  page', args: { id: 'postsPage', value: '' }, },
      // isDate: { label: 'Is Date Page', description: 'Display popups on date archive  page', args: { id: 'isDate', value: '' }, },
      // isMonth: { label: 'Is Date Page', description: 'Display popups on month archive  page', args: { id: 'isMonth', value: '' }, },
      // isYear: { label: 'Is Date Page', description: 'Display popups on year archive page', args: { id: 'isYear', value: '' }, },
      // is404: { label: 'Is Date Page', description: 'Display popups on 404 archive page', args: { id: 'is404', value: '' }, },
      // wcAccount: { label: 'Is WooCommerce Account', description: 'Display popups on WooCommerce my account page', args: { id: 'wcAccount', value: '' }, },
      // wcShop: { label: 'Is WooCommerce Shop', description: 'Display popups on WooCommerce shop page', args: { id: 'wcShop', value: '' }, },
      // searchPage: { label: 'Is Search page', description: 'Display popups on search page', args: { id: 'searchPage', value: '' }, },
      urlPrams: {
        label: 'URL Prams',
        description: 'If URL contain certain parameter(ex: domain.com/some-page?urlPram=pramVal)',
        args: {
          id: 'urlPrams',
          value: ''
        },
        isPro: true
      },
      referrerExist: {
        label: 'Referrer Exist',
        description: 'if visitor come from external website.',
        args: {
          id: 'referrerExist',
          value: ''
        },
        isPro: true
      }
    };
    let visbleArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__.applyFilters)('visbleArgs', visbleArgsBasic);
    const {
      replaceInnerBlocks
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useDispatch)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.store);
    const hasInnerBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.store).getBlocks(clientId).length > 0, [clientId]); //console.log(JSON.stringify(wp.data.select(blockEditorStore).getBlocks(clientId)));

    const [closeIconHtml, setcloseIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = closeWrap.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setcloseIconHtml(iconHtml);
    }, [closeWrap.options]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss); // blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'display': { "Desktop": "grid" } };
      // blockCssY.items[wrapperSelector] = { ...blockCssY.items[wrapperSelector], 'gap': { "Desktop": "20px" } };
      // setAttributes({ blockCssY: { items: blockCssY.items } });
      //setAttributes({ wrapper: { ...wrapper, styles: { display: { Desktop: 'grid' }, gap: { Desktop: '20px' } } } });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleInner(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, inner);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        inner: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, innerSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleInner(sudoScource, key) {
      var object = myStore.deletePropertyDeep(inner, [sudoScource, key, breakPointX]);
      setAttributes({
        inner: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, innerSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleInner(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, inner);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        inner: object
      });
    }

    function onBulkAddInner(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, inner);
      obj[sudoScource] = cssObj;
      setAttributes({
        inner: obj
      });
      var selector = myStore.getElementSelector(sudoScource, innerSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleCloseWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, closeWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        closeWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, closeWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleCloseWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(closeWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        closeWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, closeWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleCloseWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, closeWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        closeWrap: object
      });
    }

    function onBulkAddCloseWrap(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, closeWrap);
      obj[sudoScource] = cssObj;
      setAttributes({
        closeWrap: obj
      });
      var selector = myStore.getElementSelector(sudoScource, closeWrapSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    var RemoveVisibleGroup = function (_ref) {
      let {
        title,
        index
      } = _ref;
      console.log(index);
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var visibleX = { ...visible
          };
          delete visibleX[index];
          setAttributes({
            visible: visibleX
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, title));
    };

    var RemoveVisibleArg = function (_ref2) {
      let {
        title,
        index,
        groupId
      } = _ref2;
      console.log(groupId);
      console.log(index);
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer inline-block hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var visibleX = { ...visible
          };
          visibleX[groupId].args.splice(index, 1);
          setAttributes({
            visible: visibleX
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, title));
    };

    const ALLOWED_BLOCKS = ['post-grid/text'];
    const MY_TEMPLATE = [['post-grid/text', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-popup `
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useInnerBlocksProps)(blockProps, {
      //allowedBlocks: ALLOWED_BLOCKS,
      //template: MY_TEMPLATE,
      //orientation: 'horizontal',
      templateInsertUpdatesSelection: true,
      renderAppender: _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InnerBlocks.ButtonBlockAppender
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
      label: "Edit Mode?",
      help: editMode ? 'Edit Mode Enabled' : 'Edit Mode Disabled.',
      checked: editMode ? true : false,
      onChange: e => {
        setAttributes({
          editMode: editMode ? false : true
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Visiblity",
      initialOpen: true
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 p-2 px-4 text-white inline-block cursor-pointer rounded-sm",
      onClick: ev => {
        var visibleX = { ...visible
        };
        var index = Object.entries(visibleX).length;
        visibleX[index] = {
          logic: 'OR',
          title: '',
          args: []
        };
        setAttributes({
          visible: visibleX
        });
      }
    }, "Add Group"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "my-4"
    }, Object.entries(visible).map((group, groupIndex) => {
      var groupId = group[0];
      var groupData = group[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
        title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleGroup, {
          title: groupIndex,
          index: groupId
        }),
        initialOpen: false
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
        className: "my-3"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
        position: "bottom right",
        variant: "secondary",
        buttonTitle: 'Add Condition',
        options: visbleArgs,
        onChange: (option, index) => {
          var visibleX = { ...visible
          };
          visibleX[groupId]['args'].push(option.args);
          setAttributes({
            visible: visibleX
          });
        },
        values: ""
      })), visible[groupId]['args'] != undefined && visible[groupId]['args'].map((item, index) => {
        var id = item.id; //console.log(item);

        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, id == 'initial' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition.")), id == 'delay' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Element ID/Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          placeholder: ".element or #elementId",
          value: item.value,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'scrollParcent' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Scroll Minimum"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.min,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].min = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Scroll Max"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.max,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].max = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'scrollFixed' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Scroll Minimum"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.min,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].min = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Scroll Max"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.max,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].max = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'scrollEnd' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition.")), id == 'scrollElement' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Element Class/ID"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.value,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'clickFirst' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition.")), id == 'clickCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Click Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.value,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'clickRight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.ToggleControl, {
          label: "Disabled right menu?",
          help: item.value ? 'Right Menu Disabled ' : 'Right Menu Enabled.',
          checked: item.value ? true : false,
          onChange: e => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = item.value ? 0 : 1;
            setAttributes({
              visible: visibleX
            });
          }
        })), id == 'onExit' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition.")), id == 'clickElement' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Element ID/Class', 'post-grid')), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          placeholder: ".element or #elementId",
          value: item.value,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'cookieExist' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Cookie Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.value,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'cookieNotExist' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Cookie Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.value,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'userLogged' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "No Option avilable for this condition.")), id == 'userIds' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "User IDs"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          placeholder: "1,2,3",
          value: item.value,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'urlPrams' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "URL Parameter"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.value,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))), id == 'referrerExist' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
          title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveVisibleArg, {
            title: visbleArgs[id] == undefined ? id : visbleArgs[id].label,
            index: id,
            groupId: groupId
          }),
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, {
          className: "mb-4"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
          for: ""
        }, "Referrer Domain"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.__experimentalInputControl, {
          className: "mr-2",
          value: item.value,
          onChange: newVal => {
            var visibleX = { ...visible
            };
            visibleX[groupId]['args'][index].value = newVal;
            setAttributes({
              visible: visibleX
            });
          }
        }))));
      }));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Inner",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: inner,
      onChange: onChangeStyleInner,
      onAdd: onAddStyleInner,
      onRemove: onRemoveStyleInner,
      onBulkAdd: onBulkAddInner
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Close",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_23__["default"], {
      library: closeWrap.options.library,
      srcType: closeWrap.options.srcType,
      iconSrc: closeWrap.options.iconSrc,
      onChange: arg => {
        var options = { ...closeWrap.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          closeWrap: { ...closeWrap,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Out animation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: closeAnimateArgs[closeWrap.options.animation] == undefined ? 'Choose' : closeAnimateArgs[closeWrap.options.animation].label,
      options: closeAnimateArgs,
      onChange: (option, index) => {
        var options = { ...closeWrap.options,
          animation: option.value
        };
        setAttributes({
          closeWrap: { ...closeWrap,
            options: options
          }
        });
        console.log(option);
        const element = document.querySelector(wrapperSelector + ' .inner');
        element.classList.add('animate__animated', 'animate__' + option.value);
        setTimeout(() => {
          element.classList.remove('animate__animated', 'animate__' + option.value);
        }, 2000);
      },
      values: ""
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: closeWrap,
      onChange: onChangeStyleCloseWrap,
      onAdd: onAddStyleCloseWrap,
      onRemove: onRemoveStyleCloseWrap,
      onBulkAdd: onBulkAddCloseWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: ""
    }, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400 hidden hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)([['post-grid/text', {}]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_17__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 bg-gray-400 cursor-pointer hover:bg-gray-500 relative",
        onClick: ev => {
          if (variation.isPro) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var atts = variation.atts;
          var wrapper = { ...atts.wrapper
          };
          var closeWrap = { ...atts.closeWrap
          };
          var inner = { ...atts.inner
          };
          var blockCssY = { ...atts.blockCssY
          };
          var customCss = { ...atts.customCss
          };
          var blockCssObj = {};
          blockCssObj[wrapperSelector] = wrapper;
          blockCssObj[closeWrapSelector] = closeWrap;
          blockCssObj[innerSelector] = inner;
          setAttributes({
            wrapper: wrapper,
            closeWrap: closeWrap,
            inner: inner,
            customCss: customCss
          });
          var blockCssRules = myStore.getBlockCssRules(blockCssObj);
          var items = { ...blockCssY.items,
            ...blockCssRules
          };
          setAttributes({
            blockCssY: {
              items: items
            }
          });
          replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)(variation.innerBlocks), true);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, !editMode && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-center inline-block mx-auto",
      onClick: e => {
        setAttributes({
          editMode: editMode ? false : true
        });
      }
    }, "Enable Edit Mode"), editMode && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "inner"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "close"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "icon",
      dangerouslySetInnerHTML: {
        __html: closeIconHtml
      }
    })), innerBlocksProps.children))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps.save({
      className: ` ${blockId} pg-popup`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InnerBlocks.Content, null); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/popup/variations.js":
/*!****************************************!*\
  !*** ./src/blocks/popup/variations.js ***!
  \****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__);


/**
 * WordPress dependencies
 */


let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('isProFeature', true);
/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: 'preset-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-1'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-1'),
  isPro: false,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        },
        "position": {
          "Desktop": "fixed"
        },
        "top": {
          "Desktop": "30px"
        },
        "left": {
          "Desktop": "0px"
        },
        "width": {
          "Desktop": "100% !important"
        },
        "height": {
          "Desktop": "100% !important"
        },
        "maxWidth": {
          "Desktop": "100% !important"
        },
        "zIndex": {
          "Desktop": "99"
        },
        "borderRadius": {},
        "padding": {
          "Desktop": "20px 20px 20px 20px"
        }
      }
    },
    inner: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "width": {
          "Desktop": "700px"
        },
        "height": {
          "Desktop": "400px"
        },
        "top": {
          "Desktop": "50%"
        },
        "left": {
          "Desktop": "50%"
        },
        "position": {
          "Desktop": "absolute"
        },
        "transform": {
          "Desktop": "translateX(-50%) translateY(-50%) "
        },
        "backgroundColor": {
          "Desktop": "#A084CF"
        },
        "padding": {
          "Desktop": "15px 15px 15px 15px"
        },
        "borderRadius": {
          "Desktop": "5px 5px 5px 5px"
        },
        "overflow": {}
      }
    },
    closeWrap: {
      "options": {
        "tag": "span",
        "class": "",
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "fas fa-times",
        "animation": "zoomOutLeft"
      },
      "styles": {
        "backgroundColor": {
          "Desktop": "#ff6565"
        },
        "padding": {
          "Desktop": "8px 15px 7px 15px"
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "right": {
          "Desktop": "-21px"
        },
        "top": {
          "Desktop": "-21px"
        },
        "position": {
          "Desktop": "absolute"
        },
        "cursor": {
          "Desktop": "pointer"
        }
      },
      "hover": {
        "backgroundColor": {
          "Desktop": "#a82b2b"
        }
      }
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/text', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "16.02",
    y: "29.98",
    width: "302.52",
    height: "201.47",
    rx: "0.73"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#939598",
    cx: "318.54",
    cy: "29.98",
    r: "25.44"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M320.11,30l9.54-9.54a1.12,1.12,0,0,0,0-1.57,1.1,1.1,0,0,0-1.56,0l-9.55,9.55L309,18.87a1.1,1.1,0,0,0-1.56,0,1.12,1.12,0,0,0,0,1.57L317,30l-9.55,9.55a1.12,1.12,0,0,0,0,1.57,1.13,1.13,0,0,0,.78.32,1.1,1.1,0,0,0,.78-.32l9.55-9.55,9.55,9.55a1.11,1.11,0,1,0,1.56-1.57Z"
  }))
}, {
  name: 'preset-2',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-2'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-2'),
  isPro: false,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        },
        "position": {
          "Desktop": "fixed"
        },
        "top": {
          "Desktop": "30px"
        },
        "left": {
          "Desktop": "0px"
        },
        "width": {
          "Desktop": "100% !important"
        },
        "height": {
          "Desktop": "100% !important"
        },
        "maxWidth": {
          "Desktop": "100% !important"
        },
        "zIndex": {
          "Desktop": "99"
        },
        "borderRadius": {},
        "padding": {
          "Desktop": "20px 20px 20px 20px"
        }
      }
    },
    inner: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "width": {
          "Desktop": "700px"
        },
        "height": {
          "Desktop": "400px"
        },
        "top": {
          "Desktop": "50%"
        },
        "left": {
          "Desktop": "50%"
        },
        "position": {
          "Desktop": "absolute"
        },
        "transform": {
          "Desktop": "translateX(-50%) translateY(-50%) "
        },
        "backgroundColor": {
          "Desktop": "#A084CF"
        },
        "padding": {
          "Desktop": "15px 15px 15px 15px"
        },
        "borderRadius": {
          "Desktop": "5px 5px 5px 5px"
        },
        "overflow": {}
      }
    },
    closeWrap: {
      "options": {
        "tag": "span",
        "class": "",
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "fas fa-times",
        "animation": "zoomOutLeft"
      },
      "styles": {
        "backgroundColor": {
          "Desktop": "#ff6565"
        },
        "padding": {
          "Desktop": "8px 15px 7px 15px"
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "left": {
          "Desktop": "-21px"
        },
        "top": {
          "Desktop": "-21px"
        },
        "position": {
          "Desktop": "absolute"
        },
        "cursor": {
          "Desktop": "pointer"
        }
      },
      "hover": {
        "backgroundColor": {
          "Desktop": "#a82b2b"
        }
      }
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/text', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "41.46",
    y: "29.98",
    width: "302.52",
    height: "201.47",
    rx: "0.73"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#939598",
    cx: "41.46",
    cy: "29.98",
    r: "25.44"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M43,30l9.55-9.54a1.12,1.12,0,0,0,0-1.57,1.1,1.1,0,0,0-1.56,0l-9.55,9.55-9.55-9.55a1.1,1.1,0,0,0-1.56,0,1.12,1.12,0,0,0,0,1.57L39.89,30l-9.54,9.55a1.11,1.11,0,0,0,1.56,1.57l9.55-9.55L51,41.1a1.1,1.1,0,0,0,.78.32,1.13,1.13,0,0,0,.78-.32,1.12,1.12,0,0,0,0-1.57Z"
  }))
}, {
  name: 'preset-3',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-3'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-3'),
  isPro: false,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        },
        "position": {
          "Desktop": "fixed"
        },
        "top": {
          "Desktop": "30px"
        },
        "left": {
          "Desktop": "0px"
        },
        "width": {
          "Desktop": "100% !important"
        },
        "height": {
          "Desktop": "100% !important"
        },
        "maxWidth": {
          "Desktop": "100% !important"
        },
        "zIndex": {
          "Desktop": "99"
        },
        "borderRadius": {},
        "padding": {
          "Desktop": "20px 20px 20px 20px"
        }
      }
    },
    inner: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "width": {
          "Desktop": "700px"
        },
        "height": {
          "Desktop": "400px"
        },
        "top": {
          "Desktop": "50%"
        },
        "left": {
          "Desktop": "50%"
        },
        "position": {
          "Desktop": "absolute"
        },
        "transform": {
          "Desktop": "translateX(-50%) translateY(-50%) "
        },
        "backgroundColor": {
          "Desktop": "#A084CF"
        },
        "padding": {
          "Desktop": "15px 15px 15px 15px"
        },
        "borderRadius": {
          "Desktop": "5px 5px 5px 5px"
        },
        "overflow": {}
      }
    },
    closeWrap: {
      "options": {
        "tag": "span",
        "class": "",
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "fas fa-times",
        "animation": "zoomOutLeft"
      },
      "styles": {
        "backgroundColor": {
          "Desktop": "#ff6565"
        },
        "padding": {
          "Desktop": "8px 15px 7px 15px"
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "left": {
          "Desktop": "-21px"
        },
        "bottom": {
          "Desktop": "-21px"
        },
        "position": {
          "Desktop": "absolute"
        },
        "cursor": {
          "Desktop": "pointer"
        }
      },
      "hover": {
        "backgroundColor": {
          "Desktop": "#a82b2b"
        }
      }
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/text', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "41.46",
    y: "4.54",
    width: "302.52",
    height: "201.47",
    rx: "0.73"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#939598",
    cx: "41.46",
    cy: "206.02",
    r: "25.44"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M43,206l9.55-9.55a1.12,1.12,0,0,0,0-1.57,1.1,1.1,0,0,0-1.56,0l-9.55,9.55-9.55-9.55a1.1,1.1,0,0,0-1.56,0,1.12,1.12,0,0,0,0,1.57L39.89,206l-9.54,9.54a1.11,1.11,0,0,0,1.56,1.57l9.55-9.55L51,217.13a1.1,1.1,0,0,0,.78.32,1.13,1.13,0,0,0,.78-.32,1.12,1.12,0,0,0,0-1.57Z"
  }))
}, {
  name: 'preset-4',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-4'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-4'),
  isPro: false,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        },
        "position": {
          "Desktop": "fixed"
        },
        "top": {
          "Desktop": "30px"
        },
        "left": {
          "Desktop": "0px"
        },
        "width": {
          "Desktop": "100% !important"
        },
        "height": {
          "Desktop": "100% !important"
        },
        "maxWidth": {
          "Desktop": "100% !important"
        },
        "zIndex": {
          "Desktop": "99"
        },
        "borderRadius": {},
        "padding": {
          "Desktop": "20px 20px 20px 20px"
        }
      }
    },
    inner: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "width": {
          "Desktop": "700px"
        },
        "height": {
          "Desktop": "400px"
        },
        "top": {
          "Desktop": "50%"
        },
        "left": {
          "Desktop": "50%"
        },
        "position": {
          "Desktop": "absolute"
        },
        "transform": {
          "Desktop": "translateX(-50%) translateY(-50%) "
        },
        "backgroundColor": {
          "Desktop": "#A084CF"
        },
        "padding": {
          "Desktop": "15px 15px 15px 15px"
        },
        "borderRadius": {
          "Desktop": "5px 5px 5px 5px"
        },
        "overflow": {}
      }
    },
    closeWrap: {
      "options": {
        "tag": "span",
        "class": "",
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "fas fa-times",
        "animation": "zoomOutLeft"
      },
      "styles": {
        "backgroundColor": {
          "Desktop": "#ff6565"
        },
        "padding": {
          "Desktop": "8px 15px 7px 15px"
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        "right": {
          "Desktop": "-21px"
        },
        "bottom": {
          "Desktop": "-21px"
        },
        "position": {
          "Desktop": "absolute"
        },
        "cursor": {
          "Desktop": "pointer"
        }
      },
      "hover": {
        "backgroundColor": {
          "Desktop": "#a82b2b"
        }
      }
    },
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  innerBlocks: [['post-grid/text', {}]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 360 236"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#bcbec0",
    x: "16.02",
    y: "4.54",
    width: "302.52",
    height: "201.47",
    rx: "0.73"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
    fill: "#939598",
    cx: "318.54",
    cy: "206.02",
    r: "25.44"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#fff",
    d: "M320.11,206l9.54-9.55a1.12,1.12,0,0,0,0-1.57,1.1,1.1,0,0,0-1.56,0l-9.55,9.55L309,194.9a1.1,1.1,0,0,0-1.56,0,1.12,1.12,0,0,0,0,1.57L317,206l-9.55,9.54a1.12,1.12,0,0,0,0,1.57,1.13,1.13,0,0,0,.78.32,1.1,1.1,0,0,0,.78-.32l9.55-9.55,9.55,9.55a1.11,1.11,0,1,0,1.56-1.57Z"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/post-author-fields/index.js":
/*!************************************************!*\
  !*** ./src/blocks/post-author-fields/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");

















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__.registerBlockType)("post-grid/post-author-fields", {
  apiVersion: 2,
  title: "Author Fields",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M3.25,10.49H4.64a3.25,3.25,0,0,1,3.25,3.25V15a0,0,0,0,1,0,0H0a0,0,0,0,1,0,0V13.74A3.25,3.25,0,0,1,3.25,10.49Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "3.94",
      cy: "7.81",
      r: "2.18"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "28.38",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "16.42",
      y: "28.38",
      width: "9.96",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "23.68",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "18.98",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "15.48",
      y: "12.07",
      width: "10.87",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "28.26",
      y: "12.07",
      width: "7.74",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "15.48",
      y: "6.54",
      width: "20.52",
      height: "2.35"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          class: '',
          tag: 'div'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    field: {
      type: 'object',
      default: {
        options: {
          linkTo: 'postUrl',

          /*postUrl, homeUrl, authorUrl, authorLink, mailTo, custom */
          linkToMeta: '',
          linkTarget: '',
          avatarSize: '',
          dateFormat: '',
          customUrl: '',
          prefix: '',
          postfix: '',
          linkAttr: []
        },
        styles: {}
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: '',
          position: 'beforePostDate',

          /*before, after, prefix, postfix */
          class: 'icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {},
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          fontWeight: {
            "Desktop": "700"
          },
          textDecoration: {} //overline, line-through, underline

        }
      }
    },
    metaKey: {
      "type": "string",
      "default": ''
    },
    frontText: {
      type: 'object',
      default: {
        options: {
          text: 'Author: ',
          class: 'inline-block'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var frontText = attributes.frontText;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var metaKey = attributes.metaKey;
    var field = attributes.field;
    var icon = attributes.icon;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    var userFields = [{
      label: "ID",
      key: 'id'
    }, // { label: "login", key: 'login' },
    // { label: "Nick name", key: 'nickname' },
    // { label: "Email", key: 'email' },
    {
      label: "URL",
      key: 'url'
    }, {
      label: "Registered",
      key: 'registered'
    }, {
      label: "Display name",
      key: 'display_name'
    }, {
      label: "First name",
      key: 'first_name'
    }, {
      label: "Last name",
      key: 'last_name'
    }, {
      label: "Description",
      key: 'description'
    }, // { label: "Avatar URL", key: 'avatar_url' },
    {
      label: "Avatar",
      key: 'avatar'
    } // { label: "Profile Link", key: 'link' },
    ];
    var linkToArgsBasic = {
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_4__.applyFilters)('linkToArgs', linkToArgsBasic); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    const fieldSelector = blockClass + ' .fieldVal';
    const frontTextSelector = blockClass + ' .frontText';
    const iconSelector = blockClass + ' .icon';
    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';
    const CustomTagWrapper = `${wrapper.options.tag}`;
    var breakPointList = [];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    const [postAuthorData, setpostAuthorData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]); // Using the hook.

    const [loading, setLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Using the hook.

    const [postAuthorX, setpostAuthorX] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_3__.useEntityProp)('postType', postType, 'author', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      if (metaKey.length == 0) return;
      setpostAuthorData([]);
      setLoading(true);
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1___default()({
        path: '/post-grid/v2/get_user_data',
        method: 'POST',
        data: {
          id: postAuthorX,
          fields: []
        }
      }).then(res => {
        setpostAuthorData(res);
        setLoading(false);
      });
    }, [metaKey]);
    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryFrontText(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        frontText[sudoScource] = sudoScourceArgs;
      });
      var frontTextX = Object.assign({}, frontText);
      setAttributes({
        frontText: frontTextX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleField(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, field);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        field: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, fieldSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleField(sudoScource, key) {
      var object = myStore.deletePropertyDeep(field, [sudoScource, key, breakPointX]);
      setAttributes({
        field: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, fieldSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleField(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, field);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        field: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleFrontText(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleFrontText(sudoScource, key) {
      var object = myStore.deletePropertyDeep(frontText, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleFrontText(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        frontText: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    function setFieldLinkTo(option, index) {
      var options = { ...field.options,
        linkTo: option.value
      };
      setAttributes({
        field: { ...field,
          options: options
        }
      });
    }

    function setUserField(option, index) {
      setAttributes({
        metaKey: option.key
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      linkAttrObj();
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [field]);

    var linkAttrObj = () => {
      var sdsd = {};
      field.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    const post = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecord('postType', context['postType'], context['postId']));
    const termstaxonomy = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecords('taxonomy', 'category', [4, 5]));
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps)({
      className: ` ${blockId} pg-author-fields`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Select User Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_15__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: userFields,
      buttonTitle: "Choose",
      onChange: setUserField,
      values: metaKey
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: metaKey,
      onChange: newVal => {
        setAttributes({
          metaKey: newVal
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Field Settings",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'style',
        title: 'Style',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, field.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_15__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: "Choose",
      onChange: setFieldLinkTo,
      values: metaKey
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-gray-500 p-2 my-3 text-white"
    }, linkToArgs[field.options.linkTo] != undefined ? linkToArgs[field.options.linkTo].label : ''), field.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Author Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: field.options.linkToMeta,
      onChange: newVal => {
        var options = { ...field.options,
          linkToMeta: newVal
        };
        setAttributes({
          field: { ...field,
            options: options
          }
        });
      }
    })), field.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: field.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...field.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          field: { ...field,
            options: options
          }
        });
      }
    })), field.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), field.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        var options = { ...field.options,
          customUrl: ''
        };
        setAttributes({
          field: { ...field,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.__experimentalLinkControl, {
      settings: [],
      value: field.options.customUrl,
      onChange: newVal => {
        var options = { ...field.options,
          customUrl: newVal.url
        };
        setAttributes({
          field: { ...field,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", field.options.customUrl.length != 0 ? field.options.customUrl : 'No link', " "))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: field.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...field.options,
          linkTarget: newVal
        };
        setAttributes({
          field: { ...field,
            options: options
          }
        });
      }
    }))), field.options.linkTo == 'custom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: field.options.customUrl,
      onChange: newVal => {
        var options = { ...field.options,
          customUrl: newVal
        };
        setAttributes({
          field: { ...field,
            options: options
          }
        });
      }
    })), field.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Link Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = field.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...field.options,
          linkAttr: sdsd
        };
        setAttributes({
          field: { ...field,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), field.options.linkAttr.length > 0 && field.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        className: "mr-2",
        value: field.options.linkAttr[i].id,
        onChange: newVal => {
          field.options.linkAttr[i].id = newVal;
          var ssdsd = field.options.linkAttr.concat([]);
          var options = { ...field.options,
            linkAttr: ssdsd
          };
          setAttributes({
            field: { ...field,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        className: "mr-2",
        value: x.val,
        onChange: newVal => {
          field.options.linkAttr[i].val = newVal;
          var ssdsd = field.options.linkAttr.concat([]);
          var options = { ...field.options,
            linkAttr: ssdsd
          };
          setAttributes({
            field: { ...field,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          field.options.linkAttr.splice(i, 1);
          var ssdsd = field.options.linkAttr.concat([]);
          var options = { ...field.options,
            linkAttr: ssdsd
          };
          setAttributes({
            field: { ...field,
              options: options
            }
          });
        }
      })));
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "style"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: field,
      onChange: onChangeStyleField,
      onAdd: onAddStyleField,
      onRemove: onRemoveStyleField
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_18__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Front text',
        value: 'beforeFronttext'
      }, {
        label: 'After Front text',
        value: 'afterFronttext'
      }, {
        label: 'Before Field',
        value: 'beforeField'
      }, {
        label: 'After Field',
        value: 'afterField'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Front Text",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: frontText.options.text,
      onChange: newVal => {
        var options = { ...frontText.options,
          text: newVal
        };
        setAttributes({
          frontText: { ...frontText,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: frontText,
      onChange: onChangeStyleFrontText,
      onAdd: onAddStyleFrontText,
      onRemove: onRemoveStyleFrontText
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: frontText,
      onChange: onPickCssLibraryFrontText
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: {
            styles: prefix.styles,
            options: options
          }
        }); // setAttributes({ prefix: { text: newVal, class: prefix.options.class, color: prefix.color, backgroundColor: prefix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        }); // setAttributes({ postfix: { text: newVal, class: prefix.options.class, color: postfix.color, backgroundColor: postfix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Field Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, fieldSelector, '{}', " ")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, ".pg-postAuthor a", '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, frontTextSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_19__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_20__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), loading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Spinner, null)), !loading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, metaKey.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Select User Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_15__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: userFields,
      buttonTitle: "Choose",
      onChange: setUserField,
      values: metaKey
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: metaKey,
      onChange: newVal => {
        setAttributes({
          metaKey: newVal
        });
      }
    }))), metaKey.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagWrapper, blockProps, icon.options.position == 'beforeFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), frontText.options.text.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "frontText"
    }, frontText.options.text), icon.options.position == 'afterFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforeField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), field.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, prefix.options.text.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "prefix"
    }, prefix.options.text), metaKey == 'avatar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
      className: "fieldVal",
      src: postAuthorData['avatar_url'],
      alt: postAuthorData['display_name']
    }), metaKey != 'avatar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "fieldVal"
    }, postAuthorData[metaKey]), postfix.options.text.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "postfix"
    }, postfix.options.text)), field.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
      href: "#",
      target: field.options.linkTarget
    }, prefix.options.text.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "prefix"
    }, prefix.options.text), metaKey == 'avatar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
      className: "fieldVal",
      src: postAuthorData['avatar_url'],
      alt: postAuthorData['display_name']
    }), metaKey != 'avatar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "fieldVal"
    }, postAuthorData[metaKey]), postfix.options.text.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "postfix"
    }, postfix.options.text)), icon.options.position == 'afterField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-author/index.js":
/*!*****************************************!*\
  !*** ./src/blocks/post-author/index.js ***!
  \*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");

















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/post-author", {
  apiVersion: 2,
  title: "Post Author",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "28.03",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "16.42",
      y: "28.03",
      width: "9.96",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "23.34",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "18.64",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M3,10.43H4.26a3,3,0,0,1,3,3v1.15a0,0,0,0,1,0,0H0a0,0,0,0,1,0,0V13.42a3,3,0,0,1,3-3Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "3.62",
      cy: "7.97",
      r: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "15.48",
      y: "9.09",
      width: "20.52",
      height: "2.35"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    elements: {
      "type": "object",
      "default": {
        items: [{
          id: 'avatar',
          label: "Avatar"
        }, {
          id: 'name',
          label: "Name"
        }, {
          id: 'description',
          label: "Description"
        }]
      } // avatar, name, description, id

    },
    avatar: {
      "type": "object",
      "default": {
        options: {
          class: 'avatar',
          size: '48',
          default: ''
        },
        styles: {
          display: {},
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          verticalAlign: {},
          borderRadius: {}
        }
      }
    },
    name: {
      "type": "object",
      "default": {
        options: {
          class: 'name',
          prefix: '',
          postfix: '',
          linkTo: '',
          linkToMeta: '',
          customUrl: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          verticalAlign: {},
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    description: {
      "type": "object",
      "default": {
        options: {
          class: 'description',
          prefix: '',
          postfix: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          verticalAlign: {},
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    linkAttr: {
      "type": "array",
      "default": []
    },
    blockCss: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var elements = attributes.elements;
    var avatar = attributes.avatar;
    var description = attributes.description;
    var name = attributes.name;
    var linkAttr = attributes.linkAttr;
    var blockCss = attributes.blockCss;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType'];
    var wrapperSelector = blockClass; // Wrapper CSS Class Selectors

    var nameSelector = blockClass + ' .name';
    var descriptionSelector = blockClass + ' .description';
    var avatarSelector = blockClass + ' .avatar';
    var avatarImgSelector = blockClass + ' .avatar img';
    const CustomTagWrapper = `${wrapper.options.tag}`;
    var [breakPointX, setBreakPointX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(myStore.getBreakPoint());
    var [postAuthor, setPostAuthor] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({});
    var [html, setHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({});
    var [loading, setLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    var [postAuthorId, setPostAuthorId] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__.useEntityProp)('postType', postType, 'author', postId);
    var [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
        path: '/wp/v2/users/' + postAuthorId,
        method: 'GET'
      }).then(res => {
        setPostAuthor(res);
      });
    }, [postAuthorId]);
    var linkToArgsBasic = {
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__.applyFilters)('linkToArgs', linkToArgsBasic);
    var userFields = [{
      id: 'avatar',
      label: "Avatar"
    }, {
      id: 'name',
      label: "Name"
    }, {
      id: 'description',
      label: "Description"
    }];

    function setUserField(option, index) {
      //var isExist = elements.items.find(x => x.label === option.label);
      //if (isExist == undefined) {
      //}
      var elementsX = elements.items.push(option);
      setAttributes({
        elements: {
          items: elements.items
        }
      });
    }

    function generatehtml() {
      var nameHtml = postAuthor.name != undefined ? `<span className='prefix'>${name.options.prefix}</span>${postAuthor.name}<span className='postfix'>${name.options.postfix}</span>` : 'Author Name 1';

      if (name.options.linkTo == 'postUrl') {
        nameHtml = `<span className='prefix'>${name.options.prefix}</span><a href="${currentPostUrl}">${postAuthor.name != undefined ? postAuthor.name : 'Author Name'}</a><span className='postfix'>${name.options.postfix}</span>`;
      }

      if (name.options.linkTo == 'authorUrl') {
        nameHtml = `<span className='prefix'>${name.options.prefix}</span><a href="${postAuthor.url}">${postAuthor.name != undefined ? postAuthor.name : 'Author Name'}</a><span className='postfix'>${name.options.postfix}</span>`;
      }

      if (name.options.linkTo == 'authorLink') {
        nameHtml = `<span className='prefix'>${name.options.prefix}</span><a href="${postAuthor.link}">${postAuthor.name != undefined ? postAuthor.name : 'Author Name'}</a><span className='postfix'>${name.options.postfix}</span>`;
      }

      if (name.options.linkTo == 'authorMeta') {
        nameHtml = `<span className='prefix'>${name.options.prefix}</span><a href="${postAuthor.link}">${postAuthor.name != undefined ? postAuthor.name : 'Author Name'}</a><span className='postfix'>${name.options.postfix}</span>`;
      }

      if (name.options.linkTo == 'customUrl') {
        nameHtml = `<span className='prefix'>${name.options.prefix}</span><a href="${name.options.customUrl}">${postAuthor.name != undefined ? postAuthor.name : 'Author Name'}</a><span className='postfix'>${name.options.postfix}</span>`;
      }

      html.name = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RawHTML, {
        class: name.options.class
      }, nameHtml);
      html.description = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RawHTML, {
        class: description.options.class
      }, postAuthor.description != undefined ? postAuthor.description : 'Author description');

      if (postAuthor.avatar_urls != undefined) {
        var avatarHtml = `<img alt='' src=${postAuthor.avatar_urls != undefined ? postAuthor.avatar_urls[avatar.options.size] : ''} />`;
        html.avatar = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RawHTML, {
          class: avatar.options.class
        }, avatarHtml, " ");
      }

      setTimeout(x => {
        setHtml(html);
      }, 100);
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setTimeout(() => {
        generatehtml();
      }, 1000);
    }, [postAuthor]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      generatehtml();
    }, [name]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      generatehtml();
    }, [description]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      generatehtml();
    }, [avatar]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleElements(sudoScource, newVal, attr) {
      var path = sudoScource + '.' + attr + '.' + breakPointX;
      let obj = Object.assign({}, elements);
      const updatedObj = myStore.setPropertyDeep(obj, path, newVal);
      setAttributes({
        elements: updatedObj
      });
      var sudoScourceX = { ...updatedObj[sudoScource]
      };
      var elementSelector = redmoreSelector;
      var elementSelector = myStore.getElementSelector(sudoScource, redmoreSelector);
      sudoScourceX[attr][breakPointX] = newVal;

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[elementSelector][argAttr] = argAttrVal;
      });
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }

    function onRemoveStyleElements(sudoScource, key) {
      var object = myStore.deletePropertyDeep(elements, [sudoScource, key, breakPointX]);
      setAttributes({
        elements: object
      });
      var elementSelectorX = myStore.getElementSelector(sudoScource, elementSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelectorX, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleElements(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, elements);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        elements: object
      });
    }

    function onChangeStyleAvatar(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, avatar);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        avatar: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, avatarSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleAvatar(sudoScource, key) {
      var object = myStore.deletePropertyDeep(avatar, [sudoScource, key, breakPointX]);
      setAttributes({
        avatar: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, avatarSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleAvatar(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, avatar);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        avatar: object
      });
    }

    function onChangeStyleName(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, name);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        name: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, nameSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleName(sudoScource, key) {
      var object = myStore.deletePropertyDeep(name, [sudoScource, key, breakPointX]);
      setAttributes({
        name: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, nameSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleName(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, name);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        name: object
      });
    }

    function onChangeStyleDescription(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, description);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        description: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, descriptionSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleDescription(sudoScource, key) {
      var object = myStore.deletePropertyDeep(description, [sudoScource, key, breakPointX]);
      setAttributes({
        description: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, descriptionSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleDescription(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, description);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        description: object
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      linkAttrObj();
    }, [linkAttr]);

    var linkAttrObj = () => {
      var sdsd = {};
      linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd); //return sdsd;
    };

    const CustomTag = `${wrapper.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-post-author`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Elements",
      initialOpen: true
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: elements,
      onChange: onChangeStyleElements,
      onAdd: onAddStyleElements,
      onRemove: onRemoveStyleElements
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Add User Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_15__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: userFields,
      buttonTitle: "Choose",
      onChange: setUserField,
      values: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__.ReactSortable, {
      list: elements.items,
      setList: item => {
        setAttributes({
          elements: {
            items: item
          }
        });
      }
    }, elements.items.map((item, index) => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      key: item.id,
      className: "flex items-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      onClick: ev => {
        var elementsX = elements.items.splice(index, 1);
        setAttributes({
          elements: {
            items: elements.items
          }
        });
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "cursor-move"
    }, item.label))))), elements.items.find(x => x.label === 'Avatar') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Avatar",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Avatar Size"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: avatar.options.size,
      options: [{
        label: 'Select..',
        value: ''
      }, {
        label: '24',
        value: '24'
      }, {
        label: '48',
        value: '48'
      }, {
        label: '96',
        value: '96'
      }],
      onChange: newVal => {
        var options = { ...avatar.options,
          size: newVal
        };
        setAttributes({
          avatar: { ...avatar,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Avatar Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: avatar.options.class,
      onChange: newVal => {
        var options = { ...avatar.options,
          class: newVal
        };
        setAttributes({
          avatar: { ...avatar,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: avatar,
      onChange: onChangeStyleAvatar,
      onAdd: onAddStyleAvatar,
      onRemove: onRemoveStyleAvatar
    })))), elements.items.find(x => x.label === 'Name') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Name",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Name Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: name.options.class,
      onChange: newVal => {
        var options = { ...name.options,
          class: newVal
        };
        setAttributes({
          name: { ...name,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_15__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: name.options.linkTo.length == 0 ? 'Choose' : linkToArgs[name.options.linkTo].label,
      options: linkToArgs,
      onChange: (option, index) => {
        var options = { ...name.options,
          linkTo: option.value
        };
        setAttributes({
          name: { ...name,
            options: options
          }
        });
      },
      values: ""
    })), (name.options.linkTo == 'authorMeta' || name.options.linkTo == 'customField') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, name.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, "Author Meta Key"), name.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, "Post Meta Key")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: name.options.linkToMeta,
      onChange: newVal => {
        var options = { ...name.options,
          linkToMeta: newVal
        };
        setAttributes({
          name: { ...name,
            options: options
          }
        });
      }
    })), name.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), name.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
      onClick: ev => {
        var options = { ...name.options,
          customUrl: ''
        };
        setAttributes({
          name: { ...name,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.__experimentalLinkControl, {
      settings: [],
      value: name.options.customUrl,
      onChange: newVal => {
        var options = { ...name.options,
          customUrl: newVal.url
        };
        setAttributes({
          name: { ...name,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", name.options.customUrl.length != 0 ? name.options.customUrl : 'No link', " "))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: name.options.prefix,
      onChange: newVal => {
        var options = { ...name.options,
          prefix: newVal
        };
        setAttributes({
          name: { ...name,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: name.options.postfix,
      onChange: newVal => {
        var options = { ...name.options,
          postfix: newVal
        };
        setAttributes({
          name: { ...name,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: name,
      onChange: onChangeStyleName,
      onAdd: onAddStyleName,
      onRemove: onRemoveStyleName
    })))), elements.items.find(x => x.label === 'Description') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Description",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Description Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: description.options.class,
      onChange: newVal => {
        var options = { ...description.options,
          class: newVal
        };
        setAttributes({
          description: { ...description,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: description,
      onChange: onChangeStyleDescription,
      onAdd: onAddStyleDescription,
      onRemove: onRemoveStyleDescription
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Name Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, nameSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Description Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, descriptionSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Avatar Selector "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, avatarSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_17__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_18__["default"], {
      utm: {
        utm_source: 'BlockPostExcerpt',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagWrapper, blockProps, elements.items.map(x => {
      return html[x.id];
    })));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-categories/index.js":
/*!*********************************************!*\
  !*** ./src/blocks/post-categories/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");

















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__.registerBlockType)("post-grid/post-categories", {
  apiVersion: 2,
  title: "Post Categories",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "27.61",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.42",
      y: "27.61",
      width: "9.96",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "22.91",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "18.22",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "6.39",
      width: "36",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "0.07",
      y: "13.09",
      width: "5.42",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "8.3",
      y: "13.09",
      width: "5.42",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "16.53",
      y: "13.09",
      width: "5.42",
      height: "2"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          class: '',
          tag: 'div'
        },
        styles: {
          display: {},
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    items: {
      type: 'object',
      default: {
        options: {
          prefix: '',
          postfix: '',
          linkTo: 'termUrl',
          linkToCustomMeta: '',
          linkToAuthorMeta: '',
          customUrl: '',
          maxCount: 99,
          postCount: false,
          class: ' item ',
          linkTarget: '',
          linkAttr: []
        },
        styles: {
          display: {},
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: '',
          position: 'beforeFronttext',

          /*before, after, prefix, postfix */
          class: 'icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {},
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          fontWeight: {
            "Desktop": "700"
          },
          textDecoration: {} //overline, line-through, underline

        }
      }
    },
    termTitle: {
      type: 'object',
      default: {
        options: {
          class: 'inline-block',
          text: ', '
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    separator: {
      type: 'object',
      default: {
        options: {
          class: 'inline-block',
          text: ', '
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    frontText: {
      type: 'object',
      default: {
        options: {
          text: 'Categories: ',
          class: 'inline-block'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var items = attributes.items;
    var separator = attributes.separator;
    var frontText = attributes.frontText;
    var icon = attributes.icon;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const CustomTagWrapper = `${wrapper.options.tag}`; // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    const itemSelector = blockClass + ' .item';
    const itemTitleSelector = blockClass + ' .termTitle';
    const separatorSelector = blockClass + ' .separator';
    const frontTextSelector = blockClass + ' .frontText';
    const postCountSelector = blockClass + ' .postCount';
    const iconSelector = blockClass + ' .icon';
    var breakPointList = [];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    var dummyCats = [{
      "id": 1,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 1",
      "slug": "category-1",
      "taxonomy": "category_tax"
    }, {
      "id": 2,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 2",
      "slug": "category-2",
      "taxonomy": "category_tax"
    }, {
      "id": 3,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 3",
      "slug": "category-3",
      "taxonomy": "category_tax"
    }, {
      "id": 4,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 4",
      "slug": "category-4",
      "taxonomy": "category_tax"
    }, {
      "id": 5,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 5",
      "slug": "category-5",
      "taxonomy": "category_tax"
    }, {
      "id": 6,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 6",
      "slug": "category-6",
      "taxonomy": "category_tax"
    }];
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ postTitle: postTitle });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    const [categoryCount, setcategoryCount] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(0); // Using the hook.

    const [postCategoriesData, setPostCategoriesData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [categories, setCategories] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [postCategoriesX, setPostCategoriesX] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__.useEntityProp)('postType', postType, 'categories', postId);
    var iconPositonArgsBasic = {
      none: {
        label: 'Choose Position',
        value: ''
      },
      beforeFronttext: {
        label: 'Before Front text',
        value: 'beforeFronttext'
      },
      afterFronttext: {
        label: 'After Front text',
        value: 'afterFronttext'
      },
      beforeItems: {
        label: 'Before Items',
        value: 'beforeItems'
      },
      afterItems: {
        label: 'After Items',
        value: 'afterItems'
      },
      beforeItem: {
        label: 'Before Each Items',
        value: 'beforeItem',
        isPro: true
      },
      afterItem: {
        label: 'After Each Items',
        value: 'afterItem',
        isPro: true
      }
    };
    let iconPositonArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__.applyFilters)('iconPositonArgs', iconPositonArgsBasic);
    var linkToArgsBasic = {
      noUrl: {
        label: 'No URL',
        value: ''
      },
      termUrl: {
        label: 'Term URL',
        value: 'termUrl'
      },
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = linkToArgsBasic;

    function setFieldLinkTo(option, index) {
      var options = { ...items.options,
        linkTo: option.value
      };
      setAttributes({
        items: { ...items,
          options: options
        }
      });
    }

    function setIconPosition(option, index) {
      var options = { ...icon.options,
        position: option.value
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setPostCategoriesData([]);
      setCategories([]);
      setcategoryCount(categories.length - 1);

      if (postCategoriesX != undefined) {
        for (x in postCategoriesX) {
          var catId = postCategoriesX[x];
          var assd = x;

          if (x) {
            _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
              path: '/wp/v2/categories/' + catId,
              method: 'GET'
            }).then(res => {
              setPostCategoriesData(current => [...current, res]);
              setCategories(current => [...current, res]);
            });
          }
        }
      } else {
        setPostCategoriesData(dummyCats);
        setCategories(dummyCats);
      }
    }, [postCategoriesX]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var asdasd = postCategoriesData.slice(0, items.options.maxCount);
      setCategories(asdasd);
    }, [postCategoriesData]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      if (postCategoriesX != undefined && postCategoriesX.length > 0) {
        var maxCount = items.options.maxCount.length > 0 ? items.options.maxCount : 99;
        setcategoryCount(categories.length - 1);
        var asdasd = postCategoriesData.slice(0, maxCount);
        setCategories(asdasd);
      } else {
        var asdasd = dummyCats.slice(0, maxCount);
        setCategories(asdasd);
      }
    }, [items]);
    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryItems(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        items[sudoScource] = sudoScourceArgs;
      });
      var itemsX = Object.assign({}, items);
      setAttributes({
        items: itemsX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibrarySeparator(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        separator[sudoScource] = sudoScourceArgs;
      });
      var separatorX = Object.assign({}, separator);
      setAttributes({
        separator: separatorX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryFrontText(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        frontText[sudoScource] = sudoScourceArgs;
      });
      var frontTextX = Object.assign({}, frontText);
      setAttributes({
        frontText: frontTextX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleItems(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, items);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        items: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItems(sudoScource, key) {
      var object = myStore.deletePropertyDeep(items, [sudoScource, key, breakPointX]);
      setAttributes({
        items: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItems(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, items);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        items: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleFrontText(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleFrontText(sudoScource, key) {
      var object = myStore.deletePropertyDeep(frontText, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleFrontText(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        frontText: object
      });
    }

    function onChangeStyleSeparator(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      }); // var path = sudoScource + '.' + attr + '.' + breakPointX
      // let obj = Object.assign({}, separator);
      // const updatedObj = myStore.setPropertyDeep(obj, path, newVal)
      // setAttributes({ separator: updatedObj });
      // var sudoScourceX = { ...updatedObj[sudoScource] }
      // var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      // sudoScourceX[attr][breakPointX] = newVal;
      // if (blockCssY.items[elementSelector] == undefined) {
      //   blockCssY.items[elementSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[elementSelector][argAttr] = argAttrVal;
      // })
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onRemoveStyleSeparator(sudoScource, key) {
      var object = myStore.deletePropertyDeep(separator, [sudoScource, key, breakPointX]);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      }); // var sudoScourceX = { ...separator[sudoScource] }
      // if (sudoScourceX[key] != undefined) {
      //   delete sudoScourceX[key];
      // }
      // separator[sudoScource] = sudoScourceX;
      // setAttributes({ separator: { ...separator } });
      // if (blockCssY.items[separatorSelector] == undefined) {
      //   blockCssY.items[separatorSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[separatorSelector][argAttr] = argAttrVal;
      // })
      // if (blockCssY.items[separatorSelector][key] != undefined) {
      //   delete blockCssY.items[separatorSelector][key];
      // }
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onAddStyleSeparator(sudoScource, key) {
      // var sudoScourceX = { ...separator[sudoScource] }
      // sudoScourceX[key] = {};
      // separator[sudoScource] = sudoScourceX;
      // setAttributes({ separator: { ...separator } });
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        separator: object
      });
    }

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [items]);

    var linkAttrObj = () => {
      var sdsd = {};
      items.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    const post = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecord('postType', context['postType'], context['postId']));
    const termstaxonomy = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecords('taxonomy', 'category', [4, 5]));
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-post-categories`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Items",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      label: "Display Post Count",
      help: items.options.postCount ? 'Post Count Enabled' : 'Post Count Disabled',
      checked: items.options.postCount ? true : false,
      onChange: e => {
        var options = { ...items.options,
          postCount: items.options.postCount ? false : true
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Item Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.class,
      onChange: newVal => {
        var options = { ...items.options,
          class: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Max Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.maxCount,
      onChange: newVal => {
        var options = { ...items.options,
          maxCount: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: items.options.linkTo == undefined || items.options.linkTo.length == 0 ? 'Choose' : linkToArgs[items.options.linkTo] == undefined ? '' : linkToArgs[items.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), items.options.linkTo != undefined && items.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, items.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Author Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...items.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), items.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...items.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), items.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), items.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
      onClick: ev => {
        var options = { ...items.options,
          customUrl: ''
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(LinkControl, {
      settings: [],
      value: items.options.customUrl,
      onChange: newVal => {
        var options = { ...items.options,
          customUrl: newVal.url
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", items.options.customUrl.length != 0 ? items.options.customUrl : 'No link', " ")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: items.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...items.options,
          linkTarget: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.prefix,
      onChange: newVal => {
        var options = { ...items.options,
          prefix: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.postfix,
      onChange: newVal => {
        var options = { ...items.options,
          postfix: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = items.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...items.options,
          linkAttr: sdsd
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), items.options.linkAttr.length > 0 && items.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: items.options.linkAttr[i].id,
        onChange: newVal => {
          items.options.linkAttr[i].id = newVal;
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          items.options.linkAttr[i].val = newVal;
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          items.options.linkAttr.splice(i, 1);
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: items,
      onChange: onChangeStyleItems,
      onAdd: onAddStyleItems,
      onRemove: onRemoveStyleItems
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: items,
      onChange: onPickCssLibraryItems
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: iconPositonArgs,
      buttonTitle: icon.options.position.length == 0 ? 'Choose' : iconPositonArgs[icon.options.position].label,
      onChange: setIconPosition,
      values: []
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Front Text",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: frontText.options.text,
      onChange: newVal => {
        var options = { ...frontText.options,
          text: newVal
        };
        setAttributes({
          frontText: { ...frontText,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: frontText,
      onChange: onChangeStyleFrontText,
      onAdd: onAddStyleFrontText,
      onRemove: onRemoveStyleFrontText
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: frontText,
      onChange: onPickCssLibraryFrontText
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Separator",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Separator"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: separator.options.text,
      onChange: newVal => {
        var options = { ...separator.options,
          text: newVal
        };
        setAttributes({
          separator: { ...separator,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: separator,
      onChange: onChangeStyleSeparator,
      onAdd: onAddStyleSeparator,
      onRemove: onRemoveStyleSeparator
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: separator,
      onChange: onPickCssLibrarySeparator
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Items Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Caetgory Items"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, itemSelector, '{}', " ")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, ".pg-postCategories a", '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Separator"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, separatorSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, frontTextSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Post Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postCountSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_18__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_19__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, categories.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, "No Categories Found"), categories.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagWrapper, blockProps, icon.options.position == 'beforeFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "frontText inline-block"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, frontText.options.text)), icon.options.position == 'afterFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforeItems' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), categories.map((x, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, items.options.linkTo != undefined && items.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
        title: x.name
      }, linkAttrItems, {
        className: items.options.class
      }), icon.options.position == 'beforeItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "termTitle"
      }, items.options.prefix, x.name, items.options.postfix), items.options.postCount == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "postCount"
      }, "(", x.count, ")"), icon.options.position == 'afterItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), items.options.linkTo != undefined && items.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
        onClick: ev => ev.preventDefault(),
        target: items.options.linkTarget,
        title: x.name
      }, linkAttrItems, {
        className: items.options.class,
        href: x.link
      }), icon.options.position == 'beforeItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "termTitle"
      }, items.options.prefix, x.name, items.options.postfix), items.options.postCount == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "postCount"
      }, "(", x.count, ")"), icon.options.position == 'afterItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), categories.length > index + 1 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "separator",
        dangerouslySetInnerHTML: {
          __html: separator.options.text
        }
      }));
    }), icon.options.position == 'afterItems' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-comment-count/index.js":
/*!************************************************!*\
  !*** ./src/blocks/post-comment-count/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");

















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/post-comment-count", {
  apiVersion: 2,
  title: "Post Comment Count",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M8.65,34.2H8.23c-.84-.33-1-.64-1-1.57V26.24a.81.81,0,0,0,0-.41,1,1,0,0,0-.42,0H1.46c-1,0-1.45-.43-1.45-1.45,0-7,0-14,0-21A1.36,1.36,0,0,1,1.52,1.8q16.49,0,33,0a1.41,1.41,0,0,1,1.52,1V24.85a1.41,1.41,0,0,1-1.53.95H18.88a1,1,0,0,0-.72.27L9.49,33.65A3.93,3.93,0,0,1,8.65,34.2ZM33.55,4.28H2.46v19.1H8.18c1,0,1.45.47,1.45,1.47v5c0,.12-.05.25.06.36l.12-.09L17,23.88a1.84,1.84,0,0,1,1.3-.51c4.95,0,9.91,0,14.86,0a.86.86,0,0,0,.42,0Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("circle", {
      fill: "#8db1ff",
      cx: "18",
      cy: "13.49",
      r: "8.06"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M20,10.15v1.22a2.62,2.62,0,0,0-1.12-.26,1.87,1.87,0,0,0-2,1.88,1.87,1.87,0,0,1,1.45-.53,2,2,0,0,1,1.48.61,2.18,2.18,0,0,1,.6,1.61,2.37,2.37,0,0,1-.63,1.68A2.16,2.16,0,0,1,18.1,17a2.17,2.17,0,0,1-1.86-.88,3.82,3.82,0,0,1-.66-2.34,4.31,4.31,0,0,1,.84-2.87,2.9,2.9,0,0,1,2.34-1A3.6,3.6,0,0,1,20,10.15Zm-2,3.37a1.41,1.41,0,0,0-1.17.56,2.69,2.69,0,0,0,.35,1.34,1,1,0,0,0,.84.46,1,1,0,0,0,.78-.32,1.24,1.24,0,0,0,.29-.86,1.2,1.2,0,0,0-.3-.86A1,1,0,0,0,18,13.52Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    commentCount: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          status: 'approved',
          customLabel: 'Count: %s',
          linkTo: '',
          // postUrl, customField, authorUrl, authorLink, homeUrl, custom
          linkToUrl: '',
          linkToMetaKey: '',
          linkTarget: '_blank',
          linkAttr: [],
          customUrl: '',
          class: 'commentCount'
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'far fa-calendar-alt',
          position: 'beforeCommentCount',

          /*before, after, prefix, postfix */
          class: 'commentCount-icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    let commentCount = attributes.commentCount;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var icon = attributes.icon;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    var [currentCommentCount, setcurrentCommentCount] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
      approved: 0,
      moderated: 0,
      spam: 0,
      total_comments: 0,
      trash: 0,
      'post-trashed': 0,
      all: 0
    });
    var [commentCountEdited, setcommentCountEdited] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(commentCount.options.customLabel);
    var linkToArgsBasic = {
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__.applyFilters)('linkToArgs', linkToArgsBasic);

    function setFieldLinkTo(option, index) {
      var options = { ...commentCount.options,
        linkTo: option.value
      };
      setAttributes({
        commentCount: { ...commentCount,
          options: options
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default()({
        path: '/post-grid/v2/get_comment_count',
        method: 'POST',
        data: {
          id: postId
        }
      }).then(res => {
        setcurrentCommentCount(res);
        setcommentCountEdited(commentCount.options.customLabel.replace('%s', res[commentCount.options.status]));
      });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setcommentCountEdited(commentCount.options.customLabel.replace('%s', currentCommentCount[commentCount.options.status]));
    }, [commentCount]); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var commentCountSelector = blockClass + ' .commentCount';
    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';
    const iconSelector = blockClass + ' .commentCount-icon';

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryCommentCount(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        commentCount[sudoScource] = sudoScourceArgs;
      });
      var commentCountX = Object.assign({}, commentCount);
      setAttributes({
        commentCount: commentCountX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, commentCountSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      }); // var path = sudoScource + '.' + attr + '.' + breakPointX
      // let obj = Object.assign({}, wrapper);
      // const updatedObj = myStore.setPropertyDeep(obj, path, newVal)
      // setAttributes({ wrapper: updatedObj });
      // var sudoScourceX = { ...updatedObj[sudoScource] }
      // var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      // sudoScourceX[attr][breakPointX] = newVal;
      // if (blockCssY.items[elementSelector] == undefined) {
      //   blockCssY.items[elementSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[elementSelector][argAttr] = argAttrVal;
      // })
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      }); // var sudoScourceX = { ...wrapper[sudoScource] }
      // if (sudoScourceX[key] != undefined) {
      //   delete sudoScourceX[key];
      // }
      // wrapper[sudoScource] = sudoScourceX;
      // setAttributes({ wrapper: { ...wrapper } });
      // if (blockCssY.items[wrapperSelector] == undefined) {
      //   blockCssY.items[wrapperSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[wrapperSelector][argAttr] = argAttrVal;
      // })
      // if (blockCssY.items[wrapperSelector][key] != undefined) {
      //   delete blockCssY.items[wrapperSelector][key];
      // }
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onAddStyleWrapper(sudoScource, key) {
      // var sudoScourceX = { ...wrapper[sudoScource] }
      // sudoScourceX[key] = {};
      // wrapper[sudoScource] = sudoScourceX;
      // setAttributes({ wrapper: { ...wrapper } });
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleCommentCount(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, commentCount);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        commentCount: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, commentCountSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      }); // var path = sudoScource + '.' + attr + '.' + breakPointX
      // let obj = Object.assign({}, commentCount);
      // const updatedObj = myStore.setPropertyDeep(obj, path, newVal)
      // setAttributes({ commentCount: updatedObj });
      // var sudoScourceX = { ...updatedObj[sudoScource] }
      // var elementSelector = myStore.getElementSelector(sudoScource, commentCountSelector);
      // sudoScourceX[attr][breakPointX] = newVal;
      // if (blockCssY.items[elementSelector] == undefined) {
      //   blockCssY.items[elementSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[elementSelector][argAttr] = argAttrVal;
      // })
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onRemoveStyleCommentCount(sudoScource, key) {
      var object = myStore.deletePropertyDeep(commentCount, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, commentCountSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      }); // var sudoScourceX = { ...commentCount[sudoScource] }
      // if (sudoScourceX[key] != undefined) {
      //   delete sudoScourceX[key];
      // }
      // commentCount[sudoScource] = sudoScourceX;
      // setAttributes({ commentCount: { ...commentCount } });
      // if (blockCssY.items[commentCountSelector] == undefined) {
      //   blockCssY.items[commentCountSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[commentCountSelector][argAttr] = argAttrVal;
      // })
      // if (blockCssY.items[commentCountSelector][key] != undefined) {
      //   delete blockCssY.items[wrapperSelector][key];
      // }
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onAddStyleCommentCount(sudoScource, key) {
      // var sudoScourceX = { ...commentCount[sudoScource] }
      // sudoScourceX[key] = {};
      // commentCount[sudoScource] = sudoScourceX;
      // setAttributes({ commentCount: { ...commentCount } });
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, commentCount);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        commentCount: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      }); // var path = sudoScource + '.' + attr + '.' + breakPointX
      // let obj = Object.assign({}, icon);
      // const updatedObj = myStore.setPropertyDeep(obj, path, newVal)
      // setAttributes({ icon: updatedObj });
      // var sudoScourceX = { ...updatedObj[sudoScource] }
      // var elementSelector = iconSelector;
      // var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      // sudoScourceX[attr][breakPointX] = newVal;
      // if (blockCssY.items[elementSelector] == undefined) {
      //   blockCssY.items[elementSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[elementSelector][argAttr] = argAttrVal;
      // })
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      }); // var sudoScourceX = { ...icon[sudoScource] }
      // if (sudoScourceX[key] != undefined) {
      //   delete sudoScourceX[key];
      // }
      // icon[sudoScource] = sudoScourceX;
      // setAttributes({ icon: { ...icon } });
      // if (blockCssY.items[iconSelector] == undefined) {
      //   blockCssY.items[iconSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[iconSelector][argAttr] = argAttrVal;
      // })
      // if (blockCssY.items[iconSelector][key] != undefined) {
      //   delete blockCssY.items[iconSelector][key];
      // }
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      }); // var path = sudoScource + '.' + attr + '.' + breakPointX
      // let obj = Object.assign({}, prefix);
      // const updatedObj = myStore.setPropertyDeep(obj, path, newVal)
      // setAttributes({ prefix: updatedObj });
      // var sudoScourceX = { ...updatedObj[sudoScource] }
      // var elementSelector = prefixSelector;
      // var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      // sudoScourceX[attr][breakPointX] = newVal;
      // if (blockCssY.items[elementSelector] == undefined) {
      //   blockCssY.items[elementSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[elementSelector][argAttr] = argAttrVal;
      // })
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      }); // var sudoScourceX = { ...prefix[sudoScource] }
      // if (sudoScourceX[key] != undefined) {
      //   delete sudoScourceX[key];
      // }
      // prefix[sudoScource] = sudoScourceX;
      // //sudoScourceX[attr][breakPointX] = newVal;
      // setAttributes({ prefix: { ...prefix } });
      // if (blockCssY.items[prefixSelector] == undefined) {
      //   blockCssY.items[prefixSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[prefixSelector][argAttr] = argAttrVal;
      // })
      // if (blockCssY.items[prefixSelector][key] != undefined) {
      //   delete blockCssY.items[prefixSelector][key];
      // }
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = sudoScource + '.' + attr + '.' + breakPointX;
      let obj = Object.assign({}, postfix);
      const updatedObj = myStore.setPropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: updatedObj
      });
      var sudoScourceX = { ...updatedObj[sudoScource]
      };
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      sudoScourceX[attr][breakPointX] = newVal;

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[elementSelector][argAttr] = argAttrVal;
      });
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      }); // var sudoScourceX = { ...postfix[sudoScource] }
      // if (sudoScourceX[key] != undefined) {
      //   delete sudoScourceX[key];
      // }
      // postfix[sudoScource] = sudoScourceX;
      // //sudoScourceX[attr][breakPointX] = newVal;
      // setAttributes({ postfix: { ...postfix } });
      // if (blockCssY.items[postfixSelector] == undefined) {
      //   blockCssY.items[postfixSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[postfixSelector][argAttr] = argAttrVal;
      // })
      // if (blockCssY.items[postfixSelector][key] != undefined) {
      //   delete blockCssY.items[postfixSelector][key];
      // }
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    String.prototype.strtr = function (dic) {
      const str = this.toString(),
            makeToken = inx => `{{###~${inx}~###}}`,
            tokens = Object.keys(dic).map((key, inx) => ({
        key,
        val: dic[key],
        token: makeToken(inx)
      })),
            tokenizedStr = tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.key, "g"), entry.token), str);

      return tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.token, "g"), entry.val), tokenizedStr);
    };

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ commentCount: commentCount });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
    }, [commentCount]);

    var linkAttrObj = () => {
      var sdsd = {};
      commentCount.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    var postUrl = commentCount.options.customUrl != undefined && commentCount.options.customUrl.length > 0 ? commentCount.options.customUrl : currentPostUrl;
    const CustomTag = `${wrapper.options.tag}`;
    const CustomTagPostTitle = `${commentCount.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.useBlockProps)({
      className: ` ${blockId} pg-post-comment-count`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Comment Count",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Comment Status"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, {
      label: "",
      value: commentCount.options.status,
      options: [{
        label: 'Approved',
        value: 'approved'
      }, {
        label: 'Moderated',
        value: 'moderated'
      }, {
        label: 'Spam',
        value: 'spam'
      }, {
        label: 'Trash',
        value: 'trash'
      }, {
        label: 'Post trashed',
        value: 'post-trashed'
      }, {
        label: 'Total Comments',
        value: 'total_comments'
      }, {
        label: 'All',
        value: 'all'
      }],
      onChange: newVal => {
        var options = { ...commentCount.options,
          status: newVal
        };
        setAttributes({
          commentCount: { ...commentCount,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Label"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      className: "mr-2",
      value: commentCount.options.customLabel,
      onChange: newVal => {
        var options = { ...commentCount.options,
          customLabel: newVal
        };
        setAttributes({
          commentCount: { ...commentCount,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_18__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: commentCount.options.linkTo.length == 0 ? 'Choose' : linkToArgs[commentCount.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), commentCount.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      className: "mr-2",
      value: commentCount.options.linkToMetaKey,
      onChange: newVal => {
        var options = { ...commentCount.options,
          linkToMetaKey: newVal
        };
        setAttributes({
          commentCount: { ...commentCount,
            options: options
          }
        });
      }
    })), commentCount.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), commentCount.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
      onClick: ev => {
        var options = { ...commentCount.options,
          customUrl: ''
        };
        setAttributes({
          commentCount: { ...commentCount,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.__experimentalLinkControl, {
      settings: [],
      value: commentCount.options.customUrl,
      onChange: newVal => {
        var options = { ...commentCount.options,
          customUrl: newVal.url
        };
        setAttributes({
          commentCount: { ...commentCount,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", commentCount.options.customUrl.length != 0 ? commentCount.options.customUrl : 'No link', " ")))), commentCount.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, {
      label: "",
      value: commentCount.options.linkTarget,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...commentCount.options,
          linkTarget: newVal
        };
        setAttributes({
          commentCount: { ...commentCount,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = commentCount.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...commentCount.options,
          linkAttr: sdsd
        };
        setAttributes({
          commentCount: { ...commentCount,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), commentCount.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: commentCount.options.linkAttr[i].id,
        onChange: newVal => {
          commentCount.options.linkAttr[i].id = newVal;
          var ssdsd = commentCount.options.linkAttr.concat([]);
          var options = { ...commentCount.options,
            linkAttr: ssdsd
          };
          setAttributes({
            commentCount: { ...commentCount,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          commentCount.options.linkAttr[i].val = newVal;
          var ssdsd = commentCount.options.linkAttr.concat([]);
          var options = { ...commentCount.options,
            linkAttr: ssdsd
          };
          setAttributes({
            commentCount: { ...commentCount,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          commentCount.options.linkAttr.splice(i, 1);
          var ssdsd = commentCount.options.linkAttr.concat([]);
          var options = { ...commentCount.options,
            linkAttr: ssdsd
          };
          setAttributes({
            commentCount: { ...commentCount,
              options: options
            }
          });
        }
      })));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: commentCount,
      onChange: onChangeStyleCommentCount,
      onAdd: onAddStyleCommentCount,
      onRemove: onRemoveStyleCommentCount
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: commentCount,
      onChange: onPickCssLibraryCommentCount
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_19__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Comment Count',
        value: 'beforeCommentCount'
      }, {
        label: 'After Comment Count',
        value: 'afterCommentCount'
      }, {
        label: 'Before Prefix',
        value: 'beforePrefix'
      }, {
        label: 'After Prefix',
        value: 'afterPrefix'
      }, {
        label: 'Before Postfix',
        value: 'beforePostfix'
      }, {
        label: 'After Postfix',
        value: 'afterPostfix'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: {
            styles: prefix.styles,
            options: options
          }
        }); // setAttributes({ prefix: { text: newVal, class: prefix.options.class, color: prefix.color, backgroundColor: prefix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        }); // setAttributes({ postfix: { text: newVal, class: prefix.options.class, color: postfix.color, backgroundColor: postfix.backgroundColor } })
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title link"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, commentCountSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_15__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps, icon.options.position == 'beforePrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'afterPrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), commentCount.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "commentCount",
      onClick: handleLinkClick
    }, linkAttrItems, {
      target: commentCount.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforeCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: commentCount.options.class
    }, commentCountEdited), icon.options.position == 'afterCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), commentCount.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforeCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: commentCount.options.class
    }, commentCountEdited), icon.options.position == 'afterCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), commentCount.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "commentCount",
      onClick: handleLinkClick
    }, linkAttrItems, {
      target: commentCount.options.linkTarget,
      href: postUrl
    }), "A", icon.options.position == 'beforeCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: commentCount.options.class
    }, commentCountEdited), icon.options.position == 'afterCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), commentCount.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, icon.options.position == 'beforeCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: commentCount.options.class
    }, commentCountEdited), icon.options.position == 'afterCommentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-date/index.js":
/*!***************************************!*\
  !*** ./src/blocks/post-date/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/post-date", {
  apiVersion: 2,
  title: "Post Date",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "30.98",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "16.42",
      y: "30.98",
      width: "9.96",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "26.28",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "21.58",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "20.7",
      y: "9.61",
      width: "15.3",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M12.42,18.54H1.55A1.54,1.54,0,0,1,0,17V6.13A1.55,1.55,0,0,1,1.55,4.57H3.1V3H4.66V4.57H9.31V3h1.56V4.57h1.55A1.55,1.55,0,0,1,14,6.13V17A1.54,1.54,0,0,1,12.42,18.54ZM1.55,9.23V17H12.42V9.23Zm0-3.1V7.68H12.42V6.13Zm9.32,9.31H9.31V13.89h1.56Zm-3.11,0H6.21V13.89H7.76Zm-3.1,0H3.1V13.89H4.66Zm6.21-3.1H9.31V10.78h1.56Zm-3.11,0H6.21V10.78H7.76Zm-3.1,0H3.1V10.78H4.66Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    postDate: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          dateFormat: 'Y-m-d',
          linkTo: '',
          // postUrl, customField, authorUrl, authorLink, homeUrl, custom
          linkToUrl: '',
          linkToMetaKey: '',
          linkTarget: '_blank',
          linkAttr: [],
          customUrl: '',
          class: ''
        },
        styles: {
          display: {},
          width: {},
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'far fa-calendar-alt',
          position: 'beforePostDate',

          /*before, after, prefix, postfix */
          class: 'postdate-icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {},
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          fontWeight: {
            "Desktop": "700"
          },
          textDecoration: {} //overline, line-through, underline

        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    let postDate = attributes.postDate;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var icon = attributes.icon;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [customTags, setCustomTags] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [dateObj, setdateObj] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    const [formatedPostDate, setformatedPostDate] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)("");
    var linkToArgsBasic = {
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      archiveDate: {
        label: 'Date Archive',
        value: 'archiveDate'
      },
      archiveYear: {
        label: 'Year Archive',
        value: 'archiveYear'
      },
      archiveMonth: {
        label: 'Month Archive',
        value: 'archiveMonth'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('linkToArgs', linkToArgsBasic);
    var dateFormats = {
      'Y-M-d': {
        label: '2022-Feb-25',
        value: 'Y-M-d'
      },
      'Y-m-d': {
        label: '2022-05-25',
        value: 'Y-m-d'
      },
      'd-m-y': {
        label: '25-05-2022',
        value: 'd-m-y'
      },
      'd/m/y': {
        label: '25/05/2022',
        value: 'd/m/y'
      },
      'y-m-d': {
        label: '2022-05-25',
        value: 'y-m-d'
      },
      'y/m/d': {
        label: '2022/05/25',
        value: 'y/m/d'
      },
      'D M y': {
        label: 'Sun Feb 2022',
        value: 'D M y'
      },
      'D M d, y': {
        label: 'Sun Feb 11, 2022',
        value: 'D M d, y'
      },
      'M D d, y': {
        label: 'Feb Sun 11, 2022',
        value: 'M D d, y'
      },
      'M d, y': {
        label: 'Feb 11, 2022',
        value: 'M d, y'
      },
      'F d, y': {
        label: 'February 11, 2022',
        value: 'F d, y'
      },
      'd M y': {
        label: '25 Feb 2022',
        value: 'd M y'
      }
    };
    var dateNames = ["Satureday", "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday"];
    var dateNamesShort = ["Sat", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri"];
    var MonthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
    var MonthNamesShort = ["Jan", "Feb", "Mar", "Apr", "May", "June", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
    const [currentPostDate, setcurrentPostDate] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'date', postId);
    const [postDateEdited, setpostDateEdited] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(currentPostDate);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var dateFormat = postDate.options.dateFormat;
      var dateFormat = dateFormat.replace("d", "{d}");
      var dateFormat = dateFormat.replace("D", "{D}");
      var dateFormat = dateFormat.replace("M", "{M}");
      var dateFormat = dateFormat.replace("F", "{F}");
      var dateFormat = dateFormat.replace("m", "{m}");
      var dateFormat = dateFormat.replace("y", "{y}");
      var dateFormat = dateFormat.replace("Y", "{Y}");
      var dateFormat = dateFormat.replace("h", "{h}");
      var dateFormat = dateFormat.replace("H", "{H}");
      var dateFormat = dateFormat.replace("i", "{i}");
      var dateFormat = dateFormat.replace("s", "{s}");
      var dateFormat = dateFormat.replace("A", "{A}");
      var dateFormat = dateFormat.replace("a", "{a}");
      const date = new Date(currentPostDate);
      var amOrPm = date.getHours() < 12 ? "AM" : "PM";
      dateObj["{d}"] = date.getDate();
      dateObj["{D}"] = dateNamesShort[date.getDay()];
      dateObj["{M}"] = MonthNamesShort[date.getMonth()];
      dateObj["{F}"] = MonthNames[date.getMonth()];
      dateObj["{m}"] = date.getMonth() + 1;
      dateObj["{y}"] = date.getFullYear();
      dateObj['{Y}'] = date.getFullYear();
      dateObj["{h}"] = date.getHours();
      dateObj["{H}"] = date.getHours();
      dateObj["{i}"] = date.getMinutes();
      dateObj["{s}"] = date.getSeconds();
      dateObj["{A}"] = amOrPm;
      dateObj["{a}"] = amOrPm.toLowerCase();
      console.log(dateObj);
      setpostDateEdited(dateFormat.strtr(dateObj));
    }, [currentPostDate, postDate.options.dateFormat]);

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function setFieldLinkTo(option, index) {
      var options = { ...postDate.options,
        linkTo: option.value
      };
      setAttributes({
        postDate: { ...postDate,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostDate(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postDate[sudoScource] = sudoScourceArgs;
      });
      var postDateX = Object.assign({}, postDate);
      setAttributes({
        postDate: postDateX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postDateSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStylePostDate(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postDate);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postDate: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postDateSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostDate(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postDate, [sudoScource, key, breakPointX]);
      setAttributes({
        postDate: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postDateSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostDate(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postDate);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postDate: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = sudoScource + '.' + attr + '.' + breakPointX;
      let obj = Object.assign({}, postfix);
      const updatedObj = myStore.setPropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: updatedObj
      });
      var sudoScourceX = { ...updatedObj[sudoScource]
      };
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      sudoScourceX[attr][breakPointX] = newVal;

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[elementSelector][argAttr] = argAttrVal;
      });
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    String.prototype.strtr = function (dic) {
      const str = this.toString(),
            makeToken = inx => `{{###~${inx}~###}}`,
            tokens = Object.keys(dic).map((key, inx) => ({
        key,
        val: dic[key],
        token: makeToken(inx)
      })),
            tokenizedStr = tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.key, "g"), entry.token), str);

      return tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.token, "g"), entry.val), tokenizedStr);
    };

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ postDate: postDate });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      customTags['currentYear'] = '2022';
      customTags['currentMonth'] = '07';
      customTags['currentDay'] = '27';
      customTags['currentDate'] = '27';
      customTags['currentTime'] = '27';
      customTags['postPublishDate'] = '123';
      customTags['postModifiedDate'] = '123';
      customTags['termId'] = '';
      customTags['termTitle'] = '';
      customTags['termDescription'] = '';
      customTags['termPostCount'] = '';
      customTags['postTagTitle'] = 'First Tag Title';
      customTags['postTagsTitle'] = 'First Tag Title';
      customTags['postCategoryTitle'] = 'First Category Title';
      customTags['postCategoriesTitle'] = 'First Categories Title';
      customTags['postTermTitle'] = 'First Term Title';
      customTags['postTermsTitle'] = 'List of all terms title';
      customTags['postId'] = '123';
      customTags['postStatus'] = '123';
      customTags['authorId'] = '123';
      customTags['authorName'] = 'Nur Hasan';
      customTags['authorFirstName'] = 'Nur';
      customTags['authorLastName'] = 'Hasan';
      customTags['authorDescription'] = 'Hasan';
      customTags['excerpt'] = 'Here is the post excerpt';
      customTags['rankmathTitle'] = 'Hasan';
      customTags['rankmathPermalink'] = 'Hasan';
      customTags['rankmathExcerpt'] = 'Hasan';
      customTags['rankmathFocusKeyword'] = 'Hasan';
      customTags['rankmathFocusKeywords'] = 'Hasan';
      customTags['rankmathOrgname'] = 'Hasan';
      customTags['rankmathOrgurl'] = 'Hasan';
      customTags['rankmathOrglogo'] = 'Hasan';
      customTags['siteTitle'] = '';
      customTags['siteDescription'] = '';
      customTags['siteTagline'] = '';
      customTags['postMeta'] = '';
      customTags['separator'] = '';
      customTags['searchTerms'] = '';
      customTags['counter'] = '1';
    }, [clientId]); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var postDateSelector = blockClass + ' .postdate-text';
    const iconSelector = blockClass + ' .postdate-icon';
    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
    }, [postDate]);

    var linkAttrObj = () => {
      var sdsd = {};
      postDate.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    var postUrl = postDate.options.customUrl != undefined && postDate.options.customUrl.length > 0 ? postDate.options.customUrl : currentPostUrl;
    const CustomTag = `${wrapper.options.tag}`;
    const CustomTagPostTitle = `${postDate.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-post-date`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'Span',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: {
            styles: wrapper.styles,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Post Date",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Date Format"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: dateFormats,
      buttonTitle: "Choose",
      onChange: (option, index) => {
        var options = { ...postDate.options,
          dateFormat: option.value
        };
        setAttributes({
          postDate: { ...postDate,
            options: options
          }
        });
      },
      values: ''
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Format"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      className: "mr-2",
      value: postDate.options.dateFormat,
      onChange: newVal => {
        var options = { ...postDate.options,
          dateFormat: newVal
        };
        setAttributes({
          postDate: { ...postDate,
            options: options
          }
        });
      }
    })), dateFormats[postDate.options.dateFormat] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2 my-3 bg-gray-500 text-white"
    }, dateFormats[postDate.options.dateFormat].label), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_17__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: postDate.options.linkTo.length == 0 ? 'Choose' : linkToArgs[postDate.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), (postDate.options.linkTo == 'authorMeta' || postDate.options.linkTo == 'customField') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, postDate.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, "Author Meta Key"), postDate.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, "Custom Field Key")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      className: "mr-2",
      value: postDate.options.linkToMetaKey,
      onChange: newVal => {
        var options = { ...postDate.options,
          linkToMetaKey: newVal
        };
        setAttributes({
          postDate: { ...postDate,
            options: options
          }
        });
      }
    })), postDate.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), postDate.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        var options = { ...postDate.options,
          customUrl: ''
        };
        setAttributes({
          postDate: { ...postDate,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.__experimentalLinkControl, {
      settings: [],
      value: postDate.options.customUrl,
      onChange: newVal => {
        var options = { ...postDate.options,
          customUrl: newVal.url
        };
        setAttributes({
          postDate: { ...postDate,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", postDate.options.customUrl.length != 0 ? postDate.options.customUrl : 'No link', " ")))), postDate.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: postDate.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...postDate.options,
          tag: newVal
        };
        setAttributes({
          postDate: { ...postDate,
            options: options
          }
        });
      }
    })), postDate.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: postDate.options.linkTarget,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...postDate.options,
          linkTarget: newVal
        };
        setAttributes({
          postDate: { ...postDate,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = postDate.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...postDate.options,
          linkAttr: sdsd
        };
        setAttributes({
          postDate: { ...postDate,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), postDate.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: postDate.options.linkAttr[i].id,
        onChange: newVal => {
          postDate.options.linkAttr[i].id = newVal;
          var ssdsd = postDate.options.linkAttr.concat([]);
          var options = { ...postDate.options,
            linkAttr: ssdsd
          };
          setAttributes({
            postDate: { ...postDate,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          postDate.options.linkAttr[i].val = newVal;
          var ssdsd = postDate.options.linkAttr.concat([]);
          var options = { ...postDate.options,
            linkAttr: ssdsd
          };
          setAttributes({
            postDate: { ...postDate,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          postDate.options.linkAttr.splice(i, 1);
          var ssdsd = postDate.options.linkAttr.concat([]);
          var options = { ...postDate.options,
            linkAttr: ssdsd
          };
          setAttributes({
            postDate: { ...postDate,
              options: options
            }
          });
        }
      })));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: postDate,
      onChange: onChangeStylePostDate,
      onAdd: onAddStylePostDate,
      onRemove: onRemoveStylePostDate
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: postDate,
      onChange: onPickCssLibraryPostDate
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_18__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Post Date',
        value: 'beforePostDate'
      }, {
        label: 'After Post Date',
        value: 'afterPostDate'
      }, {
        label: 'Before Prefix',
        value: 'beforePrefix'
      }, {
        label: 'After Prefix',
        value: 'afterPrefix'
      }, {
        label: 'Before Postfix',
        value: 'beforePostfix'
      }, {
        label: 'After Postfix',
        value: 'afterPostfix'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: {
            styles: prefix.styles,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title link"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postDateSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps, icon.options.position == 'beforePrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'afterPrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postDate.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "postDate",
      onClick: handleLinkClick
    }, linkAttrItems, {
      target: postDate.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforePostDate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "postdate-text"
    }, postDateEdited), icon.options.position == 'afterPostDate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), postDate.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, icon.options.position == 'beforePostDate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "postdate-text"
    }, postDateEdited), icon.options.position == 'afterPostDate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postDate.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      onClick: handleLinkClick
    }, linkAttrItems, {
      target: postDate.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforePostDate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "postdate-text"
    }, postDateEdited), icon.options.position == 'afterPostDate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), postDate.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, icon.options.position == 'beforePostDate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "postdate-text"
    }, postDateEdited), icon.options.position == 'afterPostDate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-excerpt/index.js":
/*!******************************************!*\
  !*** ./src/blocks/post-excerpt/index.js ***!
  \******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
















const {
  RawHTML
} = wp.element;









var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/post-excerpt", {
  apiVersion: 2,
  title: "Post Excerpt",
  apiVersion: 2,
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "22.72",
      width: "13.97",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.42",
      y: "22.72",
      width: "9.96",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "16.82",
      width: "36",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "10.93",
      width: "36",
      height: "2.35"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    postExcerpt: {
      type: 'object',
      default: {
        options: {
          tag: 'p',
          text: '',
          limitBy: 'word',

          /*word, character*/
          limitCount: 99,
          excerptSource: 'auto',

          /*excerpt, content, auto, meta*/
          excerptSourceMeta: '',
          removeBlocks: true,
          removeShortcodes: true,
          keepHtml: false,
          removeEmbeds: true,
          autoP: false,
          isLink: false,
          linkTarget: '_blank',
          customUrl: '',
          linkAttr: [],
          class: 'excerpt-text'
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    readMore: {
      type: 'object',
      default: {
        options: {
          enable: true,
          text: 'Read More',
          isLink: true,
          linkTarget: '_blank',
          customUrl: '',
          linkAttr: [],
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    linkAttr: {
      "type": "array",
      "default": []
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var postExcerpt = attributes.postExcerpt;
    var wrapper = attributes.wrapper;
    var readMore = attributes.readMore;
    var linkAttr = attributes.linkAttr;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [currentPostExcerpt, setCurrentpostExcerpt] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'excerpt', postId);
    const [currentPostContent, setCurrentpostContent] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'content', postId);
    const [customFields, setCustomFields] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    var linkToArgsBasic = {
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('linkToArgs', linkToArgsBasic);
    var limitByArgsBasic = {
      none: {
        label: 'Choose..',
        value: ''
      },
      word: {
        label: 'Word',
        value: 'word'
      },
      character: {
        label: 'Character',
        value: 'character',
        isPro: true
      }
    };
    let limitByArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('limitByArgs', limitByArgsBasic);
    var excerptSourceArgsBasic = {
      auto: {
        label: 'Auto',
        value: 'auto'
      },
      excerpt: {
        label: 'Excerpt',
        value: 'excerpt'
      },
      content: {
        label: 'Content',
        value: 'content'
      },
      meta: {
        label: 'Custom Fields',
        value: 'meta',
        isPro: true
      }
    };
    let excerptSourceArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('excerptSourceArgs', excerptSourceArgsBasic);

    function setFieldLinkTo(option, index) {
      var options = { ...postExcerpt.options,
        linkTo: option.value
      };
      setAttributes({
        postExcerpt: { ...postExcerpt,
          options: options
        }
      });
    }

    function setLimitBy(option, index) {
      var options = { ...postExcerpt.options,
        limitBy: option.value
      };
      setAttributes({
        postExcerpt: { ...postExcerpt,
          options: options
        }
      });
    } // Wrapper CSS Class Selectors


    const wrapperSelector = blockClass;
    var excerptSelector = '';
    const readmoreSelector = blockClass + ' .readmore';
    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';

    if (wrapper.options.tag.length != 0) {
      if (postExcerpt.options.isLink) {
        excerptSelector = blockClass + ' .excerpt-text';
      } else {
        if (postExcerpt.options.tag.length > 0) {
          excerptSelector = blockClass + ' .excerpt-text';
        } else {
          excerptSelector = blockClass;
        }
      }
    } else {
      excerptSelector = blockClass;
    }

    function getMetaField(metaKey) {
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_8___default()({
        path: '/post-grid/v2/get_post_meta',
        method: 'POST',
        data: {
          postId: postId,
          meta_key: metaKey
        }
      }).then(res => {
        if (res['meta_value'] != undefined && res['meta_value'].length > 0) {
          customFields[metaKey] = res['meta_value'];
          setCustomFields({});
          setCustomFields(customFields);
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var excerptSource = postExcerpt.options.excerptSource;
      var excerptSourceMeta = postExcerpt.options.excerptSourceMeta;

      if (excerptSource == 'meta' && excerptSourceMeta.length > 0) {
        var response = getMetaField(excerptSourceMeta);
      }
    }, [postExcerpt]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    const [postExcerptEdited, setPostExcerptEdited] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(currentPostExcerpt); //const [postContentEdited, setPostContentEdited] = useState(currentPostContent);

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      //setisLoading(true);
      var excerptSource = postExcerpt.options.excerptSource;
      var excerptText = '';

      if (excerptSource == 'auto') {
        excerptText = currentPostExcerpt != undefined && currentPostExcerpt.length > 0 ? currentPostExcerpt : '';
      } else if (excerptSource == 'excerpt') {
        excerptText = currentPostExcerpt;
      } else if (excerptSource == 'content') {
        excerptText = '';
      } else if (excerptSource == 'meta') {
        var excerptSourceMeta = postExcerpt.options.excerptSourceMeta;
        setTimeout(() => {
          excerptText = customFields[excerptSourceMeta] ? customFields[excerptSourceMeta] : '';
        }, 100);
      }

      excerptText = excerptText.length > 0 ? excerptText : 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book';

      if (!postExcerpt.options.keepHtml) {
        excerptText = excerptText.replace(/<[^>]*>?/gm, '');
      }

      setTimeout(() => {
        var count = postExcerpt.options.limitCount > 0 ? postExcerpt.options.limitCount : 999;

        if (postExcerpt.options.limitBy == 'character') {
          setPostExcerptEdited(excerptText.substring(0, count));
        } else {
          setPostExcerptEdited(excerptText.split(" ").splice(0, count).join(" "));
        } //setisLoading(false);

      }, 100);
    }, [postExcerpt, currentPostExcerpt]);
    const [linkPickerExcerpt, setLinkPickerExcerpt] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [linkPickerReadmore, setLinkPickerReadmore] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostExcerpt(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postExcerpt[sudoScource] = sudoScourceArgs;
      });
      var postExcerptX = Object.assign({}, postExcerpt);
      setAttributes({
        postExcerpt: postExcerptX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, excerptSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryReadmore(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        readMore[sudoScource] = sudoScourceArgs;
      });
      var readMoreX = Object.assign({}, readMore);
      setAttributes({
        readMore: readMoreX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, readmoreSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStylePostExcerpt(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postExcerpt);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postExcerpt: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, excerptSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostExcerpt(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postExcerpt, [sudoScource, key, breakPointX]);
      setAttributes({
        postExcerpt: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, excerptSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
      var sudoScourceX = { ...postExcerpt[sudoScource]
      };

      if (sudoScourceX[key] != undefined) {
        delete sudoScourceX[key];
      }

      postExcerpt[sudoScource] = sudoScourceX;
      setAttributes({
        postExcerpt: { ...postExcerpt
        }
      });

      if (blockCssY.items[excerptSelector] == undefined) {
        blockCssY.items[excerptSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[excerptSelector][argAttr] = argAttrVal;
      });

      if (blockCssY.items[excerptSelector][key] != undefined) {
        delete blockCssY.items[excerptSelector][key];
      }

      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }

    function onAddStylePostExcerpt(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postExcerpt);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postExcerpt: object
      });
    }

    function onChangeStyleReadmore(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, readMore);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        readMore: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, readmoreSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleReadmore(sudoScource, key) {
      var object = myStore.deletePropertyDeep(readMore, [sudoScource, key, breakPointX]);
      setAttributes({
        readMore: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, readmoreSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleReadmore(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, readMore);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        readMore: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPostExcerpt(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, postExcerpt);
      obj[sudoScource] = cssObj;
      setAttributes({
        postExcerpt: obj
      });
      var selector = myStore.getElementSelector(sudoScource, excerptSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddReadmore(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, readMore);
      obj[sudoScource] = cssObj;
      setAttributes({
        readMore: obj
      });
      var selector = myStore.getElementSelector(sudoScource, readmoreSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddIcon(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, icon);
      obj[sudoScource] = cssObj;
      setAttributes({
        icon: obj
      });
      var selector = myStore.getElementSelector(sudoScource, iconSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPrefix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, prefix);
      obj[sudoScource] = cssObj;
      setAttributes({
        prefix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, prefixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPostfix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, postfix);
      obj[sudoScource] = cssObj;
      setAttributes({
        postfix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, postfixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    var [linkAttrItemsReadmore, setlinkAttrItemsReadmore] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var sdsd = {};
      postExcerpt.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    }, [postExcerpt]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var sdsd = {};
      readMore.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItemsReadmore(sdsd);
    }, [readMore]);
    var postUrl = postExcerpt.options.customUrl != undefined && postExcerpt.options.customUrl.length > 0 ? postExcerpt.options.customUrl : currentPostUrl;
    const CustomTagX = `${wrapper.options.tag}`;
    const CustomTagExcerpt = `${postExcerpt.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__.useBlockProps)({
      className: ` ${blockId} pg-post-excerpt`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_15__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_18__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Post Excerpt",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_15__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      label: "Linked with post?",
      help: postExcerpt.options.isLink ? 'Linked with post URL' : 'Not linked to post URL.',
      checked: postExcerpt.options.isLink ? true : false,
      onChange: e => {
        var options = { ...postExcerpt.options,
          isLink: postExcerpt.options.isLink ? false : true
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    }), !postExcerpt.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: postExcerpt.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...postExcerpt.options,
          tag: newVal
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    })), postExcerpt.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: postExcerpt.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...postExcerpt.options,
          linkTarget: newVal
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: linkPickerExcerpt ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
      onClick: ev => {
        setLinkPickerExcerpt(prev => !prev);
      }
    }), postExcerpt.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
      onClick: ev => {
        var options = { ...postExcerpt.options,
          customUrl: ''
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    }), linkPickerExcerpt && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__.__experimentalLinkControl, {
      settings: [],
      value: postExcerpt.options.customUrl,
      onChange: newVal => {
        var options = { ...postExcerpt.options,
          customUrl: newVal.url
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        }); //setLinkPickerpostExcerpt(false)
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", postExcerpt.options.customUrl.length != 0 ? postExcerpt.options.customUrl : 'No link', " ")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = postExcerpt.options.linkAttr != undefined ? postExcerpt.options.linkAttr.concat({
          id: '',
          val: ''
        }) : [];
        var options = { ...postExcerpt.options,
          linkAttr: sdsd
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    }, "Add")), postExcerpt.options.linkAttr != undefined && postExcerpt.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: postExcerpt.options.linkAttr[i].id,
        onChange: newVal => {
          postExcerpt.options.linkAttr[i].id = newVal;
          var ssdsd = postExcerpt.options.linkAttr.concat([]);
          var options = { ...postExcerpt.options,
            linkAttr: ssdsd
          };
          setAttributes({
            postExcerpt: { ...postExcerpt,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          postExcerpt.options.linkAttr[i].val = newVal;
          var ssdsd = postExcerpt.options.linkAttr.concat([]);
          var options = { ...postExcerpt.options,
            linkAttr: ssdsd
          };
          setAttributes({
            postExcerpt: { ...postExcerpt,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          postExcerpt.options.linkAttr.splice(i, 1);
          var ssdsd = postExcerpt.options.linkAttr.concat([]);
          var options = { ...postExcerpt.options,
            linkAttr: ssdsd
          };
          setAttributes({
            postExcerpt: { ...postExcerpt,
              options: options
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Limit By"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_14__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: limitByArgs,
      buttonTitle: "Choose",
      onChange: setLimitBy,
      values: []
    })), postExcerpt.options.limitBy.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-500 my-3 text-white p-2"
    }, limitByArgs[postExcerpt.options.limitBy].label), (postExcerpt.options.limitBy == 'word' || postExcerpt.options.limitBy == 'character') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Limit Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: postExcerpt.options.limitCount,
      onChange: newVal => {
        var options = { ...postExcerpt.options,
          limitCount: newVal
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Excerpt Source"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_14__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: postExcerpt.options.excerptSource.length == 0 ? 'Choose' : postExcerpt.options.excerptSource,
      options: excerptSourceArgs,
      onChange: (option, index) => {
        var options = { ...postExcerpt.options,
          excerptSource: option.value
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      },
      values: ""
    })), postExcerpt.options.excerptSource == 'excerpt' && currentPostExcerpt.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-red-500"
    }, "Post Excerpt is empty."), postExcerpt.options.excerptSource == 'meta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Meta Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: postExcerpt.options.excerptSourceMeta,
      options: [{
        label: 'Custom',
        value: ''
      }, {
        label: 'Yoast meta',
        value: '_yoast_wpseo_metadesc'
      }, {
        label: 'Rank Math meta',
        value: 'rank_math_description'
      }, {
        label: 'AIO SEO meta',
        value: '_aioseo_og_description'
      }, {
        label: 'SEOPress meta',
        value: '_seopress_titles_desc'
      }, {
        label: 'WP Meta SEO meta',
        value: '_metaseo_metadesc'
      }, {
        label: 'The SEO Framework meta',
        value: '_genesis_description'
      }, {
        label: 'SEO SIMPLE PACK meta',
        value: 'ssp_meta_description'
      }],
      onChange: newVal => {
        var options = { ...postExcerpt.options,
          excerptSourceMeta: newVal
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: postExcerpt.options.excerptSourceMeta,
      onChange: newVal => {
        var options = { ...postExcerpt.options,
          excerptSourceMeta: newVal
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      className: "my-4",
      label: "Remove Blocks?",
      help: postExcerpt.options.removeBlocks ? 'Blocks will be removed' : 'Blocks may output with excerpt.',
      checked: postExcerpt.options.removeBlocks ? true : false,
      onChange: e => {
        var options = { ...postExcerpt.options,
          removeBlocks: postExcerpt.options.removeBlocks ? false : true
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      className: "my-4",
      label: "Remove Shortcodes?",
      help: postExcerpt.options.removeShortcodes ? 'Shortcodes will be removed' : 'Shortcodes may output with excerpt.',
      checked: postExcerpt.options.removeShortcodes ? true : false,
      onChange: e => {
        var options = { ...postExcerpt.options,
          removeShortcodes: postExcerpt.options.removeShortcodes ? false : true
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      className: "my-4",
      label: "Keep HTML?",
      help: postExcerpt.options.keepHtml ? 'HTML may output with excerpt.' : 'HTML will be removed',
      checked: postExcerpt.options.keepHtml ? true : false,
      onChange: e => {
        var options = { ...postExcerpt.options,
          keepHtml: postExcerpt.options.keepHtml ? false : true
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    }), postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "bg-amber-400 mx-2 rounded-sm px-3  text-white hover:text-white"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      target: "_blank",
      href: 'https://pickplugins.com/post-grid/?utm_source=search&utm_term=blockaccordion&utm_campaign=pluginPostGrid&utm_medium=search'
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "underline"
    }, "Keep HTML"), " Only avilable in Premium")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      className: "my-4",
      label: "Enable wpautop()?",
      help: postExcerpt.options.autoP ? 'wpautop function will be applied' : 'wpautop function will not be applied.',
      checked: postExcerpt.options.autoP ? true : false,
      onChange: e => {
        var options = { ...postExcerpt.options,
          autoP: postExcerpt.options.autoP ? false : true
        };
        setAttributes({
          postExcerpt: { ...postExcerpt,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: postExcerpt,
      onChange: onChangeStylePostExcerpt,
      onAdd: onAddStylePostExcerpt,
      onRemove: onRemoveStylePostExcerpt,
      onBulkAdd: onBulkAddPostExcerpt
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_18__["default"], {
      blockId: blockId,
      obj: postExcerpt,
      onChange: onPickCssLibraryPostExcerpt
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Read More",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_15__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      label: "Enable Read more?",
      help: readMore.options.enable ? 'Read more enabled' : 'Read more disabled.',
      checked: readMore.options.enable ? true : false,
      onChange: e => {
        var options = { ...readMore.options,
          enable: readMore.options.enable ? false : true
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Read More Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: readMore.options.text,
      onChange: newVal => {
        var options = { ...readMore.options,
          text: newVal
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
      label: "Linked with post?",
      help: readMore.options.isLink ? 'Linked with post URL' : 'Not linked to post URL.',
      checked: readMore.options.isLink ? true : false,
      onChange: e => {
        var options = { ...readMore.options,
          isLink: readMore.options.isLink ? false : true
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    })), readMore.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: readMore.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...readMore.options,
          linkTarget: newVal
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: linkPickerReadmore ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
      onClick: ev => {
        setLinkPickerReadmore(prev => !prev);
      }
    }), readMore.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
      onClick: ev => {
        var options = { ...readMore.options,
          customUrl: ''
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    }), linkPickerReadmore && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__.__experimentalLinkControl, {
      settings: [],
      value: readMore.options.customUrl,
      onChange: newVal => {
        var options = { ...readMore.options,
          customUrl: newVal.url
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        }); //setLinkPickerReadmore(false)
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", readMore.options.customUrl.length != 0 ? readMore.options.customUrl : 'No link', " ")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = readMore.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...readMore.options,
          linkAttr: sdsd
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    }, "Add")), readMore.options.linkAttr != undefined && readMore.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: readMore.options.linkAttr[i].id,
        onChange: newVal => {
          readMore.options.linkAttr[i].id = newVal;
          var ssdsd = readMore.options.linkAttr.concat([]);
          var options = { ...readMore.options,
            linkAttr: ssdsd
          };
          setAttributes({
            readMore: { ...readMore,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          readMore.options.linkAttr[i].val = newVal;
          var ssdsd = readMore.options.linkAttr.concat([]);
          var options = { ...readMore.options,
            linkAttr: ssdsd
          };
          setAttributes({
            readMore: { ...readMore,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          readMore.options.linkAttr.splice(i, 1);
          var ssdsd = readMore.options.linkAttr.concat([]);
          var options = { ...readMore.options,
            linkAttr: ssdsd
          };
          setAttributes({
            readMore: { ...readMore,
              options: options
            }
          });
        }
      })));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: readMore,
      onChange: onChangeStyleReadmore,
      onAdd: onAddStyleReadmore,
      onRemove: onRemoveStyleReadmore,
      onBulkAdd: onBulkAddReadmore
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_18__["default"], {
      blockId: blockId,
      obj: readMore,
      onChange: onPickCssLibraryReadmore
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_15__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: {
            styles: prefix.styles,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix,
      onBulkAdd: onBulkAddPrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_18__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_15__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix,
      onBulkAdd: onBulkAddPostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_18__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Excerpt Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Excerpt - With Link"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, excerptSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Read More"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, readmoreSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Prefix Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Postfix Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockPostExcerpt',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, isLoading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Spinner, null), wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagX, blockProps, postExcerpt.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: postExcerpt.options.class,
      onClick: handleLinkClick
    }, linkAttrItems, {
      href: postUrl
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, postExcerptEdited), !postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postExcerptEdited), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), !postExcerpt.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postExcerpt.options.tag.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagExcerpt, {
      className: postExcerpt.options.class
    }, prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, postExcerptEdited), !postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postExcerptEdited), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), postExcerpt.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, postExcerptEdited), !postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postExcerptEdited), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text))), readMore.options.enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, readMore.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "readmore",
      onClick: handleLinkClick
    }, linkAttrItemsReadmore, {
      target: readMore.options.linkTarget,
      href: postUrl
    }), " ", readMore.options.text), !readMore.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "readmore"
    }, " ", readMore.options.text))), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postExcerpt.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      onClick: handleLinkClick
    }, linkAttrItems, {
      href: postUrl,
      target: postExcerpt.options.linkTarget
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "prefix"
    }, prefix.options.text), postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, postExcerptEdited), !postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postExcerptEdited), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "postfix"
    }, postfix.options.text)), readMore.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "readmore",
      onClick: handleLinkClick
    }, linkAttrItemsReadmore, {
      target: readMore.options.linkTarget,
      href: postUrl
    }), " ", readMore.options.text))), wrapper.options.tag.length == 0 && !postExcerpt.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "prefix"
    }, prefix.options.text), postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, postExcerptEdited), !postExcerpt.options.keepHtml && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postExcerptEdited), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "postfix"
    }, postfix.options.text), readMore.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "readmore",
      onClick: handleLinkClick
    }, linkAttrItemsReadmore, {
      target: postExcerpt.options.linkTarget,
      href: postUrl
    }), " ", readMore.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-featured-image/index.js":
/*!*************************************************!*\
  !*** ./src/blocks/post-featured-image/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_11__);
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_toggle__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/toggle */ "./src/components/toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./placeholder.jpg */ "./src/blocks/post-featured-image/placeholder.jpg");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
















const {
  RawHTML
} = wp.element;
















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/post-featured-image", {
  apiVersion: 2,
  title: "Featured Image",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "33.79",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "16.42",
      y: "33.79",
      width: "9.96",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "29.1",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "24.4",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M0,.21V19.4H36V.21Zm2,17.23V2.17H34.08V17.44Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "20.23 4.13 14.59 11 12.36 8.28 6.46 15.48 10.92 15.48 18.26 15.48 29.54 15.48 20.23 4.13"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: '',
          useAsBackground: 'no'
        },
        styles: {
          height: {},
          overflow: {},
          color: {
            Desktop: ''
          },
          display: {},
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          backgroundPosition: {},
          backgroundSize: {}
        }
      }
    },
    featuredImage: {
      type: 'object',
      default: {
        options: {
          tag: '',
          linkTo: '',
          // postUrl, customField, authorUrl, authorLink, homeUrl, custom
          customUrl: '',
          linkToMetaKey: '',
          altTextSrc: 'imgAltText',
          // imgAltText, imgTitle, imgCaption, imgDescription imgName, imgSlug, postTitle, excerpt, postSlug, customField, custom
          altTextCustom: '',
          altTextMetaKey: '',
          titleTextSrc: 'imgTitle',
          // imgAltText, imgTitle, imgCaption, imgDescription imgName, imgSlug, postTitle, excerpt, postSlug, customField, custom
          titleTextCustom: '',
          titleTextMetaKey: '',
          linkTarget: '_blank',
          linkAttr: [],
          class: '',
          size: {
            "Desktop": "full",
            "Tablet": "full",
            "Mobile": "full"
          }
        },
        styles: {
          width: {},
          height: {},
          filter: {},
          padding: {
            Desktop: ''
          },
          margin: {}
        },
        hoverStyles: {
          filter: {}
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    let featuredImage = attributes.featuredImage;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var demoImg = 'src/blocks/post-featured-image/placeholder.jpg';
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [postImage, setPostImage] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(null);
    const [imageSizes, setImageSizes] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]);
    const [filterArgs, setfilterArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([{
      label: 'Blur',
      isPro: false,
      value: 'blur',
      val: '',
      unit: 'px'
    }, {
      label: 'Brightness',
      isPro: false,
      value: 'brightness',
      val: '10',
      unit: '%'
    }, {
      label: 'Contrast',
      isPro: true,
      value: 'contrast',
      val: '10',
      unit: '%'
    }, {
      label: 'Grayscale',
      isPro: true,
      value: 'grayscale',
      val: '10',
      unit: '%'
    }, {
      label: 'Hue-rotate',
      isPro: true,
      value: 'hue-rotate',
      val: '10',
      unit: 'deg'
    }, {
      label: 'Invert',
      isPro: true,
      value: 'invert',
      val: '10',
      unit: '%'
    }, {
      label: 'Opacity',
      isPro: true,
      value: 'opacity',
      val: '10',
      unit: '%'
    }, {
      label: 'Saturate',
      isPro: true,
      value: 'saturate',
      val: '10',
      unit: '%'
    }, {
      label: 'Sepia',
      value: 'sepia',
      val: '10',
      unit: '%'
    }]);
    var linkToArgsBasic = {
      noUrl: {
        label: 'No URL',
        value: ''
      },
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('linkToArgs', linkToArgsBasic);
    var altTextSrcArgsBasic = {
      'none': {
        label: 'No Alt Text',
        value: ''
      },
      'imgAltText': {
        label: 'Image Alt Text',
        value: 'imgAltText'
      },
      'imgTitle': {
        label: 'Image Title',
        value: 'imgTitle'
      },
      'imgCaption': {
        label: 'Image Caption',
        value: 'imgCaption'
      },
      'imgDescription': {
        label: 'Image Description',
        value: 'imgDescription'
      },
      'imgSlug': {
        label: 'Image Slug',
        value: 'imgSlug'
      },
      'postTitle': {
        label: 'Post Title',
        value: 'postTitle'
      },
      'postSlug': {
        label: 'Post Slug',
        value: 'postSlug'
      },
      'excerpt': {
        label: 'Post Excerpt',
        value: 'excerpt',
        isPro: true
      },
      'customField': {
        label: 'Post Custom Field',
        value: 'customField',
        isPro: true
      },
      'custom': {
        label: 'Custom',
        value: 'custom',
        isPro: true
      }
    };
    let altTextSrcArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('altTextSrcArgs', altTextSrcArgsBasic);
    var customTagArgsBasic = {
      h1: {
        label: 'H1',
        value: 'h1'
      },
      h2: {
        label: 'H2',
        value: 'h2'
      },
      h3: {
        label: 'H3',
        value: 'h3'
      },
      h4: {
        label: 'H4',
        value: 'h4'
      },
      h5: {
        label: 'H5',
        value: 'h5'
      },
      h6: {
        label: 'H6',
        value: 'h6'
      },
      span: {
        label: 'SPAN',
        value: 'span'
      },
      div: {
        label: 'DIV',
        value: 'div'
      },
      p: {
        label: 'P',
        value: 'p'
      }
    };
    let customTagArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_6__.applyFilters)('customTagArgs', customTagArgsBasic);
    const ALLOWED_MEDIA_TYPES = ['image'];
    const [currentPostImageId, setCurrentPostImageId] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'featured_media', postId);
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      if (!currentPostImageId) return;
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_11___default()({
        path: '/wp/v2/media/' + currentPostImageId,
        method: 'POST',
        data: {
          id: currentPostImageId
        }
      }).then(res => {
        setPostImage(res);
        var imgSizes = [];
        Object.keys(res.media_details.sizes).map(x => {
          var height = res.media_details.sizes[x].height;
          var width = res.media_details.sizes[x].width; //var crop = res[x].crop

          imgSizes.push({
            label: x + "(" + width + "*" + height + ")",
            value: x,
            height: height,
            width: width
          });
        });
        setImageSizes(imgSizes);
      }); // apiFetch({
      //   path: '/post-grid/v2/get_image_sizes',
      //   method: 'POST',
      //   data: {},
      // }).then((res) => {
      //   var imgSizes = [];
      //   Object.keys(res).map(x => {
      //     var height = res[x].height
      //     var width = res[x].width
      //     var crop = res[x].crop
      //     imgSizes.push({ label: x + "(" + width + "*" + height + ")", value: x, height: height, width: width, crop: crop });
      //   })
      //   imgSizes.push({ label: "Full(**)", value: 'full', height: '', width: '', crop: true });
      //   setImageSizes(imgSizes)
      // });
    }, [currentPostImageId]);

    function addfilterArgs(option, index) {
      var filterObj = {};

      if (featuredImage.styles.filter[breakPointX] != undefined) {
        featuredImage.styles.filter[breakPointX].push(option);
      } else {
        featuredImage.styles.filter[breakPointX] = [];
        featuredImage.styles.filter[breakPointX].push(option);
      }

      var styles = { ...featuredImage.styles,
        filter: featuredImage.styles.filter
      };
      setAttributes({
        featuredImage: { ...featuredImage,
          styles: styles
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {}, [featuredImage]);

    function setFeaturedImageSize(option, index) {
      var newValuesObj = {};

      if (Object.keys(featuredImage.options.size).length == 0) {
        newValuesObj[breakPointX] = option.value;
      } else {
        newValuesObj = featuredImage.options.size;
        newValuesObj[breakPointX] = option.value;
      }

      var options = { ...featuredImage.options,
        size: newValuesObj
      };
      setAttributes({
        featuredImage: { ...featuredImage,
          options: options
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ featuredImage: featuredImage });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss); //blockCssY.items[imgSelector] = { ...blockCssY.items[imgSelector], 'width': { "Desktop": "100%" } };
      //blockCssY.items[imgSelector] = { ...blockCssY.items[imgSelector], 'height': { "Desktop": "auto" } };
      //setAttributes({ blockCssY: { items: blockCssY.items } });
    }, [clientId]); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var linkSelector = '';

    if (wrapper.options.tag.length != 0) {
      if (featuredImage.options.linkTo.length > 0) {
        linkSelector = blockClass + ' a';
      } else {
        linkSelector = blockClass;
      }
    } else {
      linkSelector = blockClass;
    }

    var imgSelector = blockClass + ' img';
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    var BefroeTitle = function (_ref) {
      let {
        title,
        args
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          featuredImage.styles.filter[breakPointX].splice(args.index, 1);
          var styles = featuredImage.styles;
          setAttributes({
            featuredImage: { ...featuredImage,
              styles: styles
            }
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "mx-2"
      }, title));
    };

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryImage(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        featuredImage[sudoScource] = sudoScourceArgs;
      });
      var featuredImageX = Object.assign({}, featuredImage);
      setAttributes({
        featuredImage: featuredImageX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, imgSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleImage(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, featuredImage);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        featuredImage: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, imgSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleImage(sudoScource, key) {
      var object = myStore.deletePropertyDeep(featuredImage, [sudoScource, key, breakPointX]);
      setAttributes({
        featuredImage: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, imgSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleImage(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, featuredImage);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        featuredImage: object
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
    }, [featuredImage]);

    var linkAttrObj = () => {
      var sdsd = {};
      featuredImage.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    var postUrl = featuredImage.options.customUrl != undefined && featuredImage.options.customUrl.length > 0 ? featuredImage.options.customUrl : currentPostUrl;
    const CustomTag = `${wrapper.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-post-featured-image`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'span',
        value: 'span'
      }, {
        label: 'div',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: {
            styles: wrapper.styles,
            options: options
          }
        });
      }
    })), wrapper.options.tag.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Image as Background"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: wrapper.options.useAsBackground,
      options: [{
        label: 'No',
        value: 'no'
      }, {
        label: 'Yes',
        value: 'yes'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          useAsBackground: newVal
        };
        var styles = { ...wrapper.styles,
          backgroundImage: {}
        };

        if (newVal == 'no') {
          setAttributes({
            wrapper: { ...wrapper,
              options: options,
              styles: styles
            }
          });
          var itemsX = { ...blockCssY.items
          };
          itemsX[wrapperSelector] = { ...blockCssY.items[wrapperSelector],
            'background-image': {}
          };
          setAttributes({
            blockCssY: {
              items: itemsX
            }
          });
        }

        if (newVal == 'yes') {
          var newValuesObj = {};

          if (wrapper.styles.backgroundImage == undefined || Object.keys(wrapper.styles.backgroundImage).length == 0) {
            newValuesObj[breakPointX] = 'url("' + (postImage == null) ? _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__ : 0;
          } else {
            newValuesObj = wrapper.styles.backgroundImage;
            newValuesObj[breakPointX] = 'url("' + (postImage == null) ? _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__ : 0;
          }

          var styles = { ...wrapper.styles,
            backgroundImage: newValuesObj
          };
          setAttributes({
            wrapper: { ...wrapper,
              styles: styles,
              options: options
            }
          });
          var itemsX = { ...blockCssY.items
          };
          itemsX[wrapperSelector] = { ...blockCssY.items[wrapperSelector],
            'background-image': newValuesObj
          }; //setAttributes({ blockCssY: { items: itemsX } });
        }
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Featured Image",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Thumbnail Size"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: imageSizes,
      buttonTitle: "Choose",
      onChange: setFeaturedImageSize,
      values: featuredImage.options.size[breakPointX]
    })), featuredImage.options.size[breakPointX] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-400 text-white px-3 py-2 my-3"
    }, " ", featuredImage.options.size[breakPointX]), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: featuredImage.options.linkTo.length == 0 ? 'Choose' : linkToArgs[featuredImage.options.linkTo].label,
      options: linkToArgs,
      onChange: (option, index) => {
        var options = { ...featuredImage.options,
          linkTo: option.value
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      },
      values: ""
    })), featuredImage.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: featuredImage.options.linkToMetaKey,
      onChange: newVal => {
        var options = { ...featuredImage.options,
          linkToMetaKey: newVal
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      }
    })), featuredImage.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), featuredImage.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_30__["default"],
      onClick: ev => {
        var options = { ...featuredImage.options,
          customUrl: ''
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.__experimentalLinkControl, {
      settings: [],
      value: featuredImage.options.customUrl,
      onChange: newVal => {
        var options = { ...featuredImage.options,
          customUrl: newVal.url
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", featuredImage.options.customUrl.length != 0 ? featuredImage.options.customUrl : 'No link', " ")))), featuredImage.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: featuredImage.options.linkTarget,
      options: [{
        label: 'Choose...',
        value: ''
      }, {
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...featuredImage.options,
          linkTarget: newVal
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = featuredImage.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...featuredImage.options,
          linkAttr: sdsd
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), featuredImage.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: featuredImage.options.linkAttr[i].id,
        onChange: newVal => {
          featuredImage.options.linkAttr[i].id = newVal;
          var ssdsd = featuredImage.options.linkAttr.concat([]);
          var options = { ...featuredImage.options,
            linkAttr: ssdsd
          };
          setAttributes({
            featuredImage: { ...featuredImage,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          featuredImage.options.linkAttr[i].val = newVal;
          var ssdsd = featuredImage.options.linkAttr.concat([]);
          var options = { ...featuredImage.options,
            linkAttr: ssdsd
          };
          setAttributes({
            featuredImage: { ...featuredImage,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          featuredImage.options.linkAttr.splice(i, 1);
          var ssdsd = featuredImage.options.linkAttr.concat([]);
          var options = { ...featuredImage.options,
            linkAttr: ssdsd
          };
          setAttributes({
            featuredImage: { ...featuredImage,
              options: options
            }
          });
        }
      })));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Alt Text Source"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: featuredImage.options.altTextSrc.length == 0 ? 'Choose' : altTextSrcArgs[featuredImage.options.altTextSrc].label,
      options: altTextSrcArgs,
      onChange: (option, index) => {
        var options = { ...featuredImage.options,
          altTextSrc: option.value
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      },
      values: ""
    })), featuredImage.options.altTextSrc == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Custom Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: 'Choose',
      options: [{
        label: 'Custom',
        value: ''
      }, {
        label: 'Yoast meta',
        value: '_yoast_wpseo_metadesc'
      }, {
        label: 'Rank Math meta',
        value: 'rank_math_description'
      }, {
        label: 'AIO SEO meta',
        value: '_aioseo_og_description'
      }, {
        label: 'SEOPress meta',
        value: '_seopress_titles_desc'
      }, {
        label: 'WP Meta SEO meta',
        value: '_metaseo_metadesc'
      }, {
        label: 'The SEO Framework meta',
        value: '_genesis_description'
      }, {
        label: 'SEO SIMPLE PACK meta',
        value: 'ssp_meta_description'
      }],
      onChange: (option, index) => {
        var options = { ...featuredImage.options,
          altTextMetaKey: option.value
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      },
      values: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: featuredImage.options.altTextMetaKey,
      onChange: newVal => {
        var options = { ...featuredImage.options,
          altTextMetaKey: newVal
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      }
    }))), featuredImage.options.altTextSrc == 'custom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Alt Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: featuredImage.options.altTextCustom,
      onChange: newVal => {
        var options = { ...featuredImage.options,
          altTextCustom: newVal
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Title Text Source"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: featuredImage.options.titleTextSrc == undefined || featuredImage.options.titleTextSrc.length == 0 ? 'Choose' : altTextSrcArgs[featuredImage.options.titleTextSrc].label,
      options: altTextSrcArgs,
      onChange: (option, index) => {
        var options = { ...featuredImage.options,
          titleTextSrc: option.value
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      },
      values: ""
    })), featuredImage.options.titleTextSrc == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Custom Field"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      buttonTitle: 'Choose',
      options: [{
        label: 'Custom',
        value: ''
      }, {
        label: 'Yoast meta',
        value: '_yoast_wpseo_metadesc'
      }, {
        label: 'Rank Math meta',
        value: 'rank_math_description'
      }, {
        label: 'AIO SEO meta',
        value: '_aioseo_og_description'
      }, {
        label: 'SEOPress meta',
        value: '_seopress_titles_desc'
      }, {
        label: 'WP Meta SEO meta',
        value: '_metaseo_metadesc'
      }, {
        label: 'The SEO Framework meta',
        value: '_genesis_description'
      }, {
        label: 'SEO SIMPLE PACK meta',
        value: 'ssp_meta_description'
      }],
      onChange: (option, index) => {
        var options = { ...featuredImage.options,
          titleTextMetaKey: option.value
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      },
      values: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: featuredImage.options.titleTextMetaKey,
      onChange: newVal => {
        var options = { ...featuredImage.options,
          titleTextMetaKey: newVal
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      }
    }))), featuredImage.options.titleTextSrc == 'custom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Title Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      className: "mr-2",
      value: featuredImage.options.titleTextCustom,
      onChange: newVal => {
        var options = { ...featuredImage.options,
          titleTextCustom: newVal
        };
        setAttributes({
          featuredImage: { ...featuredImage,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: featuredImage,
      onChange: onChangeStyleImage,
      onAdd: onAddStyleImage,
      onRemove: onRemoveStyleImage
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: featuredImage,
      onChange: onPickCssLibraryImage
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title link"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, linkSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postImage == null && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.useAsBackground == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, linkAttrItems, {
      style: {
        backgroundImage: 'url(' + _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__ + ')'
      }
    })), wrapper.options.useAsBackground == 'no' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps, featuredImage.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      onClick: handleLinkClick,
      href: postUrl,
      target: featuredImage.options.linkTarget
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      src: _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__
    }, linkAttrItems, {
      alt: "Default Featured Image"
    }))), featuredImage.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      src: _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__
    }, linkAttrItems, {
      alt: "Default Featured Image"
    })))), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, featuredImage.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      onClick: handleLinkClick,
      href: postUrl,
      target: featuredImage.options.linkTarget
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      src: _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__
    }, linkAttrItems, {
      alt: "Default Featured Image"
    }))), featuredImage.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, linkAttrItems, {
      src: _placeholder_jpg__WEBPACK_IMPORTED_MODULE_20__,
      alt: "Default Featured Image"
    })))), postImage != null && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.useAsBackground == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, featuredImage.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      onClick: handleLinkClick,
      href: postUrl
    }, blockProps, {
      target: featuredImage.options.linkTarget,
      style: {
        backgroundImage: 'url(' + (postImage != null && postImage.media_details.sizes[featuredImage.options.size[breakPointX]] != undefined ? postImage.media_details.sizes[featuredImage.options.size[breakPointX]].source_url : '') + ')'
      }
    })), featuredImage.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      style: {
        backgroundImage: 'url(' + (postImage != null && postImage.media_details.sizes[featuredImage.options.size[breakPointX]] != undefined ? postImage.media_details.sizes[featuredImage.options.size[breakPointX]].source_url : '') + ')'
      }
    }))), wrapper.options.useAsBackground == 'no' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps, featuredImage.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      onClick: handleLinkClick,
      href: postUrl,
      target: featuredImage.options.linkTarget
    }, featuredImage.options.size[breakPointX] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: postImage != null && postImage.media_details.sizes[featuredImage.options.size[breakPointX]] != undefined ? postImage.media_details.sizes[featuredImage.options.size[breakPointX]].source_url : '',
      alt: postImage.alt_text
    })), postImage != null && postImage.media_details.sizes[featuredImage.options.size[breakPointX]] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
      src: postImage != null && postImage.guid.rendered != undefined ? postImage.guid.rendered : '',
      alt: postImage.alt_text
    })), featuredImage.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, featuredImage.options.size[breakPointX] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: postImage != null && postImage.media_details.sizes[featuredImage.options.size[breakPointX]] != undefined ? postImage.media_details.sizes[featuredImage.options.size[breakPointX]].source_url : '',
      alt: postImage.alt_text
    })), postImage.media_details.sizes[featuredImage.options.size[breakPointX]] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: postImage != null && postImage.guid.rendered != undefined ? postImage.guid.rendered : '',
      alt: postImage.alt_text
    }))))), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, featuredImage.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      onClick: handleLinkClick,
      href: postUrl,
      target: featuredImage.options.linkTarget
    }), featuredImage.options.size[breakPointX] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, linkAttrItems, {
      src: postImage != null && postImage.media_details.sizes[featuredImage.options.size[breakPointX]] != undefined ? postImage.media_details.sizes[featuredImage.options.size[breakPointX]].source_url : '',
      alt: postImage.alt_text
    })), postImage != null && postImage.media_details.sizes[featuredImage.options.size[breakPointX]] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
      src: postImage != null && postImage.guid.rendered != undefined ? postImage.guid.rendered : '',
      alt: postImage.alt_text
    })), featuredImage.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, featuredImage.options.size[breakPointX] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, linkAttrItems, {
      src: postImage != null && postImage.media_details.sizes[featuredImage.options.size[breakPointX]] != undefined ? postImage.media_details.sizes[featuredImage.options.size[breakPointX]].source_url : '',
      alt: postImage.alt_text
    })), postImage.media_details.sizes[featuredImage.options.size[breakPointX]] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      src: postImage != null && postImage.guid.rendered != undefined ? postImage.guid.rendered : '',
      alt: postImage.alt_text
    })))))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-grid-filterable/grid-layouts.js":
/*!*********************************************************!*\
  !*** ./src/blocks/post-grid-filterable/grid-layouts.js ***!
  \*********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);

const gridLayouts = [{
  thumb: '',
  title: '3 Col, 0 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "0",
          "unit": "em"
        },
        "Mobile": {
          "val": "0",
          "unit": "em"
        },
        "Tablet": {
          "val": "0",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "0",
          "unit": "em"
        },
        "Mobile": {
          "val": "0",
          "unit": "em"
        },
        "Tablet": {
          "val": "0",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "11.5",
    y: "14.5",
    width: "73.3231",
    height: "91",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.0611 73.9162C25.0611 72.5868 26.1387 71.5092 27.468 71.5092H69.1885C70.5178 71.5092 71.5954 72.5868 71.5954 73.9162V73.9162C71.5954 75.2455 70.5178 76.3231 69.1885 76.3231H27.468C26.1387 76.3231 25.0611 75.2455 25.0611 73.9162V73.9162Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.0611 81.6184C25.0611 80.2891 26.1387 79.2115 27.468 79.2115H69.1885C70.5178 79.2115 71.5954 80.2891 71.5954 81.6184V81.6184C71.5954 82.9477 70.5178 84.0254 69.1885 84.0254H27.468C26.1387 84.0254 25.0611 82.9477 25.0611 81.6184V81.6184Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.0611 89.3206C25.0611 87.9913 26.1387 86.9137 27.468 86.9137H55.7663C57.0956 86.9137 58.1732 87.9913 58.1732 89.3206V89.3206C58.1732 90.65 57.0956 91.7276 55.7663 91.7276H27.468C26.1387 91.7276 25.0611 90.65 25.0611 89.3206V89.3206Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M20.2402 21.2314V65.1079H76.083V21.2314H20.2402ZM24.2289 25.2202H72.0942V52.9546L61.5613 42.3595L60.1279 40.926L51.0908 49.9631L39.6231 38.3707L38.1896 36.9372L24.2289 50.8979V25.2202ZM64.1167 29.209C61.9119 29.209 60.1279 30.993 60.1279 33.1978C60.1279 35.4025 61.9119 37.1865 64.1167 37.1865C66.3214 37.1865 68.1054 35.4025 68.1054 33.1978C68.1054 30.993 66.3214 29.209 64.1167 29.209ZM38.1896 42.6088L56.5131 61.1192H24.2289V56.5695L38.1896 42.6088ZM60.1279 46.5975L72.0942 58.5638V61.1192H62.1846L53.8954 52.7677L60.1279 46.5975Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "85.4359",
    y: "14.5",
    width: "73.3231",
    height: "91",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M98.9971 73.9162C98.9971 72.5868 100.075 71.5092 101.404 71.5092H143.124C144.454 71.5092 145.531 72.5868 145.531 73.9162V73.9162C145.531 75.2455 144.454 76.3231 143.124 76.3231H101.404C100.075 76.3231 98.9971 75.2455 98.9971 73.9162V73.9162Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M98.9971 81.6184C98.9971 80.2891 100.075 79.2115 101.404 79.2115H143.124C144.454 79.2115 145.531 80.2891 145.531 81.6184V81.6184C145.531 82.9477 144.454 84.0254 143.124 84.0254H101.404C100.075 84.0254 98.9971 82.9477 98.9971 81.6184V81.6184Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M98.9971 89.3206C98.9971 87.9913 100.075 86.9137 101.404 86.9137H129.702C131.032 86.9137 132.109 87.9913 132.109 89.3206V89.3206C132.109 90.65 131.032 91.7276 129.702 91.7276H101.404C100.075 91.7276 98.9971 90.65 98.9971 89.3206V89.3206Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M94.1761 21.2314V65.1079H150.019V21.2314H94.1761ZM98.1649 25.2202H146.03V52.9546L135.497 42.3595L134.064 40.926L125.027 49.9631L113.559 38.3707L112.126 36.9372L98.1649 50.8979V25.2202ZM138.053 29.209C135.848 29.209 134.064 30.993 134.064 33.1978C134.064 35.4025 135.848 37.1865 138.053 37.1865C140.257 37.1865 142.041 35.4025 142.041 33.1978C142.041 30.993 140.257 29.209 138.053 29.209ZM112.126 42.6088L130.449 61.1192H98.1649V56.5695L112.126 42.6088ZM134.064 46.5975L146.03 58.5638V61.1192H136.121L127.831 52.7677L134.064 46.5975Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "159.372",
    y: "14.5",
    width: "73.3231",
    height: "91",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M172.933 73.9162C172.933 72.5868 174.01 71.5092 175.34 71.5092H217.06C218.39 71.5092 219.467 72.5868 219.467 73.9162V73.9162C219.467 75.2455 218.39 76.3231 217.06 76.3231H175.34C174.01 76.3231 172.933 75.2455 172.933 73.9162V73.9162Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M172.933 81.6184C172.933 80.2891 174.01 79.2115 175.34 79.2115H217.06C218.39 79.2115 219.467 80.2891 219.467 81.6184V81.6184C219.467 82.9477 218.39 84.0254 217.06 84.0254H175.34C174.01 84.0254 172.933 82.9477 172.933 81.6184V81.6184Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M172.933 89.3206C172.933 87.9913 174.01 86.9137 175.34 86.9137H203.638C204.967 86.9137 206.045 87.9913 206.045 89.3206V89.3206C206.045 90.65 204.967 91.7276 203.638 91.7276H175.34C174.01 91.7276 172.933 90.65 172.933 89.3206V89.3206Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M168.112 21.2314V65.1079H223.955V21.2314H168.112ZM172.101 25.2202H219.966V52.9546L209.433 42.3595L208 40.926L198.963 49.9631L187.495 38.3707L186.061 36.9372L172.101 50.8979V25.2202ZM211.988 29.209C209.784 29.209 208 30.993 208 33.1978C208 35.4025 209.784 37.1865 211.988 37.1865C214.193 37.1865 215.977 35.4025 215.977 33.1978C215.977 30.993 214.193 29.209 211.988 29.209ZM186.061 42.6088L204.385 61.1192H172.101V56.5695L186.061 42.6088ZM208 46.5975L219.966 58.5638V61.1192H210.056L201.767 52.7677L208 46.5975Z",
    fill: "black"
  }))
}, {
  title: '3 Col 1 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "1",
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "1",
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "12.5",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 73.3111C25.4498 72.0396 26.4805 71.0089 27.7521 71.0089H67.6586C68.9301 71.0089 69.9608 72.0396 69.9608 73.3111V73.3111C69.9608 74.5827 68.9301 75.6134 67.6585 75.6134H27.7521C26.4805 75.6134 25.4498 74.5827 25.4498 73.3111V73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 80.6785C25.4498 79.407 26.4805 78.3762 27.7521 78.3762H67.6586C68.9301 78.3762 69.9608 79.407 69.9608 80.6785V80.6785C69.9608 81.95 68.9301 82.9808 67.6585 82.9808H27.7521C26.4805 82.9808 25.4498 81.95 25.4498 80.6785V80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 88.0458C25.4498 86.7743 26.4805 85.7435 27.7521 85.7435H54.8199C56.0915 85.7435 57.1222 86.7743 57.1222 88.0458V88.0458C57.1222 89.3174 56.0915 90.3481 54.8199 90.3481H27.7521C26.4805 90.3481 25.4498 89.3174 25.4498 88.0458V88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M20.8384 22.917V64.8858H74.2533V22.917H20.8384ZM24.6538 26.7324H70.4379V53.2609L60.363 43.1264L58.9919 41.7553L50.3478 50.3994L39.3786 39.3111L38.0075 37.9399L24.6538 51.2937V26.7324ZM62.8072 30.5477C60.6984 30.5477 58.9919 32.2542 58.9919 34.3631C58.9919 36.4719 60.6984 38.1784 62.8072 38.1784C64.9161 38.1784 66.6226 36.4719 66.6226 34.3631C66.6226 32.2542 64.9161 30.5477 62.8072 30.5477ZM38.0075 43.3649L55.5342 61.0705H24.6538V56.7186L38.0075 43.3649ZM58.9919 47.1802L70.4379 58.6263V61.0705H60.9592L53.0304 53.0821L58.9919 47.1802Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "87.4345",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100.384 73.3111C100.384 72.0396 101.415 71.0089 102.687 71.0089H142.593C143.865 71.0089 144.895 72.0396 144.895 73.3111V73.3111C144.895 74.5827 143.865 75.6134 142.593 75.6134H102.687C101.415 75.6134 100.384 74.5827 100.384 73.3111V73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100.384 80.6785C100.384 79.407 101.415 78.3762 102.687 78.3762H142.593C143.865 78.3762 144.895 79.407 144.895 80.6785V80.6785C144.895 81.95 143.865 82.9808 142.593 82.9808H102.687C101.415 82.9808 100.384 81.95 100.384 80.6785V80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100.384 88.0458C100.384 86.7743 101.415 85.7435 102.687 85.7435H129.754C131.026 85.7435 132.057 86.7743 132.057 88.0458V88.0458C132.057 89.3174 131.026 90.3481 129.754 90.3481H102.687C101.415 90.3481 100.384 89.3174 100.384 88.0458V88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M95.7729 22.917V64.8858H149.188V22.917H95.7729ZM99.5883 26.7324H145.372V53.2609L135.298 43.1264L133.926 41.7553L125.282 50.3994L114.313 39.3111L112.942 37.9399L99.5883 51.2937V26.7324ZM137.742 30.5477C135.633 30.5477 133.926 32.2542 133.926 34.3631C133.926 36.4719 135.633 38.1784 137.742 38.1784C139.851 38.1784 141.557 36.4719 141.557 34.3631C141.557 32.2542 139.851 30.5477 137.742 30.5477ZM112.942 43.3649L130.469 61.0705H99.5883V56.7186L112.942 43.3649ZM133.926 47.1802L145.372 58.6263V61.0705H135.894L127.965 53.0821L133.926 47.1802Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "162.369",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 73.3111C175.319 72.0396 176.35 71.0089 177.621 71.0089H217.528C218.799 71.0089 219.83 72.0396 219.83 73.3111V73.3111C219.83 74.5827 218.799 75.6134 217.528 75.6134H177.621C176.35 75.6134 175.319 74.5827 175.319 73.3111V73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 80.6785C175.319 79.407 176.35 78.3762 177.621 78.3762H217.528C218.799 78.3762 219.83 79.407 219.83 80.6785V80.6785C219.83 81.95 218.799 82.9808 217.528 82.9808H177.621C176.35 82.9808 175.319 81.95 175.319 80.6785V80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 88.0458C175.319 86.7743 176.35 85.7435 177.621 85.7435H204.689C205.96 85.7435 206.991 86.7743 206.991 88.0458V88.0458C206.991 89.3174 205.96 90.3481 204.689 90.3481H177.621C176.35 90.3481 175.319 89.3174 175.319 88.0458V88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M170.707 22.917V64.8858H224.122V22.917H170.707ZM174.523 26.7324H220.307V53.2609L210.232 43.1264L208.861 41.7553L200.217 50.3994L189.248 39.3111L187.877 37.9399L174.523 51.2937V26.7324ZM212.676 30.5477C210.567 30.5477 208.861 32.2542 208.861 34.3631C208.861 36.4719 210.567 38.1784 212.676 38.1784C214.785 38.1784 216.492 36.4719 216.492 34.3631C216.492 32.2542 214.785 30.5477 212.676 30.5477ZM187.877 43.3649L205.403 61.0705H174.523V56.7186L187.877 43.3649ZM208.861 47.1802L220.307 58.6263V61.0705H210.828L202.899 53.0821L208.861 47.1802Z",
    fill: "black"
  }))
}, {
  title: '3 Col 2 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "2",
          "unit": "em"
        },
        "Tablet": {
          "val": "2",
          "unit": "em"
        },
        "Mobile": {
          "val": "2",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "2",
          "unit": "em"
        },
        "Tablet": {
          "val": "2",
          "unit": "em"
        },
        "Mobile": {
          "val": "2",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "13.5",
    y: "19.5",
    width: "66.0524",
    height: "82",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.6855 73.0548C25.6855 71.8555 26.6578 70.8833 27.857 70.8833H65.4961C66.6954 70.8833 67.6676 71.8555 67.6676 73.0548V73.0548C67.6676 74.2541 66.6954 75.2263 65.4961 75.2263H27.857C26.6578 75.2263 25.6855 74.2541 25.6855 73.0548V73.0548Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.6855 80.0035C25.6855 78.8043 26.6578 77.8321 27.857 77.8321H65.4961C66.6954 77.8321 67.6676 78.8043 67.6676 80.0035V80.0035C67.6676 81.2028 66.6954 82.175 65.4961 82.175H27.857C26.6578 82.175 25.6855 81.2028 25.6855 80.0035V80.0035Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.6855 86.9523C25.6855 85.7531 26.6578 84.7809 27.857 84.7809H53.387C54.5862 84.7809 55.5584 85.7531 55.5584 86.9523V86.9523C55.5584 88.1516 54.5862 89.1238 53.387 89.1238H27.857C26.6578 89.1238 25.6855 88.1516 25.6855 86.9523V86.9523Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M21.3362 25.524V65.1083H71.7162V25.524H21.3362ZM24.9348 29.1226H68.1176V54.1439L58.6151 44.5852L57.3219 43.292L49.1689 51.445L38.823 40.9866L37.5298 39.6934L24.9348 52.2884V29.1226ZM60.9205 32.7212C58.9314 32.7212 57.3219 34.3307 57.3219 36.3197C57.3219 38.3088 58.9314 39.9183 60.9205 39.9183C62.9095 39.9183 64.519 38.3088 64.519 36.3197C64.519 34.3307 62.9095 32.7212 60.9205 32.7212ZM37.5298 44.8101L54.0607 61.5097H24.9348V57.4051L37.5298 44.8101ZM57.3219 48.4087L68.1176 59.2044V61.5097H59.1774L51.6991 53.9752L57.3219 48.4087Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "89.4753",
    y: "19.5",
    width: "66.0524",
    height: "82",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M101.661 73.0548C101.661 71.8555 102.633 70.8833 103.832 70.8833H141.471C142.671 70.8833 143.643 71.8555 143.643 73.0548V73.0548C143.643 74.2541 142.671 75.2263 141.471 75.2263H103.832C102.633 75.2263 101.661 74.2541 101.661 73.0548V73.0548Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M101.661 80.0035C101.661 78.8043 102.633 77.8321 103.832 77.8321H141.471C142.671 77.8321 143.643 78.8043 143.643 80.0035V80.0035C143.643 81.2028 142.671 82.175 141.471 82.175H103.832C102.633 82.175 101.661 81.2028 101.661 80.0035V80.0035Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M101.661 86.9523C101.661 85.7531 102.633 84.7809 103.832 84.7809H129.362C130.562 84.7809 131.534 85.7531 131.534 86.9523V86.9523C131.534 88.1516 130.562 89.1238 129.362 89.1238H103.832C102.633 89.1238 101.661 88.1516 101.661 86.9523V86.9523Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M97.3116 25.524V65.1083H147.692V25.524H97.3116ZM100.91 29.1226H144.093V54.1439L134.59 44.5852L133.297 43.292L125.144 51.445L114.798 40.9866L113.505 39.6934L100.91 52.2884V29.1226ZM136.896 32.7212C134.907 32.7212 133.297 34.3307 133.297 36.3197C133.297 38.3088 134.907 39.9183 136.896 39.9183C138.885 39.9183 140.494 38.3088 140.494 36.3197C140.494 34.3307 138.885 32.7212 136.896 32.7212ZM113.505 44.8101L130.036 61.5097H100.91V57.4051L113.505 44.8101ZM133.297 48.4087L144.093 59.2044V61.5097H135.153L127.674 53.9752L133.297 48.4087Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "165.389",
    y: "19.5",
    width: "66.0524",
    height: "82",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M177.575 73.0548C177.575 71.8555 178.547 70.8833 179.746 70.8833H217.385C218.585 70.8833 219.557 71.8555 219.557 73.0548V73.0548C219.557 74.2541 218.585 75.2263 217.385 75.2263H179.746C178.547 75.2263 177.575 74.2541 177.575 73.0548V73.0548Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M177.575 80.0035C177.575 78.8043 178.547 77.8321 179.746 77.8321H217.385C218.585 77.8321 219.557 78.8043 219.557 80.0035V80.0035C219.557 81.2028 218.585 82.175 217.385 82.175H179.746C178.547 82.175 177.575 81.2028 177.575 80.0035V80.0035Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M177.575 86.9523C177.575 85.7531 178.547 84.7809 179.746 84.7809H205.276C206.476 84.7809 207.448 85.7531 207.448 86.9523V86.9523C207.448 88.1516 206.476 89.1238 205.276 89.1238H179.746C178.547 89.1238 177.575 88.1516 177.575 86.9523V86.9523Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M173.225 25.524V65.1083H223.605V25.524H173.225ZM176.824 29.1226H220.007V54.1439L210.504 44.5852L209.211 43.292L201.058 51.445L190.712 40.9866L189.419 39.6934L176.824 52.2884V29.1226ZM212.81 32.7212C210.821 32.7212 209.211 34.3307 209.211 36.3197C209.211 38.3088 210.821 39.9183 212.81 39.9183C214.799 39.9183 216.408 38.3088 216.408 36.3197C216.408 34.3307 214.799 32.7212 212.81 32.7212ZM189.419 44.8101L205.95 61.5097H176.824V57.4051L189.419 44.8101ZM209.211 48.4087L220.007 59.2044V61.5097H211.067L203.588 53.9752L209.211 48.4087Z",
    fill: "black"
  }))
}, {
  title: '2 Col 0 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "0",
          "unit": "em"
        },
        "Tablet": {
          "val": "0",
          "unit": "em"
        },
        "Mobile": {
          "val": "0",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "0",
          "unit": "em"
        },
        "Tablet": {
          "val": "0",
          "unit": "em"
        },
        "Mobile": {
          "val": "0",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "38.5",
    y: "8.5",
    width: "83.0175",
    height: "103",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M53.8952 75.7313C53.8952 74.2286 55.1134 73.0104 56.6161 73.0104H103.778C105.281 73.0104 106.499 74.2286 106.499 75.7313C106.499 77.234 105.281 78.4522 103.778 78.4522H56.6161C55.1134 78.4522 53.8952 77.234 53.8952 75.7313Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M53.8952 84.4382C53.8952 82.9355 55.1134 81.7173 56.6161 81.7173H103.778C105.281 81.7173 106.499 82.9355 106.499 84.4382C106.499 85.9409 105.281 87.1591 103.778 87.1591H56.6161C55.1134 87.1591 53.8952 85.9409 53.8952 84.4382Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M53.8952 93.1451C53.8952 91.6424 55.1134 90.4242 56.6161 90.4242H88.6054C90.1081 90.4242 91.3263 91.6424 91.3263 93.1451C91.3263 94.6478 90.1081 95.866 88.6054 95.866H56.6161C55.1134 95.866 53.8952 94.6478 53.8952 93.1451Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M48.4454 16.1747V65.7742H111.572V16.1747H48.4454ZM52.9545 20.6837H107.063V52.0357L95.1563 40.0585L93.5359 38.4381L83.3201 48.6539L70.3566 35.5495L68.7361 33.929L52.9545 49.7107V20.6837ZM98.0449 25.1928C95.5526 25.1928 93.5359 27.2095 93.5359 29.7018C93.5359 32.1941 95.5526 34.2109 98.0449 34.2109C100.537 34.2109 102.554 32.1941 102.554 29.7018C102.554 27.2095 100.537 25.1928 98.0449 25.1928ZM68.7361 40.3403L89.4496 61.2651H52.9545V56.122L68.7361 40.3403ZM93.5359 44.8494L107.063 58.3765V61.2651H95.8609L86.4905 51.8243L93.5359 44.8494Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "122.08",
    y: "8.5",
    width: "83.0175",
    height: "103",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M137.475 75.7313C137.475 74.2286 138.693 73.0104 140.196 73.0104H187.358C188.861 73.0104 190.079 74.2286 190.079 75.7313C190.079 77.234 188.861 78.4522 187.358 78.4522H140.196C138.693 78.4522 137.475 77.234 137.475 75.7313Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M137.475 84.4382C137.475 82.9355 138.693 81.7173 140.196 81.7173H187.358C188.861 81.7173 190.079 82.9355 190.079 84.4382C190.079 85.9409 188.861 87.1591 187.358 87.1591H140.196C138.693 87.1591 137.475 85.9409 137.475 84.4382Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M137.475 93.1451C137.475 91.6424 138.693 90.4242 140.196 90.4242H172.185C173.688 90.4242 174.906 91.6424 174.906 93.1451C174.906 94.6478 173.688 95.866 172.185 95.866H140.196C138.693 95.866 137.475 94.6478 137.475 93.1451Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M132.025 16.1747V65.7742H195.152V16.1747H132.025ZM136.534 20.6837H190.643V52.0357L178.736 40.0585L177.116 38.4381L166.9 48.6539L153.936 35.5495L152.316 33.929L136.534 49.7107V20.6837ZM181.625 25.1928C179.132 25.1928 177.116 27.2095 177.116 29.7018C177.116 32.1941 179.132 34.2109 181.625 34.2109C184.117 34.2109 186.134 32.1941 186.134 29.7018C186.134 27.2095 184.117 25.1928 181.625 25.1928ZM152.316 40.3403L173.029 61.2651H136.534V56.122L152.316 40.3403ZM177.116 44.8494L190.643 58.3765V61.2651H179.441L170.07 51.8243L177.116 44.8494Z",
    fill: "black"
  }))
}, {
  title: '2 Col 1 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "1",
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "1",
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "37.5",
    y: "9.5",
    width: "81.7632",
    height: "101.447",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M52.6579 75.7202C52.6579 74.2399 53.8579 73.0399 55.3382 73.0399H101.796C103.277 73.0399 104.477 74.2399 104.477 75.7202V75.7202C104.477 77.2005 103.277 78.4005 101.796 78.4005H55.3382C53.8579 78.4005 52.6579 77.2005 52.6579 75.7202V75.7202Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M52.6579 84.297C52.6579 82.8168 53.8579 81.6168 55.3382 81.6168H101.796C103.277 81.6168 104.477 82.8168 104.477 84.297V84.297C104.477 85.7773 103.277 86.9773 101.796 86.9773H55.3382C53.8579 86.9773 52.6579 85.7773 52.6579 84.297V84.297Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M52.6579 92.8739C52.6579 91.3936 53.8579 90.1936 55.3382 90.1936H86.8499C88.3302 90.1936 89.5302 91.3936 89.5302 92.8739V92.8739C89.5302 94.3542 88.3302 95.5542 86.8499 95.5542H55.3382C53.8579 95.5542 52.6579 94.3542 52.6579 92.8739V92.8739Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M47.2895 17.0526V65.9117H109.474V17.0526H47.2895ZM51.7312 21.4944H105.032V52.3783L93.303 40.5799L91.7068 38.9837L81.6435 49.047L68.8735 36.1382L67.2773 34.542L51.7312 50.088V21.4944ZM96.1485 25.9361C93.6934 25.9361 91.7068 27.9227 91.7068 30.3778C91.7068 32.8329 93.6934 34.8196 96.1485 34.8196C98.6036 34.8196 100.59 32.8329 100.59 30.3778C100.59 27.9227 98.6036 25.9361 96.1485 25.9361ZM67.2773 40.8575L87.6815 61.4699H51.7312V56.4036L67.2773 40.8575ZM91.7068 45.2993L105.032 58.6245V61.4699H93.997L84.7666 52.1701L91.7068 45.2993Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "124.737",
    y: "9.5",
    width: "81.7632",
    height: "101.447",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M139.895 75.7202C139.895 74.2399 141.095 73.0399 142.575 73.0399H189.033C190.513 73.0399 191.713 74.2399 191.713 75.7202V75.7202C191.713 77.2005 190.513 78.4005 189.033 78.4005H142.575C141.095 78.4005 139.895 77.2005 139.895 75.7202V75.7202Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M139.895 84.297C139.895 82.8168 141.095 81.6168 142.575 81.6168H189.033C190.513 81.6168 191.713 82.8168 191.713 84.297V84.297C191.713 85.7773 190.513 86.9773 189.033 86.9773H142.575C141.095 86.9773 139.895 85.7773 139.895 84.297V84.297Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M139.895 92.8739C139.895 91.3936 141.095 90.1936 142.575 90.1936H174.087C175.567 90.1936 176.767 91.3936 176.767 92.8739V92.8739C176.767 94.3542 175.567 95.5542 174.087 95.5542H142.575C141.095 95.5542 139.895 94.3542 139.895 92.8739V92.8739Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M134.526 17.0526V65.9117H196.711V17.0526H134.526ZM138.968 21.4944H192.269V52.3783L180.54 40.5799L178.944 38.9837L168.88 49.047L156.11 36.1382L154.514 34.542L138.968 50.088V21.4944ZM183.385 25.9361C180.93 25.9361 178.944 27.9227 178.944 30.3778C178.944 32.8329 180.93 34.8196 183.385 34.8196C185.84 34.8196 187.827 32.8329 187.827 30.3778C187.827 27.9227 185.84 25.9361 183.385 25.9361ZM154.514 40.8575L174.918 61.4699H138.968V56.4036L154.514 40.8575ZM178.944 45.2993L192.269 58.6245V61.4699H181.234L172.003 52.1701L178.944 45.2993Z",
    fill: "black"
  }))
}, {
  title: '2 Col 2 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "2",
          "unit": "em"
        },
        "Tablet": {
          "val": "2",
          "unit": "em"
        },
        "Mobile": {
          "val": "2",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "2",
          "unit": "em"
        },
        "Tablet": {
          "val": "2",
          "unit": "em"
        },
        "Mobile": {
          "val": "2",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "34.5",
    y: "9.5",
    width: "81.4017",
    height: "101",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M49.5895 75.4288C49.5895 73.955 50.7842 72.7603 52.258 72.7603H98.5133C99.9871 72.7603 101.182 73.955 101.182 75.4288V75.4288C101.182 76.9026 99.9871 78.0974 98.5133 78.0974H52.258C50.7842 78.0974 49.5895 76.9026 49.5895 75.4288V75.4288Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M49.5895 83.9683C49.5895 82.4944 50.7842 81.2997 52.258 81.2997H98.5133C99.9871 81.2997 101.182 82.4944 101.182 83.9683V83.9683C101.182 85.4421 99.9871 86.6368 98.5133 86.6368H52.258C50.7842 86.6368 49.5895 85.4421 49.5895 83.9683V83.9683Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M49.5895 92.5077C49.5895 91.0338 50.7842 89.8391 52.258 89.8391H83.6322C85.106 89.8391 86.3007 91.0338 86.3007 92.5077V92.5077C86.3007 93.9815 85.106 95.1762 83.6322 95.1762H52.258C50.7842 95.1762 49.5895 93.9815 49.5895 92.5077V92.5077Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M44.2446 17.0175V65.6632H106.157V17.0175H44.2446ZM48.6669 21.4398H101.735V52.1889L90.0572 40.442L88.4679 38.8528L78.4486 48.8721L65.7343 36.0197L64.1451 34.4304L48.6669 49.9086V21.4398ZM92.8902 25.8622C90.4459 25.8622 88.4679 27.8401 88.4679 30.2845C88.4679 32.7289 90.4459 34.7068 92.8902 34.7068C95.3346 34.7068 97.3126 32.7289 97.3126 30.2845C97.3126 27.8401 95.3346 25.8622 92.8902 25.8622ZM64.1451 40.7184L84.4602 61.2408H48.6669V56.1966L64.1451 40.7184ZM88.4679 45.1408L101.735 58.4078V61.2408H90.7482L81.558 51.9816L88.4679 45.1408Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "127.867",
    y: "9.5",
    width: "81.4017",
    height: "101",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M142.957 75.4288C142.957 73.955 144.152 72.7603 145.625 72.7603H191.881C193.354 72.7603 194.549 73.955 194.549 75.4288V75.4288C194.549 76.9026 193.354 78.0974 191.881 78.0974H145.625C144.152 78.0974 142.957 76.9026 142.957 75.4288V75.4288Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M142.957 83.9683C142.957 82.4944 144.152 81.2997 145.625 81.2997H191.881C193.354 81.2997 194.549 82.4944 194.549 83.9683V83.9683C194.549 85.4421 193.354 86.6368 191.881 86.6368H145.625C144.152 86.6368 142.957 85.4421 142.957 83.9683V83.9683Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M142.957 92.5077C142.957 91.0338 144.152 89.8391 145.625 89.8391H177C178.473 89.8391 179.668 91.0338 179.668 92.5077V92.5077C179.668 93.9815 178.473 95.1762 177 95.1762H145.625C144.152 95.1762 142.957 93.9815 142.957 92.5077V92.5077Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M137.612 17.0175V65.6632H199.525V17.0175H137.612ZM142.034 21.4398H195.102V52.1889L183.424 40.442L181.835 38.8528L171.816 48.8721L159.102 36.0197L157.512 34.4304L142.034 49.9086V21.4398ZM186.258 25.8622C183.813 25.8622 181.835 27.8401 181.835 30.2845C181.835 32.7289 183.813 34.7068 186.258 34.7068C188.702 34.7068 190.68 32.7289 190.68 30.2845C190.68 27.8401 188.702 25.8622 186.258 25.8622ZM157.512 40.7184L177.827 61.2408H142.034V56.1966L157.512 40.7184ZM181.835 45.1408L195.102 58.4078V61.2408H184.115L174.925 51.9816L181.835 45.1408Z",
    fill: "black"
  }))
}, {
  title: '3 Col, nth(1)-2 Offset 1 Gap',
  isPro: true,
  data: {
    "options": {
      "itemCss": {
        "Desktop": [{
          "grid-column-start": "1",
          "grid-column-end": "3",
          "grid-row-start": "",
          "grid-row-end": ""
        }]
      }
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": 1,
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": 1,
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "12.5",
    y: "16.5",
    width: "145",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M24 73.3111C24 72.0396 25.0308 71.0089 26.3023 71.0089H138.698C139.969 71.0089 141 72.0396 141 73.3111V73.3111C141 74.5827 139.969 75.6134 138.698 75.6134H26.3023C25.0308 75.6134 24 74.5827 24 73.3111V73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M24 80.6785C24 79.407 25.0308 78.3762 26.3023 78.3762H138.698C139.969 78.3762 141 79.407 141 80.6785V80.6785C141 81.95 139.969 82.9808 138.698 82.9808H26.3023C25.0308 82.9808 24 81.95 24 80.6785V80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M24 88.0458C24 86.7743 25.0308 85.7435 26.3023 85.7435H104.951C106.222 85.7435 107.253 86.7743 107.253 88.0458V88.0458C107.253 89.3174 106.222 90.3481 104.951 90.3481H26.3023C25.0308 90.3481 24 89.3174 24 88.0458V88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M58 22.9171V64.8859H111.415V22.9171H58ZM61.8153 26.7324H107.6V53.261L97.5246 43.1265L96.1535 41.7553L87.5093 50.3995L76.5402 39.3111L75.1691 37.94L61.8153 51.2937V26.7324ZM99.9688 30.5477C97.8599 30.5477 96.1535 32.2542 96.1535 34.3631C96.1535 36.472 97.8599 38.1784 99.9688 38.1784C102.078 38.1784 103.784 36.472 103.784 34.3631C103.784 32.2542 102.078 30.5477 99.9688 30.5477ZM75.1691 43.3649L92.6958 61.0705H61.8153V56.7186L75.1691 43.3649ZM96.1535 47.1803L107.6 58.6263V61.0705H98.1208L90.192 53.0821L96.1535 47.1803Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "162.369",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 73.3111C175.319 72.0396 176.35 71.0089 177.621 71.0089H217.528C218.799 71.0089 219.83 72.0396 219.83 73.3111C219.83 74.5827 218.799 75.6134 217.528 75.6134H177.621C176.35 75.6134 175.319 74.5827 175.319 73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 80.6785C175.319 79.407 176.35 78.3762 177.621 78.3762H217.528C218.799 78.3762 219.83 79.407 219.83 80.6785C219.83 81.95 218.799 82.9808 217.528 82.9808H177.621C176.35 82.9808 175.319 81.95 175.319 80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 88.0458C175.319 86.7743 176.35 85.7435 177.621 85.7435H204.689C205.96 85.7435 206.991 86.7743 206.991 88.0458C206.991 89.3174 205.96 90.3481 204.689 90.3481H177.621C176.35 90.3481 175.319 89.3174 175.319 88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M170.707 22.917V64.8858H224.122V22.917H170.707ZM174.523 26.7324H220.307V53.2609L210.232 43.1264L208.861 41.7553L200.217 50.3994L189.248 39.3111L187.877 37.9399L174.523 51.2937V26.7324ZM212.676 30.5477C210.567 30.5477 208.861 32.2542 208.861 34.3631C208.861 36.4719 210.567 38.1784 212.676 38.1784C214.785 38.1784 216.492 36.4719 216.492 34.3631C216.492 32.2542 214.785 30.5477 212.676 30.5477ZM187.877 43.3649L205.403 61.0705H174.523V56.7186L187.877 43.3649ZM208.861 47.1802L220.307 58.6263V61.0705H210.828L202.899 53.0821L208.861 47.1802Z",
    fill: "black"
  }))
}, {
  title: '3 Col, nth(2)-2 Offset 1 Gap',
  isPro: true,
  data: {
    "options": {
      "itemCss": {
        "Desktop": [{
          "grid-column-start": "",
          "grid-column-end": "",
          "grid-row-start": "",
          "grid-row-end": ""
        }, {
          "grid-column-start": "2",
          "grid-column-end": "4",
          "grid-row-start": "",
          "grid-row-end": ""
        }]
      }
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": 1,
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": 1,
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "88.5",
    y: "16.5",
    width: "145",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100 73.3111C100 72.0396 101.031 71.0089 102.302 71.0089H214.698C215.969 71.0089 217 72.0396 217 73.3111C217 74.5827 215.969 75.6134 214.698 75.6134H102.302C101.031 75.6134 100 74.5827 100 73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100 80.6785C100 79.407 101.031 78.3762 102.302 78.3762H214.698C215.969 78.3762 217 79.407 217 80.6785C217 81.95 215.969 82.9808 214.698 82.9808H102.302C101.031 82.9808 100 81.95 100 80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100 88.0458C100 86.7743 101.031 85.7435 102.302 85.7435H180.951C182.222 85.7435 183.253 86.7743 183.253 88.0458C183.253 89.3174 182.222 90.3481 180.951 90.3481H102.302C101.031 90.3481 100 89.3174 100 88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M134 22.9171V64.8859H187.415V22.9171H134ZM137.815 26.7324H183.6V53.261L173.525 43.1265L172.153 41.7553L163.509 50.3995L152.54 39.3111L151.169 37.94L137.815 51.2937V26.7324ZM175.969 30.5477C173.86 30.5477 172.153 32.2542 172.153 34.3631C172.153 36.472 173.86 38.1784 175.969 38.1784C178.078 38.1784 179.784 36.472 179.784 34.3631C179.784 32.2542 178.078 30.5477 175.969 30.5477ZM151.169 43.3649L168.696 61.0705H137.815V56.7186L151.169 43.3649ZM172.153 47.1803L183.6 58.6263V61.0705H174.121L166.192 53.0821L172.153 47.1803Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "12.5",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 73.3111C25.4498 72.0396 26.4805 71.0089 27.7521 71.0089H67.6586C68.9301 71.0089 69.9608 72.0396 69.9608 73.3111C69.9608 74.5827 68.9301 75.6134 67.6586 75.6134H27.7521C26.4805 75.6134 25.4498 74.5827 25.4498 73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 80.6785C25.4498 79.407 26.4805 78.3762 27.7521 78.3762H67.6586C68.9301 78.3762 69.9608 79.407 69.9608 80.6785C69.9608 81.95 68.9301 82.9808 67.6586 82.9808H27.7521C26.4805 82.9808 25.4498 81.95 25.4498 80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 88.0458C25.4498 86.7743 26.4805 85.7435 27.7521 85.7435H54.8199C56.0915 85.7435 57.1222 86.7743 57.1222 88.0458C57.1222 89.3174 56.0915 90.3481 54.8199 90.3481H27.7521C26.4805 90.3481 25.4498 89.3174 25.4498 88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M20.8384 22.917V64.8858H74.2533V22.917H20.8384ZM24.6538 26.7324H70.4379V53.2609L60.363 43.1264L58.9919 41.7553L50.3478 50.3994L39.3786 39.3111L38.0075 37.9399L24.6538 51.2937V26.7324ZM62.8072 30.5477C60.6984 30.5477 58.9919 32.2542 58.9919 34.3631C58.9919 36.4719 60.6984 38.1784 62.8072 38.1784C64.9161 38.1784 66.6226 36.4719 66.6226 34.3631C66.6226 32.2542 64.9161 30.5477 62.8072 30.5477ZM38.0075 43.3649L55.5342 61.0705H24.6538V56.7186L38.0075 43.3649ZM58.9919 47.1802L70.4379 58.6263V61.0705H60.9592L53.0304 53.0821L58.9919 47.1802Z",
    fill: "black"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (gridLayouts);

/***/ }),

/***/ "./src/blocks/post-grid-filterable/index.js":
/*!**************************************************!*\
  !*** ./src/blocks/post-grid-filterable/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/pencil.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/cloud.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_css_cursor__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-cursor */ "./src/components/css-cursor/index.js");
/* harmony import */ var _components_input_select__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _components_tutorials__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tutorials */ "./src/components/tutorials/index.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _query_presets__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./query-presets */ "./src/blocks/post-grid-filterable/query-presets.js");
/* harmony import */ var _grid_layouts__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./grid-layouts */ "./src/blocks/post-grid-filterable/grid-layouts.js");
/* harmony import */ var _queryprams__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./queryprams */ "./src/blocks/post-grid-filterable/queryprams.js");
/* harmony import */ var _tutorials_links__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./tutorials-links */ "./src/blocks/post-grid-filterable/tutorials-links.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var animejs_lib_anime_es_js__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! animejs/lib/anime.es.js */ "./node_modules/animejs/lib/anime.es.js");








const {
  parse
} = wp.blockSerializationDefaultParser;
const {
  RawHTML
} = wp.element;
var select = wp.data.select('core/block-editor');






























const ALLOWED_MEDIA_TYPES = ['image'];
var queryPramsX = _queryprams__WEBPACK_IMPORTED_MODULE_24__["default"].map((x, i) => {
  return {
    value: i,
    label: x.label,
    description: x.description,
    isPro: x.isPro
  };
});
var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/post-grid-filterable", {
  apiVersion: 2,
  title: "Post Grid -  Filterable",
  icon: {
    background: '#fff',
    foreground: '#fff',
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "3.5",
      width: "8.34",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "13.83",
      width: "8.34",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "24.16",
      width: "8.34",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M3.5,20.82H15.66V8.65H3.5ZM13.31,11v7.46H5.85V11Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M3.5,36H15.66V23.84H3.5Zm9.81-9.81v7.46H5.85V26.19Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M18.68,36H30.85V23.84H18.68Zm9.82-9.81v7.46H21V26.19Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "19.21",
      y: "10.83",
      width: "11.12",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "19.21",
      y: "16.29",
      width: "11.12",
      height: "2.35"
    }))
  },
  providesContext: {
    queryId: "queryId",
    loopIndex: "loopIndex",
    query: "query",
    displayLayout: "displayLayout"
  },
  supports: {
    align: ["left", "right", "center", "wide", "full"],
    html: false
  },
  attributes: {
    lazyLoad: {
      type: 'object',
      default: {
        options: {
          class: 'lazyLoad',
          enable: 'no',
          srcUrl: '',
          srcId: '',
          icon: {
            library: '',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: ''
          }
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    search: {
      type: 'object',
      default: {
        options: {
          class: 'search',
          enable: 'no',
          type: '',
          placeholder: '',
          icon: '',
          busyIcon: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    container: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundImage: {},
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    itemsWrap: {
      type: 'object',
      default: {
        options: {
          class: 'items-loop'
        },
        styles: {
          color: {
            Desktop: ''
          },
          wordBreak: {},
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    itemWrap: {
      type: 'object',
      default: {
        options: {
          class: 'item'
        },
        styles: {
          color: {
            Desktop: ''
          },
          wordBreak: {},
          padding: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        },
        hoverStyles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    filterable: {
      type: 'object',
      default: {
        options: {
          filters: [],
          allText: 'All',
          logicWithinGroup: '',
          logicBetweenGroups: '',
          multifilter: false,
          showSort: '',
          filterToggle: 'no',
          showRandom: '',
          showAll: 'yes',
          showClear: '',
          activeFilter: '',
          parPage: 6
        },
        styles: {
          color: {
            Desktop: ''
          },
          wordBreak: {},
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {
            "Desktop": "inline-block"
          },
          cursor: {
            "Desktop": "pointer"
          }
        }
      }
    },
    activeFilter: {
      type: 'object',
      default: {
        options: {
          slug: 'all'
        },
        styles: {
          color: {
            Desktop: ''
          },
          wordBreak: {},
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    filterGroupWrap: {
      type: 'object',
      default: {
        options: {},
        styles: {
          color: {
            "Desktop": "#18978F"
          },
          backgroundColor: {
            "Desktop": "#9DD6DF"
          },
          wordBreak: {},
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {
            "Desktop": "inline-block"
          }
        }
      }
    },
    filterGroup: {
      type: 'object',
      default: {
        options: {},
        styles: {
          color: {
            "Desktop": "#18978F"
          },
          backgroundColor: {
            "Desktop": "#9DD6DF"
          },
          wordBreak: {},
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {
            "Desktop": "inline-block"
          }
        }
      }
    },
    noPostsWrap: {
      type: 'object',
      default: {
        options: {
          class: 'no-posts text-center'
        },
        styles: {
          color: {
            Desktop: ''
          },
          wordBreak: {},
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    spinnerWrap: {
      type: 'object',
      default: {
        options: {
          class: 'spinner'
        },
        styles: {
          color: {
            Desktop: ''
          },
          wordBreak: {},
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    grid: {
      type: 'object',
      default: {
        options: {
          itemCss: {}
        },
        styles: {
          gridTemplateColumns: {},
          gridTemplateRows: {},
          colGap: {},
          rowGap: {},
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    pagination: {
      type: 'object',
      default: {
        options: {
          class: 'pagination',
          type: 'filterable',
          maxPageNum: '',
          prevText: 'Previous',
          nextText: 'Next',
          loadMoreText: 'Load More',
          noMorePosts: 'No More Posts',
          loadingText: 'Loading...',
          loadingIcon: {
            library: '',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: ''
          }
        },
        styles: {
          textAlign: {
            "Desktop": "center"
          },
          color: {
            "Desktop": "#18978F"
          },
          backgroundColor: {
            "Desktop": "#9DD6DF"
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        },
        hoverStyles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    paginationItem: {
      type: 'object',
      default: {
        options: {
          class: 'page-numbers inline-block'
        },
        styles: {
          display: {
            "Desktop": "inline-block"
          },
          color: {
            "Desktop": "#18978F"
          },
          backgroundColor: {
            "Desktop": "#9DD6DF"
          },
          padding: {
            "Desktop": {
              "top": "10px",
              "right": "10px",
              "bottom": "10px",
              "left": "10px"
            }
          },
          margin: {
            "Desktop": {
              "top": "5px",
              "right": "5px",
              "bottom": "5px",
              "left": "5px"
            }
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        },
        hoverStyles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    paginationItemActive: {
      type: 'object',
      default: {
        options: {
          class: 'page-numbers inline-block'
        },
        styles: {
          display: {},
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        },
        hoverStyles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    layout: {
      type: 'object',
      default: {
        id: '',
        srcServer: 'library',
        data: [{
          "blockName": "core/post-title",
          "attrs": {},
          "innerBlocks": [],
          "innerHTML": "",
          "innerContent": []
        }, {
          "blockName": null,
          "attrs": {},
          "innerBlocks": [],
          "innerHTML": "\n\n",
          "innerContent": ["\n\n"]
        }, {
          "blockName": "core/post-date",
          "attrs": {},
          "innerBlocks": [],
          "innerHTML": "",
          "innerContent": []
        }, {
          "blockName": null,
          "attrs": {},
          "innerBlocks": [],
          "innerHTML": "\n\n",
          "innerContent": ["\n\n"]
        }, {
          "blockName": "core/post-excerpt",
          "attrs": {
            "moreText": "",
            "textColor": "primary"
          },
          "innerBlocks": [],
          "innerHTML": "",
          "innerContent": []
        }],
        "rawData": "<!-- wp:post-featured-image  /-->\n\n<!-- wp:post-title /-->\n\n<!-- wp:post-excerpt  /-->"
      }
    },
    postTypes: {
      type: 'array',
      default: []
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    scripts: {
      type: 'object',
      default: {
        js: '',
        css: ''
      }
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    queryArgs: {
      type: 'object',
      default: {
        items: [{
          val: ['post'],
          multiple: false,
          id: 'postType',
          label: 'Post Types',
          description: "Select Post Types to Query"
        }, {
          val: ['publish'],
          multiple: false,
          id: 'postStatus',
          label: 'Post status',
          description: "Query post by post status"
        }, {
          val: 'DESC',
          multiple: false,
          id: 'order',
          label: 'Order',
          description: "Post query order"
        }, {
          val: ['date'],
          multiple: false,
          id: 'orderby',
          label: 'Orderby',
          description: "Post query orderby"
        }, {
          val: -1,
          multiple: false,
          id: 'postsPerPage',
          label: 'Posts Per Page',
          description: "Number of post to show per page"
        }, {
          val: 1,
          multiple: false,
          id: 'paged',
          label: 'Paged',
          description: "Pagination start with"
        }]
      }
    }
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var clientId = props.clientId;
    var setAttributes = props.setAttributes;
    var lazyLoad = attributes.lazyLoad;
    var container = attributes.container;
    var pagination = attributes.pagination;
    var paginationItem = attributes.paginationItem;
    var paginationItemActive = attributes.paginationItemActive;
    var search = attributes.search;
    var itemsWrap = attributes.itemsWrap;
    var itemWrap = attributes.itemWrap;
    var noPostsWrap = attributes.noPostsWrap;
    var spinnerWrap = attributes.spinnerWrap;
    var filterable = attributes.filterable;
    var activeFilter = attributes.activeFilter;
    var filterGroupWrap = attributes.filterGroupWrap;
    var filterGroup = attributes.filterGroup;
    var grid = attributes.grid;
    var layout = attributes.layout;
    var queryArgs = attributes.queryArgs;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var [isBusy, setIsBusy] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false); // Using the hook.

    var [importLayoutOpen, setimportLayoutOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
      id: 0,
      isOpen: false
    }); // Using the hook.

    let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_4__.applyFilters)('isProFeature', true);
    const [postGridData, setPostGridData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(window.PostGridPluginData);
    var containerSelector = blockClass;
    const itemsWrapSelector = blockClass + ' .items-loop';
    const itemWrapSelector = blockClass + ' .item';
    const filterGroupWrapSelector = blockClass + ' .filterable-group-wrap';
    const filterGroupSelector = blockClass + ' .filterable-group';
    const filterGroupTitleSelector = blockClass + ' .filterable-group-title';
    const filterableSelector = blockClass + ' .pg-filter';
    const activeFilterSelector = blockClass + ' .pg-filter.mixitup-control-active';
    const noPostsSelector = blockClass + ' .no-posts';
    const searchWrapSelector = blockClass + ' .search';
    const lazyloadWrapSelector = blockClass + ' .lazyLoad';
    const spinnerSelector = blockClass + ' .spinner';
    const paginationWrapSelector = blockClass + ' .pagination';
    const paginationItemSelector = blockClass + ' .pagination .page-numbers';
    const paginationItemActiveSelector = blockClass + ' .pagination .page-numbers.mixitup-control-active';
    const BLOCKS_TEMPLATE = [['post-grid/post-title', {}], ['post-grid/read-more', {}]];
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setPostGridData(window.PostGridPluginData);
    }, [window.PostGridPluginData]);
    const columnPresets = [{
      label: '1 Column',
      args: [{
        "val": 1,
        "unit": "fr"
      }],
      icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "23",
        height: "17",
        viewBox: "0 0 23 17",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 1.36364C0 0.61052 0.610521 0 1.36364 0H21.6364C22.3895 0 23 0.61052 23 1.36364V1.36364C23 2.11675 22.3895 2.72727 21.6364 2.72727H1.36364C0.61052 2.72727 0 2.11675 0 1.36364V1.36364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 15.6364C0 14.8833 0.610521 14.2727 1.36364 14.2727H21.6364C22.3895 14.2727 23 14.8833 23 15.6364V15.6364C23 16.3895 22.3895 17 21.6364 17H1.36364C0.61052 17 0 16.3895 0 15.6364V15.6364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M1.36363 -5.96064e-08C2.11674 -2.66867e-08 2.72726 0.610521 2.72726 1.36364L2.72726 15.6364C2.72726 16.3895 2.11674 17 1.36363 17C0.610513 17 -7.63055e-06 16.3895 -7.59763e-06 15.6364L-6.97375e-06 1.36364C-6.94083e-06 0.610521 0.610513 -9.25261e-08 1.36363 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M21.6364 -5.96064e-08C22.3895 -2.66867e-08 23 0.610521 23 1.36364L23 15.6364C23 16.3895 22.3895 17 21.6364 17V17C20.8832 17 20.2727 16.3895 20.2727 15.6364L20.2727 1.36364C20.2727 0.610521 20.8832 -9.25261e-08 21.6364 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }))
    }, {
      label: '2 Columns',
      args: [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "43",
        height: "17",
        viewBox: "0 0 43 17",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 1.36364C0 0.61052 0.610521 0 1.36364 0H41.2727C42.0258 0 42.6363 0.61052 42.6363 1.36364C42.6363 2.11675 42.0258 2.72727 41.2727 2.72727H1.36364C0.610521 2.72727 0 2.11675 0 1.36364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 15.6364C0 14.8833 0.610521 14.2727 1.36364 14.2727H41.2727C42.0258 14.2727 42.6363 14.8833 42.6363 15.6364C42.6363 16.3895 42.0258 17 41.2727 17H1.36364C0.610521 17 0 16.3895 0 15.6364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M1.36363 -5.96064e-08C2.11674 -2.66867e-08 2.72726 0.610521 2.72726 1.36364L2.72726 15.6364C2.72726 16.3895 2.11674 17 1.36363 17C0.610513 17 -7.63055e-06 16.3895 -7.59763e-06 15.6364L-6.97375e-06 1.36364C-6.94083e-06 0.610521 0.610513 -9.25261e-08 1.36363 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M21.6364 -5.96064e-08C22.3895 -2.66867e-08 23 0.610521 23 1.36364L23 15.6364C23 16.3895 22.3895 17 21.6364 17C20.8832 17 20.2727 16.3895 20.2727 15.6364L20.2727 1.36364C20.2727 0.610521 20.8832 -9.25261e-08 21.6364 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M41.6364 -5.96064e-08C42.3895 -2.66867e-08 43 0.610521 43 1.36364L43 15.6364C43 16.3895 42.3895 17 41.6364 17C40.8832 17 40.2727 16.3895 40.2727 15.6364L40.2727 1.36364C40.2727 0.610521 40.8832 -9.25261e-08 41.6364 -5.96064e-08Z",
        fill: "#fff"
      }))
    }, {
      label: '3 Columns',
      args: [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "43",
        height: "17",
        viewBox: "0 0 43 17",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 1.36364C0 0.61052 0.610521 0 1.36364 0H41.2727C42.0258 0 42.6363 0.61052 42.6363 1.36364C42.6363 2.11675 42.0258 2.72727 41.2727 2.72727H1.36364C0.610521 2.72727 0 2.11675 0 1.36364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 15.6364C0 14.8833 0.610521 14.2727 1.36364 14.2727H41.2727C42.0258 14.2727 42.6363 14.8833 42.6363 15.6364C42.6363 16.3895 42.0258 17 41.2727 17H1.36364C0.610521 17 0 16.3895 0 15.6364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M1.36363 -5.96064e-08C2.11674 -2.66867e-08 2.72726 0.610521 2.72726 1.36364L2.72726 15.6364C2.72726 16.3895 2.11674 17 1.36363 17C0.610513 17 -7.63055e-06 16.3895 -7.59763e-06 15.6364L-6.97375e-06 1.36364C-6.94083e-06 0.610521 0.610513 -9.25261e-08 1.36363 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M14.6364 -5.96064e-08C15.3895 -2.66867e-08 16 0.610521 16 1.36364L16 15.6364C16 16.3895 15.3895 17 14.6364 17C13.8832 17 13.2727 16.3895 13.2727 15.6364L13.2727 1.36364C13.2727 0.610521 13.8832 -9.25261e-08 14.6364 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M28.6364 -5.96064e-08C29.3895 -2.66867e-08 30 0.610521 30 1.36364L30 15.6364C30 16.3895 29.3895 17 28.6364 17C27.8832 17 27.2727 16.3895 27.2727 15.6364L27.2727 1.36364C27.2727 0.61052 27.8832 -9.25261e-08 28.6364 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M41.6364 -5.96064e-08C42.3895 -2.66867e-08 43 0.610521 43 1.36364L43 15.6364C43 16.3895 42.3895 17 41.6364 17C40.8832 17 40.2727 16.3895 40.2727 15.6364L40.2727 1.36364C40.2727 0.610521 40.8832 -9.25261e-08 41.6364 -5.96064e-08Z",
        fill: "#fff"
      }))
    }, {
      label: '4 Columns',
      args: [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "43",
        height: "17",
        viewBox: "0 0 43 17",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 1.36364C0 0.61052 0.610521 0 1.36364 0H41.2727C42.0258 0 42.6363 0.61052 42.6363 1.36364V1.36364C42.6363 2.11675 42.0258 2.72727 41.2727 2.72727H1.36364C0.610521 2.72727 0 2.11675 0 1.36364V1.36364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 15.6364C0 14.8833 0.610521 14.2727 1.36364 14.2727H41.2727C42.0258 14.2727 42.6363 14.8833 42.6363 15.6364V15.6364C42.6363 16.3895 42.0258 17 41.2727 17H1.36364C0.610521 17 0 16.3895 0 15.6364V15.6364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M1.36366 -5.96064e-08C2.11677 -2.66867e-08 2.72729 0.610521 2.72729 1.36364L2.72729 15.6364C2.72729 16.3895 2.11677 17 1.36366 17V17C0.610543 17 2.2887e-05 16.3895 2.292e-05 15.6364L2.35438e-05 1.36364C2.35768e-05 0.610521 0.610544 -9.25261e-08 1.36366 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M11.3636 -5.96064e-08C12.1167 -2.66867e-08 12.7273 0.610521 12.7273 1.36364L12.7273 15.6364C12.7273 16.3895 12.1167 17 11.3636 17V17C10.6105 17 9.99999 16.3895 9.99999 15.6364L9.99999 1.36364C9.99999 0.610521 10.6105 -9.25261e-08 11.3636 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M21.3636 -5.96064e-08C22.1167 -2.66867e-08 22.7273 0.610521 22.7273 1.36364L22.7273 15.6364C22.7273 16.3895 22.1167 17 21.3636 17V17C20.6105 17 20 16.3895 20 15.6364L20 1.36364C20 0.61052 20.6105 -9.25261e-08 21.3636 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M31.3636 -5.96064e-08C32.1167 -2.66867e-08 32.7273 0.610521 32.7273 1.36364L32.7273 15.6364C32.7273 16.3895 32.1167 17 31.3636 17V17C30.6105 17 30 16.3895 30 15.6364L30 1.36364C30 0.610521 30.6105 -9.25261e-08 31.3636 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M41.3636 -5.96064e-08C42.1167 -2.66867e-08 42.7273 0.610521 42.7273 1.36364L42.7273 15.6364C42.7273 16.3895 42.1167 17 41.3636 17V17C40.6105 17 40 16.3895 40 15.6364L40 1.36364C40 0.610521 40.6105 -9.25261e-08 41.3636 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }))
    }];
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      blockCssY.items[itemWrapSelector] = blockCssY.items[itemWrapSelector] != undefined ? blockCssY.items[itemWrapSelector] : {};
      blockCssY.items[paginationWrapSelector] = blockCssY.items[paginationWrapSelector] != undefined ? blockCssY.items[paginationWrapSelector] : {};
      var wordBreak = blockCssY.items[itemWrapSelector]['word-break'] != undefined ? blockCssY.items[itemWrapSelector]['word-break'] : {};
      wordBreak[breakPointX] = 'break-word';
      blockCssY.items[itemWrapSelector] = { ...blockCssY.items[itemWrapSelector],
        'word-break': wordBreak
      };
      blockCssY.items[paginationWrapSelector] = { ...blockCssY.items[paginationWrapSelector],
        'text-align': {
          "Desktop": "center"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'display': {
          "Desktop": "inline-block"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'cursor': {
          "Desktop": "pointer"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'color': {
          "Desktop": "#18978F"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'background-color': {
          "Desktop": "#9DD6DF"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'margin-left': {
          "Desktop": "5px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'margin-right': {
          "Desktop": "5px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'padding-top': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'padding-right': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'padding-bottom': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'padding-left': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
        'grid-template-columns': {
          "Desktop": "1fr 1fr 1fr",
          "Tablet": "1fr 1fr",
          "Mobile": "1fr"
        }
      };
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
      var paginationOptons = { ...pagination.options,
        type: 'filterable'
      };
      setAttributes({
        pagination: { ...pagination,
          options: paginationOptons
        }
      });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      blockCssY.items[itemsWrapSelector] = blockCssY.items[itemsWrapSelector] != undefined ? blockCssY.items[itemsWrapSelector] : {};
      var display = blockCssY.items[itemsWrapSelector]['display'] != undefined ? blockCssY.items[itemsWrapSelector]['display'] : {};
      display[breakPointX] = 'grid';
      blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
        'display': display
      };

      if (grid.styles.gridTemplateColumns[breakPointX] != undefined) {
        var gridTemplateColumns = blockCssY.items[itemsWrapSelector]['grid-template-columns'] != undefined ? blockCssY.items[itemsWrapSelector]['grid-template-columns'] : {};
        gridTemplateColumns[breakPointX] = grid.styles.gridTemplateColumns[breakPointX].map(item => {
          return item.val + item.unit + ' ';
        }).join(' ');
        blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
          'grid-template-columns': gridTemplateColumns
        };
      }

      if (grid.styles.gridTemplateRows[breakPointX] != undefined) {
        var gridTemplateRows = blockCssY.items[itemsWrapSelector]['grid-template-rows'] != undefined ? blockCssY.items[itemsWrapSelector]['grid-template-rows'] : {};
        gridTemplateRows[breakPointX] = grid.styles.gridTemplateRows[breakPointX].map(item => {
          return item.val + item.unit + ' ';
        }).join(' ');
        blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
          'grid-template-rows': gridTemplateRows
        };
      }

      if (grid.styles.colGap[breakPointX] != undefined) {
        var colGap = blockCssY.items[itemsWrapSelector]['column-gap'] != undefined ? blockCssY.items[itemsWrapSelector]['column-gap'] : {};
        colGap[breakPointX] = grid.styles.colGap[breakPointX].val + grid.styles.colGap[breakPointX].unit;
        blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
          'column-gap': colGap
        };
      }

      if (grid.styles.rowGap[breakPointX] != undefined) {
        var rowGap = blockCssY.items[itemsWrapSelector]['row-gap'] != undefined ? blockCssY.items[itemsWrapSelector]['row-gap'] : {};
        rowGap[breakPointX] = grid.styles.rowGap[breakPointX].val + grid.styles.rowGap[breakPointX].unit;
        blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
          'row-gap': rowGap
        };
      }

      var nthItemsResponsive = [];
      var itemX = { ...blockCssY.items
      };
      Object.entries(grid.options.itemCss).map(args => {
        /****breakPoint****/
        var breakPoint = args[0];
        var nthItems = args[1];
        nthItems.length > 0 && nthItems.map((x, i) => {
          /****nthItems****/
          Object.entries(x).map(attr => {
            var attrId = attr[0];
            var attrVal = attr[1];

            if (nthItemsResponsive[i] != undefined) {//nthItemsResponsive[i] = [];
            } else {
              nthItemsResponsive[i] = [];
            }

            if (nthItemsResponsive[i][attrId] != undefined) {//nthItemsResponsive[i][attrId] = [];
            } else {
              nthItemsResponsive[i][attrId] = [];
            }

            if (nthItemsResponsive[i][attrId][breakPoint] != undefined) {
              nthItemsResponsive[i][attrId][breakPoint] = attrVal;
            } else {
              nthItemsResponsive[i][attrId][breakPoint] = attrVal;
            }
          });
        });
      });

      for (var i = 0; i < 10; i++) {
        var selector = `${blockClass} .item:nth-child(${i})`;

        if (blockCssY.items[selector] != undefined) {
          delete blockCssY.items[selector];
        }
      }

      var imtasdas = {};
      nthItemsResponsive.length > 0 && nthItemsResponsive.map((nth, i) => {
        var selector = `${blockClass} .item:nth-child(${i + 1})`;
        Object.entries(nth).map(attr => {
          var attrId = attr[0];
          var attrVal = attr[1];

          if (imtasdas[selector] != undefined) {} else {
            imtasdas[selector] = {};
          }

          if (imtasdas[selector][attrId] != undefined) {} else {
            imtasdas[selector][attrId] = {};
          }

          imtasdas[selector][attrId] = attrVal;
        });
      });
      var asdsd = { ...blockCssY.items,
        ...imtasdas
      };
      setAttributes({
        blockCssY: {
          items: asdsd
        }
      });
    }, [grid]);
    var [layoutImporting, setlayoutImporting] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false); // Using the hook.

    const [filterablTerms, setFilterablTerms] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    function fetchPostTypeTerms(keyword) {
      var postTypes = [];
      var terms = [];
      setFilterablTerms([]);
      queryArgs.items.map(x => {
        if (x.id == 'postType') {
          postTypes.push(x.val);
        }
      });
      var sss = _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
        path: '/post-grid/v2/post_type_objects',
        method: 'POST',
        data: {
          postTypes: postTypes[0],
          search: keyword
        }
      }).then(result => {
        //setFilterablTerms(result);
        result.length > 0 && result.map(x => {
          _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
            path: '/post-grid/v2/get_tax_terms',
            method: 'POST',
            data: {
              taxonomy: x.id,
              search: keyword
            }
          }).then(res => {
            //setFilterablTerms(res);
            res.length > 0 && res.map(y => {
              terms.push(y);
            });
            setFilterablTerms(terms);
          });
        }); //return result;
      });
    }

    function importLayout(postData) {
      setTimeout(() => {
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
          path: '/post-grid/v2/import_post_grid_template',
          method: 'POST',
          data: {
            postData: postData
          }
        }).then(res => {
          setlayoutImporting(false);
        });
      }, 2000);
    }

    var [debounce, setDebounce] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(null); // Using the hook.

    const [breakPointX, setBreakPointX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(myStore != null ? myStore.getBreakPoint() : 'Desktop');
    const [clientData, setClientData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    const paginationTypes = {
      none: {
        label: 'None',
        value: 'none',
        isPro: false
      },
      filterable: {
        label: 'Filterable',
        value: 'filterable',
        isPro: true
      }
    }; // [
    //       { label: 'None', value: 'none', isPro: false },
    //       { label: 'Normal Pagination', value: 'normal', isPro: false },
    //       { label: 'Ajax Pagination', value: 'ajax', isPro: true },
    //       { label: 'Next-Previous', value: 'next_previous', isPro: true },
    //       { label: 'Load More', value: 'loadmore', isPro: true },
    //       { label: 'Infinite Load', value: 'infinite', isPro: true },
    //     ]

    var clientDataX = myStore != null ? myStore.getclientdata() : '';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setClientData(myStore != null ? myStore.getclientdata() : '');
    }, [clientDataX]); // var ItemNthCssadasd2 = grid.options.itemCss.map((x, i) => {
    //   return (
    //     `<style>.item:nth-child(${i + 1}){grid-column-start: ${x['grid-column-start']};grid-column-end: ${x['grid-column-end']};grid-row-start: ${x['grid-row-start']};grid-row-end: ${x['grid-row-end']};}</style>`
    //   )
    // });

    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_21__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_21__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function addQueryPreset(option, index) {
      queryArgs.items = option.value.items;
      setAttributes({
        queryArgs: {
          items: queryArgs.items
        }
      });
      fetchPosts();
    }

    var postTypes = [];
    const postTypesData = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_8__.useSelect)(select => select(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_9__.store).getPostTypes({
      per_page: -1
    }), []);
    postTypesData !== null && postTypesData.map(x => {
      postTypes.push({
        value: x.slug,
        label: x.name
      });
    });
    const TEMPLATE = [['core/post-title'], ['core/post-date'], ['core/post-excerpt']];
    const TEMPLATE1 = [['core/post-date'], ['core/post-title'], ['core/post-excerpt']];
    var blocks = select.getBlocks(clientId);
    var defaultBloicks = [];
    var [blocksX, setBlocksX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(blocks); // Using the hook.

    var [TEMPLATEX, setTEMPLATEX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(TEMPLATE); // Using the hook.

    function PostTemplateInnerBlocks(_ref) {
      let {
        attsx
      } = _ref;
      const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.useInnerBlocksProps)({
        className: 'item'
      }, {
        template: attsx
      });
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", innerBlocksProps);
    }

    function PostTemplateBlockPreview(_ref2) {
      let {
        blocks,
        blockContextId,
        isHidden,
        setActiveBlockContextId
      } = _ref2;
      const blockPreviewProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.__experimentalUseBlockPreview)({
        blocks,
        props: {
          className: 'item'
        }
      });

      const handleOnClick = () => {
        setActiveBlockContextId(blockContextId);
      };

      const style = {
        display: isHidden ? 'none' : undefined
      };
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockPreviewProps, {
        tabIndex: 0 // eslint-disable-next-line jsx-a11y/no-noninteractive-element-to-interactive-role
        ,
        role: "button",
        onClick: handleOnClick,
        onKeyPress: handleOnClick,
        style: style
      }));
    }

    const MemoizedPostTemplateBlockPreview = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.memo)(PostTemplateBlockPreview);
    const [activeBlockContextId, setActiveBlockContextId] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)();

    function PostLoopItem() {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, " ");
    }

    function generateDateQueryArgs(_args) {}

    function onChangeBreakPoint(x, _index) {
      var asdsdsd = wp.data.dispatch('postgrid-shop').setBreakPoint(x.value);
      asdsdsd.then(res => {
        setBreakPointX(res.breakpoint);
        ;
        myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      });
    }

    function onPickCssLibraryContainer(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        container[sudoScource] = sudoScourceArgs;
      });
      var containerX = Object.assign({}, container);
      setAttributes({
        container: containerX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, containerSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleContainer(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, container);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        container: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, containerSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleContainer(sudoScource, key) {
      var object = myStore.deletePropertyDeep(container, [sudoScource, key, breakPointX]);
      setAttributes({
        container: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, containerSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleContainer(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, container);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        container: object
      });
    }

    function onPickCssLibraryItemsWrap(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        itemsWrap[sudoScource] = sudoScourceArgs;
      });
      var itemsWrapX = Object.assign({}, itemsWrap);
      setAttributes({
        itemsWrap: itemsWrapX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, itemsWrapSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleItemsWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, itemsWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        itemsWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemsWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItemsWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(itemsWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        itemsWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemsWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItemsWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, itemsWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        itemsWrap: object
      });
    }

    function onPickCssLibraryItemWrap(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        itemWrap[sudoScource] = sudoScourceArgs;
      });
      var itemWrapX = Object.assign({}, itemWrap);
      setAttributes({
        itemWrap: itemWrapX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, itemWrapSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleItemWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, itemWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        itemWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItemWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(itemWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        itemWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItemWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, itemWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        itemWrap: object
      });
    }

    function onPickCssLibraryPagination(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        pagination[sudoScource] = sudoScourceArgs;
      });
      var paginationX = Object.assign({}, pagination);
      setAttributes({
        pagination: paginationX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, paginationSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStylePagination(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, pagination);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        pagination: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePagination(sudoScource, key) {
      var object = myStore.deletePropertyDeep(pagination, [sudoScource, key, breakPointX]);
      setAttributes({
        pagination: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePagination(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, pagination);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        pagination: object
      });
    }

    function onPickCssLibraryPaginationItem(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        paginationItem[sudoScource] = sudoScourceArgs;
      });
      var paginationX = Object.assign({}, paginationItem);
      setAttributes({
        paginationItem: paginationX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, paginationItemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStylePaginationItem(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, paginationItem);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        paginationItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationItemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePaginationItem(sudoScource, key) {
      var object = myStore.deletePropertyDeep(paginationItem, [sudoScource, key, breakPointX]);
      setAttributes({
        paginationItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationItemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePaginationItem(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, paginationItem);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        paginationItem: object
      });
    }

    function onPickCssLibraryPaginationItemActive(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        paginationItemActive[sudoScource] = sudoScourceArgs;
      });
      var paginationX = Object.assign({}, paginationItemActive);
      setAttributes({
        paginationItemActive: paginationX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, paginationItemActiveSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStylePaginationItemActive(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, paginationItemActive);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        paginationItemActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationItemActiveSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePaginationItemActive(sudoScource, key) {
      var object = myStore.deletePropertyDeep(paginationItemActive, [sudoScource, key, breakPointX]);
      setAttributes({
        paginationItemActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationItemActiveSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePaginationItemActive(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, paginationItemActive);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        paginationItemActive: object
      });
    }

    function onPickCssLibraryFilterable(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        filterable[sudoScource] = sudoScourceArgs;
      });
      var paginationX = Object.assign({}, filterable);
      setAttributes({
        filterable: paginationX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, filterableSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleFilterable(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, filterable);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        filterable: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, filterableSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleFilterable(sudoScource, key) {
      var object = myStore.deletePropertyDeep(filterable, [sudoScource, key, breakPointX]);
      setAttributes({
        filterable: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, filterableSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleFilterable(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, filterable);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        filterable: object
      });
    }

    function onPickCssLibraryActiveFilter(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        activeFilter[sudoScource] = sudoScourceArgs;
      });
      var paginationX = Object.assign({}, activeFilter);
      setAttributes({
        activeFilter: paginationX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, activeFilterSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleActiveFilter(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, activeFilter);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        activeFilter: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, activeFilterSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleActiveFilter(sudoScource, key) {
      var object = myStore.deletePropertyDeep(activeFilter, [sudoScource, key, breakPointX]);
      setAttributes({
        activeFilter: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, activeFilterSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleActiveFilter(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, activeFilter);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        activeFilter: object
      });
    }

    function onPickCssLibraryFilterGroup(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        filterGroup[sudoScource] = sudoScourceArgs;
      });
      var paginationX = Object.assign({}, filterGroup);
      setAttributes({
        filterGroup: paginationX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, filterGroupSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleFilterGroup(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, filterGroup);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        filterGroup: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, filterGroupSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleFilterGroup(sudoScource, key) {
      var object = myStore.deletePropertyDeep(filterGroup, [sudoScource, key, breakPointX]);
      setAttributes({
        filterGroup: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, filterGroupSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleFilterGroup(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, filterGroup);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        filterGroup: object
      });
    }

    function onPickCssLibraryFilterGroupWrap(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        filterGroupWrap[sudoScource] = sudoScourceArgs;
      });
      var paginationX = Object.assign({}, filterGroupWrap);
      setAttributes({
        filterGroupWrap: paginationX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, filterGroupWrapSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleFilterGroupWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, filterGroupWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        filterGroupWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, filterGroupWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleFilterGroupWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(filterGroupWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        filterGroupWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, filterGroupWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleFilterGroupWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, filterGroupWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        filterGroupWrap: object
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);

    function generateBlockCssY() {
      var reponsiveCssGroups = {};
      var reponsiveCss = '';

      for (var selector in blockCssY.items) {
        var attrs = blockCssY.items[selector];

        for (var attr in attrs) {
          var breakpoints = attrs[attr];

          for (var device in breakpoints) {
            var attrValue = breakpoints[device];

            if (reponsiveCssGroups[device] == undefined) {
              reponsiveCssGroups[device] = [];
            }

            if (reponsiveCssGroups[device][selector] == undefined) {
              reponsiveCssGroups[device][selector] = [];
            }

            reponsiveCssGroups[device][selector].push({
              'attr': attr,
              'val': attrValue
            });
          }
        }
      }

      if (reponsiveCssGroups['Mobile'] != undefined) {
        reponsiveCss += '@media only screen and (min-width: 0px) and (max-width: 360px){';

        for (var selector in reponsiveCssGroups['Mobile']) {
          var attrs = reponsiveCssGroups['Mobile'][selector];
          reponsiveCss += selector + '{';

          for (var index in attrs) {
            var attr = attrs[index];
            var attrName = attr.attr;
            var attrValue = attr.val;
            reponsiveCss += attrName + ':' + attrValue + ';';
          }

          reponsiveCss += '}';
        }

        reponsiveCss += '}';
      }

      if (reponsiveCssGroups['Tablet'] != undefined) {
        reponsiveCss += '@media only screen and (min-width: 361px) and (max-width: 780px){';

        for (var selector in reponsiveCssGroups['Tablet']) {
          var attrs = reponsiveCssGroups['Tablet'][selector];
          reponsiveCss += selector + '{';

          for (var index in attrs) {
            var attr = attrs[index];
            var attrName = attr.attr;
            var attrValue = attr.val;
            reponsiveCss += attrName + ':' + attrValue + ';';
          }

          reponsiveCss += '}';
        }

        reponsiveCss += '}';
      }

      if (reponsiveCssGroups['Desktop'] != undefined) {
        reponsiveCss += '@media only screen and (min-width: 781px){';

        for (var selector in reponsiveCssGroups['Desktop']) {
          var attrs = reponsiveCssGroups['Desktop'][selector];
          reponsiveCss += selector + '{';

          for (var index in attrs) {
            var attr = attrs[index];
            var attrName = attr.attr;
            var attrValue = attr.val;
            reponsiveCss += attrName + ':' + attrValue + ';';
          }

          reponsiveCss += '}';
        }

        reponsiveCss += '}';
      }

      var iframe = document.querySelectorAll('[name="editor-canvas"]')[0];

      if (iframe) {
        setTimeout(() => {
          var iframeDocument = iframe.contentDocument;
          var body = iframeDocument.body;
          var divWrap = iframeDocument.getElementById("css-block-" + blockId);

          if (divWrap != undefined) {
            iframeDocument.getElementById("css-block-" + blockId).outerHTML = "";
          }

          var divWrap = '<div id="css-block-' + blockId + '"></div>';
          body.insertAdjacentHTML('beforeend', divWrap);
          var csswrappg = iframeDocument.getElementById('css-block-' + blockId);
          var str = '<style>' + reponsiveCss + customCss + '</style>';
          csswrappg.insertAdjacentHTML('beforeend', str);
        }, 200);
      } else {
        var wpfooter = document.getElementById('wpfooter');
        var divWrap = document.getElementById("css-block-" + blockId);

        if (divWrap != undefined) {
          document.getElementById("css-block-" + blockId).outerHTML = "";
        }

        var divWrap = '<div id="css-block-' + blockId + '"></div>';
        wpfooter.insertAdjacentHTML('beforeend', divWrap);
        var csswrappg = document.getElementById('css-block-' + blockId);
        var str = '<style>' + reponsiveCss + customCss + '</style>';
        csswrappg.insertAdjacentHTML('beforeend', "");
        setTimeout(() => {
          csswrappg.insertAdjacentHTML('beforeend', str);
        }, 100);
      }
    }

    const [posts, setPosts] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [postsQuery, setPostsQuery] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false); // Using the hook.

    const [paginationItems, setPaginationItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    function fetchPosts() {
      setPostsQuery(true);
      setIsBusy(true);
      var arg = queryArgs.items.map(item => {
        return {
          id: item.id,
          val: item.val
        };
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
        path: '/post-grid/v2/get_posts',
        method: 'POST',
        data: {
          queryArgs: arg,
          rawData: layout.rawData
        }
      }).then(res => {
        setPostsQuery(false);
        setPosts(res.posts);
        setPaginationItems(res.pagination);
        setIsBusy(false);
      });
    }

    function generateLayout(x, _i) {
      var savedBlocks = layout.data;
      var content = "<!-- wp:paragraph --><p>paragraph one</p><!-- /wp:paragraph --><!-- wp:paragraph --><p>then two</p><!-- /wp:paragraph -->"; // Parse the serialized content into valid blocks using parse from @wordpress/block-serialization-default-parser

      var blocks = savedBlocks.length > 0 ? savedBlocks : parse(content);
      var sss = blocks.map((block, i) => {
        if (block.blockName !== null) {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, block.innerBlocks.length > 0 ? recursInnerBlocksHtml(block.innerBlocks, i) : block.innerHTML);
        }
      });
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "bg-gray-400 p-3 "
      }, x.post_title, sss);
    }

    function recursInnerBlocksHtml(blocks) {
      let _index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;

      var xx = blocks.map((block, i) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, "2nd Block", block.innerBlocks.length > 0 ? block.innerHTML + recursInnerBlocksHtml(block.innerBlocks, i) : block.innerHTML);
      });
      return xx;
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      fetchPosts();
    }, [layout]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      fetchPosts();
    }, [queryArgs]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      fetchLayouts();
      fetchLayoutData();
    }, [container]);

    function selectLayout(id, postContent) {
      var srcServer = layoutData.source;

      if (srcServer == 'library') {
        var blocks = parse(postContent);
        setAttributes({
          layout: {
            id: null,
            srcServer: srcServer,
            data: blocks,
            rawData: postContent
          }
        });
        var allStyle = {};
        blocks.map((block, i) => {
          var items = block.attrs.blockCssY != undefined ? block.attrs.blockCssY.items : [];

          if (Object.entries(items).length > 0) {
            Object.entries(items).map(data => {
              var handle = data[0];
              var css = data[1];
              allStyle[handle] = css;
            });
          }
        });
        var xxx = { ...blockCssY.items,
          ...allStyle
        };
        setAttributes({
          blockCssY: {
            items: xxx
          }
        });
      } else {
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
          path: '/post-grid/v2/get_post_data',
          method: 'POST',
          data: {
            postId: id
          }
        }).then(res => {
          var postContent = res.post_content.replace(/(^[ \t]*\n)/gm, "");
          var blocks = parse(postContent);
          setAttributes({
            layout: {
              id: id,
              srcServer: srcServer,
              data: blocks,
              rawData: postContent
            }
          });
          var allStyle = {};
          blocks.map((block, i) => {
            var items = block.attrs.blockCssY != undefined ? block.attrs.blockCssY.items : [];

            if (Object.entries(items).length > 0) {
              Object.entries(items).map(data => {
                var handle = data[0];
                var css = data[1];
                allStyle[handle] = css;
              });
            }
          });
          var xxx = { ...blockCssY.items,
            ...allStyle
          };
          setAttributes({
            blockCssY: {
              items: xxx
            }
          });
        });
      } //console.log(wp.data.select('core/block-editor').getBlocks());
      //wp.data.dispatch('core/block-editor').insertBlocks(wp.blocks.parse(post_content));
      //wp.data.dispatch('core/notices').createNotice('success', 'Here is our notice!');
      //var content = "<!-- wp:paragraph --><p>paragraph one</p><!-- /wp:paragraph --><!-- wp:paragraph --><p>then two</p><!-- /wp:paragraph -->";
      //Parse the serialized content into valid blocks using parse from @wordpress/block-serialization-default-parser
      // var gutblock = wp.blocks.rawHandler({
      //   HTML: post_content,
      // });
      //setBlocksX(gutblock)
      // setAttributes({ layout: { id: id, data: blocks, rawData: post_content } })

    }

    const [queryLayouts, setQueryLayouts] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
      keyword: '',
      page: 1,
      category: ''
    });
    var [layoutList, setLayoutList] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
      items: []
    });
    var [layoutData, setLayoutData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
      source: 'library'
    });
    var [layoutLoading, setLayoutLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    var [layoutCats, setLayoutCats] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var keywordLength = queryLayouts.keyword.length;

      if (keywordLength != 0) {
        if (keywordLength >= 4) {
          fetchLayouts();
        } else {}
      } else {
        fetchLayouts();
      }
    }, [layoutData]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var keywordLength = queryLayouts.keyword.length;

      if (keywordLength != 0) {
        if (keywordLength >= 4) {
          fetchLayouts();
        } else {}
      } else {
        fetchLayouts();
      }
    }, [queryLayouts]);

    function fetchLayouts() {
      setLayoutLoading(true);

      if (layoutData.source == 'saved') {
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
          path: '/post-grid/v2/get_posts_layout',
          method: 'POST',
          data: {
            category: queryLayouts.category,
            page: queryLayouts.page,
            keyword: queryLayouts.keyword
          }
        }).then(res => {
          setLayoutList({
            items: res.posts
          });
          setLayoutCats(res.terms);
          setLayoutLoading(false);
        });
      } else {
        fetch("https://getpostgrid.com/wp-json/postlayout/v2/get_post_layouts?category=" + queryLayouts.category + "&page=" + queryLayouts.page + "&keyword=" + queryLayouts.keyword, {
          method: "GET",
          headers: {
            "Content-Type": "application/json;charset=utf-8"
          }
        }).then(response => {
          if (response.ok && response.status < 400) {
            response.json().then(data => {
              setLayoutList({
                items: data.posts
              });
              setLayoutCats(data.terms);
              setLayoutLoading(false);
            });
          }
        }).catch(_error => {//this.saveAsStatus = 'error';
          // handle the error
        });
      }
    }

    function fetchLayoutData() {
      setQueryLayouts({
        keyword: queryLayouts.keyword,
        page: queryLayouts.page,
        category: queryLayouts.category
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
        path: '/post-grid/v2/get_posts_layout',
        method: 'POST',
        data: {
          category: queryLayouts.category,
          source: queryLayouts.source,
          page: queryLayouts.page,
          keyword: queryLayouts.keyword
        }
      }).then(_res => {
        setLayoutData({
          source: layoutData.source
        });
        setQueryLayouts({
          keyword: queryLayouts.keyword,
          page: queryLayouts.page,
          category: queryLayouts.category
        });
      });
    }

    function generateQueryFieldAuthorIn(_xx) {
      var xxts = [12, 24, 32];
      var xxt = [1, 2, 3].concat(xxts);
      return xxt.map(x => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, x);
      });
    }

    function updateQueryPram(newVal, index) {
      var itemData = queryArgs.items[index];
      itemData.val = newVal;
      queryArgs.items[index] = itemData;
      setAttributes({
        queryArgs: {
          items: queryArgs.items
        }
      });
      fetchPosts(); // if (itemData.id == 's' || itemData.id == 'order'  ) {
      //     itemData.val = newVal;
      //     queryArgs.items[index] = itemData;
      //     setAttributes({ queryArgs: { items: queryArgs.items } });
      // }
      // if (itemData.id == 'postType' || itemData.id == 'orderby' || itemData.id == 'postStatus') {
      //     itemData.val = newVal;
      //     queryArgs.items[index] = itemData;
      //     setAttributes({ queryArgs: { items: queryArgs.items } });
      // }
      //queryArgs.items.splice(i, 1);
    }

    function generateQueryArgOptions(item, index) {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: " "
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RemoveQueryPram, {
          title: item.label,
          index: index
        }),
        initialOpen: false
      }, item.id == 'postType' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'postType' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_input_select__WEBPACK_IMPORTED_MODULE_19__["default"], {
        val: item.val,
        options: postTypes,
        multiple: true,
        onChange: newVal => {
          updateQueryPram(newVal, index);
        }
      })), item.id == 'postStatus' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'postStatus' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_input_select__WEBPACK_IMPORTED_MODULE_19__["default"], {
        val: item.val,
        options: [{
          label: 'Publish',
          value: 'publish'
        }, {
          label: 'Pending',
          value: 'pending'
        }, {
          label: 'Draft',
          value: 'draft'
        }, {
          label: 'Auto draft',
          value: 'auto-draft'
        }, {
          label: 'Future',
          value: 'future'
        }, {
          label: 'Private',
          value: 'private'
        }, {
          label: 'Inherit',
          value: 'inherit'
        }, {
          label: 'Trash',
          value: 'trash'
        }, {
          label: 'Any',
          value: 'any'
        }],
        multiple: true,
        onChange: newVal => {
          updateQueryPram(newVal, index);
        }
      })), item.id == 'order' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'order' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val,
        options: [{
          label: 'Ascending',
          value: 'ASC'
        }, {
          label: 'Descending',
          value: 'DESC'
        }],
        onChange: newVal => updateQueryPram(newVal, index)
      })), item.id == 'orderby' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'orderby' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_input_select__WEBPACK_IMPORTED_MODULE_19__["default"], {
        val: item.val,
        options: [{
          label: 'None',
          value: 'none'
        }, {
          label: 'ID',
          value: 'ID'
        }, {
          label: 'Author',
          value: 'author'
        }, {
          label: 'Title',
          value: 'title'
        }, {
          label: 'Name',
          value: 'name'
        }, {
          label: 'Type',
          value: 'type'
        }, {
          label: 'Date',
          value: 'date'
        }, {
          label: 'Modified',
          value: 'modified'
        }, {
          label: 'Parent',
          value: 'parent'
        }, {
          label: 'Random',
          value: 'rand'
        }, {
          label: 'Comment Count',
          value: 'comment_count'
        }, {
          label: 'Relevance',
          value: 'relevance'
        }, {
          label: 'Menu Order',
          value: 'menu_order'
        }, {
          label: 'Meta Value(String)',
          value: 'meta_value'
        }, {
          label: 'Meta Value(Number)',
          value: 'meta_value_num'
        }, {
          label: 'post__in',
          value: 'post__in'
        }, {
          label: 'post_name__in',
          value: 'post_name__in'
        }, {
          label: 'post_parent__in',
          value: 'post_parent__in'
        }],
        multiple: true,
        onChange: newVal => {
          updateQueryPram(newVal, index);
        }
      })), item.id == 'taxQueryRelation' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'taxQueryRelation' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val,
        options: [{
          label: 'OR',
          value: 'OR'
        }, {
          label: 'AND',
          value: 'AND'
        }],
        onChange: newVal => updateQueryPram(newVal, index)
      })), item.id == 'metaQuery' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-blue-600 text-sm",
        onClick: _ev => {
          var itemData = queryArgs.items[index];
          var xx = itemData.val.concat({
            fields: [{
              key: '',
              value: '',
              type: '',
              compare: ''
            }],
            relation: 'OR'
          });
          queryArgs.items[index].val = xx;
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      }, "Add"), item.val.map((x, j) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
          title: "Meta Field",
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-red-600 text-sm",
          onClick: _ev => {
            var itemData = queryArgs.items[index];
            var xx = itemData.val.splice(j, 1);
            queryArgs.items[index].val = itemData.val;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Remove"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, "Relation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
          style: {
            margin: 0
          },
          label: "",
          value: x.relation,
          options: [{
            label: 'OR',
            value: 'OR'
          }, {
            label: 'AND',
            value: 'AND'
          }],
          onChange: newVal => {
            var itemData = queryArgs.items[index]; //itemData.val.relation = newVal;

            itemData.val[j].relation = newVal; //var term = itemData.val[j].fields[k]
            //term.taxonomy = newVal;

            queryArgs.items[index].val = itemData.val;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), x.fields.map((y, k) => {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "border-b border-solid border-gray-300 py-3"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
            label: "Custom field key",
            value: y.key,
            placeholder: "meta_key",
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].fields[k];
              term.key = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
            label: "Meta Value ",
            value: y.value,
            placeholder: "25",
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].fields[k];
              term.value = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
            style: {
              margin: 0
            },
            label: "Custom field type",
            value: y.type,
            options: [{
              label: 'NUMERIC',
              value: 'NUMERIC'
            }, {
              label: 'BINARY',
              value: 'BINARY'
            }, {
              label: 'CHAR',
              value: 'CHAR'
            }, {
              label: 'DATE',
              value: 'DATE'
            }, {
              label: 'DATETIME',
              value: 'DATETIME'
            }, {
              label: 'DECIMAL',
              value: 'DECIMAL'
            }, {
              label: 'SIGNED',
              value: 'SIGNED'
            }, {
              label: 'TIME',
              value: 'TIME'
            }, {
              label: 'UNSIGNED',
              value: 'UNSIGNED'
            }],
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].fields[k];
              term.type = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
            style: {
              margin: 0
            },
            label: "compare ",
            value: y.compare,
            options: [{
              label: 'IN',
              value: 'IN'
            }, {
              label: 'NOT IN',
              value: 'NOT IN'
            }, {
              label: 'EXISTS',
              value: 'EXISTS'
            }, {
              label: 'NOT EXISTS',
              value: 'NOT EXISTS'
            }],
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].fields[k];
              term.compare = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          })));
        }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "cursor-pointer text-center px-3 py-1 text-white bg-blue-600 text-sm",
          onClick: _ev => {
            var itemData = queryArgs.items[index];
            var xx = itemData.val[j].fields.concat({
              key: '',
              value: '',
              type: '',
              compare: ''
            });
            queryArgs.items[index].val[j].fields = xx;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Add")));
      }))), item.id == 'dateQuery' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
        className: "my-3"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Add Arguments"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        options: [{
          "value": "",
          "label": "Select..."
        }, {
          "value": "year",
          "label": "Year"
        }, {
          "value": "month",
          "label": "Month"
        }, {
          "value": "week",
          "label": "Week"
        }, {
          "value": "day",
          "label": "Day"
        }, {
          "value": "hour",
          "label": "Hour"
        }, {
          "value": "minute",
          "label": "Minute"
        }, {
          "value": "second",
          "label": "Second"
        }, {
          "value": "after",
          "label": "After"
        }, {
          "value": "before",
          "label": "Before"
        }, {
          "value": "inclusive",
          "label": "Inclusive"
        }, {
          "value": "compare",
          "label": "Compare"
        }, {
          "value": "column",
          "label": "Column"
        }, {
          "value": "relation",
          "label": "Relation"
        }],
        onChange: newVal => {
          var itemData = queryArgs.items[index];

          if (newVal == 'year') {
            var xx = itemData.val.concat({
              id: 'year',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'month') {
            var xx = itemData.val.concat({
              id: 'month',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'week') {
            var xx = itemData.val.concat({
              id: 'week',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'day') {
            var xx = itemData.val.concat({
              id: 'day',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'hour') {
            var xx = itemData.val.concat({
              id: 'hour',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'minute') {
            var xx = itemData.val.concat({
              id: 'minute',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'second') {
            var xx = itemData.val.concat({
              id: 'second',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'inclusive') {
            var xx = itemData.val.concat({
              id: 'inclusive',
              value: true
            });
          }

          if (newVal == 'compare') {
            var xx = itemData.val.concat({
              id: 'compare',
              value: ''
            });
          }

          if (newVal == 'column') {
            var xx = itemData.val.concat({
              id: 'column',
              value: ''
            });
          }

          if (newVal == 'relation') {
            var xx = itemData.val.concat({
              id: 'relation',
              value: ''
            });
          }

          if (newVal == 'before') {
            var xx = itemData.val.concat({
              id: 'before',
              value: '',
              year: '',
              month: '',
              day: ''
            });
          }

          if (newVal == 'after') {
            var xx = itemData.val.concat({
              id: 'after',
              value: '',
              year: '',
              month: '',
              day: ''
            });
          }

          queryArgs.items[index].val = xx;
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      })), item.val.map((x, j) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
          title: x.id,
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          className: "cursor-pointer px-3 py-1 text-white bg-red-600 text-sm my-2 inline-block",
          onClick: _ev => {
            queryArgs.items[index].val.splice(j, 1);
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Delete"), (x.id == 'after' || x.id == 'before') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Year"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
          placeholder: "",
          onChange: newVal => {
            //clearTimeout(debounce);
            // debounce = setTimeout(() => {
            queryArgs.items[index].val[j].year = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            }); //}, 1000);
          }
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Month"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
          placeholder: "",
          onChange: newVal => {
            // clearTimeout(debounce);
            //debounce = setTimeout(() => {
            queryArgs.items[index].val[j].month = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            }); //}, 1000);
          }
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Day"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
          placeholder: "",
          onChange: newVal => {
            clearTimeout(debounce);
            debounce = setTimeout(() => {
              queryArgs.items[index].val[j].day = newVal;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }, 1000);
          }
        }))), x.id == 'inclusive' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
          style: {
            margin: 0
          },
          options: [{
            label: 'True',
            value: true
          }, {
            label: 'False',
            value: false
          }],
          onChange: newVal => {
            queryArgs.items[index].val[j].value = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), x.id == 'compare' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
          style: {
            margin: 0
          },
          options: [{
            label: '=',
            value: '='
          }, {
            label: '!=',
            value: '!='
          }, {
            label: '>',
            value: '>'
          }, {
            label: '>=',
            value: '>='
          }, {
            label: '<',
            value: '<'
          }, {
            label: '<=',
            value: '<='
          }, {
            label: 'IN',
            value: 'IN'
          }, {
            label: 'NOT IN',
            value: 'NOT IN'
          }, {
            label: 'EXISTS',
            value: 'EXISTS'
          }, {
            label: 'NOT EXISTS',
            value: 'NOT EXISTS'
          }, {
            label: 'BETWEEN',
            value: 'BETWEEN'
          }, {
            label: 'NOT BETWEEN',
            value: 'NOT BETWEEN'
          }],
          onChange: newVal => {
            queryArgs.items[index].val[j].value = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), x.id == 'column' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
          placeholder: "",
          onChange: newVal => {
            clearTimeout(debounce);
            debounce = setTimeout(() => {
              queryArgs.items[index].val[j].value = newVal;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }, 1000);
          }
        })), x.id == 'relation' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
          style: {
            margin: 0
          },
          options: [{
            label: 'OR',
            value: 'OR'
          }, {
            label: 'AND',
            value: 'AND'
          }],
          onChange: newVal => {
            queryArgs.items[index].val[j].value = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), (x.id == 'year' || x.id == 'month' || x.id == 'week' || x.id == 'day' || x.id == 'hour' || x.id == 'minute' || x.id == 'second') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
          label: "Value",
          placeholder: "",
          onChange: newVal => {
            //clearTimeout(debounce);
            //debounce = setTimeout(() => {
            queryArgs.items[index].val[j].value = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            }); //}, 1000);
          }
        }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
          style: {
            margin: 0
          },
          label: "compare ",
          options: [{
            label: '=',
            value: '='
          }, {
            label: '!=',
            value: '!='
          }, {
            label: '>',
            value: '>'
          }, {
            label: '>=',
            value: '>='
          }, {
            label: '<',
            value: '<'
          }, {
            label: '<=',
            value: '<='
          }, {
            label: 'IN',
            value: 'IN'
          }, {
            label: 'NOT IN',
            value: 'NOT IN'
          }, {
            label: 'EXISTS',
            value: 'EXISTS'
          }, {
            label: 'NOT EXISTS',
            value: 'NOT EXISTS'
          }, {
            label: 'BETWEEN',
            value: 'BETWEEN'
          }, {
            label: 'NOT BETWEEN',
            value: 'NOT BETWEEN'
          }],
          onChange: newVal => {
            queryArgs.items[index].val[j].compare = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }))));
      })), item.id == 'taxQuery' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-blue-600 text-sm",
        onClick: _ev => {
          var itemData = queryArgs.items[index];
          var xx = itemData.val.concat({
            terms: [{
              taxonomy: '',
              field: '',
              terms: [],
              operator: ''
            }],
            relation: 'OR'
          });
          queryArgs.items[index].val = xx;
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      }, "Add"), item.val.map((x, j) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
          title: "Term",
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-red-600 text-sm",
          onClick: _ev => {
            var itemData = queryArgs.items[index];
            var xx = itemData.val.splice(j, 1);
            queryArgs.items[index].val = itemData.val;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Remove"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, "Terms Relation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
          style: {
            margin: 0
          },
          label: "",
          value: x.relation,
          options: [{
            label: 'OR',
            value: 'OR'
          }, {
            label: 'AND',
            value: 'AND'
          }],
          onChange: newVal => {
            var itemData = queryArgs.items[index]; //itemData.val.relation = newVal;

            itemData.val[j].relation = newVal; //var term = itemData.val[j].terms[k]
            //term.taxonomy = newVal;

            queryArgs.items[index].val = itemData.val;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), x.terms.map((y, k) => {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "border-b border-solid border-gray-300 py-3"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
            label: "Taxonomy",
            value: y.taxonomy,
            placeholder: "Taxonomy",
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].terms[k];
              term.taxonomy = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
            label: "Terms",
            value: y.terms.join(','),
            placeholder: "Comma separated",
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].terms[k];
              term.terms = newVal.split(',');
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
            style: {
              margin: 0
            },
            label: "Fields",
            value: y.field,
            options: [{
              label: 'Choose...',
              value: ''
            }, {
              label: 'Term ID',
              value: 'term_id'
            }, {
              label: 'Name',
              value: 'name'
            }, {
              label: 'Slug',
              value: 'slug'
            }, {
              label: 'Term taxonomy id',
              value: 'term_taxonomy_id'
            }],
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].terms[k];
              term.field = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
            style: {
              margin: 0
            },
            label: "Operator",
            value: y.operator,
            options: [{
              label: 'Choose...',
              value: ''
            }, {
              label: 'IN',
              value: 'IN'
            }, {
              label: 'NOT IN',
              value: 'NOT IN'
            }, {
              label: 'AND',
              value: 'AND'
            }, {
              label: 'EXISTS',
              value: 'EXISTS'
            }, {
              label: 'NOT EXISTS',
              value: 'NOT EXISTS'
            }],
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].terms[k];
              term.operator = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "cursor-pointer block text-center my-2 px-3 py-1 text-white bg-red-600 text-sm",
            onClick: _ev => {
              var itemData = queryArgs.items[index];
              var terms = itemData.val[j].terms;
              var xx = itemData.val[j].terms.splice(k, 1);
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }, "Remove"));
        }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "cursor-pointer text-center px-3 py-1 text-white bg-blue-600 text-sm",
          onClick: _ev => {
            var itemData = queryArgs.items[index];
            var xx = itemData.val[j].terms.concat({
              taxonomy: '',
              field: '',
              terms: [],
              operator: ''
            });
            queryArgs.items[index].val[j].terms = xx;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Add")));
      }))), (item.id == 'metaKey' || item.id == 's' || item.id == 'metaValue' || item.id == 'metaValueNum' || item.id == 'metaCompare' || item.id == 'year' || item.id == 'monthnum' || item.id == 'w' || item.id == 'day' || item.id == 'hour' || item.id == 'minute' || item.id == 'second' || item.id == 'm' || item.id == 'author' || item.id == 'authorName' || item.id == 'tag' || item.id == 'tagId' || item.id == 'cat' || item.id == 'categoryName' || item.id == 'p' || item.id == 'name' || item.id == 'pageId' || item.id == 'pagename' || item.id == 'postParent' || item.id == 'postsPerPage' || item.id == 'paged' || item.id == 'offset' || item.id == 'postsPerArchivePage' || item.id == 'perm') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: item.val,
        onChange: newVal => {
          clearTimeout(debounce);
          debounce = setTimeout(() => {
            updateQueryPram(newVal, index);
          }, 1000);
        }
      })), (item.id == 'postParent' || item.id == 'postPassword') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: item.val,
        onChange: newVal => updateQueryPram(newVal, index)
      })), (item.id == 'postNameIn' || item.id == 'authorIn' || item.id == 'authorNotIn' || item.id == 'postNotIn' || item.id == 'postIn' || item.id == 'postParentNotIn' || item.id == 'tagNotIn' || item.id == 'tagAnd' || item.id == 'tagIn' || item.id == 'postParentIn' || item.id == 'tagSlugIn' || item.id == 'tagSlugAnd' || item.id == 'categoryNotIn' || item.id == 'categoryIn' || item.id == 'categoryAnd') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: item.val,
        placeholder: "Comma separated",
        onChange: newVal => updateQueryPram(newVal, index)
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'postNameIndd' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer text-center px-3 py-1 text-white bg-blue-600 text-sm",
        onClick: _ev => {
          var itemData = queryArgs.items[index];
          var val = itemData.val.concat({
            slug: ''
          });
          itemData.val = val;
          queryArgs.items[index] = itemData;
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      }, "Add")), item.id == 'commentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: item.val.value,
        placeholder: "Comment Count, Ex: 25",
        onChange: newVal => updateQueryPram({
          value: newVal,
          compare: item.val.compare
        }, index)
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val.compare,
        options: [{
          label: '=',
          value: '='
        }, {
          label: '!=',
          value: '!='
        }, {
          label: '>',
          value: '>'
        }, {
          label: '>=',
          value: '>='
        }, {
          label: '<',
          value: '<'
        }, {
          label: '<=',
          value: '<='
        }],
        onChange: newVal => updateQueryPram({
          value: item.val.value,
          compare: newVal
        }, index)
      })), item.id == 'postMimeType' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_input_select__WEBPACK_IMPORTED_MODULE_19__["default"], {
        val: item.val,
        options: [{
          label: 'image/jpeg',
          value: 'jpg|jpeg|jpe'
        }, {
          label: 'image/gif',
          value: 'gif'
        }, {
          label: 'image/png',
          value: 'png'
        }, {
          label: 'image/bmp',
          value: 'bmp'
        }],
        multiple: true,
        onChange: newVal => {
          updateQueryPram(newVal, index);
        }
      })), (item.id == 'cacheResults' || item.id == 'nopaging' || item.id == 'hasPassword' || item.id == 'updatePostMetaCache' || item.id == 'updatePostTermCache') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val,
        options: [{
          label: 'True',
          value: true
        }, {
          label: 'False',
          value: false
        }],
        onChange: newVal => updateQueryPram(newVal, index)
      })), item.id == 'ignoreStickyPosts' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val,
        options: [{
          label: 'True',
          value: true
        }, {
          label: 'False',
          value: false
        }],
        onChange: newVal => updateQueryPram(newVal, index)
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, item.description)));
    }

    function addQueryPramX(_option, index) {
      var attrExist = false;
      var data = _queryprams__WEBPACK_IMPORTED_MODULE_24__["default"][index];
      var multiple = data.multiple;
      var isExist = queryArgs.items.map(item => {
        if (item.id == index) {
          return true;
        }
      });
      var items = queryArgs.items.concat([data]);
      setAttributes({
        queryArgs: {
          items: items
        }
      });
    }

    var RemoveQueryPram = function (_ref3) {
      let {
        title,
        index
      } = _ref3;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          queryArgs.items.splice(index, 1);
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_32__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "mx-2"
      }, title));
    };

    function deleteGridColumn(i) {
      grid.styles.gridTemplateColumns[breakPointX].splice(i, 1);
      var styles = { ...grid.styles,
        gridTemplateColumns: grid.styles.gridTemplateColumns
      };
      setAttributes({
        grid: { ...grid,
          styles: styles
        }
      });
    }

    function deleteGridRow(i) {
      grid.styles.gridTemplateRows[breakPointX].splice(i, 1);
      var styles = { ...grid.styles,
        gridTemplateRows: grid.styles.gridTemplateRows
      };
      setAttributes({
        grid: { ...grid,
          styles: styles
        }
      });
    }

    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.useBlockProps)({
      className: ` ${blockId} pg-post-grid-filterable`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Layouts",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-white cursor-pointer"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: layoutData.source == 'library' ? 'bg-blue-500 w-1/2 inline-block px-3 py-2 text-[14px] font-bold' : 'bg-blue-300 text-[14px] font-bold inline-block px-3 py-2 w-1/2',
      onClick: _ev => {
        setLayoutData({
          source: 'library'
        });
      }
    }, "Library"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: layoutData.source == 'saved' ? 'bg-blue-500 w-1/2 inline-block px-3 py-2 text-[14px] font-bold' : 'bg-blue-300 inline-block px-3 py-2 w-1/2 text-[14px] font-bold',
      onClick: _ev => {
        setLayoutData({
          source: 'saved'
        });
      }
    }, "Saved")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: queryLayouts.keyword,
      type: "text",
      placeholder: "Search Layouts...",
      onChange: newVal => {
        clearTimeout(debounce);
        debounce = setTimeout(() => {
          setQueryLayouts({
            keyword: newVal,
            page: queryLayouts.page,
            category: queryLayouts.category
          });
        }, 1000); //fetchLayouts();
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      className: "w-full",
      style: {
        margin: 0
      },
      label: "",
      value: queryLayouts.category,
      options: layoutCats,
      onChange: newVal => {
        setQueryLayouts({
          keyword: queryLayouts.keyword,
          page: queryLayouts.page,
          category: newVal
        }); //fetchLayouts();
      }
    })), layoutData.source == 'saved' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "flex gap-2\t"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "w-full rounded-sm  py-2 bg-blue-500 text-[14px] font-bold text-white cursor-pointer my-3 text-center "
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      className: " ",
      target: "_blank",
      href: clientData.siteAdminurl + 'edit.php?post_type=post_grid_template'
    }, "All Layouts")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "w-full rounded-sm  py-2 bg-blue-500 text-[14px] font-bold text-white cursor-pointer my-3 text-center "
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      className: "",
      target: "_blank",
      href: clientData.siteAdminurl + 'post-new.php?post_type=post_grid_template'
    }, "Create Layout"))), layoutLoading == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Spinner, null)), layoutLoading == false && layoutList.items.length > 0 && layoutList.items.map(x => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-4 border bg-gray-200 "
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "relative cursor-pointer",
        onClick: _ev => {
          selectLayout(x.post_id, x.post_content);
        }
      }, layout.id == x.post_id && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "absolute bg-amber-500 text-white px-2 py-1 top-0 right-0"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        class: "dashicons dashicons-saved"
      }), " Selected"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
        className: "w-full",
        src: x.thumb_url
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "text-[14px] p-1 bg-gray-500 text-white bg-opacity-80 text-bold  text-center"
      }, x.post_title)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "py-3 flex justify-items-stretch"
      }, layoutData.source != 'library' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "mx-1 inline-block bg-blue-500 hover:bg-blue-400 px-2 py-1 text-white rounded-sm cursor-pointer"
      }, " ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
        target: "_blank",
        href: clientData.siteAdminurl + 'post.php?post=' + x.post_id + '&action=edit'
      }, "Edit"), " "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "mx-1 inline-block bg-blue-500 hover:bg-blue-400 px-2 py-1 text-white rounded-sm cursor-pointer"
      }, "#", x.post_id), layoutData.source == 'library' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "mx-1 relative inline-block bg-blue-500 hover:bg-blue-400 px-2 py-1 text-white rounded-sm cursor-pointer",
        onClick: ev => {
          if (isProFeature == false) {
            if (!importLayoutOpen.isOpen) {
              setlayoutImporting(true);
              importLayout(x);
            }
          }

          setimportLayoutOpen({
            id: x.post_id,
            isOpen: !importLayoutOpen.isOpen
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        class: "dashicons dashicons-download"
      }), " Import"), importLayoutOpen.id == x.post_id && importLayoutOpen.isOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Popover, {
        position: "bottom left p-2 "
      }, isProFeature == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "w-48 bg-amber-100 px-3 py-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
        className: ""
      }, " ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "underline"
      }, "Importing Layouts"), " Only avilable in Premium"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
        className: ""
      }, "After import the layout you customize and make your own.")), isProFeature == false && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "w-48 bg-sky-300 px-3 py-2"
      }, layoutImporting && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Spinner, null), " Importing"), !layoutImporting && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
        className: ""
      }, "Layout imported and saved under ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
        target: "_blank",
        className: "font-bold underline ",
        href: postGridData.siteAdminurl + 'edit.php?post_type=post_grid_template'
      }, "Saved Templates")))))));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "w-full rounded-sm  py-2 bg-blue-500 text-[14px] font-bold text-white cursor-pointer my-3 text-center",
      onClick: _ev => {
        var page = queryLayouts.page + 1;
        setQueryLayouts({
          keyword: queryLayouts.keyword,
          page: page,
          category: queryLayouts.category
        });
      }
    }, layoutLoading.loading == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "text-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Spinner, null)), "Load More")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Query Post",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Add Query Parameters"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: queryPramsX,
      buttonTitle: "Choose",
      onChange: addQueryPramX,
      values: ""
    })), queryArgs.items.map((item, index) => {
      return generateQueryArgOptions(item, index);
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Query Presets"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: _query_presets__WEBPACK_IMPORTED_MODULE_22__["default"],
      buttonTitle: "Choose",
      onChange: addQueryPreset,
      values: ''
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Grid Settings",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      onClick: _ev => {
        var gridTemplateColumns = grid.styles.gridTemplateColumns;

        if (Object.keys(grid.styles.gridTemplateColumns).length == 0) {
          gridTemplateColumns[breakPointX] = [{
            val: 1,
            unit: 'fr'
          }];
        } else {
          var sds = gridTemplateColumns[breakPointX] != undefined ? gridTemplateColumns[breakPointX].concat({
            val: 1,
            unit: 'fr'
          }) : [{
            val: 1,
            unit: 'fr'
          }];
          gridTemplateColumns[breakPointX] = sds;
        }

        var styles = { ...grid.styles,
          gridTemplateColumns: gridTemplateColumns
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      },
      className: "my-3 !bg-blue-600 !text-white"
    }, "Add Column"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_21__["default"][breakPointX].icon,
      value: breakPointX
    })), grid.styles.gridTemplateColumns[breakPointX] != undefined && grid.styles.gridTemplateColumns[breakPointX].map((item, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: item.val,
        type: "number",
        onChange: newVal => {
          var newValuesObj = {};

          if (Object.keys(grid.styles.gridTemplateColumns).length == 0) {
            newValuesObj[breakPointX] = {
              val: newVal,
              unit: 'em'
            };
          } else {
            var gridTemplateColumns = grid.styles.gridTemplateColumns;
            var sds = gridTemplateColumns[breakPointX].map((x, i) => {
              return index == i ? {
                val: newVal,
                unit: x.unit
              } : x;
            });
            newValuesObj[breakPointX] = sds;
          }

          var styles = { ...grid.styles,
            gridTemplateColumns: newValuesObj
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        className: "mb-0",
        value: item.unit,
        options: [{
          label: 'fr',
          value: 'fr'
        }, {
          label: 'px',
          value: 'px'
        }, {
          label: '%',
          value: '%'
        }, {
          label: 'em',
          value: 'em'
        }],
        onChange: newVal => {
          var newValuesObj = {};

          if (Object.keys(grid.styles.gridTemplateColumns).length == 0) {
            newValuesObj[breakPointX] = {
              val: newVal,
              unit: 'em'
            };
          } else {
            var gridTemplateColumns = grid.styles.gridTemplateColumns;
            var sds = gridTemplateColumns[breakPointX].map((x, i) => {
              return index == i ? {
                val: x.val,
                unit: newVal
              } : x;
            });
            newValuesObj[breakPointX] = sds;
          }

          var styles = { ...grid.styles,
            gridTemplateColumns: newValuesObj
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
        icon: "no-alt",
        onClick: _ev => {
          deleteGridColumn(index);
        }
      }));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      onClick: _ev => {
        var gridTemplateRows = grid.styles.gridTemplateRows;

        if (Object.keys(grid.styles.gridTemplateRows).length == 0) {
          gridTemplateRows[breakPointX] = [{
            val: 1,
            unit: 'fr'
          }];
        } else {
          var sds = gridTemplateRows[breakPointX] != undefined ? gridTemplateRows[breakPointX].concat({
            val: 1,
            unit: 'fr'
          }) : [{
            val: 1,
            unit: 'fr'
          }];
          gridTemplateRows[breakPointX] = sds;
        }

        var styles = { ...grid.styles,
          gridTemplateRows: gridTemplateRows
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      },
      className: "my-3 !bg-blue-600 !text-white"
    }, "Add Row"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_21__["default"][breakPointX].icon,
      value: breakPointX
    })), grid.styles.gridTemplateRows[breakPointX] != undefined && grid.styles.gridTemplateRows[breakPointX].map((item, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: item.val,
        type: "number",
        onChange: newVal => {
          var newValuesObj = {};

          if (Object.keys(grid.styles.gridTemplateRows).length == 0) {
            newValuesObj[breakPointX] = {
              val: newVal,
              unit: 'em'
            };
          } else {
            var gridTemplateRows = grid.styles.gridTemplateRows;
            var sds = gridTemplateRows[breakPointX].map((x, i) => {
              return index == i ? {
                val: newVal,
                unit: x.unit
              } : x;
            });
            newValuesObj[breakPointX] = sds;
          }

          var styles = { ...grid.styles,
            gridTemplateRows: newValuesObj
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        className: "mb-0",
        value: item.unit,
        options: [{
          label: 'fr',
          value: 'fr'
        }, {
          label: 'px',
          value: 'px'
        }, {
          label: '%',
          value: '%'
        }, {
          label: 'em',
          value: 'em'
        }],
        onChange: newVal => {
          var newValuesObj = {};

          if (Object.keys(grid.styles.gridTemplateRows).length == 0) {
            newValuesObj[breakPointX] = {
              val: newVal,
              unit: 'em'
            };
          } else {
            var gridTemplateRows = grid.styles.gridTemplateRows;
            var sds = gridTemplateRows[breakPointX].map((x, i) => {
              return index == i ? {
                val: x.val,
                unit: newVal
              } : x;
            });
            newValuesObj[breakPointX] = sds;
          }

          var styles = { ...grid.styles,
            gridTemplateRows: newValuesObj
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
        icon: "no-alt",
        onClick: _ev => {
          deleteGridRow(index);
        }
      }));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Column Gap"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_21__["default"][breakPointX].icon,
      value: breakPointX
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: grid.styles.colGap[breakPointX] != undefined ? grid.styles.colGap[breakPointX].val : 1,
      type: "number",
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(grid.styles.colGap).length == 0) {
          newValuesObj[breakPointX] = {
            val: newVal,
            unit: 'em'
          };
        } else {
          newValuesObj = grid.styles.colGap;
          var unit = newValuesObj[breakPointX] != undefined ? newValuesObj[breakPointX].unit : 'em';
          newValuesObj[breakPointX] = {
            val: newVal,
            unit: unit
          };
        }

        var styles = { ...grid.styles,
          colGap: newValuesObj
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      className: "mb-0",
      value: grid.styles.colGap[breakPointX] != undefined ? grid.styles.colGap[breakPointX].unit : 'em',
      options: [{
        label: 'fr',
        value: 'fr'
      }, {
        label: 'px',
        value: 'px'
      }, {
        label: '%',
        value: '%'
      }, {
        label: 'em',
        value: 'em'
      }],
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(grid.styles.colGap).length == 0) {
          newValuesObj[breakPointX] = {
            val: 1,
            unit: newVal
          };
        } else {
          var val = newValuesObj[breakPointX] != undefined ? newValuesObj[breakPointX].val : 1;
          newValuesObj = grid.styles.colGap;
          newValuesObj[breakPointX] = {
            val: val,
            unit: newVal
          };
        }

        var styles = { ...grid.styles,
          colGap: newValuesObj
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Row Gap"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_21__["default"][breakPointX].icon,
      value: breakPointX
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: grid.styles.rowGap[breakPointX] != undefined ? grid.styles.rowGap[breakPointX].val : 1,
      type: "number",
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(grid.styles.rowGap).length == 0) {
          newValuesObj[breakPointX] = {
            val: newVal,
            unit: 'em'
          };
        } else {
          var unit = newValuesObj[breakPointX] != undefined ? newValuesObj[breakPointX].unit : 'em';
          newValuesObj = grid.styles.rowGap;
          newValuesObj[breakPointX] = {
            val: newVal,
            unit: unit
          };
        }

        var styles = { ...grid.styles,
          rowGap: newValuesObj
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      className: "mb-0",
      value: grid.styles.rowGap[breakPointX] != undefined ? grid.styles.rowGap[breakPointX].unit : 'em',
      options: [{
        label: 'fr',
        value: 'fr'
      }, {
        label: 'px',
        value: 'px'
      }, {
        label: '%',
        value: '%'
      }, {
        label: 'em',
        value: 'em'
      }],
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(grid.styles.rowGap).length == 0) {
          newValuesObj[breakPointX] = {
            val: 1,
            unit: newVal
          };
        } else {
          var val = newValuesObj[breakPointX] != undefined ? newValuesObj[breakPointX].val : 'em';
          newValuesObj = grid.styles.rowGap;
          newValuesObj[breakPointX] = {
            val: val,
            unit: newVal
          };
        }

        var styles = { ...grid.styles,
          rowGap: newValuesObj
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "N'th Item CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: "my-3",
      variant: "secondary",
      onClick: _newVal => {
        if (isProFeature) {
          if (grid.options.itemCss[breakPointX] != undefined) {
            var ssd = grid.options.itemCss[breakPointX].concat({
              'grid-column-start': '',
              'grid-column-end': '',
              'grid-row-start': '',
              'grid-row-end': ''
            });
          } else {
            grid.options.itemCss[breakPointX] = [];
            var ssd = grid.options.itemCss[breakPointX].concat({
              'grid-column-start': '',
              'grid-column-end': '',
              'grid-row-start': '',
              'grid-row-end': ''
            });
          }

          var newValuesObj = {};

          if (Object.keys(grid.options.itemCss).length == 0) {
            newValuesObj[breakPointX] = ssd;
          } else {
            newValuesObj = grid.options.itemCss;
            newValuesObj[breakPointX] = ssd;
          }

          var options = { ...grid.options,
            itemCss: newValuesObj
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      }
    }, "Add", isProFeature && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "bg-amber-400 mx-2 rounded-sm px-3  text-white hover:text-white"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      target: "_blank",
      href: 'https://pickplugins.com/post-grid/?utm_source=nthItemCSS&utm_term=blockPostgrid&utm_campaign=pluginPostGrid&utm_medium=nthItemCSS'
    }, "Pro")))), grid.options.itemCss[breakPointX] != undefined && grid.options.itemCss[breakPointX].map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        title: i + 1 + '\'th Item',
        initialOpen: false
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
        icon: "no-alt",
        variant: "secondary",
        onClick: _ev => {
          grid.options.itemCss[breakPointX].splice(i, 1);
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      }, "Delete"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "grid-column-start"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: x['grid-column-start'],
        type: "number",
        onChange: newVal => {
          grid.options.itemCss[breakPointX][i]['grid-column-start'] = newVal;
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "grid-column-end"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: x['grid-column-end'],
        type: "number",
        onChange: newVal => {
          grid.options.itemCss[breakPointX][i]['grid-column-end'] = newVal;
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "grid-row-start"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: x['grid-row-start'],
        type: "number",
        onChange: newVal => {
          grid.options.itemCss[breakPointX][i]['grid-row-start'] = newVal;
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "grid-row-end"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: x['grid-row-end'],
        type: "number",
        onChange: newVal => {
          grid.options.itemCss[breakPointX][i]['grid-row-end'] = newVal;
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      })));
    }), _grid_layouts__WEBPACK_IMPORTED_MODULE_23__["default"].map((x, _i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer relative hover:bg-blue-200 my-3",
        onClick: _ev => {
          if (x.isPro) {
            if (isProFeature == false) {
              setAttributes({
                grid: x.data
              });
            }
          } else {
            setAttributes({
              grid: x.data
            });
          }
        }
      }, x.isPro && isProFeature == false && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "bg-amber-400 absolute top-2 left-0 rounded-sm px-3 mx-2  text-white hover:text-white"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
        target: "_blank",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")), x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "w-full grid-layout-prewview"
      }, x.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "text-[16px] p-2 bg-blue-600 text-white bg-opacity-90 text-bold  w-full text-center"
      }, x.title));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Container",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: container,
      onChange: onChangeStyleContainer,
      onAdd: onAddStyleContainer,
      onRemove: onRemoveStyleContainer
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: container,
      onChange: onPickCssLibraryContainer
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Items Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: itemsWrap,
      onChange: onChangeStyleItemsWrap,
      onAdd: onAddStyleItemsWrap,
      onRemove: onRemoveStyleItemsWrap
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: itemsWrap,
      onChange: onPickCssLibraryItemsWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Loop Item",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: itemWrap,
      onChange: onChangeStyleItemWrap,
      onAdd: onAddStyleItemWrap,
      onRemove: onRemoveStyleItemWrap
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: itemWrap,
      onChange: onPickCssLibraryItemWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Filterable",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      variant: "secondary",
      className: "mb-2",
      onClick: ev => {
        var filters = filterable.options.filters.concat({
          groupTitle: '',
          type: '',
          logic: '',
          showPostCount: '',
          items: []
        });
        var options = { ...filterable.options,
          filters: filters
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    }, "Add Filter Group"), filterable.options.filters.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        title: x.groupTitle ? x.groupTitle : 'Filter Group ' + i,
        initialOpen: false
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        onClick: ev => {
          filterable.options.filters.splice(i, 1);
          var options = { ...filterable.options,
            filters: filterable.options.filters
          };
          setAttributes({
            filterable: { ...filterable,
              options: options
            }
          });
        },
        className: "cursor-pointer px-3 py-1 inline-block text-white bg-red-600 text-sm mb-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "dashicon dashicons dashicons-no-alt"
      }), " Delete Group"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "Group Title"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: x.groupTitle,
        onChange: newVal => {
          filterable.options.filters[i].groupTitle = newVal;
          var options = { ...filterable.options,
            filters: filterable.options.filters
          };
          setAttributes({
            filterable: { ...filterable,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "Group Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        value: x.type,
        options: [{
          value: 'inline',
          label: 'Inline'
        }, {
          value: 'dropdown',
          label: 'Dropdown'
        }, {
          value: 'radio',
          label: 'Radio'
        }, {
          value: 'checkbox',
          label: 'Checkbox'
        }],
        onChange: newVal => {
          filterable.options.filters[i].type = newVal;
          var options = { ...filterable.options,
            filters: filterable.options.filters
          };
          setAttributes({
            filterable: { ...filterable,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "Data Logic"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        value: x.logic,
        options: [{
          value: 'or',
          label: 'OR'
        }, {
          value: 'and',
          label: 'AND'
        }],
        onChange: newVal => {
          filterable.options.filters[i].logic = newVal;
          var options = { ...filterable.options,
            filters: filterable.options.filters
          };
          setAttributes({
            filterable: { ...filterable,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "Show Post Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
        value: x.showPostCount,
        options: [{
          value: 'no',
          label: 'No'
        }, {
          value: 'yes',
          label: 'Yes'
        }],
        onChange: newVal => {
          filterable.options.filters[i].showPostCount = newVal;
          var options = { ...filterable.options,
            filters: filterable.options.filters
          };
          setAttributes({
            filterable: { ...filterable,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: "",
        className: "my-3 font-bold"
      }, "Search Terms"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "To add custom filter please use following format and hit Enter"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, "Filter Name|filter-slug|15"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        className: "my-3",
        placeholder: "Search Categories or terms",
        value: "",
        onKeyPress: ev => {
          if (ev.key === 'Enter') {
            var filterParts = ev.target.value.split('|');
            var ss = filterable.options.filters[i].items.concat({
              id: 0,
              slug: filterParts[1],
              title: filterParts[0],
              count: filterParts[2]
            });
            filterable.options.filters[i].items = ss;
            var options = { ...filterable.options,
              filters: filterable.options.filters
            };
            setAttributes({
              filterable: { ...filterable,
                options: options
              }
            });
          }
        },
        onChange: newVal => {
          fetchPostTypeTerms(newVal);
        }
      }), x.items.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-1"
      }, "No terms added."), x.items.map((y, j) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "py-2 my-1 border-b border-gray-400 flex justify-between"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, y.title), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          onClick: ev => {
            var options = { ...activeFilter.options,
              slug: activeFilter.options.slug == y.slug ? "" : y.slug
            };
            setAttributes({
              activeFilter: { ...activeFilter,
                options: options
              }
            });
          },
          className: [activeFilter.options.slug == y.slug ? "bg-blue-600 cursor-pointer p-1   text-white  text-sm" : "bg-gray-400 cursor-pointer p-1   text-white  text-sm"]
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          class: "dashicons dashicons-yes-alt"
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          onClick: ev => {
            filterable.options.filters[i].items.splice(j, 1);
            var options = { ...filterable.options,
              filters: filterable.options.filters
            };
            setAttributes({
              filterable: { ...filterable,
                options: options
              }
            });
          },
          className: "cursor-pointer p-1   text-white bg-red-600 text-sm"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          className: "dashicon dashicons dashicons-no-alt"
        }))));
      }), filterablTerms.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "bg-gray-200 p-2 mt-2"
      }, filterablTerms.map(x => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          title: "Click Add terms",
          className: "border-b border-gray-400 my-2 pb-1 cursor-pointer",
          onClick: ev => {
            if (x.slug) {
              var ss = filterable.options.filters[i].items.concat({
                id: x.term_id,
                slug: x.slug,
                title: x.name,
                count: x.count
              });
              filterable.options.filters[i].items = ss;
              var options = { ...filterable.options,
                filters: filterable.options.filters
              };
              setAttributes({
                filterable: { ...filterable,
                  options: options
                }
              });
            }
          }
        }, x.name, " (", x.count, ")");
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Enable Multifilter "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: filterable.options.multifilter,
      options: [{
        label: 'True',
        value: true
      }, {
        label: 'False',
        value: false
      }],
      onChange: newVal => {
        var options = { ...filterable.options,
          multifilter: newVal
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Enable Filter Toggle "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: filterable.options.filterToggle,
      options: [{
        label: 'Yes',
        value: 'yes'
      }, {
        label: 'no',
        value: 'no'
      }],
      onChange: newVal => {
        var options = { ...filterable.options,
          filterToggle: newVal
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    })), filterable.options.multifilter && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Logic Within Group "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: filterable.options.logicWithinGroup,
      options: [{
        label: 'OR',
        value: 'or'
      }, {
        label: 'AND',
        value: 'and'
      }],
      onChange: newVal => {
        var options = { ...filterable.options,
          logicWithinGroup: newVal
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Logic Between Groups "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: filterable.options.logicBetweenGroups,
      options: [{
        label: 'OR',
        value: 'or'
      }, {
        label: 'AND',
        value: 'and'
      }],
      onChange: newVal => {
        var options = { ...filterable.options,
          logicBetweenGroups: newVal
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Show Sort Filter "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: filterable.options.showSort,
      options: [{
        label: 'No',
        value: 'no'
      }, {
        label: 'Yes',
        value: 'yes'
      }],
      onChange: newVal => {
        var options = { ...filterable.options,
          showSort: newVal
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Show Random Filter "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: filterable.options.showRandom,
      options: [{
        label: 'No',
        value: 'no'
      }, {
        label: 'Yes',
        value: 'yes'
      }],
      onChange: newVal => {
        var options = { ...filterable.options,
          showRandom: newVal
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Show Clear Filter "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: filterable.options.showClear,
      options: [{
        label: 'No',
        value: 'no'
      }, {
        label: 'Yes',
        value: 'yes'
      }],
      onChange: newVal => {
        var options = { ...filterable.options,
          showClear: newVal
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Show All Filter "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "",
      value: filterable.options.showAll,
      options: [{
        label: 'No',
        value: 'no'
      }, {
        label: 'Yes',
        value: 'yes'
      }],
      onChange: newVal => {
        var options = { ...filterable.options,
          showAll: newVal
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Items Per Page"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      type: "number",
      value: filterable.options.perPage != undefined ? filterable.options.perPage : 6,
      onChange: newVal => {
        var options = { ...filterable.options,
          perPage: newVal
        };
        setAttributes({
          filterable: { ...filterable,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Filter",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: filterable,
      onChange: onChangeStyleFilterable,
      onAdd: onAddStyleFilterable,
      onRemove: onRemoveStyleFilterable
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: filterable,
      onChange: onPickCssLibraryFilterable
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Active Filter",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: activeFilter,
      onChange: onChangeStyleActiveFilter,
      onAdd: onAddStyleActiveFilter,
      onRemove: onRemoveStyleActiveFilter
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: activeFilter,
      onChange: onPickCssLibraryActiveFilter
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Filter Group",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: filterGroup,
      onChange: onChangeStyleFilterGroup,
      onAdd: onAddStyleFilterGroup,
      onRemove: onRemoveStyleFilterGroup
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: filterGroup,
      onChange: onPickCssLibraryFilterGroup
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Filter Group Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: filterGroupWrap,
      onChange: onChangeStyleFilterGroupWrap,
      onAdd: onAddStyleFilterGroupWrap,
      onRemove: onRemoveStyleFilterGroupWrap
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: filterGroup,
      onChange: onPickCssLibraryFilterGroupWrap
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Pagination",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Pagination Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: paginationTypes,
      buttonTitle: "Choose",
      onChange: (arg, index) => {
        var options = { ...pagination.options,
          type: arg.value
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      },
      values: ''
    })), pagination.options.type.length != 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-500 text-white px-3 py-2 my-5"
    }, paginationTypes[pagination.options.type] != undefined ? paginationTypes[pagination.options.type].label : ''), (pagination.options.type == 'normal' || pagination.options.type == 'ajax') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Max Number of Pagination"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: pagination.options.maxPageNum,
      onChange: newVal => {
        var options = { ...pagination.options,
          maxPageNum: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    })), (pagination.options.type == 'normal' || pagination.options.type == 'ajax' || pagination.options.type == 'next_previous') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Previous Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: pagination.options.prevText,
      onChange: newVal => {
        var options = { ...pagination.options,
          prevText: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Next Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: pagination.options.nextText,
      onChange: newVal => {
        var options = { ...pagination.options,
          nextText: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    })), (pagination.options.type == 'loadmore' || pagination.options.type == 'infinite') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Load More Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: pagination.options.loadMoreText,
      onChange: newVal => {
        var options = { ...pagination.options,
          loadMoreText: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "No Posts Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: pagination.options.noMorePosts,
      onChange: newVal => {
        var options = { ...pagination.options,
          noMorePosts: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Loading Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: pagination.options.loadingText,
      onChange: newVal => {
        var options = { ...pagination.options,
          loadingText: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Loading Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_12__["default"], {
      library: pagination.options.loadingIcon.library,
      srcType: pagination.options.loadingIcon.srcType,
      iconSrc: pagination.options.loadingIcon.iconSrc,
      onChange: arg => {
        var options = { ...pagination.options,
          loadingIcon: {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          }
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Pagination Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: pagination,
      onChange: onChangeStylePagination,
      onAdd: onAddStylePagination,
      onRemove: onRemoveStylePagination
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: pagination,
      onChange: onPickCssLibraryPagination
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Pagination Items",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: paginationItem,
      onChange: onChangeStylePaginationItem,
      onAdd: onAddStylePaginationItem,
      onRemove: onRemoveStylePaginationItem
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: paginationItem,
      onChange: onPickCssLibraryPaginationItem
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Pagination Item Active",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_26__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_33__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_34__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
      obj: paginationItemActive,
      onChange: onChangeStylePaginationItemActive,
      onAdd: onAddStylePaginationItemActive,
      onRemove: onRemoveStylePaginationItemActive
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_27__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_28__["default"], {
      blockId: blockId,
      obj: paginationItemActive,
      onChange: onPickCssLibraryPaginationItemActive
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Lazy load",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Enable Lazyload "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      value: lazyLoad.options.enable,
      options: [{
        label: 'Yes',
        value: 'yes'
      }, {
        label: 'No',
        value: 'no'
      }],
      onChange: newVal => {
        var options = { ...lazyLoad.options,
          enable: newVal
        };
        setAttributes({
          lazyLoad: { ...lazyLoad,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Lazyload Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_12__["default"], {
      library: lazyLoad.options.icon != undefined ? lazyLoad.options.icon.library : 'fontAwesome',
      srcType: lazyLoad.options.icon != undefined ? lazyLoad.options.icon.srcType : 'class',
      iconSrc: lazyLoad.options.icon != undefined ? lazyLoad.options.icon.iconSrc : '',
      onChange: arg => {
        var options = { ...lazyLoad.options,
          icon: {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          }
        };
        setAttributes({
          lazyLoad: { ...lazyLoad,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Lazy Load Image"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.MediaUploadCheck, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.MediaUpload, {
      onSelect: media => {
        // media.id
        var options = { ...lazyLoad.options,
          srcUrl: media.url,
          srcId: media.id
        };
        setAttributes({
          lazyLoad: { ...lazyLoad,
            options: options
          }
        });
      },
      onClose: () => {},
      allowedTypes: ALLOWED_MEDIA_TYPES,
      value: lazyLoad.options.srcId,
      render: _ref4 => {
        let {
          open
        } = _ref4;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
          onClick: open
        }, "Media Library");
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
      className: "my-4",
      src: lazyLoad.options.srcUrl,
      alt: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      className: "hidden",
      title: "Search",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "Enable",
      value: search.enable,
      options: [{
        label: 'No',
        value: 'no'
      }, {
        label: 'Yes',
        value: 'yes'
      }],
      onChange: newVal => setAttributes({
        search: {
          enable: newVal,
          type: search.type,
          placeholder: search.placeholder,
          icon: search.icon,
          busyIcon: search.busyIcon
        }
      })
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.SelectControl, {
      label: "Search action",
      value: search.type,
      options: [{
        label: 'Ajax - On change form data',
        value: 'ajax'
      }, {
        label: 'On form submit - GET method',
        value: 'form_submit'
      }],
      onChange: newVal => setAttributes({
        search: {
          enable: search.type,
          type: newVal,
          placeholder: search.placeholder,
          icon: search.icon,
          busyIcon: search.busyIcon
        }
      })
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      label: "Placeholder text",
      value: search.placeholder,
      onChange: newVal => setAttributes({
        search: {
          enable: search.type,
          type: search.type,
          placeholder: newVal,
          icon: search.icon,
          busyIcon: search.busyIcon
        }
      })
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      label: "Search icon",
      value: search.icon,
      onChange: newVal => setAttributes({
        search: {
          enable: search.type,
          type: search.type,
          placeholder: search.placeholder,
          icon: newVal,
          busyIcon: search.busyIcon
        }
      })
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      label: "Loading icon",
      value: search.busyIcon,
      onChange: newVal => setAttributes({
        search: {
          enable: search.type,
          type: search.type,
          placeholder: search.placeholder,
          icon: search.icon,
          busyIcon: newVal
        }
      })
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockPostGrid',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      className: "",
      title: "Tutorials",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tutorials__WEBPACK_IMPORTED_MODULE_20__["default"], {
      links: _tutorials_links__WEBPACK_IMPORTED_MODULE_25__["default"]
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, grid.styles.gridTemplateColumns[breakPointX] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-center my-5"
    }, "Please set the column number"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "grid grid-cols-4 gap-4"
    }, columnPresets.map(x => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer text-center bg-slate-400 hover:bg-slate-500",
        onClick: ev => {
          var gridTemplateColumns = grid.styles.gridTemplateColumns;
          var colGap = grid.styles.colGap;
          var rowGap = grid.styles.rowGap;
          gridTemplateColumns[breakPointX] = x.args;
          colGap[breakPointX] = {
            val: 1,
            unit: 'em'
          };
          rowGap[breakPointX] = {
            val: 1,
            unit: 'em'
          };
          var styles = { ...grid.styles,
            gridTemplateColumns: gridTemplateColumns,
            colGap: colGap,
            rowGap: rowGap
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "p-3 py-4 inline-block"
      }, x.icon));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, lazyLoad.options.enable == 'yes' && isBusy && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: lazyLoad.options.class
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "filterable-group-wrap"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "filterable-group"
    }, filterable.options.showAll == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "pg-filter mixitup-control-active cusror-pointer px-4 py-2 m-2 inline-block bg-gray-200 filter-34534",
      "data-filter": "all"
    }, "All"))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "filterable-group  "
    }), filterable.options.filters.length > 0 && filterable.options.filters.map(x => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "filterable-group ",
        "data-logic": x.logic
      }, x.groupTitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "filterable-group-title "
      }, x.groupTitle), x.items.map(y => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: [activeFilter.options.slug == y.slug ? 'mixitup-control-active pg-filter cursor-pointer' : 'pg-filter cursor-pointer'],
          "terms-id": y.id,
          "data-filter": '.' + y.slug
        }, y.title, " ", x.showPostCount == 'yes' ? '(' + y.count + ')' : '');
      }));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "filterable-group"
    }, filterable.options.showSort == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "pg-filter mixitup-control-active cusror-pointer px-4 py-2 m-2 inline-block bg-gray-200 filter-34534",
      "data-filter": ""
    }, "ASC"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "pg-filter  cusror-pointer px-4 py-2 m-2 inline-block bg-gray-200 filter-34534",
      "data-filter": ""
    }, "DESC")), filterable.options.showRandom == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "pg-filter  cusror-pointer px-4 py-2 m-2 inline-block bg-gray-200 filter-34534",
      "data-filter": ""
    }, "Random")), filterable.options.showClear == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "pg-filter  cusror-pointer px-4 py-2 m-2 inline-block bg-gray-200 filter-34534",
      "data-filter": ""
    }, "Clear"), "                  "))), search.enable == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: search.options.class
    }, "search form"), postsQuery == false && posts == null && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: noPostsWrap.options.class
    }, "No Post found"), postsQuery && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: spinnerWrap.options.class
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Spinner, null)), isBusy && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Spinner, null)), postsQuery == false && posts != null && posts.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: itemsWrap.options.class
    }, posts.map((x, _i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: itemWrap.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, x.html));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: pagination.options.class
    }, pagination.options.type == 'filterable' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, paginationItems != undefined && paginationItems.map(item => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, {
        className: "inline-block"
      }, item.replace("page-numbers", paginationItem.options.class));
    })), pagination.options.type == 'ajax' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, paginationItems != undefined && paginationItems.map(item => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, {
        className: "inline-block"
      }, item.replace("page-numbers", paginationItem.options.class));
    })), pagination.options.type == 'next_previous' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "flex justify-between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "pagination-prev page-numbers"
    }, pagination.options.prevText), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "pagination-next page-numbers"
    }, pagination.options.nextText)), pagination.options.type == 'loadmore' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "page-numbers"
    }, pagination.options.loadMoreText)), pagination.options.type == 'infinite' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null)))));
  },
  save: function (_props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-grid-filterable/query-presets.js":
/*!**********************************************************!*\
  !*** ./src/blocks/post-grid-filterable/query-presets.js ***!
  \**********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
const queryPresets = [{
  label: 'Latest Posts by Publish Date',
  key: 'preset1',
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["date"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Oldest Posts by Publish Date',
  key: 'preset2',
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "ASC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["date"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Latest Posts by Modified Date',
  key: 'preset3',
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["modified"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Oldest Posts by Modified Date',
  key: 'preset4',
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "ASC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["modified"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Alphabetical Order A-Z',
  key: 'preset5',
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "ASC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["name"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Alphabetical Order Z-A',
  key: 'preset6',
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["name"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Most Commented Posts',
  key: 'preset7',
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["name"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Random 10 Posts',
  key: 'preset8',
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["rand"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (queryPresets);

/***/ }),

/***/ "./src/blocks/post-grid-filterable/queryprams.js":
/*!*******************************************************!*\
  !*** ./src/blocks/post-grid-filterable/queryprams.js ***!
  \*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
const queryPrams = [{
  val: ['post'],
  multiple: false,
  id: 'postType',
  label: 'Post Types',
  description: "Select Post Types to Query"
}, {
  val: [],
  multiple: false,
  id: 'taxQuery',
  label: 'Tax Query',
  description: "Taxonomies query arguments",
  isPro: true
}, {
  val: 'OR',
  multiple: false,
  id: 'taxQueryRelation',
  label: 'Tax Query Relation',
  description: "Taxonomies query relation"
}, {
  val: [],
  multiple: false,
  id: 'metaQuery',
  label: 'Meta Query',
  description: "Meta field query",
  isPro: true
}, {
  val: '',
  multiple: false,
  id: 's',
  label: 'Keyword',
  description: "Search keyword, ex: hello"
}, {
  val: [],
  multiple: false,
  id: 'postStatus',
  label: 'Post status',
  description: "Query post by post status"
}, {
  val: '',
  multiple: false,
  id: 'order',
  label: 'Order',
  description: "Post query order"
}, {
  val: [],
  multiple: false,
  id: 'orderby',
  label: 'Orderby',
  description: "Post query orderby"
}, {
  val: '',
  multiple: false,
  id: 'metaKey',
  label: 'Meta fields key',
  description: "Post query by meta fields key"
}, // Date Parameters
{
  val: [],
  multiple: false,
  id: 'dateQuery',
  label: 'Date Query',
  description: "Post query by date",
  isPro: true
}, {
  val: '',
  multiple: false,
  id: 'year',
  label: 'Year',
  description: "Post query by year"
}, {
  val: '',
  multiple: false,
  id: 'monthnum',
  label: 'Month',
  description: "Post query by month"
}, {
  val: '',
  multiple: false,
  id: 'w',
  label: 'Week',
  description: "Post query by week"
}, {
  val: '',
  multiple: false,
  id: 'day',
  label: 'Day',
  description: "Post query by day"
}, {
  val: '',
  multiple: false,
  id: 'hour',
  label: 'Hour',
  description: "Post query by hour"
}, {
  val: '',
  multiple: false,
  id: 'minute',
  label: 'Miniute',
  description: "Post query by miniute"
}, {
  val: '',
  multiple: false,
  id: 'second',
  label: 'Second',
  description: "Post query by second"
}, {
  val: '',
  multiple: false,
  id: 'm',
  label: 'Month',
  description: "Post query by month"
}, // Author Parameters
{
  val: '',
  multiple: false,
  id: 'author',
  label: 'Author',
  description: "Post query by Author ID"
}, {
  val: '',
  multiple: false,
  id: 'authorName',
  label: 'Author Name',
  description: "Post query by Author Name"
}, {
  val: [],
  multiple: false,
  id: 'authorIn',
  label: 'Author In',
  description: "Post query by Author IDs",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'authorNotIn',
  label: 'Author Not In',
  description: "Post query by exluded Author IDs",
  isPro: true
}, // Category Parameters
{
  val: '',
  multiple: false,
  id: 'cat',
  label: 'Category ID',
  description: "Post query by Category ID"
}, {
  val: '',
  multiple: false,
  id: 'categoryName',
  label: 'Category Name',
  description: "Post query by Category Name"
}, {
  val: [],
  multiple: false,
  id: 'categoryAnd',
  label: 'Category And',
  description: "Post query by Category IDs",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'categoryIn',
  label: 'Category In',
  description: "Post query by Category IDs",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'categoryNotIn',
  label: 'Category Not In',
  description: "Post query by excluded Category IDs",
  isPro: true
}, // Tag Parameters
{
  val: '',
  multiple: false,
  id: 'tag',
  label: 'Tags',
  description: "Post query by Tag slug"
}, {
  val: '',
  multiple: false,
  id: 'tagId',
  label: 'Tag Id',
  description: "Post query by Tag ID"
}, {
  val: [],
  multiple: false,
  id: 'tagAnd',
  label: 'Tag And',
  description: "Post query by Tag Ids",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'tagIn',
  label: 'Tag In',
  description: "Post query by Tag ids",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'tagNotIn',
  label: 'Tag Not In',
  description: "Post query by excluded Tag ids"
}, {
  val: [],
  multiple: false,
  id: 'tagSlugAnd',
  label: 'Tag Slug And',
  description: "Post query by Tags slug",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'tagSlugIn',
  label: 'Tag Slug In',
  description: "Post query by excluded Tags slug",
  isPro: true
}, {
  val: '',
  multiple: false,
  id: 'p',
  label: 'Post id',
  description: "Post query by single post id"
}, {
  val: '',
  multiple: false,
  id: 'name',
  label: 'Name',
  description: "Post query by post slug"
}, {
  val: '',
  multiple: false,
  id: 'pageId',
  label: 'Page Id',
  description: "Post query by single page id"
}, {
  val: '',
  multiple: false,
  id: 'pagename',
  label: 'Page name',
  description: "Post query by page slug"
}, {
  val: '',
  multiple: false,
  id: 'postParent',
  label: 'Post Parent',
  description: "Post query by post parent id",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'postParentIn',
  label: 'Post Parent In',
  description: "Post query by post parent ids",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'postParentNotIn',
  label: 'Post Parent Not In',
  description: "Post query by excluded post parent ids"
}, {
  val: [],
  multiple: false,
  id: 'postIn',
  label: 'Post In',
  description: "Post query by single post id",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'postNotIn',
  label: 'Post Not In',
  description: "Post query by excluded post ids",
  isPro: true
}, {
  val: [{
    slug: ''
  }],
  multiple: false,
  id: 'postNameIn',
  label: 'Post Name In',
  description: "Post query by post slugs",
  isPro: true
}, {
  val: '',
  multiple: false,
  id: 'hasPassword',
  label: 'Has Password',
  description: "Post query for posts with passwords"
}, {
  val: '',
  multiple: false,
  id: 'postPassword',
  label: 'Post Password',
  description: "Post query for posts with particular passwords",
  isPro: true
}, {
  val: {
    compare: '='
  },
  multiple: false,
  id: 'commentCount',
  label: 'Comment Count',
  description: "Post query by comment count"
}, {
  val: '',
  multiple: false,
  id: 'nopaging',
  label: 'No Paging',
  description: "Enable show all posts or use pagination"
}, {
  val: '',
  multiple: false,
  id: 'postsPerPage',
  label: 'Posts Per Page',
  description: "Number of post to show per page"
}, {
  val: '',
  multiple: false,
  id: 'paged',
  label: 'Paged',
  description: "Pagination start with"
}, {
  val: '',
  multiple: false,
  id: 'offset',
  label: 'Offset',
  description: "Number of post to displace or pass over"
}, {
  val: '',
  multiple: false,
  id: 'postsPerArchivePage',
  label: 'Posts Per Archive Page',
  description: ""
}, {
  val: '',
  multiple: false,
  id: 'ignoreStickyPosts',
  label: 'Ignore Sticky Posts',
  description: "Ignore post from post query",
  isPro: true
}, {
  val: '',
  multiple: false,
  id: 'metaKey',
  label: 'Meta Key',
  description: "Post query by custom field key"
}, {
  val: '',
  multiple: false,
  id: 'metaValue',
  label: 'Meta Value',
  description: "Post query by custom field value"
}, {
  val: '',
  multiple: false,
  id: 'metaValueNum',
  label: 'Meta Value Num',
  description: "Post query by custom field value for number types"
}, {
  val: '',
  multiple: false,
  id: 'metaCompare',
  label: 'Meta Compare',
  description: "Meta query compare"
}, {
  val: [],
  multiple: false,
  id: 'metaQuery',
  label: 'Meta Query',
  description: "Advance meta fields query"
}, {
  val: 'readable',
  multiple: false,
  id: 'perm',
  label: 'Perm',
  description: "User permission parameter"
}, {
  val: [],
  multiple: false,
  id: 'postMimeType',
  label: 'Post Mime Type',
  description: "Post query by allwed post mime types"
}, {
  val: false,
  multiple: false,
  id: 'cacheResults',
  label: 'Cache Results',
  description: "Enable Post information cache"
}, {
  val: false,
  multiple: false,
  id: 'updatePostMetaCache',
  label: 'Update Post Meta Cache',
  description: "Enable Post meta information cache"
}, {
  val: false,
  multiple: false,
  id: 'updatePostTermCache',
  label: 'Update Post Term Cache',
  description: "Enable Post term information cache"
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (queryPrams);

/***/ }),

/***/ "./src/blocks/post-grid-filterable/tutorials-links.js":
/*!************************************************************!*\
  !*** ./src/blocks/post-grid-filterable/tutorials-links.js ***!
  \************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
var tutorialsLinks = [];
fetch("https://getpostgrid.com/wp-json/wp/v2/docs", {
  method: "GET",
  headers: {
    "Content-Type": "application/json;charset=utf-8"
  }
}).then(response => {
  if (response.ok && response.status < 400) {
    response.json().then(data => {
      data.map(x => {
        tutorialsLinks.push({
          label: x.title.rendered,
          url: x.link,
          isVideo: false
        });
      });
    });
  }
}).catch(_error => {//this.saveAsStatus = 'error';
  // handle the error
}); // const tutorialsLinks = [
//     { label: 'How to add columns?', url: '', isVideo: false, },
//     { label: 'How to disable pagination?', url: '', isVideo: false, },
//     { label: 'How to customize pagination style?', url: '', isVideo: false, },
//     { label: 'How to display normal pagination?', url: '', isVideo: false, },
//     { label: 'How to display next-previous pagination?', url: '', isVideo: false, },
//     { label: 'How to display ajax pagination?', url: '', isVideo: false, },
//     { label: 'How to enable infinte loading?', url: '', isVideo: false, },
//     { label: 'How to query post by post status?', url: '', isVideo: false, },
//     { label: 'How to add rows?', url: '', isVideo: false, },
//     { label: 'How to enable load more?', url: '', isVideo: false, },
//     { label: 'How to enable lazy loading?', url: '', isVideo: true, },
//     { label: 'How to custoize post grid container', url: '', isVideo: false, },
//     { label: 'How to customize post grid loop wrapper?', url: '', isVideo: false, },
//     { label: 'How to query post by post types?', url: '', isVideo: false, },
//     { label: 'How to query posts by custom post types?', url: '', isVideo: false, },
//     { label: 'How to query post by categories?', url: '', isVideo: false, },
//     { label: 'How to query post by tags?', url: '', isVideo: false, },
//     { label: 'How to query post by custom taxonomies & terms?', url: '', isVideo: false, },
//     { label: 'How to query post by custom meta fields?', url: '', isVideo: false, },
//     { label: 'How to query post by search parameter?', url: '', isVideo: false, },
//     { label: 'How to query post by order & orderby?', url: '', isVideo: false, },
//     { label: 'How to query post by date?', url: '', isVideo: false, },
//     { label: 'How to query post by author?', url: '', isVideo: false, },
//     { label: 'How to query post by post ids?', url: '', isVideo: false, },
//     { label: 'How to query post by post parents?', url: '', isVideo: false, },
//     { label: 'How to query post by post passwords?', url: '', isVideo: false, },
//     { label: 'How to customize layouts?', url: '', isVideo: false, },
//     { label: 'How to customize grid layout?', url: '', isVideo: false, },
//     { label: 'How to create complex grid layout?', url: '', isVideo: false, },
// ];

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (tutorialsLinks);

/***/ }),

/***/ "./src/blocks/post-grid/grid-layouts.js":
/*!**********************************************!*\
  !*** ./src/blocks/post-grid/grid-layouts.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__);


const gridLayoutsBasic = [{
  thumb: '',
  title: '3 Col, 0 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "0",
          "unit": "em"
        },
        "Mobile": {
          "val": "0",
          "unit": "em"
        },
        "Tablet": {
          "val": "0",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "0",
          "unit": "em"
        },
        "Mobile": {
          "val": "0",
          "unit": "em"
        },
        "Tablet": {
          "val": "0",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "11.5",
    y: "14.5",
    width: "73.3231",
    height: "91",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.0611 73.9162C25.0611 72.5868 26.1387 71.5092 27.468 71.5092H69.1885C70.5178 71.5092 71.5954 72.5868 71.5954 73.9162V73.9162C71.5954 75.2455 70.5178 76.3231 69.1885 76.3231H27.468C26.1387 76.3231 25.0611 75.2455 25.0611 73.9162V73.9162Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.0611 81.6184C25.0611 80.2891 26.1387 79.2115 27.468 79.2115H69.1885C70.5178 79.2115 71.5954 80.2891 71.5954 81.6184V81.6184C71.5954 82.9477 70.5178 84.0254 69.1885 84.0254H27.468C26.1387 84.0254 25.0611 82.9477 25.0611 81.6184V81.6184Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.0611 89.3206C25.0611 87.9913 26.1387 86.9137 27.468 86.9137H55.7663C57.0956 86.9137 58.1732 87.9913 58.1732 89.3206V89.3206C58.1732 90.65 57.0956 91.7276 55.7663 91.7276H27.468C26.1387 91.7276 25.0611 90.65 25.0611 89.3206V89.3206Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M20.2402 21.2314V65.1079H76.083V21.2314H20.2402ZM24.2289 25.2202H72.0942V52.9546L61.5613 42.3595L60.1279 40.926L51.0908 49.9631L39.6231 38.3707L38.1896 36.9372L24.2289 50.8979V25.2202ZM64.1167 29.209C61.9119 29.209 60.1279 30.993 60.1279 33.1978C60.1279 35.4025 61.9119 37.1865 64.1167 37.1865C66.3214 37.1865 68.1054 35.4025 68.1054 33.1978C68.1054 30.993 66.3214 29.209 64.1167 29.209ZM38.1896 42.6088L56.5131 61.1192H24.2289V56.5695L38.1896 42.6088ZM60.1279 46.5975L72.0942 58.5638V61.1192H62.1846L53.8954 52.7677L60.1279 46.5975Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "85.4359",
    y: "14.5",
    width: "73.3231",
    height: "91",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M98.9971 73.9162C98.9971 72.5868 100.075 71.5092 101.404 71.5092H143.124C144.454 71.5092 145.531 72.5868 145.531 73.9162V73.9162C145.531 75.2455 144.454 76.3231 143.124 76.3231H101.404C100.075 76.3231 98.9971 75.2455 98.9971 73.9162V73.9162Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M98.9971 81.6184C98.9971 80.2891 100.075 79.2115 101.404 79.2115H143.124C144.454 79.2115 145.531 80.2891 145.531 81.6184V81.6184C145.531 82.9477 144.454 84.0254 143.124 84.0254H101.404C100.075 84.0254 98.9971 82.9477 98.9971 81.6184V81.6184Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M98.9971 89.3206C98.9971 87.9913 100.075 86.9137 101.404 86.9137H129.702C131.032 86.9137 132.109 87.9913 132.109 89.3206V89.3206C132.109 90.65 131.032 91.7276 129.702 91.7276H101.404C100.075 91.7276 98.9971 90.65 98.9971 89.3206V89.3206Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M94.1761 21.2314V65.1079H150.019V21.2314H94.1761ZM98.1649 25.2202H146.03V52.9546L135.497 42.3595L134.064 40.926L125.027 49.9631L113.559 38.3707L112.126 36.9372L98.1649 50.8979V25.2202ZM138.053 29.209C135.848 29.209 134.064 30.993 134.064 33.1978C134.064 35.4025 135.848 37.1865 138.053 37.1865C140.257 37.1865 142.041 35.4025 142.041 33.1978C142.041 30.993 140.257 29.209 138.053 29.209ZM112.126 42.6088L130.449 61.1192H98.1649V56.5695L112.126 42.6088ZM134.064 46.5975L146.03 58.5638V61.1192H136.121L127.831 52.7677L134.064 46.5975Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "159.372",
    y: "14.5",
    width: "73.3231",
    height: "91",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M172.933 73.9162C172.933 72.5868 174.01 71.5092 175.34 71.5092H217.06C218.39 71.5092 219.467 72.5868 219.467 73.9162V73.9162C219.467 75.2455 218.39 76.3231 217.06 76.3231H175.34C174.01 76.3231 172.933 75.2455 172.933 73.9162V73.9162Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M172.933 81.6184C172.933 80.2891 174.01 79.2115 175.34 79.2115H217.06C218.39 79.2115 219.467 80.2891 219.467 81.6184V81.6184C219.467 82.9477 218.39 84.0254 217.06 84.0254H175.34C174.01 84.0254 172.933 82.9477 172.933 81.6184V81.6184Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M172.933 89.3206C172.933 87.9913 174.01 86.9137 175.34 86.9137H203.638C204.967 86.9137 206.045 87.9913 206.045 89.3206V89.3206C206.045 90.65 204.967 91.7276 203.638 91.7276H175.34C174.01 91.7276 172.933 90.65 172.933 89.3206V89.3206Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M168.112 21.2314V65.1079H223.955V21.2314H168.112ZM172.101 25.2202H219.966V52.9546L209.433 42.3595L208 40.926L198.963 49.9631L187.495 38.3707L186.061 36.9372L172.101 50.8979V25.2202ZM211.988 29.209C209.784 29.209 208 30.993 208 33.1978C208 35.4025 209.784 37.1865 211.988 37.1865C214.193 37.1865 215.977 35.4025 215.977 33.1978C215.977 30.993 214.193 29.209 211.988 29.209ZM186.061 42.6088L204.385 61.1192H172.101V56.5695L186.061 42.6088ZM208 46.5975L219.966 58.5638V61.1192H210.056L201.767 52.7677L208 46.5975Z",
    fill: "black"
  }))
}, {
  title: '3 Col 1 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "1",
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "1",
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "12.5",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 73.3111C25.4498 72.0396 26.4805 71.0089 27.7521 71.0089H67.6586C68.9301 71.0089 69.9608 72.0396 69.9608 73.3111V73.3111C69.9608 74.5827 68.9301 75.6134 67.6585 75.6134H27.7521C26.4805 75.6134 25.4498 74.5827 25.4498 73.3111V73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 80.6785C25.4498 79.407 26.4805 78.3762 27.7521 78.3762H67.6586C68.9301 78.3762 69.9608 79.407 69.9608 80.6785V80.6785C69.9608 81.95 68.9301 82.9808 67.6585 82.9808H27.7521C26.4805 82.9808 25.4498 81.95 25.4498 80.6785V80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 88.0458C25.4498 86.7743 26.4805 85.7435 27.7521 85.7435H54.8199C56.0915 85.7435 57.1222 86.7743 57.1222 88.0458V88.0458C57.1222 89.3174 56.0915 90.3481 54.8199 90.3481H27.7521C26.4805 90.3481 25.4498 89.3174 25.4498 88.0458V88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M20.8384 22.917V64.8858H74.2533V22.917H20.8384ZM24.6538 26.7324H70.4379V53.2609L60.363 43.1264L58.9919 41.7553L50.3478 50.3994L39.3786 39.3111L38.0075 37.9399L24.6538 51.2937V26.7324ZM62.8072 30.5477C60.6984 30.5477 58.9919 32.2542 58.9919 34.3631C58.9919 36.4719 60.6984 38.1784 62.8072 38.1784C64.9161 38.1784 66.6226 36.4719 66.6226 34.3631C66.6226 32.2542 64.9161 30.5477 62.8072 30.5477ZM38.0075 43.3649L55.5342 61.0705H24.6538V56.7186L38.0075 43.3649ZM58.9919 47.1802L70.4379 58.6263V61.0705H60.9592L53.0304 53.0821L58.9919 47.1802Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "87.4345",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100.384 73.3111C100.384 72.0396 101.415 71.0089 102.687 71.0089H142.593C143.865 71.0089 144.895 72.0396 144.895 73.3111V73.3111C144.895 74.5827 143.865 75.6134 142.593 75.6134H102.687C101.415 75.6134 100.384 74.5827 100.384 73.3111V73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100.384 80.6785C100.384 79.407 101.415 78.3762 102.687 78.3762H142.593C143.865 78.3762 144.895 79.407 144.895 80.6785V80.6785C144.895 81.95 143.865 82.9808 142.593 82.9808H102.687C101.415 82.9808 100.384 81.95 100.384 80.6785V80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100.384 88.0458C100.384 86.7743 101.415 85.7435 102.687 85.7435H129.754C131.026 85.7435 132.057 86.7743 132.057 88.0458V88.0458C132.057 89.3174 131.026 90.3481 129.754 90.3481H102.687C101.415 90.3481 100.384 89.3174 100.384 88.0458V88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M95.7729 22.917V64.8858H149.188V22.917H95.7729ZM99.5883 26.7324H145.372V53.2609L135.298 43.1264L133.926 41.7553L125.282 50.3994L114.313 39.3111L112.942 37.9399L99.5883 51.2937V26.7324ZM137.742 30.5477C135.633 30.5477 133.926 32.2542 133.926 34.3631C133.926 36.4719 135.633 38.1784 137.742 38.1784C139.851 38.1784 141.557 36.4719 141.557 34.3631C141.557 32.2542 139.851 30.5477 137.742 30.5477ZM112.942 43.3649L130.469 61.0705H99.5883V56.7186L112.942 43.3649ZM133.926 47.1802L145.372 58.6263V61.0705H135.894L127.965 53.0821L133.926 47.1802Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "162.369",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 73.3111C175.319 72.0396 176.35 71.0089 177.621 71.0089H217.528C218.799 71.0089 219.83 72.0396 219.83 73.3111V73.3111C219.83 74.5827 218.799 75.6134 217.528 75.6134H177.621C176.35 75.6134 175.319 74.5827 175.319 73.3111V73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 80.6785C175.319 79.407 176.35 78.3762 177.621 78.3762H217.528C218.799 78.3762 219.83 79.407 219.83 80.6785V80.6785C219.83 81.95 218.799 82.9808 217.528 82.9808H177.621C176.35 82.9808 175.319 81.95 175.319 80.6785V80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 88.0458C175.319 86.7743 176.35 85.7435 177.621 85.7435H204.689C205.96 85.7435 206.991 86.7743 206.991 88.0458V88.0458C206.991 89.3174 205.96 90.3481 204.689 90.3481H177.621C176.35 90.3481 175.319 89.3174 175.319 88.0458V88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M170.707 22.917V64.8858H224.122V22.917H170.707ZM174.523 26.7324H220.307V53.2609L210.232 43.1264L208.861 41.7553L200.217 50.3994L189.248 39.3111L187.877 37.9399L174.523 51.2937V26.7324ZM212.676 30.5477C210.567 30.5477 208.861 32.2542 208.861 34.3631C208.861 36.4719 210.567 38.1784 212.676 38.1784C214.785 38.1784 216.492 36.4719 216.492 34.3631C216.492 32.2542 214.785 30.5477 212.676 30.5477ZM187.877 43.3649L205.403 61.0705H174.523V56.7186L187.877 43.3649ZM208.861 47.1802L220.307 58.6263V61.0705H210.828L202.899 53.0821L208.861 47.1802Z",
    fill: "black"
  }))
}, {
  title: '3 Col 2 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "2",
          "unit": "em"
        },
        "Tablet": {
          "val": "2",
          "unit": "em"
        },
        "Mobile": {
          "val": "2",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "2",
          "unit": "em"
        },
        "Tablet": {
          "val": "2",
          "unit": "em"
        },
        "Mobile": {
          "val": "2",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "13.5",
    y: "19.5",
    width: "66.0524",
    height: "82",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.6855 73.0548C25.6855 71.8555 26.6578 70.8833 27.857 70.8833H65.4961C66.6954 70.8833 67.6676 71.8555 67.6676 73.0548V73.0548C67.6676 74.2541 66.6954 75.2263 65.4961 75.2263H27.857C26.6578 75.2263 25.6855 74.2541 25.6855 73.0548V73.0548Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.6855 80.0035C25.6855 78.8043 26.6578 77.8321 27.857 77.8321H65.4961C66.6954 77.8321 67.6676 78.8043 67.6676 80.0035V80.0035C67.6676 81.2028 66.6954 82.175 65.4961 82.175H27.857C26.6578 82.175 25.6855 81.2028 25.6855 80.0035V80.0035Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.6855 86.9523C25.6855 85.7531 26.6578 84.7809 27.857 84.7809H53.387C54.5862 84.7809 55.5584 85.7531 55.5584 86.9523V86.9523C55.5584 88.1516 54.5862 89.1238 53.387 89.1238H27.857C26.6578 89.1238 25.6855 88.1516 25.6855 86.9523V86.9523Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M21.3362 25.524V65.1083H71.7162V25.524H21.3362ZM24.9348 29.1226H68.1176V54.1439L58.6151 44.5852L57.3219 43.292L49.1689 51.445L38.823 40.9866L37.5298 39.6934L24.9348 52.2884V29.1226ZM60.9205 32.7212C58.9314 32.7212 57.3219 34.3307 57.3219 36.3197C57.3219 38.3088 58.9314 39.9183 60.9205 39.9183C62.9095 39.9183 64.519 38.3088 64.519 36.3197C64.519 34.3307 62.9095 32.7212 60.9205 32.7212ZM37.5298 44.8101L54.0607 61.5097H24.9348V57.4051L37.5298 44.8101ZM57.3219 48.4087L68.1176 59.2044V61.5097H59.1774L51.6991 53.9752L57.3219 48.4087Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "89.4753",
    y: "19.5",
    width: "66.0524",
    height: "82",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M101.661 73.0548C101.661 71.8555 102.633 70.8833 103.832 70.8833H141.471C142.671 70.8833 143.643 71.8555 143.643 73.0548V73.0548C143.643 74.2541 142.671 75.2263 141.471 75.2263H103.832C102.633 75.2263 101.661 74.2541 101.661 73.0548V73.0548Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M101.661 80.0035C101.661 78.8043 102.633 77.8321 103.832 77.8321H141.471C142.671 77.8321 143.643 78.8043 143.643 80.0035V80.0035C143.643 81.2028 142.671 82.175 141.471 82.175H103.832C102.633 82.175 101.661 81.2028 101.661 80.0035V80.0035Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M101.661 86.9523C101.661 85.7531 102.633 84.7809 103.832 84.7809H129.362C130.562 84.7809 131.534 85.7531 131.534 86.9523V86.9523C131.534 88.1516 130.562 89.1238 129.362 89.1238H103.832C102.633 89.1238 101.661 88.1516 101.661 86.9523V86.9523Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M97.3116 25.524V65.1083H147.692V25.524H97.3116ZM100.91 29.1226H144.093V54.1439L134.59 44.5852L133.297 43.292L125.144 51.445L114.798 40.9866L113.505 39.6934L100.91 52.2884V29.1226ZM136.896 32.7212C134.907 32.7212 133.297 34.3307 133.297 36.3197C133.297 38.3088 134.907 39.9183 136.896 39.9183C138.885 39.9183 140.494 38.3088 140.494 36.3197C140.494 34.3307 138.885 32.7212 136.896 32.7212ZM113.505 44.8101L130.036 61.5097H100.91V57.4051L113.505 44.8101ZM133.297 48.4087L144.093 59.2044V61.5097H135.153L127.674 53.9752L133.297 48.4087Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "165.389",
    y: "19.5",
    width: "66.0524",
    height: "82",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M177.575 73.0548C177.575 71.8555 178.547 70.8833 179.746 70.8833H217.385C218.585 70.8833 219.557 71.8555 219.557 73.0548V73.0548C219.557 74.2541 218.585 75.2263 217.385 75.2263H179.746C178.547 75.2263 177.575 74.2541 177.575 73.0548V73.0548Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M177.575 80.0035C177.575 78.8043 178.547 77.8321 179.746 77.8321H217.385C218.585 77.8321 219.557 78.8043 219.557 80.0035V80.0035C219.557 81.2028 218.585 82.175 217.385 82.175H179.746C178.547 82.175 177.575 81.2028 177.575 80.0035V80.0035Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M177.575 86.9523C177.575 85.7531 178.547 84.7809 179.746 84.7809H205.276C206.476 84.7809 207.448 85.7531 207.448 86.9523V86.9523C207.448 88.1516 206.476 89.1238 205.276 89.1238H179.746C178.547 89.1238 177.575 88.1516 177.575 86.9523V86.9523Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M173.225 25.524V65.1083H223.605V25.524H173.225ZM176.824 29.1226H220.007V54.1439L210.504 44.5852L209.211 43.292L201.058 51.445L190.712 40.9866L189.419 39.6934L176.824 52.2884V29.1226ZM212.81 32.7212C210.821 32.7212 209.211 34.3307 209.211 36.3197C209.211 38.3088 210.821 39.9183 212.81 39.9183C214.799 39.9183 216.408 38.3088 216.408 36.3197C216.408 34.3307 214.799 32.7212 212.81 32.7212ZM189.419 44.8101L205.95 61.5097H176.824V57.4051L189.419 44.8101ZM209.211 48.4087L220.007 59.2044V61.5097H211.067L203.588 53.9752L209.211 48.4087Z",
    fill: "black"
  }))
}, {
  title: '2 Col 0 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "0",
          "unit": "em"
        },
        "Tablet": {
          "val": "0",
          "unit": "em"
        },
        "Mobile": {
          "val": "0",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "0",
          "unit": "em"
        },
        "Tablet": {
          "val": "0",
          "unit": "em"
        },
        "Mobile": {
          "val": "0",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "38.5",
    y: "8.5",
    width: "83.0175",
    height: "103",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M53.8952 75.7313C53.8952 74.2286 55.1134 73.0104 56.6161 73.0104H103.778C105.281 73.0104 106.499 74.2286 106.499 75.7313C106.499 77.234 105.281 78.4522 103.778 78.4522H56.6161C55.1134 78.4522 53.8952 77.234 53.8952 75.7313Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M53.8952 84.4382C53.8952 82.9355 55.1134 81.7173 56.6161 81.7173H103.778C105.281 81.7173 106.499 82.9355 106.499 84.4382C106.499 85.9409 105.281 87.1591 103.778 87.1591H56.6161C55.1134 87.1591 53.8952 85.9409 53.8952 84.4382Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M53.8952 93.1451C53.8952 91.6424 55.1134 90.4242 56.6161 90.4242H88.6054C90.1081 90.4242 91.3263 91.6424 91.3263 93.1451C91.3263 94.6478 90.1081 95.866 88.6054 95.866H56.6161C55.1134 95.866 53.8952 94.6478 53.8952 93.1451Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M48.4454 16.1747V65.7742H111.572V16.1747H48.4454ZM52.9545 20.6837H107.063V52.0357L95.1563 40.0585L93.5359 38.4381L83.3201 48.6539L70.3566 35.5495L68.7361 33.929L52.9545 49.7107V20.6837ZM98.0449 25.1928C95.5526 25.1928 93.5359 27.2095 93.5359 29.7018C93.5359 32.1941 95.5526 34.2109 98.0449 34.2109C100.537 34.2109 102.554 32.1941 102.554 29.7018C102.554 27.2095 100.537 25.1928 98.0449 25.1928ZM68.7361 40.3403L89.4496 61.2651H52.9545V56.122L68.7361 40.3403ZM93.5359 44.8494L107.063 58.3765V61.2651H95.8609L86.4905 51.8243L93.5359 44.8494Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "122.08",
    y: "8.5",
    width: "83.0175",
    height: "103",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M137.475 75.7313C137.475 74.2286 138.693 73.0104 140.196 73.0104H187.358C188.861 73.0104 190.079 74.2286 190.079 75.7313C190.079 77.234 188.861 78.4522 187.358 78.4522H140.196C138.693 78.4522 137.475 77.234 137.475 75.7313Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M137.475 84.4382C137.475 82.9355 138.693 81.7173 140.196 81.7173H187.358C188.861 81.7173 190.079 82.9355 190.079 84.4382C190.079 85.9409 188.861 87.1591 187.358 87.1591H140.196C138.693 87.1591 137.475 85.9409 137.475 84.4382Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M137.475 93.1451C137.475 91.6424 138.693 90.4242 140.196 90.4242H172.185C173.688 90.4242 174.906 91.6424 174.906 93.1451C174.906 94.6478 173.688 95.866 172.185 95.866H140.196C138.693 95.866 137.475 94.6478 137.475 93.1451Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M132.025 16.1747V65.7742H195.152V16.1747H132.025ZM136.534 20.6837H190.643V52.0357L178.736 40.0585L177.116 38.4381L166.9 48.6539L153.936 35.5495L152.316 33.929L136.534 49.7107V20.6837ZM181.625 25.1928C179.132 25.1928 177.116 27.2095 177.116 29.7018C177.116 32.1941 179.132 34.2109 181.625 34.2109C184.117 34.2109 186.134 32.1941 186.134 29.7018C186.134 27.2095 184.117 25.1928 181.625 25.1928ZM152.316 40.3403L173.029 61.2651H136.534V56.122L152.316 40.3403ZM177.116 44.8494L190.643 58.3765V61.2651H179.441L170.07 51.8243L177.116 44.8494Z",
    fill: "black"
  }))
}, {
  title: '2 Col 1 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "1",
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "1",
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "37.5",
    y: "9.5",
    width: "81.7632",
    height: "101.447",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M52.6579 75.7202C52.6579 74.2399 53.8579 73.0399 55.3382 73.0399H101.796C103.277 73.0399 104.477 74.2399 104.477 75.7202V75.7202C104.477 77.2005 103.277 78.4005 101.796 78.4005H55.3382C53.8579 78.4005 52.6579 77.2005 52.6579 75.7202V75.7202Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M52.6579 84.297C52.6579 82.8168 53.8579 81.6168 55.3382 81.6168H101.796C103.277 81.6168 104.477 82.8168 104.477 84.297V84.297C104.477 85.7773 103.277 86.9773 101.796 86.9773H55.3382C53.8579 86.9773 52.6579 85.7773 52.6579 84.297V84.297Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M52.6579 92.8739C52.6579 91.3936 53.8579 90.1936 55.3382 90.1936H86.8499C88.3302 90.1936 89.5302 91.3936 89.5302 92.8739V92.8739C89.5302 94.3542 88.3302 95.5542 86.8499 95.5542H55.3382C53.8579 95.5542 52.6579 94.3542 52.6579 92.8739V92.8739Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M47.2895 17.0526V65.9117H109.474V17.0526H47.2895ZM51.7312 21.4944H105.032V52.3783L93.303 40.5799L91.7068 38.9837L81.6435 49.047L68.8735 36.1382L67.2773 34.542L51.7312 50.088V21.4944ZM96.1485 25.9361C93.6934 25.9361 91.7068 27.9227 91.7068 30.3778C91.7068 32.8329 93.6934 34.8196 96.1485 34.8196C98.6036 34.8196 100.59 32.8329 100.59 30.3778C100.59 27.9227 98.6036 25.9361 96.1485 25.9361ZM67.2773 40.8575L87.6815 61.4699H51.7312V56.4036L67.2773 40.8575ZM91.7068 45.2993L105.032 58.6245V61.4699H93.997L84.7666 52.1701L91.7068 45.2993Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "124.737",
    y: "9.5",
    width: "81.7632",
    height: "101.447",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M139.895 75.7202C139.895 74.2399 141.095 73.0399 142.575 73.0399H189.033C190.513 73.0399 191.713 74.2399 191.713 75.7202V75.7202C191.713 77.2005 190.513 78.4005 189.033 78.4005H142.575C141.095 78.4005 139.895 77.2005 139.895 75.7202V75.7202Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M139.895 84.297C139.895 82.8168 141.095 81.6168 142.575 81.6168H189.033C190.513 81.6168 191.713 82.8168 191.713 84.297V84.297C191.713 85.7773 190.513 86.9773 189.033 86.9773H142.575C141.095 86.9773 139.895 85.7773 139.895 84.297V84.297Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M139.895 92.8739C139.895 91.3936 141.095 90.1936 142.575 90.1936H174.087C175.567 90.1936 176.767 91.3936 176.767 92.8739V92.8739C176.767 94.3542 175.567 95.5542 174.087 95.5542H142.575C141.095 95.5542 139.895 94.3542 139.895 92.8739V92.8739Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M134.526 17.0526V65.9117H196.711V17.0526H134.526ZM138.968 21.4944H192.269V52.3783L180.54 40.5799L178.944 38.9837L168.88 49.047L156.11 36.1382L154.514 34.542L138.968 50.088V21.4944ZM183.385 25.9361C180.93 25.9361 178.944 27.9227 178.944 30.3778C178.944 32.8329 180.93 34.8196 183.385 34.8196C185.84 34.8196 187.827 32.8329 187.827 30.3778C187.827 27.9227 185.84 25.9361 183.385 25.9361ZM154.514 40.8575L174.918 61.4699H138.968V56.4036L154.514 40.8575ZM178.944 45.2993L192.269 58.6245V61.4699H181.234L172.003 52.1701L178.944 45.2993Z",
    fill: "black"
  }))
}, {
  title: '2 Col 2 Gap',
  data: {
    "options": {
      "gridTemplateColumns": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "gridTemplateRows": [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      "colGap": {
        "val": 1,
        "unit": "em"
      },
      "rowGap": {
        "val": 1,
        "unit": "em"
      },
      "itemCss": []
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": "1",
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": "2",
          "unit": "em"
        },
        "Tablet": {
          "val": "2",
          "unit": "em"
        },
        "Mobile": {
          "val": "2",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": "2",
          "unit": "em"
        },
        "Tablet": {
          "val": "2",
          "unit": "em"
        },
        "Mobile": {
          "val": "2",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "34.5",
    y: "9.5",
    width: "81.4017",
    height: "101",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M49.5895 75.4288C49.5895 73.955 50.7842 72.7603 52.258 72.7603H98.5133C99.9871 72.7603 101.182 73.955 101.182 75.4288V75.4288C101.182 76.9026 99.9871 78.0974 98.5133 78.0974H52.258C50.7842 78.0974 49.5895 76.9026 49.5895 75.4288V75.4288Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M49.5895 83.9683C49.5895 82.4944 50.7842 81.2997 52.258 81.2997H98.5133C99.9871 81.2997 101.182 82.4944 101.182 83.9683V83.9683C101.182 85.4421 99.9871 86.6368 98.5133 86.6368H52.258C50.7842 86.6368 49.5895 85.4421 49.5895 83.9683V83.9683Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M49.5895 92.5077C49.5895 91.0338 50.7842 89.8391 52.258 89.8391H83.6322C85.106 89.8391 86.3007 91.0338 86.3007 92.5077V92.5077C86.3007 93.9815 85.106 95.1762 83.6322 95.1762H52.258C50.7842 95.1762 49.5895 93.9815 49.5895 92.5077V92.5077Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M44.2446 17.0175V65.6632H106.157V17.0175H44.2446ZM48.6669 21.4398H101.735V52.1889L90.0572 40.442L88.4679 38.8528L78.4486 48.8721L65.7343 36.0197L64.1451 34.4304L48.6669 49.9086V21.4398ZM92.8902 25.8622C90.4459 25.8622 88.4679 27.8401 88.4679 30.2845C88.4679 32.7289 90.4459 34.7068 92.8902 34.7068C95.3346 34.7068 97.3126 32.7289 97.3126 30.2845C97.3126 27.8401 95.3346 25.8622 92.8902 25.8622ZM64.1451 40.7184L84.4602 61.2408H48.6669V56.1966L64.1451 40.7184ZM88.4679 45.1408L101.735 58.4078V61.2408H90.7482L81.558 51.9816L88.4679 45.1408Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "127.867",
    y: "9.5",
    width: "81.4017",
    height: "101",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M142.957 75.4288C142.957 73.955 144.152 72.7603 145.625 72.7603H191.881C193.354 72.7603 194.549 73.955 194.549 75.4288V75.4288C194.549 76.9026 193.354 78.0974 191.881 78.0974H145.625C144.152 78.0974 142.957 76.9026 142.957 75.4288V75.4288Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M142.957 83.9683C142.957 82.4944 144.152 81.2997 145.625 81.2997H191.881C193.354 81.2997 194.549 82.4944 194.549 83.9683V83.9683C194.549 85.4421 193.354 86.6368 191.881 86.6368H145.625C144.152 86.6368 142.957 85.4421 142.957 83.9683V83.9683Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M142.957 92.5077C142.957 91.0338 144.152 89.8391 145.625 89.8391H177C178.473 89.8391 179.668 91.0338 179.668 92.5077V92.5077C179.668 93.9815 178.473 95.1762 177 95.1762H145.625C144.152 95.1762 142.957 93.9815 142.957 92.5077V92.5077Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M137.612 17.0175V65.6632H199.525V17.0175H137.612ZM142.034 21.4398H195.102V52.1889L183.424 40.442L181.835 38.8528L171.816 48.8721L159.102 36.0197L157.512 34.4304L142.034 49.9086V21.4398ZM186.258 25.8622C183.813 25.8622 181.835 27.8401 181.835 30.2845C181.835 32.7289 183.813 34.7068 186.258 34.7068C188.702 34.7068 190.68 32.7289 190.68 30.2845C190.68 27.8401 188.702 25.8622 186.258 25.8622ZM157.512 40.7184L177.827 61.2408H142.034V56.1966L157.512 40.7184ZM181.835 45.1408L195.102 58.4078V61.2408H184.115L174.925 51.9816L181.835 45.1408Z",
    fill: "black"
  }))
}, {
  title: '3 Col, nth(1)-2 Offset 1 Gap',
  isPro: true,
  data: {
    "options": {
      "itemCss": {
        "Desktop": [{
          "grid-column-start": "1",
          "grid-column-end": "3",
          "grid-row-start": "",
          "grid-row-end": ""
        }]
      }
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": 1,
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": 1,
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "12.5",
    y: "16.5",
    width: "145",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M24 73.3111C24 72.0396 25.0308 71.0089 26.3023 71.0089H138.698C139.969 71.0089 141 72.0396 141 73.3111V73.3111C141 74.5827 139.969 75.6134 138.698 75.6134H26.3023C25.0308 75.6134 24 74.5827 24 73.3111V73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M24 80.6785C24 79.407 25.0308 78.3762 26.3023 78.3762H138.698C139.969 78.3762 141 79.407 141 80.6785V80.6785C141 81.95 139.969 82.9808 138.698 82.9808H26.3023C25.0308 82.9808 24 81.95 24 80.6785V80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M24 88.0458C24 86.7743 25.0308 85.7435 26.3023 85.7435H104.951C106.222 85.7435 107.253 86.7743 107.253 88.0458V88.0458C107.253 89.3174 106.222 90.3481 104.951 90.3481H26.3023C25.0308 90.3481 24 89.3174 24 88.0458V88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M58 22.9171V64.8859H111.415V22.9171H58ZM61.8153 26.7324H107.6V53.261L97.5246 43.1265L96.1535 41.7553L87.5093 50.3995L76.5402 39.3111L75.1691 37.94L61.8153 51.2937V26.7324ZM99.9688 30.5477C97.8599 30.5477 96.1535 32.2542 96.1535 34.3631C96.1535 36.472 97.8599 38.1784 99.9688 38.1784C102.078 38.1784 103.784 36.472 103.784 34.3631C103.784 32.2542 102.078 30.5477 99.9688 30.5477ZM75.1691 43.3649L92.6958 61.0705H61.8153V56.7186L75.1691 43.3649ZM96.1535 47.1803L107.6 58.6263V61.0705H98.1208L90.192 53.0821L96.1535 47.1803Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "162.369",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 73.3111C175.319 72.0396 176.35 71.0089 177.621 71.0089H217.528C218.799 71.0089 219.83 72.0396 219.83 73.3111C219.83 74.5827 218.799 75.6134 217.528 75.6134H177.621C176.35 75.6134 175.319 74.5827 175.319 73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 80.6785C175.319 79.407 176.35 78.3762 177.621 78.3762H217.528C218.799 78.3762 219.83 79.407 219.83 80.6785C219.83 81.95 218.799 82.9808 217.528 82.9808H177.621C176.35 82.9808 175.319 81.95 175.319 80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M175.319 88.0458C175.319 86.7743 176.35 85.7435 177.621 85.7435H204.689C205.96 85.7435 206.991 86.7743 206.991 88.0458C206.991 89.3174 205.96 90.3481 204.689 90.3481H177.621C176.35 90.3481 175.319 89.3174 175.319 88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M170.707 22.917V64.8858H224.122V22.917H170.707ZM174.523 26.7324H220.307V53.2609L210.232 43.1264L208.861 41.7553L200.217 50.3994L189.248 39.3111L187.877 37.9399L174.523 51.2937V26.7324ZM212.676 30.5477C210.567 30.5477 208.861 32.2542 208.861 34.3631C208.861 36.4719 210.567 38.1784 212.676 38.1784C214.785 38.1784 216.492 36.4719 216.492 34.3631C216.492 32.2542 214.785 30.5477 212.676 30.5477ZM187.877 43.3649L205.403 61.0705H174.523V56.7186L187.877 43.3649ZM208.861 47.1802L220.307 58.6263V61.0705H210.828L202.899 53.0821L208.861 47.1802Z",
    fill: "black"
  }))
}, {
  title: '3 Col, nth(2)-2 Offset 1 Gap',
  isPro: true,
  data: {
    "options": {
      "itemCss": {
        "Desktop": [{
          "grid-column-start": "",
          "grid-column-end": "",
          "grid-row-start": "",
          "grid-row-end": ""
        }, {
          "grid-column-start": "2",
          "grid-column-end": "4",
          "grid-row-start": "",
          "grid-row-end": ""
        }]
      }
    },
    "styles": {
      "gridTemplateColumns": {
        "Desktop": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Tablet": [{
          "val": 1,
          "unit": "fr"
        }, {
          "val": 1,
          "unit": "fr"
        }],
        "Mobile": [{
          "val": 1,
          "unit": "fr"
        }]
      },
      "gridTemplateRows": {},
      "colGap": {
        "Desktop": {
          "val": 1,
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "rowGap": {
        "Desktop": {
          "val": 1,
          "unit": "em"
        },
        "Tablet": {
          "val": "1",
          "unit": "em"
        },
        "Mobile": {
          "val": "1",
          "unit": "em"
        }
      },
      "textAlign": {},
      "color": {},
      "backgroundColor": {},
      "padding": {},
      "margin": {}
    }
  },
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    width: "245",
    height: "120",
    viewBox: "0 0 245 120",
    fill: "none",
    xmlns: "http://www.w3.org/2000/svg"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "88.5",
    y: "16.5",
    width: "145",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100 73.3111C100 72.0396 101.031 71.0089 102.302 71.0089H214.698C215.969 71.0089 217 72.0396 217 73.3111C217 74.5827 215.969 75.6134 214.698 75.6134H102.302C101.031 75.6134 100 74.5827 100 73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100 80.6785C100 79.407 101.031 78.3762 102.302 78.3762H214.698C215.969 78.3762 217 79.407 217 80.6785C217 81.95 215.969 82.9808 214.698 82.9808H102.302C101.031 82.9808 100 81.95 100 80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M100 88.0458C100 86.7743 101.031 85.7435 102.302 85.7435H180.951C182.222 85.7435 183.253 86.7743 183.253 88.0458C183.253 89.3174 182.222 90.3481 180.951 90.3481H102.302C101.031 90.3481 100 89.3174 100 88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M134 22.9171V64.8859H187.415V22.9171H134ZM137.815 26.7324H183.6V53.261L173.525 43.1265L172.153 41.7553L163.509 50.3995L152.54 39.3111L151.169 37.94L137.815 51.2937V26.7324ZM175.969 30.5477C173.86 30.5477 172.153 32.2542 172.153 34.3631C172.153 36.472 173.86 38.1784 175.969 38.1784C178.078 38.1784 179.784 36.472 179.784 34.3631C179.784 32.2542 178.078 30.5477 175.969 30.5477ZM151.169 43.3649L168.696 61.0705H137.815V56.7186L151.169 43.3649ZM172.153 47.1803L183.6 58.6263V61.0705H174.121L166.192 53.0821L172.153 47.1803Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    x: "12.5",
    y: "16.5",
    width: "70.0917",
    height: "87",
    stroke: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 73.3111C25.4498 72.0396 26.4805 71.0089 27.7521 71.0089H67.6586C68.9301 71.0089 69.9608 72.0396 69.9608 73.3111C69.9608 74.5827 68.9301 75.6134 67.6586 75.6134H27.7521C26.4805 75.6134 25.4498 74.5827 25.4498 73.3111Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 80.6785C25.4498 79.407 26.4805 78.3762 27.7521 78.3762H67.6586C68.9301 78.3762 69.9608 79.407 69.9608 80.6785C69.9608 81.95 68.9301 82.9808 67.6586 82.9808H27.7521C26.4805 82.9808 25.4498 81.95 25.4498 80.6785Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M25.4498 88.0458C25.4498 86.7743 26.4805 85.7435 27.7521 85.7435H54.8199C56.0915 85.7435 57.1222 86.7743 57.1222 88.0458C57.1222 89.3174 56.0915 90.3481 54.8199 90.3481H27.7521C26.4805 90.3481 25.4498 89.3174 25.4498 88.0458Z",
    fill: "black"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M20.8384 22.917V64.8858H74.2533V22.917H20.8384ZM24.6538 26.7324H70.4379V53.2609L60.363 43.1264L58.9919 41.7553L50.3478 50.3994L39.3786 39.3111L38.0075 37.9399L24.6538 51.2937V26.7324ZM62.8072 30.5477C60.6984 30.5477 58.9919 32.2542 58.9919 34.3631C58.9919 36.4719 60.6984 38.1784 62.8072 38.1784C64.9161 38.1784 66.6226 36.4719 66.6226 34.3631C66.6226 32.2542 64.9161 30.5477 62.8072 30.5477ZM38.0075 43.3649L55.5342 61.0705H24.6538V56.7186L38.0075 43.3649ZM58.9919 47.1802L70.4379 58.6263V61.0705H60.9592L53.0304 53.0821L58.9919 47.1802Z",
    fill: "black"
  }))
}];
let gridLayouts = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__.applyFilters)('gridLayouts', gridLayoutsBasic);
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (gridLayouts);

/***/ }),

/***/ "./src/blocks/post-grid/index.js":
/*!***************************************!*\
  !*** ./src/blocks/post-grid/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/pencil.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/cloud.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tutorials__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tutorials */ "./src/components/tutorials/index.js");
/* harmony import */ var _components_css_padding__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-padding */ "./src/components/css-padding/index.js");
/* harmony import */ var _components_css_outline__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/css-outline */ "./src/components/css-outline/index.js");
/* harmony import */ var _components_css_border__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/css-border */ "./src/components/css-border/index.js");
/* harmony import */ var _components_css_box_shadow__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/css-box-shadow */ "./src/components/css-box-shadow/index.js");
/* harmony import */ var _components_input_select__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _query_presets__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ./query-presets */ "./src/blocks/post-grid/query-presets.js");
/* harmony import */ var _grid_layouts__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ./grid-layouts */ "./src/blocks/post-grid/grid-layouts.js");
/* harmony import */ var _queryprams__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ./queryprams */ "./src/blocks/post-grid/queryprams.js");
/* harmony import */ var _pagination_types__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ./pagination-types */ "./src/blocks/post-grid/pagination-types.js");
/* harmony import */ var _tutorials_links__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ./tutorials-links */ "./src/blocks/post-grid/tutorials-links.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");








const {
  parse
} = wp.blockSerializationDefaultParser;
const {
  RawHTML
} = wp.element; // var select = wp.data.select('core/block-editor');

































 //import anime from 'animejs/lib/anime.es.js';




const ALLOWED_MEDIA_TYPES = ['image'];
var queryPramsX = _queryprams__WEBPACK_IMPORTED_MODULE_28__["default"].map((x, i) => {
  return {
    value: i,
    label: x.label,
    description: x.description,
    isPro: x.isPro
  };
});
var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/post-grid", {
  apiVersion: 2,
  title: "Post Grid",
  icon: {
    background: '#fff',
    foreground: '#fff',
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M15.41,15.41H0V0H15.41ZM3,12.41h9.41V3H3Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M15.41,36H0V20.59H15.41ZM3,33h9.41V23.59H3Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M36,36H20.59V20.59H36ZM23.59,33H33V23.59H23.59Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "25.15",
      y: "3.87",
      width: "10.85",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "25.15",
      y: "9.19",
      width: "10.85",
      height: "2.35"
    }))
  },
  providesContext: {
    queryId: "queryId",
    loopIndex: "loopIndex",
    query: "query",
    displayLayout: "displayLayout"
  },
  supports: {
    align: ["left", "right", "center", "wide", "full"],
    html: false
  },
  attributes: {
    lazyLoad: {
      type: 'object',
      default: {
        options: {
          class: 'lazyLoad',
          enable: 'no',
          srcUrl: '',
          srcId: '',
          icon: {
            library: '',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: ''
          }
        },
        styles: {}
      }
    },
    search: {
      type: 'object',
      default: {
        options: {
          class: 'search',
          enable: 'no',
          type: '',
          placeholder: '',
          icon: '',
          busyIcon: ''
        },
        styles: {}
      }
    },
    container: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {}
      }
    },
    itemsWrap: {
      type: 'object',
      default: {
        options: {
          class: 'items-loop'
        },
        styles: {}
      }
    },
    itemWrap: {
      type: 'object',
      default: {
        options: {
          class: 'item'
        },
        styles: {}
      }
    },
    noPostsWrap: {
      type: 'object',
      default: {
        options: {
          class: 'no-posts text-center'
        },
        styles: {}
      }
    },
    spinnerWrap: {
      type: 'object',
      default: {
        options: {
          class: 'spinner'
        },
        styles: {}
      }
    },
    grid: {
      type: 'object',
      default: {
        options: {
          itemCss: {}
        },
        styles: {
          gridTemplateColumns: {
            Tablet: [{
              "val": 1,
              "unit": "fr"
            }, {
              "val": 1,
              "unit": "fr"
            }],
            Mobile: [{
              "val": 1,
              "unit": "fr"
            }]
          },
          gridTemplateRows: {},
          colGap: {},
          rowGap: {},
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    pagination: {
      type: 'object',
      default: {
        options: {
          class: 'pagination',
          type: 'normal',
          maxPageNum: '',
          prevText: 'Previous',
          nextText: 'Next',
          loadMoreText: 'Load More',
          noMorePosts: 'No More Posts',
          loadingText: 'Loading...',
          loadingIcon: {
            library: '',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: ''
          }
        },
        styles: {
          textAlign: {
            "Desktop": "center"
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    paginationItem: {
      type: 'object',
      default: {
        options: {
          class: 'page-numbers inline-block'
        },
        styles: {
          display: {
            "Desktop": "inline-block"
          },
          color: {
            "Desktop": "#18978F"
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    paginationItemActive: {
      type: 'object',
      default: {
        options: {
          class: 'page-numbers inline-block'
        },
        styles: {
          display: {},
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    layout: {
      type: 'object',
      default: {
        id: '',
        srcServer: 'library',
        data: [{
          "blockName": "core/post-title",
          "attrs": {},
          "innerBlocks": [],
          "innerHTML": "",
          "innerContent": []
        }, {
          "blockName": null,
          "attrs": {},
          "innerBlocks": [],
          "innerHTML": "\n\n",
          "innerContent": ["\n\n"]
        }, {
          "blockName": "core/post-date",
          "attrs": {},
          "innerBlocks": [],
          "innerHTML": "",
          "innerContent": []
        }, {
          "blockName": null,
          "attrs": {},
          "innerBlocks": [],
          "innerHTML": "\n\n",
          "innerContent": ["\n\n"]
        }, {
          "blockName": "core/post-excerpt",
          "attrs": {
            "moreText": "",
            "textColor": "primary"
          },
          "innerBlocks": [],
          "innerHTML": "",
          "innerContent": []
        }],
        rawData: "<!-- wp:post-featured-image  /-->\n\n<!-- wp:post-title /-->\n\n<!-- wp:post-excerpt  /-->"
      }
    },
    postTypes: {
      type: 'array',
      default: []
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    scripts: {
      type: 'object',
      default: {
        js: '',
        css: ''
      }
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    queryArgs: {
      type: 'object',
      default: {
        items: [{
          val: ['post'],
          multiple: false,
          id: 'postType',
          label: 'Post Types',
          description: "Select Post Types to Query"
        }, {
          val: ['publish'],
          multiple: false,
          id: 'postStatus',
          label: 'Post status',
          description: "Query post by post status"
        }, {
          val: 'DESC',
          multiple: false,
          id: 'order',
          label: 'Order',
          description: "Post query order"
        }, {
          val: ['date'],
          multiple: false,
          id: 'orderby',
          label: 'Orderby',
          description: "Post query orderby"
        }, {
          val: 10,
          multiple: false,
          id: 'postsPerPage',
          label: 'Posts Per Page',
          description: "Number of post to show per page"
        }, {
          val: 1,
          multiple: false,
          id: 'paged',
          label: 'Paged',
          description: "Pagination start with"
        }]
      }
    }
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var clientId = props.clientId;
    var setAttributes = props.setAttributes;
    var lazyLoad = attributes.lazyLoad;
    var container = attributes.container;
    var pagination = attributes.pagination;
    var paginationItem = attributes.paginationItem;
    var paginationItemActive = attributes.paginationItemActive;
    var search = attributes.search;
    var itemsWrap = attributes.itemsWrap;
    var itemWrap = attributes.itemWrap;
    var noPostsWrap = attributes.noPostsWrap;
    var spinnerWrap = attributes.spinnerWrap;
    var grid = attributes.grid;
    var layout = attributes.layout;
    var queryArgs = attributes.queryArgs;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var [isBusy, setIsBusy] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false); // Using the hook.

    var [importLayoutOpen, setimportLayoutOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
      id: 0,
      isOpen: false
    }); // Using the hook.

    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.useBlockProps)({
      className: ` ${blockId} pg-post-grid`
    });
    var containerSelector = blockClass;
    const itemsWrapSelector = blockClass + ' .items-loop';
    const itemWrapSelector = blockClass + ' .item';
    const noPostsSelector = blockClass + ' .no-posts';
    const searchWrapSelector = blockClass + ' .search';
    const lazyloadWrapSelector = blockClass + ' .lazyLoad';
    const spinnerSelector = blockClass + ' .spinner';
    const paginationSelector = blockClass + ' .pagination';
    const paginationItemSelector = blockClass + ' .pagination .page-numbers';
    const paginationItemActiveSelector = blockClass + ' .pagination .page-numbers.current';
    var [debounce, setDebounce] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(null); // Using the hook.

    const [breakPointX, setBreakPointX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(myStore != null ? myStore.getBreakPoint() : 'Desktop');
    const [postGridData, setPostGridData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(window.PostGridPluginData);
    let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_4__.applyFilters)('isProFeature', true);
    const [clientData, setClientData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    var clientDataX = myStore != null ? myStore.getclientdata() : '';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setPostGridData(window.PostGridPluginData);
    }, [window.PostGridPluginData]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setClientData(myStore != null ? myStore.getclientdata() : '');
    }, [clientDataX]);
    const BLOCKS_TEMPLATE = [['post-grid/post-title', {}], ['post-grid/read-more', {}]];

    function onPickCssLibraryContainer(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        container[sudoScource] = sudoScourceArgs;
      });
      var containerX = Object.assign({}, container);
      setAttributes({
        container: containerX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, containerSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleContainer(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, container);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        container: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, containerSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleContainer(sudoScource, key) {
      var object = myStore.deletePropertyDeep(container, [sudoScource, key, breakPointX]);
      setAttributes({
        container: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, containerSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleContainer(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, container);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        container: object
      });
    }

    function onPickCssLibraryItemsWrap(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        itemsWrap[sudoScource] = sudoScourceArgs;
      });
      var itemsWrapX = Object.assign({}, itemsWrap);
      setAttributes({
        itemsWrap: itemsWrapX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, itemsWrapSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleItemsWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, itemsWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        itemsWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemsWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItemsWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(itemsWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        itemsWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemsWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItemsWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, itemsWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        itemsWrap: object
      });
    }

    function onPickCssLibraryItemWrap(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        itemWrap[sudoScource] = sudoScourceArgs;
      });
      var itemWrapX = Object.assign({}, itemWrap);
      setAttributes({
        itemWrap: itemWrapX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, itemWrapSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleItemWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, itemWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        itemWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItemWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(itemWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        itemWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItemWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, itemWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        itemWrap: object
      });
    }

    function onPickCssLibraryPaginationItemActive(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        paginationItemActive[sudoScource] = sudoScourceArgs;
      });
      var paginationItemActiveX = Object.assign({}, paginationItemActive);
      setAttributes({
        paginationItemActive: paginationItemActiveX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, paginationItemActiveSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStylePaginationItemActive(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, paginationItemActive);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        paginationItemActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationItemActiveSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePaginationItemActive(sudoScource, key) {
      var object = myStore.deletePropertyDeep(paginationItemActive, [sudoScource, key, breakPointX]);
      setAttributes({
        paginationItemActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationItemActiveSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePaginationItemActive(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, paginationItemActive);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        paginationItemActive: object
      });
    }

    function onPickCssLibraryPagination(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        pagination[sudoScource] = sudoScourceArgs;
      });
      var paginationX = Object.assign({}, pagination);
      setAttributes({
        pagination: paginationX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, paginationSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStylePagination(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, pagination);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        pagination: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePagination(sudoScource, key) {
      var object = myStore.deletePropertyDeep(pagination, [sudoScource, key, breakPointX]);
      setAttributes({
        pagination: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePagination(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, pagination);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        pagination: object
      });
    }

    function onPickCssLibraryPaginationItem(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        paginationItem[sudoScource] = sudoScourceArgs;
      });
      var paginationX = Object.assign({}, paginationItem);
      setAttributes({
        paginationItem: paginationX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, paginationItemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStylePaginationItem(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, paginationItem);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        paginationItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationItemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePaginationItem(sudoScource, key) {
      var object = myStore.deletePropertyDeep(paginationItem, [sudoScource, key, breakPointX]);
      setAttributes({
        paginationItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, paginationItemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePaginationItem(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, paginationItem);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        paginationItem: object
      });
    }

    const columnPresets = [{
      label: '1 Column',
      args: [{
        "val": 1,
        "unit": "fr"
      }],
      icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "23",
        height: "17",
        viewBox: "0 0 23 17",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 1.36364C0 0.61052 0.610521 0 1.36364 0H21.6364C22.3895 0 23 0.61052 23 1.36364V1.36364C23 2.11675 22.3895 2.72727 21.6364 2.72727H1.36364C0.61052 2.72727 0 2.11675 0 1.36364V1.36364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 15.6364C0 14.8833 0.610521 14.2727 1.36364 14.2727H21.6364C22.3895 14.2727 23 14.8833 23 15.6364V15.6364C23 16.3895 22.3895 17 21.6364 17H1.36364C0.61052 17 0 16.3895 0 15.6364V15.6364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M1.36363 -5.96064e-08C2.11674 -2.66867e-08 2.72726 0.610521 2.72726 1.36364L2.72726 15.6364C2.72726 16.3895 2.11674 17 1.36363 17C0.610513 17 -7.63055e-06 16.3895 -7.59763e-06 15.6364L-6.97375e-06 1.36364C-6.94083e-06 0.610521 0.610513 -9.25261e-08 1.36363 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M21.6364 -5.96064e-08C22.3895 -2.66867e-08 23 0.610521 23 1.36364L23 15.6364C23 16.3895 22.3895 17 21.6364 17V17C20.8832 17 20.2727 16.3895 20.2727 15.6364L20.2727 1.36364C20.2727 0.610521 20.8832 -9.25261e-08 21.6364 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }))
    }, {
      label: '2 Columns',
      args: [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "43",
        height: "17",
        viewBox: "0 0 43 17",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 1.36364C0 0.61052 0.610521 0 1.36364 0H41.2727C42.0258 0 42.6363 0.61052 42.6363 1.36364C42.6363 2.11675 42.0258 2.72727 41.2727 2.72727H1.36364C0.610521 2.72727 0 2.11675 0 1.36364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 15.6364C0 14.8833 0.610521 14.2727 1.36364 14.2727H41.2727C42.0258 14.2727 42.6363 14.8833 42.6363 15.6364C42.6363 16.3895 42.0258 17 41.2727 17H1.36364C0.610521 17 0 16.3895 0 15.6364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M1.36363 -5.96064e-08C2.11674 -2.66867e-08 2.72726 0.610521 2.72726 1.36364L2.72726 15.6364C2.72726 16.3895 2.11674 17 1.36363 17C0.610513 17 -7.63055e-06 16.3895 -7.59763e-06 15.6364L-6.97375e-06 1.36364C-6.94083e-06 0.610521 0.610513 -9.25261e-08 1.36363 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M21.6364 -5.96064e-08C22.3895 -2.66867e-08 23 0.610521 23 1.36364L23 15.6364C23 16.3895 22.3895 17 21.6364 17C20.8832 17 20.2727 16.3895 20.2727 15.6364L20.2727 1.36364C20.2727 0.610521 20.8832 -9.25261e-08 21.6364 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M41.6364 -5.96064e-08C42.3895 -2.66867e-08 43 0.610521 43 1.36364L43 15.6364C43 16.3895 42.3895 17 41.6364 17C40.8832 17 40.2727 16.3895 40.2727 15.6364L40.2727 1.36364C40.2727 0.610521 40.8832 -9.25261e-08 41.6364 -5.96064e-08Z",
        fill: "#fff"
      }))
    }, {
      label: '3 Columns',
      args: [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "43",
        height: "17",
        viewBox: "0 0 43 17",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 1.36364C0 0.61052 0.610521 0 1.36364 0H41.2727C42.0258 0 42.6363 0.61052 42.6363 1.36364C42.6363 2.11675 42.0258 2.72727 41.2727 2.72727H1.36364C0.610521 2.72727 0 2.11675 0 1.36364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 15.6364C0 14.8833 0.610521 14.2727 1.36364 14.2727H41.2727C42.0258 14.2727 42.6363 14.8833 42.6363 15.6364C42.6363 16.3895 42.0258 17 41.2727 17H1.36364C0.610521 17 0 16.3895 0 15.6364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M1.36363 -5.96064e-08C2.11674 -2.66867e-08 2.72726 0.610521 2.72726 1.36364L2.72726 15.6364C2.72726 16.3895 2.11674 17 1.36363 17C0.610513 17 -7.63055e-06 16.3895 -7.59763e-06 15.6364L-6.97375e-06 1.36364C-6.94083e-06 0.610521 0.610513 -9.25261e-08 1.36363 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M14.6364 -5.96064e-08C15.3895 -2.66867e-08 16 0.610521 16 1.36364L16 15.6364C16 16.3895 15.3895 17 14.6364 17C13.8832 17 13.2727 16.3895 13.2727 15.6364L13.2727 1.36364C13.2727 0.610521 13.8832 -9.25261e-08 14.6364 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M28.6364 -5.96064e-08C29.3895 -2.66867e-08 30 0.610521 30 1.36364L30 15.6364C30 16.3895 29.3895 17 28.6364 17C27.8832 17 27.2727 16.3895 27.2727 15.6364L27.2727 1.36364C27.2727 0.61052 27.8832 -9.25261e-08 28.6364 -5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M41.6364 -5.96064e-08C42.3895 -2.66867e-08 43 0.610521 43 1.36364L43 15.6364C43 16.3895 42.3895 17 41.6364 17C40.8832 17 40.2727 16.3895 40.2727 15.6364L40.2727 1.36364C40.2727 0.610521 40.8832 -9.25261e-08 41.6364 -5.96064e-08Z",
        fill: "#fff"
      }))
    }, {
      label: '4 Columns',
      args: [{
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }, {
        "val": 1,
        "unit": "fr"
      }],
      icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "43",
        height: "17",
        viewBox: "0 0 43 17",
        fill: "none",
        xmlns: "http://www.w3.org/2000/svg"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 1.36364C0 0.61052 0.610521 0 1.36364 0H41.2727C42.0258 0 42.6363 0.61052 42.6363 1.36364V1.36364C42.6363 2.11675 42.0258 2.72727 41.2727 2.72727H1.36364C0.610521 2.72727 0 2.11675 0 1.36364V1.36364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M0 15.6364C0 14.8833 0.610521 14.2727 1.36364 14.2727H41.2727C42.0258 14.2727 42.6363 14.8833 42.6363 15.6364V15.6364C42.6363 16.3895 42.0258 17 41.2727 17H1.36364C0.610521 17 0 16.3895 0 15.6364V15.6364Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M1.36366 -5.96064e-08C2.11677 -2.66867e-08 2.72729 0.610521 2.72729 1.36364L2.72729 15.6364C2.72729 16.3895 2.11677 17 1.36366 17V17C0.610543 17 2.2887e-05 16.3895 2.292e-05 15.6364L2.35438e-05 1.36364C2.35768e-05 0.610521 0.610544 -9.25261e-08 1.36366 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M11.3636 -5.96064e-08C12.1167 -2.66867e-08 12.7273 0.610521 12.7273 1.36364L12.7273 15.6364C12.7273 16.3895 12.1167 17 11.3636 17V17C10.6105 17 9.99999 16.3895 9.99999 15.6364L9.99999 1.36364C9.99999 0.610521 10.6105 -9.25261e-08 11.3636 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M21.3636 -5.96064e-08C22.1167 -2.66867e-08 22.7273 0.610521 22.7273 1.36364L22.7273 15.6364C22.7273 16.3895 22.1167 17 21.3636 17V17C20.6105 17 20 16.3895 20 15.6364L20 1.36364C20 0.61052 20.6105 -9.25261e-08 21.3636 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M31.3636 -5.96064e-08C32.1167 -2.66867e-08 32.7273 0.610521 32.7273 1.36364L32.7273 15.6364C32.7273 16.3895 32.1167 17 31.3636 17V17C30.6105 17 30 16.3895 30 15.6364L30 1.36364C30 0.610521 30.6105 -9.25261e-08 31.3636 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M41.3636 -5.96064e-08C42.1167 -2.66867e-08 42.7273 0.610521 42.7273 1.36364L42.7273 15.6364C42.7273 16.3895 42.1167 17 41.3636 17V17C40.6105 17 40 16.3895 40 15.6364L40 1.36364C40 0.610521 40.6105 -9.25261e-08 41.3636 -5.96064e-08V-5.96064e-08Z",
        fill: "#fff"
      }))
    }];
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      blockCssY.items[itemWrapSelector] = blockCssY.items[itemWrapSelector] != undefined ? blockCssY.items[itemWrapSelector] : {};
      blockCssY.items[paginationSelector] = blockCssY.items[paginationSelector] != undefined ? blockCssY.items[paginationSelector] : {};
      var wordBreak = blockCssY.items[itemWrapSelector]['word-break'] != undefined ? blockCssY.items[itemWrapSelector]['word-break'] : {};
      wordBreak[breakPointX] = 'break-word';
      blockCssY.items[itemWrapSelector] = { ...blockCssY.items[itemWrapSelector],
        'word-break': wordBreak
      };
      blockCssY.items[paginationSelector] = { ...blockCssY.items[paginationSelector],
        'text-align': {
          "Desktop": "center"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'display': {
          "Desktop": "inline-block"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'cursor': {
          "Desktop": "pointer"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'color': {
          "Desktop": "#18978F"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'background-color': {
          "Desktop": "#9DD6DF"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'margin-left': {
          "Desktop": "5px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'margin-right': {
          "Desktop": "5px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'padding-top': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'padding-right': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'padding-bottom': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[paginationItemSelector] = { ...blockCssY.items[paginationItemSelector],
        'padding-left': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
        'grid-template-columns': {
          "Desktop": "1fr 1fr 1fr",
          "Tablet": "1fr 1fr",
          "Mobile": "1fr"
        }
      };
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });

      if (pagination.options.type.length == 0) {
        var paginationOptons = { ...pagination.options,
          type: 'normal'
        };
        setAttributes({
          pagination: { ...pagination,
            options: paginationOptons
          }
        });
      }
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      blockCssY.items[itemsWrapSelector] = blockCssY.items[itemsWrapSelector] != undefined ? blockCssY.items[itemsWrapSelector] : {};
      var display = blockCssY.items[itemsWrapSelector]['display'] != undefined ? blockCssY.items[itemsWrapSelector]['display'] : {};
      display[breakPointX] = 'grid';
      blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
        'display': display
      };

      if (grid.styles.gridTemplateColumns[breakPointX] != undefined) {
        var gridTemplateColumns = blockCssY.items[itemsWrapSelector]['grid-template-columns'] != undefined ? blockCssY.items[itemsWrapSelector]['grid-template-columns'] : {};
        gridTemplateColumns[breakPointX] = grid.styles.gridTemplateColumns[breakPointX].map(item => {
          return item.val + item.unit + ' ';
        }).join(' ');
        blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
          'grid-template-columns': gridTemplateColumns
        };
      }

      if (grid.styles.gridTemplateRows[breakPointX] != undefined) {
        var gridTemplateRows = blockCssY.items[itemsWrapSelector]['grid-template-rows'] != undefined ? blockCssY.items[itemsWrapSelector]['grid-template-rows'] : {};
        gridTemplateRows[breakPointX] = grid.styles.gridTemplateRows[breakPointX].map(item => {
          return item.val + item.unit + ' ';
        }).join(' ');
        blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
          'grid-template-rows': gridTemplateRows
        };
      }

      if (grid.styles.colGap[breakPointX] != undefined) {
        var colGap = blockCssY.items[itemsWrapSelector]['column-gap'] != undefined ? blockCssY.items[itemsWrapSelector]['column-gap'] : {};
        colGap[breakPointX] = grid.styles.colGap[breakPointX].val + grid.styles.colGap[breakPointX].unit;
        blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
          'column-gap': colGap
        };
      }

      if (grid.styles.rowGap[breakPointX] != undefined) {
        var rowGap = blockCssY.items[itemsWrapSelector]['row-gap'] != undefined ? blockCssY.items[itemsWrapSelector]['row-gap'] : {};
        rowGap[breakPointX] = grid.styles.rowGap[breakPointX].val + grid.styles.rowGap[breakPointX].unit;
        blockCssY.items[itemsWrapSelector] = { ...blockCssY.items[itemsWrapSelector],
          'row-gap': rowGap
        };
      }

      var nthItemsResponsive = [];
      var itemX = { ...blockCssY.items
      };
      Object.entries(grid.options.itemCss).map(args => {
        /****breakPoint****/
        var breakPoint = args[0];
        var nthItems = args[1];
        nthItems.length > 0 && nthItems.map((x, i) => {
          /****nthItems****/
          Object.entries(x).map(attr => {
            var attrId = attr[0];
            var attrVal = attr[1];

            if (nthItemsResponsive[i] != undefined) {//nthItemsResponsive[i] = [];
            } else {
              nthItemsResponsive[i] = [];
            }

            if (nthItemsResponsive[i][attrId] != undefined) {//nthItemsResponsive[i][attrId] = [];
            } else {
              nthItemsResponsive[i][attrId] = [];
            }

            if (nthItemsResponsive[i][attrId][breakPoint] != undefined) {
              nthItemsResponsive[i][attrId][breakPoint] = attrVal;
            } else {
              nthItemsResponsive[i][attrId][breakPoint] = attrVal;
            }
          });
        });
      });

      for (var i = 0; i < 10; i++) {
        var selector = `${blockClass} .item:nth-child(${i})`;

        if (blockCssY.items[selector] != undefined) {
          delete blockCssY.items[selector];
        }
      }

      var imtasdas = {};
      nthItemsResponsive.length > 0 && nthItemsResponsive.map((nth, i) => {
        var selector = `${blockClass} .item:nth-child(${i + 1})`;
        Object.entries(nth).map(attr => {
          var attrId = attr[0];
          var attrVal = attr[1];

          if (imtasdas[selector] != undefined) {} else {
            imtasdas[selector] = {};
          }

          if (imtasdas[selector][attrId] != undefined) {} else {
            imtasdas[selector][attrId] = {};
          }

          imtasdas[selector][attrId] = attrVal;
        });
      });
      var asdsd = { ...blockCssY.items,
        ...imtasdas
      };
      setAttributes({
        blockCssY: {
          items: asdsd
        }
      });
    }, [grid]);
    var [layoutImporting, setlayoutImporting] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false); // Using the hook.

    function importLayout(postData) {
      setTimeout(() => {
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
          path: '/post-grid/v2/import_post_grid_template',
          method: 'POST',
          data: {
            postData: postData
          }
        }).then(res => {
          setlayoutImporting(false);
        });
      }, 2000);
    } // const paginationTypes = {
    //   none: { label: 'None', value: 'none', isPro: false },
    //   normal: { label: 'Normal Pagination', value: 'normal', isPro: false },
    //   ajax: { label: 'Ajax Pagination', value: 'ajax', isPro: true },
    //   next_previous: { label: 'Next-Previous', value: 'next_previous', isPro: true },
    //   loadmore: { label: 'Load More', value: 'loadmore', isPro: true },
    //   infinite: { label: 'Infinite Load', value: 'infinite', isPro: true },
    // };
    // [
    //       { label: 'None', value: 'none', isPro: false },
    //       { label: 'Normal Pagination', value: 'normal', isPro: false },
    //       { label: 'Ajax Pagination', value: 'ajax', isPro: true },
    //       { label: 'Next-Previous', value: 'next_previous', isPro: true },
    //       { label: 'Load More', value: 'loadmore', isPro: true },
    //       { label: 'Infinite Load', value: 'infinite', isPro: true },
    //     ]
    // var ItemNthCssadasd2 = grid.options.itemCss.map((x, i) => {
    //   return (
    //     `<style>.item:nth-child(${i + 1}){grid-column-start: ${x['grid-column-start']};grid-column-end: ${x['grid-column-end']};grid-row-start: ${x['grid-row-start']};grid-row-end: ${x['grid-row-end']};}</style>`
    //   )
    // });


    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_25__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_25__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function addQueryPreset(option, index) {
      queryArgs.items = option.value.items;
      setAttributes({
        queryArgs: {
          items: queryArgs.items
        }
      });
      fetchPosts();
    }

    var postTypes = [];
    const postTypesData = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_9__.store).getPostTypes({
      per_page: -1
    }), []);
    postTypesData !== null && postTypesData.map(x => {
      postTypes.push({
        value: x.slug,
        label: x.name
      });
    });
    const TEMPLATE = [['core/post-title'], ['core/post-date'], ['core/post-excerpt']];
    const TEMPLATE1 = [['core/post-date'], ['core/post-title'], ['core/post-excerpt']]; //var blocks = select.getBlocks(clientId);

    var defaultBloicks = []; //var [blocksX, setBlocksX] = useState(blocks); // Using the hook.

    var [TEMPLATEX, setTEMPLATEX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(TEMPLATE); // Using the hook.

    function PostTemplateInnerBlocks(_ref) {
      let {
        attsx
      } = _ref;
      const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.useInnerBlocksProps)({
        className: 'item'
      }, {
        template: attsx
      });
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", innerBlocksProps);
    }

    function PostTemplateBlockPreview(_ref2) {
      let {
        blocks,
        blockContextId,
        isHidden,
        setActiveBlockContextId
      } = _ref2;
      const blockPreviewProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.__experimentalUseBlockPreview)({
        blocks,
        props: {
          className: 'item'
        }
      });

      const handleOnClick = () => {
        setActiveBlockContextId(blockContextId);
      };

      const style = {
        display: isHidden ? 'none' : undefined
      };
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockPreviewProps, {
        tabIndex: 0 // eslint-disable-next-line jsx-a11y/no-noninteractive-element-to-interactive-role
        ,
        role: "button",
        onClick: handleOnClick,
        onKeyPress: handleOnClick,
        style: style
      }));
    }

    const MemoizedPostTemplateBlockPreview = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.memo)(PostTemplateBlockPreview);
    const [activeBlockContextId, setActiveBlockContextId] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(); // const useGetDeviceType = () => {
    //   const { deviceType } = useSelect((select) => {
    //     const { __experimentalGetPreviewDeviceType: getPreviewDeviceType } =
    //       select("core/edit-post") || false;
    //     if (!getPreviewDeviceType) {
    //       return {
    //         deviceType: null,
    //       };
    //     }
    //     return {
    //       deviceType: getPreviewDeviceType(),
    //     };
    //   }, []);
    //   console.log(deviceType);
    //   return deviceType;
    // };
    // const deviceType = useGetDeviceType() || "Desktop";

    function onChangeBreakPoint(x, _index) {
      var asdsdsd = wp.data.dispatch('postgrid-shop').setBreakPoint(x.value);
      asdsdsd.then(res => {
        setBreakPointX(res.breakpoint);
        myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      });
      const {
        __experimentalGetPreviewDeviceType: getPreviewDeviceType
      } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.select)('core/edit-post');
      const gutenbergDeviceType = getPreviewDeviceType();
      console.log(gutenbergDeviceType);
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const [posts, setPosts] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [postsQuery, setPostsQuery] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false); // Using the hook.

    const [paginationItems, setPaginationItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    function fetchPosts() {
      setPostsQuery(true);
      setIsBusy(true);
      var arg = queryArgs.items.map(item => {
        return {
          id: item.id,
          val: item.val
        };
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
        path: '/post-grid/v2/get_posts',
        method: 'POST',
        data: {
          queryArgs: arg,
          rawData: layout.rawData
        }
      }).then(res => {
        setPostsQuery(false);
        setPosts(res.posts);
        setPaginationItems(res.pagination);
        setIsBusy(false);
      });
    }

    function generateLayout(x, _i) {
      var savedBlocks = layout.data;
      var content = "<!-- wp:paragraph --><p>paragraph one</p><!-- /wp:paragraph --><!-- wp:paragraph --><p>then two</p><!-- /wp:paragraph -->"; // Parse the serialized content into valid blocks using parse from @wordpress/block-serialization-default-parser

      var blocks = savedBlocks.length > 0 ? savedBlocks : parse(content);
      var sss = blocks.map((block, i) => {
        if (block.blockName !== null) {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, block.innerBlocks.length > 0 ? recursInnerBlocksHtml(block.innerBlocks, i) : block.innerHTML);
        }
      });
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "bg-gray-400 p-3 "
      }, x.post_title, sss);
    }

    function recursInnerBlocksHtml(blocks) {
      let _index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;

      var xx = blocks.map((block, i) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, "2nd Block", block.innerBlocks.length > 0 ? block.innerHTML + recursInnerBlocksHtml(block.innerBlocks, i) : block.innerHTML);
      });
      return xx;
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      fetchPosts();
    }, [layout]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      fetchPosts();
    }, [queryArgs]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      fetchLayouts();
      fetchLayoutData();
    }, [container]);

    function flatObject(block, flatObj, flatObjCss) {
      flatObj.push(block);
      var items = block.attrs.blockCssY != undefined ? block.attrs.blockCssY.items : [];

      if (Object.entries(items).length > 0) {
        Object.entries(items).map(data => {
          var handle = data[0];
          var css = data[1]; //flatObjCss[handle] = css;
        });
      }

      if (block.innerBlocks != undefined) {
        block.innerBlocks.map(block => {
          flatObject(block, flatObj);
        });
      }

      return flatObj;
    }

    function getCssfromBlocks(allStyle, blocks) {
      blocks.map((block, i) => {
        var items = block.attrs.blockCssY != undefined ? block.attrs.blockCssY.items : [];
        var innerBlocks = block.innerBlocks != undefined ? block.innerBlocks : [];

        if (Object.entries(items).length > 0) {
          Object.entries(items).map(data => {
            var handle = data[0];
            var css = data[1];
            allStyle[handle] = css;
          });
        }

        if (innerBlocks.length > 0) {
          getCssfromBlocks(allStyle, innerBlocks);
        }
      });
      console.log(allStyle);
      return allStyle;
    }

    function selectLayout(id, postContent) {
      var srcServer = layoutData.source;

      if (srcServer == 'library') {
        var blocks = parse(postContent);
        setAttributes({
          layout: {
            id: null,
            srcServer: srcServer,
            data: blocks,
            rawData: postContent
          }
        });
        var allStyle = {};
        var allStyleX = getCssfromBlocks(allStyle, blocks);
        console.log(allStyleX); // blocks.map((block, i) => {
        //   var items = (block.attrs.blockCssY != undefined) ? block.attrs.blockCssY.items : [];
        //   if (Object.entries(items).length > 0) {
        //     Object.entries(items).map(data => {
        //       var handle = data[0];
        //       var css = data[1];
        //       allStyle[handle] = css;
        //     })
        //   }
        // })

        var xxx = { ...blockCssY.items,
          ...allStyleX
        };
        setAttributes({
          blockCssY: {
            items: xxx
          }
        });
      } else {
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
          path: '/post-grid/v2/get_post_data',
          method: 'POST',
          data: {
            postId: id
          }
        }).then(res => {
          var postContent = res.post_content.replace(/(^[ \t]*\n)/gm, "");
          var blocks = parse(postContent);
          setAttributes({
            layout: {
              id: id,
              srcServer: srcServer,
              data: blocks,
              rawData: postContent
            }
          });
          var allStyle = {};
          var flatObj = [];
          var flatObjCss = [];
          var flatData = flatObject(blocks[0], flatObj, flatObjCss);
          flatData.map((block, i) => {
            var items = block.attrs.blockCssY != undefined ? block.attrs.blockCssY.items : [];

            if (Object.entries(items).length > 0) {
              Object.entries(items).map(data => {
                var handle = data[0];
                var css = data[1];
                allStyle[handle] = css;
              });
            }
          });
          var xxx = { ...blockCssY.items,
            ...allStyle
          };
          setAttributes({
            blockCssY: {
              items: xxx
            }
          });
        });
      } //console.log(wp.data.select('core/block-editor').getBlocks());
      //wp.data.dispatch('core/block-editor').insertBlocks(wp.blocks.parse(post_content));
      //wp.data.dispatch('core/notices').createNotice('success', 'Here is our notice!');
      //var content = "<!-- wp:paragraph --><p>paragraph one</p><!-- /wp:paragraph --><!-- wp:paragraph --><p>then two</p><!-- /wp:paragraph -->";
      //Parse the serialized content into valid blocks using parse from @wordpress/block-serialization-default-parser
      // var gutblock = wp.blocks.rawHandler({
      //   HTML: post_content,
      // });
      //setBlocksX(gutblock)
      // setAttributes({ layout: { id: id, data: blocks, rawData: post_content } })

    }

    const [queryLayouts, setQueryLayouts] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
      keyword: '',
      page: 1,
      category: ''
    });
    var [layoutList, setLayoutList] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
      items: []
    });
    var [layoutData, setLayoutData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
      source: 'library'
    });
    var [layoutLoading, setLayoutLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    var [layoutCats, setLayoutCats] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var keywordLength = queryLayouts.keyword.length;

      if (keywordLength != 0) {
        if (keywordLength >= 4) {
          fetchLayouts();
        } else {}
      } else {
        fetchLayouts();
      }
    }, [layoutData]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var keywordLength = queryLayouts.keyword.length;

      if (keywordLength != 0) {
        if (keywordLength >= 4) {
          fetchLayouts();
        } else {}
      } else {
        fetchLayouts();
      }
    }, [queryLayouts]);

    function fetchLayouts() {
      setLayoutLoading(true);

      if (layoutData.source == 'saved') {
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
          path: '/post-grid/v2/get_posts_layout',
          method: 'POST',
          data: {
            category: queryLayouts.category,
            page: queryLayouts.page,
            keyword: queryLayouts.keyword
          }
        }).then(res => {
          setLayoutList({
            items: res.posts
          });
          setLayoutCats(res.terms);
          setLayoutLoading(false);
        });
      } else {
        fetch("https://getpostgrid.com/wp-json/postlayout/v2/get_post_layouts?category=" + queryLayouts.category + "&page=" + queryLayouts.page + "&keyword=" + queryLayouts.keyword, {
          method: "GET",
          headers: {
            "Content-Type": "application/json;charset=utf-8"
          }
        }).then(response => {
          if (response.ok && response.status < 400) {
            response.json().then(data => {
              setLayoutList({
                items: data.posts
              });
              setLayoutCats(data.terms);
              setLayoutLoading(false);
            });
          }
        }).catch(_error => {//this.saveAsStatus = 'error';
          // handle the error
        });
      }
    }

    function fetchLayoutData() {
      setQueryLayouts({
        keyword: queryLayouts.keyword,
        page: queryLayouts.page,
        category: queryLayouts.category
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
        path: '/post-grid/v2/get_posts_layout',
        method: 'POST',
        data: {
          category: queryLayouts.category,
          source: queryLayouts.source,
          page: queryLayouts.page,
          keyword: queryLayouts.keyword
        }
      }).then(_res => {
        setLayoutData({
          source: layoutData.source
        });
        setQueryLayouts({
          keyword: queryLayouts.keyword,
          page: queryLayouts.page,
          category: queryLayouts.category
        });
      });
    }

    function updateQueryPram(newVal, index) {
      var itemData = queryArgs.items[index];
      itemData.val = newVal;
      queryArgs.items[index] = itemData;
      setAttributes({
        queryArgs: {
          items: queryArgs.items
        }
      });
      fetchPosts(); // if (itemData.id == 's' || itemData.id == 'order'  ) {
      //     itemData.val = newVal;
      //     queryArgs.items[index] = itemData;
      //     setAttributes({ queryArgs: { items: queryArgs.items } });
      // }
      // if (itemData.id == 'postType' || itemData.id == 'orderby' || itemData.id == 'postStatus') {
      //     itemData.val = newVal;
      //     queryArgs.items[index] = itemData;
      //     setAttributes({ queryArgs: { items: queryArgs.items } });
      // }
      //queryArgs.items.splice(i, 1);
    }

    function generateQueryArgOptions(item, index) {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: " "
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
        title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RemoveQueryPram, {
          title: item.label,
          index: index
        }),
        initialOpen: false
      }, item.id == 'postType' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'postType' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_input_select__WEBPACK_IMPORTED_MODULE_24__["default"], {
        val: item.val,
        options: postTypes,
        multiple: true,
        onChange: newVal => {
          updateQueryPram(newVal, index);
        }
      })), item.id == 'postStatus' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'postStatus' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_input_select__WEBPACK_IMPORTED_MODULE_24__["default"], {
        val: item.val,
        options: [{
          label: 'Publish',
          value: 'publish'
        }, {
          label: 'Pending',
          value: 'pending'
        }, {
          label: 'Draft',
          value: 'draft'
        }, {
          label: 'Auto draft',
          value: 'auto-draft'
        }, {
          label: 'Future',
          value: 'future'
        }, {
          label: 'Private',
          value: 'private'
        }, {
          label: 'Inherit',
          value: 'inherit'
        }, {
          label: 'Trash',
          value: 'trash'
        }, {
          label: 'Any',
          value: 'any'
        }],
        multiple: true,
        onChange: newVal => {
          updateQueryPram(newVal, index);
        }
      })), item.id == 'order' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'order' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val,
        options: [{
          label: 'Ascending',
          value: 'ASC'
        }, {
          label: 'Descending',
          value: 'DESC'
        }],
        onChange: newVal => updateQueryPram(newVal, index)
      })), item.id == 'orderby' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'orderby' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_input_select__WEBPACK_IMPORTED_MODULE_24__["default"], {
        val: item.val,
        options: [{
          label: 'None',
          value: 'none'
        }, {
          label: 'ID',
          value: 'ID'
        }, {
          label: 'Author',
          value: 'author'
        }, {
          label: 'Title',
          value: 'title'
        }, {
          label: 'Name',
          value: 'name'
        }, {
          label: 'Type',
          value: 'type'
        }, {
          label: 'Date',
          value: 'date'
        }, {
          label: 'Modified',
          value: 'modified'
        }, {
          label: 'Parent',
          value: 'parent'
        }, {
          label: 'Random',
          value: 'rand'
        }, {
          label: 'Comment Count',
          value: 'comment_count'
        }, {
          label: 'Relevance',
          value: 'relevance'
        }, {
          label: 'Menu Order',
          value: 'menu_order'
        }, {
          label: 'Meta Value(String)',
          value: 'meta_value'
        }, {
          label: 'Meta Value(Number)',
          value: 'meta_value_num'
        }, {
          label: 'post__in',
          value: 'post__in'
        }, {
          label: 'post_name__in',
          value: 'post_name__in'
        }, {
          label: 'post_parent__in',
          value: 'post_parent__in'
        }],
        multiple: true,
        onChange: newVal => {
          updateQueryPram(newVal, index);
        }
      })), item.id == 'taxQueryRelation' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'taxQueryRelation' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val,
        options: [{
          label: 'OR',
          value: 'OR'
        }, {
          label: 'AND',
          value: 'AND'
        }],
        onChange: newVal => updateQueryPram(newVal, index)
      })), item.id == 'metaQuery' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-blue-600 text-sm",
        onClick: _ev => {
          var itemData = queryArgs.items[index];
          var xx = itemData.val.concat({
            fields: [{
              key: '',
              value: '',
              type: '',
              compare: ''
            }],
            relation: 'OR'
          });
          queryArgs.items[index].val = xx;
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      }, "Add"), item.val.map((x, j) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
          title: "Meta Field",
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-red-600 text-sm",
          onClick: _ev => {
            var itemData = queryArgs.items[index];
            var xx = itemData.val.splice(j, 1);
            queryArgs.items[index].val = itemData.val;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Remove"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, "Relation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
          style: {
            margin: 0
          },
          label: "",
          value: x.relation,
          options: [{
            label: 'OR',
            value: 'OR'
          }, {
            label: 'AND',
            value: 'AND'
          }],
          onChange: newVal => {
            var itemData = queryArgs.items[index]; //itemData.val.relation = newVal;

            itemData.val[j].relation = newVal; //var term = itemData.val[j].fields[k]
            //term.taxonomy = newVal;

            queryArgs.items[index].val = itemData.val;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), x.fields.map((y, k) => {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "border-b border-solid border-gray-300 py-3"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "cursor-pointer block text-right mb-2 px-3 py-1 text-white bg-red-600 text-sm",
            onClick: _ev => {
              var itemData = queryArgs.items[index];
              var fields = itemData.val[j].fields;
              var xx = itemData.val[j].fields.splice(k, 1);
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }, "Remove"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
            label: "Custom field key",
            value: y.key,
            placeholder: "meta_key",
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].fields[k];
              term.key = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
            label: "Meta Value ",
            value: y.value,
            placeholder: "25",
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].fields[k];
              term.value = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
            style: {
              margin: 0
            },
            label: "Custom field type",
            value: y.type,
            options: [{
              label: 'NUMERIC',
              value: 'NUMERIC'
            }, {
              label: 'BINARY',
              value: 'BINARY'
            }, {
              label: 'CHAR',
              value: 'CHAR'
            }, {
              label: 'DATE',
              value: 'DATE'
            }, {
              label: 'DATETIME',
              value: 'DATETIME'
            }, {
              label: 'DECIMAL',
              value: 'DECIMAL'
            }, {
              label: 'SIGNED',
              value: 'SIGNED'
            }, {
              label: 'TIME',
              value: 'TIME'
            }, {
              label: 'UNSIGNED',
              value: 'UNSIGNED'
            }],
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].fields[k];
              term.type = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
            style: {
              margin: 0
            },
            label: "compare ",
            value: y.compare,
            options: [{
              label: '=',
              value: '='
            }, {
              label: '!=',
              value: '!='
            }, {
              label: '>',
              value: '>'
            }, {
              label: '>=',
              value: '>='
            }, {
              label: '<',
              value: '<'
            }, {
              label: '<=',
              value: '<='
            }, {
              label: 'LIKE',
              value: 'LIKE'
            }, {
              label: 'NOT LIKE',
              value: 'NOT LIKE'
            }, {
              label: 'IN',
              value: 'IN'
            }, {
              label: 'NOT IN',
              value: 'NOT IN'
            }, {
              label: 'BETWEEN',
              value: 'BETWEEN'
            }, {
              label: 'NOT BETWEEN',
              value: 'NOT BETWEEN'
            }, {
              label: 'EXISTS',
              value: 'EXISTS'
            }, {
              label: 'NOT EXISTS',
              value: 'NOT EXISTS'
            }],
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].fields[k];
              term.compare = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          })));
        }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "cursor-pointer text-center px-3 py-1 text-white bg-blue-600 text-sm",
          onClick: _ev => {
            var itemData = queryArgs.items[index];
            var xx = itemData.val[j].fields.concat({
              key: '',
              value: '',
              type: '',
              compare: ''
            });
            queryArgs.items[index].val[j].fields = xx;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Add")));
      }))), item.id == 'dateQuery' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
        className: "my-3"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Add Arguments"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
        options: [{
          "value": "",
          "label": "Select..."
        }, {
          "value": "year",
          "label": "Year"
        }, {
          "value": "month",
          "label": "Month"
        }, {
          "value": "week",
          "label": "Week"
        }, {
          "value": "day",
          "label": "Day"
        }, {
          "value": "hour",
          "label": "Hour"
        }, {
          "value": "minute",
          "label": "Minute"
        }, {
          "value": "second",
          "label": "Second"
        }, {
          "value": "after",
          "label": "After"
        }, {
          "value": "before",
          "label": "Before"
        }, {
          "value": "inclusive",
          "label": "Inclusive"
        }, {
          "value": "compare",
          "label": "Compare"
        }, {
          "value": "column",
          "label": "Column"
        }, {
          "value": "relation",
          "label": "Relation"
        }],
        onChange: newVal => {
          var itemData = queryArgs.items[index];

          if (newVal == 'year') {
            var xx = itemData.val.concat({
              id: 'year',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'month') {
            var xx = itemData.val.concat({
              id: 'month',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'week') {
            var xx = itemData.val.concat({
              id: 'week',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'day') {
            var xx = itemData.val.concat({
              id: 'day',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'hour') {
            var xx = itemData.val.concat({
              id: 'hour',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'minute') {
            var xx = itemData.val.concat({
              id: 'minute',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'second') {
            var xx = itemData.val.concat({
              id: 'second',
              value: '',
              compare: ''
            });
          }

          if (newVal == 'inclusive') {
            var xx = itemData.val.concat({
              id: 'inclusive',
              value: true
            });
          }

          if (newVal == 'compare') {
            var xx = itemData.val.concat({
              id: 'compare',
              value: ''
            });
          }

          if (newVal == 'column') {
            var xx = itemData.val.concat({
              id: 'column',
              value: ''
            });
          }

          if (newVal == 'relation') {
            var xx = itemData.val.concat({
              id: 'relation',
              value: ''
            });
          }

          if (newVal == 'before') {
            var xx = itemData.val.concat({
              id: 'before',
              value: '',
              year: '',
              month: '',
              day: ''
            });
          }

          if (newVal == 'after') {
            var xx = itemData.val.concat({
              id: 'after',
              value: '',
              year: '',
              month: '',
              day: ''
            });
          }

          queryArgs.items[index].val = xx;
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      })), item.val.map((x, j) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
          title: x.id,
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          className: "cursor-pointer px-3 py-1 text-white bg-red-600 text-sm my-2 inline-block",
          onClick: _ev => {
            queryArgs.items[index].val.splice(j, 1);
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Delete"), (x.id == 'after' || x.id == 'before') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Year"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
          placeholder: "",
          onChange: newVal => {
            //clearTimeout(debounce);
            // debounce = setTimeout(() => {
            queryArgs.items[index].val[j].year = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            }); //}, 1000);
          }
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Month"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
          placeholder: "",
          onChange: newVal => {
            // clearTimeout(debounce);
            //debounce = setTimeout(() => {
            queryArgs.items[index].val[j].month = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            }); //}, 1000);
          }
        })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Day"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
          placeholder: "",
          onChange: newVal => {
            clearTimeout(debounce);
            debounce = setTimeout(() => {
              queryArgs.items[index].val[j].day = newVal;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }, 1000);
          }
        }))), x.id == 'inclusive' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
          style: {
            margin: 0
          },
          options: [{
            label: 'True',
            value: true
          }, {
            label: 'False',
            value: false
          }],
          onChange: newVal => {
            queryArgs.items[index].val[j].value = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), x.id == 'compare' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
          style: {
            margin: 0
          },
          options: [{
            label: '=',
            value: '='
          }, {
            label: '!=',
            value: '!='
          }, {
            label: '>',
            value: '>'
          }, {
            label: '>=',
            value: '>='
          }, {
            label: '<',
            value: '<'
          }, {
            label: '<=',
            value: '<='
          }, {
            label: 'IN',
            value: 'IN'
          }, {
            label: 'NOT IN',
            value: 'NOT IN'
          }, {
            label: 'EXISTS',
            value: 'EXISTS'
          }, {
            label: 'NOT EXISTS',
            value: 'NOT EXISTS'
          }, {
            label: 'BETWEEN',
            value: 'BETWEEN'
          }, {
            label: 'NOT BETWEEN',
            value: 'NOT BETWEEN'
          }],
          onChange: newVal => {
            queryArgs.items[index].val[j].value = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), x.id == 'column' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
          placeholder: "",
          onChange: newVal => {
            clearTimeout(debounce);
            debounce = setTimeout(() => {
              queryArgs.items[index].val[j].value = newVal;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }, 1000);
          }
        })), x.id == 'relation' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
          style: {
            margin: 0
          },
          options: [{
            label: 'OR',
            value: 'OR'
          }, {
            label: 'AND',
            value: 'AND'
          }],
          onChange: newVal => {
            queryArgs.items[index].val[j].value = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), (x.id == 'year' || x.id == 'month' || x.id == 'week' || x.id == 'day' || x.id == 'hour' || x.id == 'minute' || x.id == 'second') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
          label: "Value",
          placeholder: "",
          onChange: newVal => {
            //clearTimeout(debounce);
            //debounce = setTimeout(() => {
            queryArgs.items[index].val[j].value = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            }); //}, 1000);
          }
        }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
          style: {
            margin: 0
          },
          label: "compare ",
          options: [{
            label: '=',
            value: '='
          }, {
            label: '!=',
            value: '!='
          }, {
            label: '>',
            value: '>'
          }, {
            label: '>=',
            value: '>='
          }, {
            label: '<',
            value: '<'
          }, {
            label: '<=',
            value: '<='
          }, {
            label: 'IN',
            value: 'IN'
          }, {
            label: 'NOT IN',
            value: 'NOT IN'
          }, {
            label: 'EXISTS',
            value: 'EXISTS'
          }, {
            label: 'NOT EXISTS',
            value: 'NOT EXISTS'
          }, {
            label: 'BETWEEN',
            value: 'BETWEEN'
          }, {
            label: 'NOT BETWEEN',
            value: 'NOT BETWEEN'
          }],
          onChange: newVal => {
            queryArgs.items[index].val[j].compare = newVal;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }))));
      })), item.id == 'taxQuery' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-blue-600 text-sm",
        onClick: _ev => {
          var itemData = queryArgs.items[index];
          var xx = itemData.val.concat({
            terms: [{
              taxonomy: '',
              field: '',
              terms: [],
              operator: ''
            }],
            relation: 'OR'
          });
          queryArgs.items[index].val = xx;
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      }, "Add"), item.val.map((x, j) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
          title: "Term",
          initialOpen: false
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-red-600 text-sm",
          onClick: _ev => {
            var itemData = queryArgs.items[index];
            var xx = itemData.val.splice(j, 1);
            queryArgs.items[index].val = itemData.val;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Remove"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, "Terms Relation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
          style: {
            margin: 0
          },
          label: "",
          value: x.relation,
          options: [{
            label: 'OR',
            value: 'OR'
          }, {
            label: 'AND',
            value: 'AND'
          }],
          onChange: newVal => {
            var itemData = queryArgs.items[index]; //itemData.val.relation = newVal;

            itemData.val[j].relation = newVal; //var term = itemData.val[j].terms[k]
            //term.taxonomy = newVal;

            queryArgs.items[index].val = itemData.val;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        })), x.terms.map((y, k) => {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "border-b border-solid border-gray-300 py-3"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
            label: "Taxonomy",
            value: y.taxonomy,
            placeholder: "Taxonomy",
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].terms[k];
              term.taxonomy = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
            label: "Terms",
            value: y.terms.join(','),
            placeholder: "Comma separated",
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].terms[k];
              term.terms = newVal.split(',');
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
            style: {
              margin: 0
            },
            label: "Fields",
            value: y.field,
            options: [{
              label: 'Choose...',
              value: ''
            }, {
              label: 'Term ID',
              value: 'term_id'
            }, {
              label: 'Name',
              value: 'name'
            }, {
              label: 'Slug',
              value: 'slug'
            }, {
              label: 'Term taxonomy id',
              value: 'term_taxonomy_id'
            }],
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].terms[k];
              term.field = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
            style: {
              margin: 0
            },
            label: "Operator",
            value: y.operator,
            options: [{
              label: 'Choose...',
              value: ''
            }, {
              label: 'IN',
              value: 'IN'
            }, {
              label: 'NOT IN',
              value: 'NOT IN'
            }, {
              label: 'AND',
              value: 'AND'
            }, {
              label: 'EXISTS',
              value: 'EXISTS'
            }, {
              label: 'NOT EXISTS',
              value: 'NOT EXISTS'
            }],
            onChange: newVal => {
              var itemData = queryArgs.items[index];
              var term = itemData.val[j].terms[k];
              term.operator = newVal;
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "cursor-pointer block text-center my-2 px-3 py-1 text-white bg-red-600 text-sm",
            onClick: _ev => {
              var itemData = queryArgs.items[index];
              var terms = itemData.val[j].terms;
              var xx = itemData.val[j].terms.splice(k, 1);
              queryArgs.items[index].val = itemData.val;
              setAttributes({
                queryArgs: {
                  items: queryArgs.items
                }
              });
            }
          }, "Remove"));
        }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "cursor-pointer text-center px-3 py-1 text-white bg-blue-600 text-sm",
          onClick: _ev => {
            var itemData = queryArgs.items[index];
            var xx = itemData.val[j].terms.concat({
              taxonomy: '',
              field: '',
              terms: [],
              operator: ''
            });
            queryArgs.items[index].val[j].terms = xx;
            setAttributes({
              queryArgs: {
                items: queryArgs.items
              }
            });
          }
        }, "Add")));
      }))), (item.id == 'metaKey' || item.id == 's' || item.id == 'metaValue' || item.id == 'metaValueNum' || item.id == 'year' || item.id == 'monthnum' || item.id == 'w' || item.id == 'day' || item.id == 'hour' || item.id == 'minute' || item.id == 'second' || item.id == 'm' || item.id == 'author' || item.id == 'authorName' || item.id == 'tag' || item.id == 'tagId' || item.id == 'cat' || item.id == 'categoryName' || item.id == 'p' || item.id == 'name' || item.id == 'pageId' || item.id == 'pagename' || item.id == 'postParent' || item.id == 'postsPerPage' || item.id == 'paged' || item.id == 'offset' || item.id == 'postsPerArchivePage' || item.id == 'perm') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: item.val,
        onChange: newVal => {
          clearTimeout(debounce);
          debounce = setTimeout(() => {
            updateQueryPram(newVal, index);
          }, 1000);
        }
      })), item.id == 'metaCompare' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val,
        options: [{
          label: '=',
          value: '='
        }, {
          label: '!=',
          value: '!='
        }, {
          label: '>',
          value: '>'
        }, {
          label: '>=',
          value: '>='
        }, {
          label: '<',
          value: '<'
        }, {
          label: '<=',
          value: '<='
        }, {
          label: 'LIKE',
          value: 'LIKE'
        }, {
          label: 'NOT LIKE',
          value: 'NOT LIKE'
        }, {
          label: 'IN',
          value: 'IN'
        }, {
          label: 'NOT IN',
          value: 'NOT IN'
        }, {
          label: 'BETWEEN',
          value: 'BETWEEN'
        }, {
          label: 'NOT BETWEEN',
          value: 'NOT BETWEEN'
        }, {
          label: 'NOT EXISTS',
          value: 'NOT EXISTS'
        }, {
          label: 'REGEXP',
          value: 'REGEXP'
        }, {
          label: 'NOT REGEXP',
          value: 'NOT REGEXP'
        }, {
          label: 'RLIKE',
          value: 'RLIKE'
        }],
        onChange: newVal => {
          updateQueryPram(newVal, index);
        }
      })), item.id == 'postPassword' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: item.val,
        onChange: newVal => updateQueryPram(newVal, index)
      })), (item.id == 'postNameIn' || item.id == 'authorIn' || item.id == 'authorNotIn' || item.id == 'postNotIn' || item.id == 'postIn' || item.id == 'postParentNotIn' || item.id == 'tagNotIn' || item.id == 'tagAnd' || item.id == 'tagIn' || item.id == 'postParentIn' || item.id == 'tagSlugIn' || item.id == 'tagSlugAnd' || item.id == 'categoryNotIn' || item.id == 'categoryIn' || item.id == 'categoryAnd') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: item.val,
        placeholder: "Comma separated",
        onChange: newVal => updateQueryPram(newVal, index)
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: item.id == 'postNameIndd' ? '' : 'hidden'
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer text-center px-3 py-1 text-white bg-blue-600 text-sm",
        onClick: _ev => {
          var itemData = queryArgs.items[index];
          var val = itemData.val.concat({
            slug: ''
          });
          itemData.val = val;
          queryArgs.items[index] = itemData;
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      }, "Add")), item.id == 'commentCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: item.val.value,
        placeholder: "Comment Count, Ex: 25",
        onChange: newVal => updateQueryPram({
          value: newVal,
          compare: item.val.compare
        }, index)
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val.compare,
        options: [{
          label: '=',
          value: '='
        }, {
          label: '!=',
          value: '!='
        }, {
          label: '>',
          value: '>'
        }, {
          label: '>=',
          value: '>='
        }, {
          label: '<',
          value: '<'
        }, {
          label: '<=',
          value: '<='
        }],
        onChange: newVal => updateQueryPram({
          value: item.val.value,
          compare: newVal
        }, index)
      })), item.id == 'postMimeType' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_input_select__WEBPACK_IMPORTED_MODULE_24__["default"], {
        val: item.val,
        options: [{
          label: 'image/jpeg',
          value: 'jpg|jpeg|jpe'
        }, {
          label: 'image/gif',
          value: 'gif'
        }, {
          label: 'image/png',
          value: 'png'
        }, {
          label: 'image/bmp',
          value: 'bmp'
        }],
        multiple: true,
        onChange: newVal => {
          updateQueryPram(newVal, index);
        }
      })), (item.id == 'cacheResults' || item.id == 'nopaging' || item.id == 'hasPassword' || item.id == 'updatePostMetaCache' || item.id == 'updatePostTermCache') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val,
        options: [{
          label: 'True',
          value: true
        }, {
          label: 'False',
          value: false
        }],
        onChange: newVal => updateQueryPram(newVal, index)
      })), item.id == 'ignoreStickyPosts' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
        style: {
          margin: 0
        },
        label: "",
        value: item.val,
        options: [{
          label: 'True',
          value: true
        }, {
          label: 'False',
          value: false
        }],
        onChange: newVal => updateQueryPram(newVal, index)
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, item.description)));
    }

    function addQueryPramX(_option, index) {
      var attrExist = false;
      var data = _queryprams__WEBPACK_IMPORTED_MODULE_28__["default"][index];
      var multiple = data.multiple;
      var isExist = queryArgs.items.map(item => {
        if (item.id == index) {
          return true;
        }
      });
      var items = queryArgs.items.concat([data]);
      setAttributes({
        queryArgs: {
          items: items
        }
      });
    }

    var RemoveQueryPram = function (_ref3) {
      let {
        title,
        index
      } = _ref3;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          queryArgs.items.splice(index, 1);
          setAttributes({
            queryArgs: {
              items: queryArgs.items
            }
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_35__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_36__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "mx-2"
      }, title));
    };

    function deleteGridColumn(i) {
      grid.styles.gridTemplateColumns[breakPointX].splice(i, 1);
      var styles = { ...grid.styles,
        gridTemplateColumns: grid.styles.gridTemplateColumns
      };
      setAttributes({
        grid: { ...grid,
          styles: styles
        }
      });
    }

    function deleteGridRow(i) {
      grid.styles.gridTemplateRows[breakPointX].splice(i, 1);
      var styles = { ...grid.styles,
        gridTemplateRows: grid.styles.gridTemplateRows
      };
      setAttributes({
        grid: { ...grid,
          styles: styles
        }
      });
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Layouts",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-white cursor-pointer"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: layoutData.source == 'library' ? 'bg-blue-500 w-1/2 inline-block px-3 py-2 text-[14px] font-bold' : 'bg-blue-300 text-[14px] font-bold inline-block px-3 py-2 w-1/2',
      onClick: _ev => {
        setLayoutData({
          source: 'library'
        });
        setQueryLayouts({
          keyword: '',
          page: 1,
          category: ''
        });
      }
    }, "Library"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: layoutData.source == 'saved' ? 'bg-blue-500 w-1/2 inline-block px-3 py-2 text-[14px] font-bold' : 'bg-blue-300 inline-block px-3 py-2 w-1/2 text-[14px] font-bold',
      onClick: _ev => {
        setLayoutData({
          source: 'saved'
        });
        setQueryLayouts({
          keyword: '',
          page: 1,
          category: ''
        });
      }
    }, "Saved")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: queryLayouts.keyword,
      type: "text",
      placeholder: "Search Layouts...",
      onChange: newVal => {
        clearTimeout(debounce);
        debounce = setTimeout(() => {
          setQueryLayouts({
            keyword: newVal,
            page: queryLayouts.page,
            category: queryLayouts.category
          });
        }, 1000); //fetchLayouts();
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      className: "w-full",
      style: {
        margin: 0
      },
      label: "",
      value: queryLayouts.category,
      options: layoutCats,
      onChange: newVal => {
        setQueryLayouts({
          keyword: queryLayouts.keyword,
          page: queryLayouts.page,
          category: newVal
        }); //fetchLayouts();
      }
    })), layoutData.source == 'saved' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "flex gap-2\t"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "w-full rounded-sm  py-2 bg-blue-500 text-[14px] font-bold text-white cursor-pointer my-3 text-center "
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      className: " ",
      target: "_blank",
      href: clientData.siteAdminurl + 'edit.php?post_type=post_grid_template'
    }, "All Layouts")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "w-full rounded-sm  py-2 bg-blue-500 text-[14px] font-bold text-white cursor-pointer my-3 text-center "
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      className: "",
      target: "_blank",
      href: clientData.siteAdminurl + 'post-new.php?post_type=post_grid_template'
    }, "Create Layout"))), layoutLoading == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Spinner, null)), layoutLoading == false && layoutList.items.length > 0 && layoutList.items.map(x => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-4 border bg-gray-200 "
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "relative cursor-pointer",
        onClick: _ev => {
          if (x.is_pro == true) {
            alert("Sorry this is only avilable in premium");
            return;
          }

          selectLayout(x.post_id, x.post_content);
        }
      }, layout.id == x.post_id && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "absolute bg-amber-500 text-white px-2 py-1 top-0 right-0"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        class: "dashicons dashicons-saved"
      }), " Selected"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
        className: "w-full",
        src: x.thumb_url
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "text-[14px] p-1 bg-gray-500 text-white bg-opacity-80 text-bold  text-center"
      }, x.post_title)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "py-3 flex justify-items-stretch"
      }, layoutData.source != 'library' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "mx-1 inline-block bg-blue-500 hover:bg-blue-400 px-2 py-1 text-white rounded-sm cursor-pointer"
      }, " ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
        target: "_blank",
        href: clientData.siteAdminurl + 'post.php?post=' + x.post_id + '&action=edit'
      }, "Edit"), " "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "mx-1 inline-block bg-blue-500 hover:bg-blue-400 px-2 py-1 text-white rounded-sm cursor-pointer"
      }, "#", x.post_id), layoutData.source == 'library' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "mx-1 relative inline-block bg-blue-500 hover:bg-blue-400 px-2 py-1 text-white rounded-sm cursor-pointer",
        onClick: ev => {
          if (isProFeature == false) {
            if (!importLayoutOpen.isOpen) {
              setlayoutImporting(true);
              importLayout(x);
            }
          }

          setimportLayoutOpen({
            id: x.post_id,
            isOpen: !importLayoutOpen.isOpen
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        class: "dashicons dashicons-download"
      }), " Import"), importLayoutOpen.id == x.post_id && importLayoutOpen.isOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Popover, {
        position: "bottom left p-2 "
      }, isProFeature == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "w-48 bg-amber-100 px-3 py-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
        className: ""
      }, " ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "underline"
      }, "Importing Layouts"), " Only avilable in Premium"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
        className: ""
      }, "After import the layout you can customize and make your own.")), isProFeature == false && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "w-48 bg-sky-300 px-3 py-2"
      }, layoutImporting && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Spinner, null), " Importing"), !layoutImporting && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
        className: ""
      }, "Layout imported and saved under ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
        target: "_blank",
        className: "font-bold underline ",
        href: postGridData.siteAdminurl + 'edit.php?post_type=post_grid_template'
      }, "Saved Templates"))))), x.is_pro == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: " bg-amber-500 text-white px-3 rounded-sm py-1"
      }, "Pro"), x.is_pro == false && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: " bg-lime-600 text-white px-3 rounded-sm py-1"
      }, "Free")));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "w-full rounded-sm  py-2 bg-blue-500 text-[14px] font-bold text-white cursor-pointer my-3 text-center",
      onClick: _ev => {
        var page = queryLayouts.page + 1;
        console.log(page);
        setQueryLayouts({
          keyword: queryLayouts.keyword,
          page: page,
          category: queryLayouts.category
        });
      }
    }, layoutLoading.loading == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "text-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Spinner, null)), "Load More")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Query Post",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Add Query Parameters"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_12__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: queryPramsX,
      buttonTitle: "Choose",
      onChange: addQueryPramX,
      values: ""
    })), queryArgs.items.map((item, index) => {
      return generateQueryArgOptions(item, index);
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Query Presets"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_12__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: _query_presets__WEBPACK_IMPORTED_MODULE_26__["default"],
      buttonTitle: "Choose",
      onChange: addQueryPreset,
      values: ''
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Grid Settings",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      onClick: _ev => {
        var gridTemplateColumns = grid.styles.gridTemplateColumns;

        if (Object.keys(grid.styles.gridTemplateColumns).length == 0) {
          gridTemplateColumns[breakPointX] = [{
            val: 1,
            unit: 'fr'
          }];
        } else {
          var sds = gridTemplateColumns[breakPointX] != undefined ? gridTemplateColumns[breakPointX].concat({
            val: 1,
            unit: 'fr'
          }) : [{
            val: 1,
            unit: 'fr'
          }];
          gridTemplateColumns[breakPointX] = sds;
        }

        var styles = { ...grid.styles,
          gridTemplateColumns: gridTemplateColumns
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      },
      className: "my-3 !bg-blue-600 !text-white"
    }, "Add Column"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_25__["default"][breakPointX].icon,
      value: breakPointX
    })), grid.styles.gridTemplateColumns[breakPointX] != undefined && grid.styles.gridTemplateColumns[breakPointX].map((item, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: item.val,
        type: "number",
        onChange: newVal => {
          var newValuesObj = {};

          if (Object.keys(grid.styles.gridTemplateColumns).length == 0) {
            newValuesObj[breakPointX] = {
              val: newVal,
              unit: 'em'
            };
          } else {
            var gridTemplateColumns = grid.styles.gridTemplateColumns;
            var sds = gridTemplateColumns[breakPointX].map((x, i) => {
              return index == i ? {
                val: newVal,
                unit: x.unit
              } : x;
            });
            newValuesObj[breakPointX] = sds;
          }

          var styles = { ...grid.styles,
            gridTemplateColumns: newValuesObj
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
        className: "mb-0",
        value: item.unit,
        options: [{
          label: 'fr',
          value: 'fr'
        }, {
          label: 'px',
          value: 'px'
        }, {
          label: '%',
          value: '%'
        }, {
          label: 'em',
          value: 'em'
        }],
        onChange: newVal => {
          var newValuesObj = {};

          if (Object.keys(grid.styles.gridTemplateColumns).length == 0) {
            newValuesObj[breakPointX] = {
              val: newVal,
              unit: 'em'
            };
          } else {
            var gridTemplateColumns = grid.styles.gridTemplateColumns;
            var sds = gridTemplateColumns[breakPointX].map((x, i) => {
              return index == i ? {
                val: x.val,
                unit: newVal
              } : x;
            });
            newValuesObj[breakPointX] = sds;
          }

          var styles = { ...grid.styles,
            gridTemplateColumns: newValuesObj
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
        icon: "no-alt",
        onClick: _ev => {
          deleteGridColumn(index);
        }
      }));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      onClick: _ev => {
        var gridTemplateRows = grid.styles.gridTemplateRows;

        if (Object.keys(grid.styles.gridTemplateRows).length == 0) {
          gridTemplateRows[breakPointX] = [{
            val: 1,
            unit: 'fr'
          }];
        } else {
          var sds = gridTemplateRows[breakPointX] != undefined ? gridTemplateRows[breakPointX].concat({
            val: 1,
            unit: 'fr'
          }) : [{
            val: 1,
            unit: 'fr'
          }];
          gridTemplateRows[breakPointX] = sds;
        }

        var styles = { ...grid.styles,
          gridTemplateRows: gridTemplateRows
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      },
      className: "my-3 !bg-blue-600 !text-white"
    }, "Add Row"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_25__["default"][breakPointX].icon,
      value: breakPointX
    })), grid.styles.gridTemplateRows[breakPointX] != undefined && grid.styles.gridTemplateRows[breakPointX].map((item, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: item.val,
        type: "number",
        onChange: newVal => {
          var newValuesObj = {};

          if (Object.keys(grid.styles.gridTemplateRows).length == 0) {
            newValuesObj[breakPointX] = {
              val: newVal,
              unit: 'em'
            };
          } else {
            var gridTemplateRows = grid.styles.gridTemplateRows;
            var sds = gridTemplateRows[breakPointX].map((x, i) => {
              return index == i ? {
                val: newVal,
                unit: x.unit
              } : x;
            });
            newValuesObj[breakPointX] = sds;
          }

          var styles = { ...grid.styles,
            gridTemplateRows: newValuesObj
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
        className: "mb-0",
        value: item.unit,
        options: [{
          label: 'fr',
          value: 'fr'
        }, {
          label: 'px',
          value: 'px'
        }, {
          label: '%',
          value: '%'
        }, {
          label: 'em',
          value: 'em'
        }],
        onChange: newVal => {
          var newValuesObj = {};

          if (Object.keys(grid.styles.gridTemplateRows).length == 0) {
            newValuesObj[breakPointX] = {
              val: newVal,
              unit: 'em'
            };
          } else {
            var gridTemplateRows = grid.styles.gridTemplateRows;
            var sds = gridTemplateRows[breakPointX].map((x, i) => {
              return index == i ? {
                val: x.val,
                unit: newVal
              } : x;
            });
            newValuesObj[breakPointX] = sds;
          }

          var styles = { ...grid.styles,
            gridTemplateRows: newValuesObj
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
        icon: "no-alt",
        onClick: _ev => {
          deleteGridRow(index);
        }
      }));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Column Gap"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_25__["default"][breakPointX].icon,
      value: breakPointX
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: grid.styles.colGap[breakPointX] != undefined ? grid.styles.colGap[breakPointX].val : 1,
      type: "number",
      onChange: newVal => {
        var colGapX = grid.styles.colGap;
        console.log(colGapX);
        var unit = colGapX[breakPointX] != undefined ? colGapX[breakPointX].unit : 'em';

        if (Object.keys(grid.styles.colGap).length == 0) {
          colGapX[breakPointX] = {
            val: newVal,
            unit: 'em'
          };
        } else {
          colGapX[breakPointX] = {
            val: newVal,
            unit: unit
          };
        }

        var styles = { ...grid.styles,
          colGap: colGapX
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      className: "mb-0",
      value: grid.styles.colGap[breakPointX] != undefined ? grid.styles.colGap[breakPointX].unit : 'em',
      options: [{
        label: 'px',
        value: 'px'
      }, {
        label: '%',
        value: '%'
      }, {
        label: 'em',
        value: 'em'
      }],
      onChange: newVal => {
        var colGapX = grid.styles.colGap;
        var val = colGapX[breakPointX] != undefined ? colGapX[breakPointX].val : 1;

        if (Object.keys(grid.styles.colGap).length == 0) {
          colGapX[breakPointX] = {
            val: 1,
            unit: newVal
          };
        } else {
          colGapX = grid.styles.colGap;
          colGapX[breakPointX] = {
            val: val,
            unit: newVal
          };
        }

        var styles = { ...grid.styles,
          colGap: colGapX
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Row Gap"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_25__["default"][breakPointX].icon,
      value: breakPointX
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: grid.styles.rowGap[breakPointX] != undefined ? grid.styles.rowGap[breakPointX].val : 1,
      type: "number",
      onChange: newVal => {
        var rowGapX = grid.styles.rowGap;
        console.log(rowGapX);
        var unit = rowGapX[breakPointX] != undefined ? rowGapX[breakPointX].unit : 'em';

        if (Object.keys(grid.styles.rowGap).length == 0) {
          rowGapX[breakPointX] = {
            val: newVal,
            unit: 'em'
          };
        } else {
          rowGapX[breakPointX] = {
            val: newVal,
            unit: unit
          };
        }

        var styles = { ...grid.styles,
          rowGap: rowGapX
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      className: "mb-0",
      value: grid.styles.rowGap[breakPointX] != undefined ? grid.styles.rowGap[breakPointX].unit : 'em',
      options: [{
        label: 'px',
        value: 'px'
      }, {
        label: '%',
        value: '%'
      }, {
        label: 'em',
        value: 'em'
      }],
      onChange: newVal => {
        var rowGapX = grid.styles.rowGap;
        var val = rowGapX[breakPointX] != undefined ? rowGapX[breakPointX].val : 1;

        if (Object.keys(grid.styles.rowGap).length == 0) {
          rowGapX[breakPointX] = {
            val: 1,
            unit: newVal
          };
        } else {
          rowGapX = grid.styles.rowGap;
          rowGapX[breakPointX] = {
            val: val,
            unit: newVal
          };
        }

        var styles = { ...grid.styles,
          rowGap: rowGapX
        };
        setAttributes({
          grid: { ...grid,
            styles: styles
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "N'th Item CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
      className: "my-3",
      variant: "secondary",
      disabled: isProFeature,
      onClick: _newVal => {
        if (grid.options.itemCss[breakPointX] != undefined) {
          var ssd = grid.options.itemCss[breakPointX].concat({
            'grid-column-start': '',
            'grid-column-end': '',
            'grid-row-start': '',
            'grid-row-end': ''
          });
        } else {
          grid.options.itemCss[breakPointX] = [];
          var ssd = grid.options.itemCss[breakPointX].concat({
            'grid-column-start': '',
            'grid-column-end': '',
            'grid-row-start': '',
            'grid-row-end': ''
          });
        }

        var newValuesObj = {};

        if (Object.keys(grid.options.itemCss).length == 0) {
          newValuesObj[breakPointX] = ssd;
        } else {
          newValuesObj = grid.options.itemCss;
          newValuesObj[breakPointX] = ssd;
        }

        var options = { ...grid.options,
          itemCss: newValuesObj
        };
        setAttributes({
          grid: { ...grid,
            options: options
          }
        });
      }
    }, "Add"), isProFeature && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "bg-amber-400 mx-2 rounded-sm py-1 px-3  text-white hover:text-white"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      target: "_blank",
      href: 'https://pickplugins.com/post-grid/?utm_source=nthItemCSS&utm_term=blockPostgrid&utm_campaign=pluginPostGrid&utm_medium=nthItemCSS'
    }, "Pro"))), grid.options.itemCss[breakPointX] != undefined && grid.options.itemCss[breakPointX].map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
        title: i + 1 + '\'th Item',
        initialOpen: false
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
        icon: "no-alt",
        variant: "secondary",
        onClick: _ev => {
          grid.options.itemCss[breakPointX].splice(i, 1);
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      }, "Delete"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "grid-column-start"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: x['grid-column-start'],
        type: "number",
        onChange: newVal => {
          grid.options.itemCss[breakPointX][i]['grid-column-start'] = newVal;
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "grid-column-end"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: x['grid-column-end'],
        type: "number",
        onChange: newVal => {
          grid.options.itemCss[breakPointX][i]['grid-column-end'] = newVal;
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "grid-row-start"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: x['grid-row-start'],
        type: "number",
        onChange: newVal => {
          grid.options.itemCss[breakPointX][i]['grid-row-start'] = newVal;
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
        for: ""
      }, "grid-row-end"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        value: x['grid-row-end'],
        type: "number",
        onChange: newVal => {
          grid.options.itemCss[breakPointX][i]['grid-row-end'] = newVal;
          var options = { ...grid.options,
            itemCss: grid.options.itemCss
          };
          setAttributes({
            grid: { ...grid,
              options: options
            }
          });
        }
      })));
    }), _grid_layouts__WEBPACK_IMPORTED_MODULE_27__["default"].map((x, _i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer relative hover:bg-blue-200 my-3",
        onClick: _ev => {
          if (x.isPro) {//setAttributes({ grid: x.data })
          } else {
            setAttributes({
              grid: x.data
            });
          }
        }
      }, x.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "bg-amber-400 absolute top-2 left-0 rounded-sm px-3 mx-2  text-white hover:text-white"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
        target: "_blank",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")), x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "w-full grid-layout-prewview"
      }, x.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "text-[16px] p-2 bg-blue-600 text-white bg-opacity-90 text-bold  w-full text-center"
      }, x.title));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Container",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_32__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_37__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_38__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
      obj: container,
      onChange: onChangeStyleContainer,
      onAdd: onAddStyleContainer,
      onRemove: onRemoveStyleContainer
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_34__["default"], {
      blockId: blockId,
      obj: container,
      onChange: onPickCssLibraryContainer
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Items Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_32__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_37__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_38__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
      obj: itemsWrap,
      onChange: onChangeStyleItemsWrap,
      onAdd: onAddStyleItemsWrap,
      onRemove: onRemoveStyleItemsWrap
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_34__["default"], {
      blockId: blockId,
      obj: itemsWrap,
      onChange: onPickCssLibraryItemsWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Loop Item",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_32__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_37__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_38__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
      obj: itemWrap,
      onChange: onChangeStyleItemWrap,
      onAdd: onAddStyleItemWrap,
      onRemove: onRemoveStyleItemWrap
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_34__["default"], {
      blockId: blockId,
      obj: itemWrap,
      onChange: onPickCssLibraryItemWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "N'th Item",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_32__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_37__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_38__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "styles"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "css"
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Pagination",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "mb-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Pagination Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_12__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: _pagination_types__WEBPACK_IMPORTED_MODULE_29__["default"],
      buttonTitle: "Choose",
      onChange: (arg, index) => {
        var options = { ...pagination.options,
          type: arg.value
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      },
      values: ''
    })), pagination.options.type.length != 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-500 text-white px-3 py-2 my-5"
    }, _pagination_types__WEBPACK_IMPORTED_MODULE_29__["default"][pagination.options.type] != undefined ? _pagination_types__WEBPACK_IMPORTED_MODULE_29__["default"][pagination.options.type].label : ''), (pagination.options.type == 'normal' || pagination.options.type == 'ajax') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Max Number of Pagination"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: pagination.options.maxPageNum,
      onChange: newVal => {
        var options = { ...pagination.options,
          maxPageNum: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    }))), (pagination.options.type == 'normal' || pagination.options.type == 'ajax' || pagination.options.type == 'next_previous') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Previous Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: pagination.options.prevText,
      onChange: newVal => {
        var options = { ...pagination.options,
          prevText: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Next Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: pagination.options.nextText,
      onChange: newVal => {
        var options = { ...pagination.options,
          nextText: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    }))), (pagination.options.type == 'loadmore' || pagination.options.type == 'infinite') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Load More Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: pagination.options.loadMoreText,
      onChange: newVal => {
        var options = { ...pagination.options,
          loadMoreText: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "No Posts Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: pagination.options.noMorePosts,
      onChange: newVal => {
        var options = { ...pagination.options,
          noMorePosts: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Loading Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: pagination.options.loadingText,
      onChange: newVal => {
        var options = { ...pagination.options,
          loadingText: newVal
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Loading Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_13__["default"], {
      library: pagination.options.loadingIcon.library,
      srcType: pagination.options.loadingIcon.srcType,
      iconSrc: pagination.options.loadingIcon.iconSrc,
      onChange: arg => {
        var options = { ...pagination.options,
          loadingIcon: {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          }
        };
        setAttributes({
          pagination: { ...pagination,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      className: "my-5",
      title: "Pagination Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_32__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_37__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_38__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
      obj: pagination,
      onChange: onChangeStylePagination,
      onAdd: onAddStylePagination,
      onRemove: onRemoveStylePagination
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_34__["default"], {
      blockId: blockId,
      obj: pagination,
      onChange: onPickCssLibraryPagination
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Pagination Items",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_32__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_37__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_38__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
      obj: paginationItem,
      onChange: onChangeStylePaginationItem,
      onAdd: onAddStylePaginationItem,
      onRemove: onRemoveStylePaginationItem
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_34__["default"], {
      blockId: blockId,
      obj: paginationItem,
      onChange: onPickCssLibraryPaginationItem
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Pagination Active",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_32__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_37__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_38__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
      obj: paginationItemActive,
      onChange: onChangeStylePaginationItemActive,
      onAdd: onAddStylePaginationItemActive,
      onRemove: onRemoveStylePaginationItemActive
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_33__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_34__["default"], {
      blockId: blockId,
      obj: paginationItemActive,
      onChange: onPickCssLibraryPaginationItemActive
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Lazy load",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Enable Lazy Load"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: lazyLoad.options.enable,
      options: [{
        label: 'Yes',
        value: 'yes'
      }, {
        label: 'No',
        value: 'no'
      }],
      onChange: newVal => {
        var options = { ...lazyLoad.options,
          enable: newVal
        };
        setAttributes({
          lazyLoad: { ...lazyLoad,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Lazy load Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_13__["default"], {
      library: lazyLoad.options.icon != undefined ? lazyLoad.options.icon.library : 'fontAwesome',
      srcType: lazyLoad.options.icon != undefined ? lazyLoad.options.icon.srcType : 'class',
      iconSrc: lazyLoad.options.icon != undefined ? lazyLoad.options.icon.iconSrc : '',
      onChange: arg => {
        var options = { ...lazyLoad.options,
          icon: {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          }
        };
        setAttributes({
          lazyLoad: { ...lazyLoad,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Lazy Load Image"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.MediaUploadCheck, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_6__.MediaUpload, {
      onSelect: media => {
        // media.id
        var options = { ...lazyLoad.options,
          srcUrl: media.url,
          srcId: media.id
        };
        setAttributes({
          lazyLoad: { ...lazyLoad,
            options: options
          }
        });
      },
      onClose: () => {},
      allowedTypes: ALLOWED_MEDIA_TYPES,
      value: lazyLoad.options.srcId,
      render: _ref4 => {
        let {
          open
        } = _ref4;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Button, {
          className: "border",
          onClick: open
        }, "Open Media Library");
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
      className: "my-5",
      src: lazyLoad.options.srcUrl,
      alt: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      className: "hidden",
      title: "Search",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "Enable",
      value: search.enable,
      options: [{
        label: 'No',
        value: 'no'
      }, {
        label: 'Yes',
        value: 'yes'
      }],
      onChange: newVal => setAttributes({
        search: {
          enable: newVal,
          type: search.type,
          placeholder: search.placeholder,
          icon: search.icon,
          busyIcon: search.busyIcon
        }
      })
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "Search action",
      value: search.type,
      options: [{
        label: 'Ajax - On change form data',
        value: 'ajax'
      }, {
        label: 'On form submit - GET method',
        value: 'form_submit'
      }],
      onChange: newVal => setAttributes({
        search: {
          enable: search.type,
          type: newVal,
          placeholder: search.placeholder,
          icon: search.icon,
          busyIcon: search.busyIcon
        }
      })
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      label: "Placeholder text",
      value: search.placeholder,
      onChange: newVal => setAttributes({
        search: {
          enable: search.type,
          type: search.type,
          placeholder: newVal,
          icon: search.icon,
          busyIcon: search.busyIcon
        }
      })
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      label: "Search icon",
      value: search.icon,
      onChange: newVal => setAttributes({
        search: {
          enable: search.type,
          type: search.type,
          placeholder: search.placeholder,
          icon: newVal,
          busyIcon: search.busyIcon
        }
      })
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      label: "Loading icon",
      value: search.busyIcon,
      onChange: newVal => setAttributes({
        search: {
          enable: search.type,
          type: search.type,
          placeholder: search.placeholder,
          icon: search.icon,
          busyIcon: newVal
        }
      })
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_15__["default"], {
      utm: {
        utm_source: 'BlockPostGrid',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      className: "",
      title: "Tutorials",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tutorials__WEBPACK_IMPORTED_MODULE_19__["default"], {
      links: _tutorials_links__WEBPACK_IMPORTED_MODULE_30__["default"]
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, grid.styles.gridTemplateColumns[breakPointX] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-center my-5"
    }, "Please set the column number"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "grid grid-cols-4 gap-4"
    }, columnPresets.map(x => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "cursor-pointer text-center bg-slate-400 hover:bg-slate-500",
        onClick: ev => {
          var gridTemplateColumns = grid.styles.gridTemplateColumns;
          var colGap = grid.styles.colGap;
          var rowGap = grid.styles.rowGap;
          gridTemplateColumns[breakPointX] = x.args;
          colGap[breakPointX] = {
            val: 1,
            unit: 'em'
          };
          rowGap[breakPointX] = {
            val: 1,
            unit: 'em'
          };
          var styles = { ...grid.styles,
            gridTemplateColumns: gridTemplateColumns,
            colGap: colGap,
            rowGap: rowGap
          };
          setAttributes({
            grid: { ...grid,
              styles: styles
            }
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "p-3 py-4 inline-block"
      }, x.icon));
    }))), lazyLoad.options.enable == 'yes' && isBusy && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: lazyLoad.options.class
    }), search.enable == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: search.options.class
    }, "search form"), postsQuery == false && posts == null && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: noPostsWrap.options.class
    }, "No Post found"), postsQuery && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: spinnerWrap.options.class
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Spinner, null)), isBusy && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.Spinner, null)), postsQuery == false && posts != null && posts.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: itemsWrap.options.class
    }, posts.map((x, _i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: itemWrap.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, x.html));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: pagination.options.class
    }, pagination.options.type == 'normal' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, paginationItems != undefined && paginationItems.map(item => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, {
        className: "inline-block"
      }, item.replace("page-numbers", paginationItem.options.class));
    })), pagination.options.type == 'ajax' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, paginationItems != undefined && paginationItems.map(item => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, {
        className: "inline-block"
      }, item.replace("page-numbers", paginationItem.options.class));
    })), pagination.options.type == 'next_previous' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "flex justify-between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "pagination-prev page-numbers"
    }, pagination.options.prevText), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "pagination-next page-numbers"
    }, pagination.options.nextText)), pagination.options.type == 'loadmore' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "page-numbers"
    }, pagination.options.loadMoreText)), pagination.options.type == 'infinite' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null))));
  },
  save: function (_props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = _props.attributes;
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-grid/pagination-types.js":
/*!**************************************************!*\
  !*** ./src/blocks/post-grid/pagination-types.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__);

const paginationTypesBasic = {
  none: {
    label: 'None',
    value: 'none',
    isPro: false
  },
  normal: {
    label: 'Normal Pagination',
    value: 'normal',
    isPro: false
  },
  ajax: {
    label: 'Ajax Pagination',
    value: 'ajax',
    isPro: true
  },
  next_previous: {
    label: 'Next-Previous',
    value: 'next_previous',
    isPro: true
  },
  loadmore: {
    label: 'Load More',
    value: 'loadmore',
    isPro: true
  },
  infinite: {
    label: 'Infinite Load',
    value: 'infinite',
    isPro: true
  }
};
let paginationTypes = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__.applyFilters)('paginationTypes', paginationTypesBasic);
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (paginationTypes);

/***/ }),

/***/ "./src/blocks/post-grid/query-presets.js":
/*!***********************************************!*\
  !*** ./src/blocks/post-grid/query-presets.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__);

const queryPresetsBasic = [{
  label: 'Latest Posts by Publish Date',
  key: 'preset1',
  isPro: false,
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["date"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Oldest Posts by Publish Date',
  key: 'preset2',
  isPro: true,
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "ASC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["date"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Latest Posts by Modified Date',
  key: 'preset3',
  isPro: false,
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["modified"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Oldest Posts by Modified Date',
  key: 'preset4',
  isPro: true,
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "ASC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["modified"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Alphabetical Order A-Z',
  key: 'preset5',
  isPro: false,
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "ASC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["name"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Alphabetical Order Z-A',
  key: 'preset6',
  isPro: true,
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["name"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Most Commented Posts',
  key: 'preset7',
  isPro: true,
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["name"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}, {
  label: 'Random 10 Posts',
  key: 'preset8',
  isPro: true,
  value: {
    "items": [{
      "val": ["post"],
      "multiple": false,
      "id": "postType",
      "label": "Post Types",
      "description": "Select Post Types to Query"
    }, {
      "val": ["publish"],
      "multiple": false,
      "id": "postStatus",
      "label": "Post status",
      "description": "Query post by post status"
    }, {
      "val": "DESC",
      "multiple": false,
      "id": "order",
      "label": "Order",
      "description": "Post query order"
    }, {
      "val": ["rand"],
      "multiple": false,
      "id": "orderby",
      "label": "Orderby",
      "description": "Post query orderby"
    }, {
      "val": "10",
      "multiple": false,
      "id": "postsPerPage",
      "label": "Posts Per Page",
      "description": ""
    }]
  }
}];
let queryPresets = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__.applyFilters)('queryPresets', queryPresetsBasic);
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (queryPresets);

/***/ }),

/***/ "./src/blocks/post-grid/queryprams.js":
/*!********************************************!*\
  !*** ./src/blocks/post-grid/queryprams.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__);

const queryPramsBasic = [{
  val: ['post'],
  multiple: false,
  id: 'postType',
  label: 'Post Types',
  description: "Select Post Types to Query"
}, {
  val: '',
  multiple: false,
  id: 's',
  label: 'Keyword',
  description: "Search keyword, ex: hello"
}, {
  val: [],
  multiple: false,
  id: 'postStatus',
  label: 'Post status',
  description: "Query post by post status"
}, {
  val: '',
  multiple: false,
  id: 'order',
  label: 'Order',
  description: "Post query order"
}, {
  val: [],
  multiple: false,
  id: 'orderby',
  label: 'Orderby',
  description: "Post query orderby"
}, {
  val: '',
  multiple: false,
  id: 'metaKey',
  label: 'Meta fields key',
  description: "Post query by meta fields key"
}, // Category Parameters
{
  val: '',
  multiple: false,
  id: 'cat',
  label: 'Category ID',
  description: "Post query by Category ID"
}, {
  val: '',
  multiple: false,
  id: 'categoryName',
  label: 'Category Name',
  description: "Post query by Category Name"
}, {
  val: [],
  multiple: false,
  id: 'categoryAnd',
  label: 'Category And',
  description: "Post query by Category IDs",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'categoryIn',
  label: 'Category In',
  description: "Post query by Category IDs",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'categoryNotIn',
  label: 'Category Not In',
  description: "Post query by excluded Category IDs",
  isPro: true
}, // Tag Parameters
{
  val: '',
  multiple: false,
  id: 'tag',
  label: 'Tags',
  description: "Post query by Tag slug"
}, {
  val: '',
  multiple: false,
  id: 'tagId',
  label: 'Tag Id',
  description: "Post query by Tag ID"
}, {
  val: [],
  multiple: false,
  id: 'tagAnd',
  label: 'Tag And',
  description: "Post query by Tag Ids",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'tagIn',
  label: 'Tag In',
  description: "Post query by Tag ids",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'tagNotIn',
  label: 'Tag Not In',
  description: "Post query by excluded Tag ids"
}, {
  val: [],
  multiple: false,
  id: 'tagSlugAnd',
  label: 'Tag Slug And',
  description: "Post query by Tags slug",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'tagSlugIn',
  label: 'Tag Slug In',
  description: "Post query by excluded Tags slug",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'taxQuery',
  label: 'Tax Query',
  description: "Taxonomies query arguments",
  isPro: true
}, {
  val: 'OR',
  multiple: false,
  id: 'taxQueryRelation',
  label: 'Tax Query Relation',
  description: "Taxonomies query relation"
}, // Date Parameters
{
  val: [],
  multiple: false,
  id: 'dateQuery',
  label: 'Date Query',
  description: "Post query by date",
  isPro: true
}, {
  val: '',
  multiple: false,
  id: 'year',
  label: 'Year',
  description: "Post query by year"
}, {
  val: '',
  multiple: false,
  id: 'monthnum',
  label: 'Month',
  description: "Post query by month"
}, {
  val: '',
  multiple: false,
  id: 'w',
  label: 'Week',
  description: "Post query by week"
}, {
  val: '',
  multiple: false,
  id: 'day',
  label: 'Day',
  description: "Post query by day"
}, {
  val: '',
  multiple: false,
  id: 'hour',
  label: 'Hour',
  description: "Post query by hour"
}, {
  val: '',
  multiple: false,
  id: 'minute',
  label: 'Miniute',
  description: "Post query by miniute"
}, {
  val: '',
  multiple: false,
  id: 'second',
  label: 'Second',
  description: "Post query by second"
}, {
  val: '',
  multiple: false,
  id: 'm',
  label: 'Month',
  description: "Post query by month"
}, // Author Parameters
{
  val: '',
  multiple: false,
  id: 'author',
  label: 'Author',
  description: "Post query by Author ID"
}, {
  val: '',
  multiple: false,
  id: 'authorName',
  label: 'Author Name',
  description: "Post query by Author Name"
}, {
  val: [],
  multiple: false,
  id: 'authorIn',
  label: 'Author In',
  description: "Post query by Author IDs",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'authorNotIn',
  label: 'Author Not In',
  description: "Post query by exluded Author IDs",
  isPro: true
}, {
  val: '',
  multiple: false,
  id: 'p',
  label: 'Post id',
  description: "Post query by single post id"
}, {
  val: '',
  multiple: false,
  id: 'name',
  label: 'Name',
  description: "Post query by post slug"
}, {
  val: '',
  multiple: false,
  id: 'pageId',
  label: 'Page Id',
  description: "Post query by single page id"
}, {
  val: '',
  multiple: false,
  id: 'pagename',
  label: 'Page name',
  description: "Post query by page slug"
}, {
  val: '',
  multiple: false,
  id: 'postParent',
  label: 'Post Parent',
  description: "Post query by post parent id",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'postParentIn',
  label: 'Post Parent In',
  description: "Post query by post parent ids",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'postParentNotIn',
  label: 'Post Parent Not In',
  description: "Post query by excluded post parent ids"
}, {
  val: [],
  multiple: false,
  id: 'postIn',
  label: 'Post In',
  description: "Post query by multiple post ids, comma separated.",
  isPro: true
}, {
  val: [],
  multiple: false,
  id: 'postNotIn',
  label: 'Post Not In',
  description: "Post query by excluded post ids",
  isPro: true
}, {
  val: [{
    slug: ''
  }],
  multiple: false,
  id: 'postNameIn',
  label: 'Post Name In',
  description: "Post query by post slugs",
  isPro: true
}, {
  val: '',
  multiple: false,
  id: 'hasPassword',
  label: 'Has Password',
  description: "Post query for posts with passwords"
}, {
  val: '',
  multiple: false,
  id: 'postPassword',
  label: 'Post Password',
  description: "Post query for posts with particular passwords",
  isPro: true
}, {
  val: {
    compare: '='
  },
  multiple: false,
  id: 'commentCount',
  label: 'Comment Count',
  description: "Post query by comment count"
}, {
  val: '',
  multiple: false,
  id: 'nopaging',
  label: 'No Paging',
  description: "Enable show all posts or use pagination"
}, {
  val: '',
  multiple: false,
  id: 'postsPerPage',
  label: 'Posts Per Page',
  description: "Number of post to show per page"
}, {
  val: '',
  multiple: false,
  id: 'paged',
  label: 'Paged',
  description: "Pagination start with"
}, {
  val: '',
  multiple: false,
  id: 'offset',
  label: 'Offset',
  description: "Number of post to displace or pass over"
}, {
  val: '',
  multiple: false,
  id: 'postsPerArchivePage',
  label: 'Posts Per Archive Page',
  description: ""
}, {
  val: '',
  multiple: false,
  id: 'ignoreStickyPosts',
  label: 'Ignore Sticky Posts',
  description: "Ignore post from post query",
  isPro: true
}, {
  val: '',
  multiple: false,
  id: 'metaKey',
  label: 'Meta Key',
  description: "Post query by custom field key"
}, {
  val: '',
  multiple: false,
  id: 'metaValue',
  label: 'Meta Value',
  description: "Post query by custom field value"
}, {
  val: '',
  multiple: false,
  id: 'metaValueNum',
  label: 'Meta Value Num',
  description: "Post query by custom field value for number types"
}, {
  val: '',
  multiple: false,
  id: 'metaCompare',
  label: 'Meta Compare',
  description: "Meta query compare"
}, {
  val: [],
  multiple: false,
  id: 'metaQuery',
  label: 'Meta Query',
  description: "Advance meta fields query",
  isPro: true
}, {
  val: 'readable',
  multiple: false,
  id: 'perm',
  label: 'Perm',
  description: "User permission parameter"
}, {
  val: [],
  multiple: false,
  id: 'postMimeType',
  label: 'Post Mime Type',
  description: "Post query by allwed post mime types"
}, {
  val: false,
  multiple: false,
  id: 'cacheResults',
  label: 'Cache Results',
  description: "Enable Post information cache"
}, {
  val: false,
  multiple: false,
  id: 'updatePostMetaCache',
  label: 'Update Post Meta Cache',
  description: "Enable Post meta information cache"
}, {
  val: false,
  multiple: false,
  id: 'updatePostTermCache',
  label: 'Update Post Term Cache',
  description: "Enable Post term information cache"
}];
let queryPrams = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__.applyFilters)('queryPrams', queryPramsBasic);
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (queryPrams);

/***/ }),

/***/ "./src/blocks/post-grid/tutorials-links.js":
/*!*************************************************!*\
  !*** ./src/blocks/post-grid/tutorials-links.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
var tutorialsLinks = [];
fetch("https://getpostgrid.com/wp-json/wp/v2/docs", {
  method: "GET",
  headers: {
    "Content-Type": "application/json;charset=utf-8"
  }
}).then(response => {
  if (response.ok && response.status < 400) {
    response.json().then(data => {
      data.map(x => {
        tutorialsLinks.push({
          label: x.title.rendered,
          url: x.link,
          isVideo: false
        });
      });
    });
  }
}).catch(_error => {//this.saveAsStatus = 'error';
  // handle the error
}); // const tutorialsLinks = [
//     { label: 'How to add columns?', url: '', isVideo: false, },
//     { label: 'How to disable pagination?', url: '', isVideo: false, },
//     { label: 'How to customize pagination style?', url: '', isVideo: false, },
//     { label: 'How to display normal pagination?', url: '', isVideo: false, },
//     { label: 'How to display next-previous pagination?', url: '', isVideo: false, },
//     { label: 'How to display ajax pagination?', url: '', isVideo: false, },
//     { label: 'How to enable infinte loading?', url: '', isVideo: false, },
//     { label: 'How to query post by post status?', url: '', isVideo: false, },
//     { label: 'How to add rows?', url: '', isVideo: false, },
//     { label: 'How to enable load more?', url: '', isVideo: false, },
//     { label: 'How to enable lazy loading?', url: '', isVideo: true, },
//     { label: 'How to custoize post grid container', url: '', isVideo: false, },
//     { label: 'How to customize post grid loop wrapper?', url: '', isVideo: false, },
//     { label: 'How to query post by post types?', url: '', isVideo: false, },
//     { label: 'How to query posts by custom post types?', url: '', isVideo: false, },
//     { label: 'How to query post by categories?', url: '', isVideo: false, },
//     { label: 'How to query post by tags?', url: '', isVideo: false, },
//     { label: 'How to query post by custom taxonomies & terms?', url: '', isVideo: false, },
//     { label: 'How to query post by custom meta fields?', url: '', isVideo: false, },
//     { label: 'How to query post by search parameter?', url: '', isVideo: false, },
//     { label: 'How to query post by order & orderby?', url: '', isVideo: false, },
//     { label: 'How to query post by date?', url: '', isVideo: false, },
//     { label: 'How to query post by author?', url: '', isVideo: false, },
//     { label: 'How to query post by post ids?', url: '', isVideo: false, },
//     { label: 'How to query post by post parents?', url: '', isVideo: false, },
//     { label: 'How to query post by post passwords?', url: '', isVideo: false, },
//     { label: 'How to customize layouts?', url: '', isVideo: false, },
//     { label: 'How to customize grid layout?', url: '', isVideo: false, },
//     { label: 'How to create complex grid layout?', url: '', isVideo: false, },
// ];

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (tutorialsLinks);

/***/ }),

/***/ "./src/blocks/post-meta/index.js":
/*!***************************************!*\
  !*** ./src/blocks/post-meta/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");

















const {
  RawHTML
} = wp.element;









var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__.registerBlockType)("post-grid/post-meta", {
  apiVersion: 2,
  title: "Post Meta",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "27.61",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.42",
      y: "27.61",
      width: "9.96",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "22.91",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "18.22",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "6.39",
      width: "36",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "13.09",
      width: "10.07",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "15.29",
      y: "13.09",
      width: "10.07",
      height: "2"
    }))
  },
  attributes: {
    template: {
      "type": "string",
      "default": '<div>Output HTML: {metaValue}</div>'
    },
    templateLoop: {
      "type": "string",
      "default": ''
    },
    wrapper: {
      type: 'object',
      default: {
        options: {
          class: '',
          tag: 'div'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {}
        }
      }
    },
    meta: {
      type: 'object',
      default: {
        options: {
          key: '',
          type: 'string',

          /*string, acfImage, acfFile, , , , acfUser*/
          prefix: '',
          postfix: ''
        },
        styles: {
          display: {},
          width: {},
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var meta = attributes.meta;
    var template = attributes.template;
    var templateLoop = attributes.templateLoop;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var wrapper = attributes.wrapper;
    var items = attributes.items;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [metaValue, setMetaValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(null);
    const [metaHtml, setMetaHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    const [metaArgs, setMetaArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(null); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    const metaValueSelector = blockClass + ' .metaValue';
    var metaKeyTypeArgsBasic = {
      string: {
        label: 'String',
        value: 'string'
      },
      object: {
        label: 'Object',
        value: 'object',
        isPro: true
      },
      array: {
        label: 'Array',
        value: 'array',
        isPro: true
      },
      acfText: {
        label: 'ACF Text',
        value: 'acfText'
      },
      acfTextarea: {
        label: 'ACF Textarea',
        value: 'acfTextarea'
      },
      acfNumber: {
        label: 'ACF Number',
        value: 'acfNumber'
      },
      acfRange: {
        label: 'ACF Range',
        value: 'acfRange'
      },
      acfEmail: {
        label: 'ACF Email',
        value: 'acfEmail'
      },
      acfUrl: {
        label: 'ACF URL',
        value: 'acfUrl'
      },
      acfPassword: {
        label: 'ACF Password',
        value: 'acfPassword'
      },
      //acfWysiwyg: { label: 'ACF WYSIWYG', value: 'acfWysiwyg', isPro: true },
      acfSelect: {
        label: 'ACF Select',
        value: 'acfSelect',
        isPro: true
      },
      acfCheckbox: {
        label: 'ACF Checkbox',
        value: 'acfCheckbox',
        isPro: true
      },
      acfRadio: {
        label: 'ACF Radio',
        value: 'acfRadio',
        isPro: true
      },
      acfImage: {
        label: 'ACF Image',
        value: 'acfImage',
        isPro: true
      },
      acfFile: {
        label: 'ACF File',
        value: 'acfFile',
        isPro: true
      },
      acfTaxonomy: {
        label: 'ACF Taxonomy',
        value: 'acfTaxonomy',
        isPro: true
      },
      acfPostObject: {
        label: 'ACF Post Object',
        value: 'acfPostObject',
        isPro: true
      },
      acfPageLink: {
        label: 'ACF Page Link',
        value: 'acfPageLink',
        isPro: true
      },
      acfLink: {
        label: 'ACF Link',
        value: 'acfLink',
        isPro: true
      },
      acfUser: {
        label: 'ACF User',
        value: 'acfUser',
        isPro: true
      },
      acfButtonGroup: {
        label: 'ACF Button Group',
        value: 'acfButtonGroup',
        isPro: true
      } // acfBoolen: { label: 'ACF Boolen', value: 'acfBoolen', isPro: true },
      // acfTimePicker: { label: 'ACF TimePicker', value: 'acfTimePicker', isPro: true },
      // acfDatePicker: { label: 'ACF DatePicker', value: 'acfDatePicker', isPro: true },
      // acfDateTimePicker: { label: 'ACF DateTimePicker', value: 'acfDateTimePicker', isPro: true },
      // acfColorPicker: { label: 'ACF ColorPicker', value: 'acfColorPicker', isPro: true },
      // acfGoogleMap: { label: 'ACF Google Map', value: 'acfGoogleMap', isPro: true },

    };
    let metaKeyTypeArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__.applyFilters)('metaKeyTypeArgs', metaKeyTypeArgsBasic);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      WooCommerce.get("products/427").then(response => {
        console.log(response.data);
      }).catch(error => {
        console.log(error.response.data);
      });
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
        path: '/post-grid/v2/get_post_meta',
        method: 'POST',
        data: {
          postId: postId,
          meta_key: meta.options.key,
          type: meta.options.type,
          template: template
        }
      }).then(res => {
        console.log(res);

        if (res.args == undefined) {} else {
          setMetaArgs(res.args);
        }

        if (res.html == undefined) {} else {
          setMetaHtml(res.html);
        } // if (meta.options.type == 'acfImage') {
        //   setMetaHtml(res.html);
        //   setMetaArgs(res.args);
        // }
        // else if (meta.options.type == 'acfFile') {
        //   setMetaHtml(res.html);
        //   setMetaArgs(res.args);
        // }
        // else {
        //   setMetaHtml(res.html);
        //   setMetaArgs(res.args);
        // }

      });
    }, [meta, template]); // useEffect(() => {
    //   if (metaValue != null) {
    //     if (meta.options.type == 'string') {
    //       setMetaValue(res.meta_value)
    //     } else if (meta.options.type == 'acfImage') {
    //       console.log(res.html);
    //       setMetaHtml(res.html);
    //     }
    //   }
    // }, [template]);

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ postTitle: postTitle });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    var breakPointList = [];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    const WrapperTag = wrapper.options.tag != undefined && wrapper.options.tag.length != 0 ? `${wrapper.options.tag}` : 'div';
    const CustomTag = wrapper.options.tag != undefined && wrapper.options.tag.length != 0 ? `${wrapper.options.tag}` : 'div';

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryMeta(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        meta[sudoScource] = sudoScourceArgs;
      });
      var metaX = Object.assign({}, meta);
      setAttributes({
        meta: metaX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, metaValueSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      }); // var path = sudoScource + '.' + attr + '.' + breakPointX
      // let obj = Object.assign({}, wrapper);
      // const updatedObj = myStore.setPropertyDeep(obj, path, newVal)
      // setAttributes({ wrapper: updatedObj });
      // var sudoScourceX = { ...updatedObj[sudoScource] }
      // var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      // sudoScourceX[attr][breakPointX] = newVal;
      // if (blockCssY.items[elementSelector] == undefined) {
      //   blockCssY.items[elementSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[elementSelector][argAttr] = argAttrVal;
      // })
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      }); // var sudoScourceX = { ...wrapper[sudoScource] }
      // if (sudoScourceX[key] != undefined) {
      //   delete sudoScourceX[key];
      // }
      // wrapper[sudoScource] = sudoScourceX;
      // setAttributes({ wrapper: { ...wrapper } });
      // if (blockCssY.items[wrapperSelector] == undefined) {
      //   blockCssY.items[wrapperSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[wrapperSelector][argAttr] = argAttrVal;
      // })
      // if (blockCssY.items[wrapperSelector][key] != undefined) {
      //   delete blockCssY.items[wrapperSelector][key];
      // }
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onAddStyleWrapper(sudoScource, key) {
      // var sudoScourceX = { ...wrapper[sudoScource] }
      // sudoScourceX[key] = {};
      // wrapper[sudoScource] = sudoScourceX;
      // setAttributes({ wrapper: { ...wrapper } });
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleMeta(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, meta);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        meta: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, metaValueSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      }); // var path = sudoScource + '.' + attr + '.' + breakPointX
      // let obj = Object.assign({}, meta);
      // const updatedObj = myStore.setPropertyDeep(obj, path, newVal)
      // setAttributes({ meta: updatedObj });
      // var sudoScourceX = { ...updatedObj[sudoScource] }
      // var elementSelector = metaValueSelector;
      // var elementSelector = myStore.getElementSelector(sudoScource, metaValueSelector);
      // sudoScourceX[attr][breakPointX] = newVal;
      // if (blockCssY.items[elementSelector] == undefined) {
      //   blockCssY.items[elementSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[elementSelector][argAttr] = argAttrVal;
      // })
      // setAttributes({ blockCssY: { items: blockCssY.items } });
      // setAttributes({ meta: { ...meta } });
    }

    function onRemoveStyleMeta(sudoScource, key) {
      var object = myStore.deletePropertyDeep(meta, [sudoScource, key, breakPointX]);
      setAttributes({
        meta: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, metaValueSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      }); // var sudoScourceX = { ...meta[sudoScource] }
      // if (sudoScourceX[key] != undefined) {
      //   delete sudoScourceX[key];
      // }
      // meta[sudoScource] = sudoScourceX;
      // setAttributes({ meta: { ...meta } });
      // if (blockCssY.items[metaValueSelector] == undefined) {
      //   blockCssY.items[metaValueSelector] = {};
      // }
      // Object.entries(sudoScourceX).map(args => {
      //   var argAttr = myStore.cssAttrParse(args[0]);
      //   var argAttrVal = args[1];
      //   blockCssY.items[metaValueSelector][argAttr] = argAttrVal;
      // })
      // if (blockCssY.items[metaValueSelector][key] != undefined) {
      //   delete blockCssY.items[metaValueSelector][key];
      // }
      // setAttributes({ blockCssY: { items: blockCssY.items } });
    }

    function onAddStyleMeta(sudoScource, key) {
      // var sudoScourceX = { ...meta[sudoScource] }
      // sudoScourceX[key] = {};
      // meta[sudoScource] = sudoScourceX;
      // setAttributes({ meta: { ...meta } });
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, meta);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        meta: object
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [items]);
    const post = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecord('postType', context['postType'], context['postId']));
    const termstaxonomy = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecords('taxonomy', 'category', [4, 5]));
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-post-meta`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: {
            styles: wrapper.styles,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: wrapper.options.class,
      onChange: newVal => {
        var options = { ...wrapper.options,
          class: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_19__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Meta Key",
      initialOpen: true
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_16__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-style'
      } // {
      //   name: 'css',
      //   title: 'CSS Library',
      //   icon: styles,
      //   className: 'tab-css',
      // },
      ]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      placeholder: "Meta key",
      value: meta.options.key,
      onChange: newVal => {
        var options = { ...meta.options,
          key: newVal
        };
        setAttributes({
          meta: { ...meta,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Meta Key Type "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_15__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: metaKeyTypeArgs,
      buttonTitle: "Choose",
      onChange: (option, index) => {
        var options = { ...meta.options,
          type: option.value
        };
        setAttributes({
          meta: { ...meta,
            options: options
          }
        });
      },
      values: "",
      value: meta.options.type
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      className: "my-3",
      for: ""
    }, "Template"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.TextareaControl, {
      value: template,
      onChange: newVal => {
        setAttributes({
          template: newVal
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "You can use following ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, "{metaValue}"), " to display output"), meta.options.type != 'string' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "hidden"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      className: "mt-5 block",
      for: ""
    }, "Loop Template "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.TextareaControl, {
      placeholder: "<div>{title}</div><div>{details}</div>",
      value: templateLoop,
      onChange: newVal => {
        setAttributes({
          templateLoop: newVal
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "You can use following for loop template to iterate array elements ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, "<div> {itemIndex1}</div><div>{itemIndex2}</div>"))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Parameters"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: ""
    }, metaArgs != undefined && Object.entries(metaArgs).map((arg, i) => {
      var key = arg[0];
      var val = arg[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2 bg-gray-300"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        onClick: ev => {
          var target = ev.target;
        },
        className: "bg-gray-500 px-3 py-2 text-white"
      }, key), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "px-3 py-2"
      }, val));
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_18__["default"], {
      obj: meta,
      onChange: onChangeStyleMeta,
      onAdd: onAddStyleMeta,
      onRemove: onRemoveStyleMeta
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_19__["default"], {
      blockId: blockId,
      obj: meta,
      onChange: onPickCssLibraryMeta
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Items Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, meta.options.key.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-slate-300 p-10 "
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "w-[400px] mx-auto my-0"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: "",
      className: "my-4 block"
    }, "Meta Field Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      placeholder: "Write Meta key",
      value: meta.options.key,
      onChange: newVal => {
        var options = { ...meta.options,
          key: newVal
        };
        setAttributes({
          meta: { ...meta,
            options: options
          }
        });
      }
    })))), meta.options.key.length != 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(WrapperTag, (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      dangerouslySetInnerHTML: {
        __html: metaHtml
      }
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-tags/index.js":
/*!***************************************!*\
  !*** ./src/blocks/post-tags/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
















const {
  RawHTML
} = wp.element;















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__.registerBlockType)("post-grid/post-tags", {
  apiVersion: 2,
  title: "Post Tags",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "27.61",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.42",
      y: "27.61",
      width: "9.96",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "22.91",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "18.22",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "6.39",
      width: "36",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "0.07",
      y: "13.09",
      width: "5.42",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "8.3",
      y: "13.09",
      width: "5.42",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "16.53",
      y: "13.09",
      width: "5.42",
      height: "2"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          class: '',
          tag: 'div'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {}
        }
      }
    },
    items: {
      type: 'object',
      default: {
        options: {
          prefix: '',
          postfix: '',
          linkTo: 'termUrl',
          linkToCustomMeta: '',
          linkToAuthorMeta: '',
          customUrl: '',
          maxCount: 99,
          postCount: false,
          class: ' item',
          linkTarget: '',
          linkAttr: []
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: '',
          position: 'beforeFronttext',

          /*before, after, prefix, postfix */
          class: 'icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {},
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          fontWeight: {
            "Desktop": "700"
          },
          textDecoration: {} //overline, line-through, underline

        }
      }
    },
    separator: {
      type: 'object',
      default: {
        options: {
          class: 'inline-block',
          text: ', '
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    frontText: {
      type: 'object',
      default: {
        options: {
          text: 'Tags: ',
          class: 'inline-block'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var items = attributes.items;
    var separator = attributes.separator;
    var frontText = attributes.frontText;
    var icon = attributes.icon;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const CustomTagWrapper = `${wrapper.options.tag}`; // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    const itemSelector = blockClass + ' .item';
    const itemTitleSelector = blockClass + ' .termTitle';
    const separatorSelector = blockClass + ' .separator';
    const frontTextSelector = blockClass + ' .frontText';
    const postCountSelector = blockClass + ' .postCount';
    const iconSelector = blockClass + ' .icon';
    var iconPositonArgsBasic = {
      none: {
        label: 'Choose Position',
        value: ''
      },
      beforeFronttext: {
        label: 'Before Front text',
        value: 'beforeFronttext'
      },
      afterFronttext: {
        label: 'After Front text',
        value: 'afterFronttext'
      },
      beforeItems: {
        label: 'Before Items',
        value: 'beforeItems'
      },
      afterItems: {
        label: 'After Items',
        value: 'afterItems'
      },
      beforeItem: {
        label: 'Before Each Items',
        value: 'beforeItem',
        isPro: true
      },
      afterItem: {
        label: 'After Each Items',
        value: 'afterItem',
        isPro: true
      }
    };
    let iconPositonArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__.applyFilters)('iconPositonArgs', iconPositonArgsBasic);
    var linkToArgsBasic = {
      noUrl: {
        label: 'No URL',
        value: ''
      },
      termUrl: {
        label: 'Term URL',
        value: 'termUrl'
      },
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = linkToArgsBasic;

    function setFieldLinkTo(option, index) {
      var options = { ...items.options,
        linkTo: option.value
      };
      setAttributes({
        items: { ...items,
          options: options
        }
      });
    }

    function setIconPosition(option, index) {
      var options = { ...icon.options,
        position: option.value
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    var breakPointList = [];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    var dummyCats = [{
      "id": 1,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Tag 1",
      "slug": "tag-1",
      "taxonomy": "tag_tax"
    }, {
      "id": 2,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Tag 2",
      "slug": "tag-2",
      "taxonomy": "tag_tax"
    }, {
      "id": 3,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Tag 3",
      "slug": "tag-3",
      "taxonomy": "tag_tax"
    }, {
      "id": 4,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Tag 4",
      "slug": "tag-4",
      "taxonomy": "tag_tax"
    }, {
      "id": 5,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Tag 5",
      "slug": "tag-5",
      "taxonomy": "tag_tax"
    }, {
      "id": 6,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Tag 6",
      "slug": "tag-6",
      "taxonomy": "tag_tax"
    }];
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ postTitle: postTitle });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    const [categoryCount, setcategoryCount] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(0); // Using the hook.

    const [postCategoriesData, setPostCategoriesData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [categories, setCategories] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [postCategoriesX, setPostCategoriesX] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__.useEntityProp)('postType', postType, 'tags', postId);
    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setPostCategoriesData([]);
      setCategories([]);
      setcategoryCount(categories.length - 1);

      if (postCategoriesX != undefined) {
        for (x in postCategoriesX) {
          var catId = postCategoriesX[x];
          var assd = x;

          if (x) {
            _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
              path: '/wp/v2/tags/' + catId,
              method: 'GET'
            }).then(res => {
              setPostCategoriesData(current => [...current, res]);
              setCategories(current => [...current, res]);
            });
          }
        }
      } else {
        setPostCategoriesData(dummyCats);
        setCategories(dummyCats);
      }
    }, [postCategoriesX]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var asdasd = postCategoriesData.slice(0, items.options.maxCount);
      setCategories(asdasd);
    }, [postCategoriesData]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      if (postCategoriesX != undefined && postCategoriesX.length > 0) {
        var maxCount = items.options.maxCount.length > 0 ? items.options.maxCount : 99;
        setcategoryCount(categories.length - 1);
        var asdasd = postCategoriesData.slice(0, maxCount);
        setCategories(asdasd);
      } else {
        var asdasd = dummyCats.slice(0, maxCount);
        setCategories(asdasd);
      }
    }, [items]);

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryItems(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        items[sudoScource] = sudoScourceArgs;
      });
      var itemsX = Object.assign({}, items);
      setAttributes({
        items: itemsX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibrarySeparator(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        separator[sudoScource] = sudoScourceArgs;
      });
      var separatorX = Object.assign({}, separator);
      setAttributes({
        separator: separatorX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryFrontText(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        frontText[sudoScource] = sudoScourceArgs;
      });
      var frontTextX = Object.assign({}, frontText);
      setAttributes({
        frontText: frontTextX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleItems(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, items);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        items: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItems(sudoScource, key) {
      var object = myStore.deletePropertyDeep(items, [sudoScource, key, breakPointX]);
      setAttributes({
        items: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItems(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, items);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        items: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleFrontText(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleFrontText(sudoScource, key) {
      var object = myStore.deletePropertyDeep(frontText, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleFrontText(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        frontText: object
      });
    }

    function onChangeStyleSeparator(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleSeparator(sudoScource, key) {
      var object = myStore.deletePropertyDeep(separator, [sudoScource, key, breakPointX]);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleSeparator(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        separator: object
      });
    }

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [items]);

    var linkAttrObj = () => {
      var sdsd = {};
      items.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    const post = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecord('postType', context['postType'], context['postId']));
    const termstaxonomy = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecords('taxonomy', 'category', [4, 5]));
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-post-tags`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.BlockControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.AlignmentToolbar, {
      value: wrapper.styles.textAlign,
      onChange: newVal => {
        var styles = { ...postfix.styles,
          textAlign: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            styles: styles
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Items",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.ToggleControl, {
      label: "Display Post Count",
      help: items.options.postCount ? 'Post Count Enabled' : 'Post Count Disabled',
      checked: items.options.postCount ? true : false,
      onChange: e => {
        var options = { ...items.options,
          postCount: items.options.postCount ? false : true
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Item Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.class,
      onChange: newVal => {
        var options = { ...items.options,
          class: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Max Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.maxCount,
      onChange: newVal => {
        var options = { ...items.options,
          maxCount: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_20__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: items.options.linkTo == undefined || items.options.linkTo.length == 0 ? 'Choose' : linkToArgs[items.options.linkTo] == undefined ? '' : linkToArgs[items.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), items.options.linkTo != undefined && items.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, items.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Author Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...items.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), items.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...items.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), items.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), items.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
      onClick: ev => {
        var options = { ...items.options,
          customUrl: ''
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(LinkControl, {
      settings: [],
      value: items.options.customUrl,
      onChange: newVal => {
        var options = { ...items.options,
          customUrl: newVal.url
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", items.options.customUrl.length != 0 ? items.options.customUrl : 'No link', " ")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, {
      label: "",
      value: items.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...items.options,
          linkTarget: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.prefix,
      onChange: newVal => {
        var options = { ...items.options,
          prefix: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.postfix,
      onChange: newVal => {
        var options = { ...items.options,
          postfix: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = items.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...items.options,
          linkAttr: sdsd
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), items.options.linkAttr.length > 0 && items.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: items.options.linkAttr[i].id,
        onChange: newVal => {
          items.options.linkAttr[i].id = newVal;
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
        placeholder: "Value",
        className: "mr-2",
        value: x.val,
        onChange: newVal => {
          items.options.linkAttr[i].val = newVal;
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          items.options.linkAttr.splice(i, 1);
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: items,
      onChange: onChangeStyleItems,
      onAdd: onAddStyleItems,
      onRemove: onRemoveStyleItems
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: items,
      onChange: onPickCssLibraryItems
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_19__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_20__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: iconPositonArgs,
      buttonTitle: icon.options.position.length == 0 ? 'Choose' : iconPositonArgs[icon.options.position].label,
      onChange: setIconPosition,
      values: []
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Front Text",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: frontText.options.text,
      onChange: newVal => {
        var options = { ...frontText.options,
          text: newVal
        };
        setAttributes({
          frontText: { ...frontText,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: frontText,
      onChange: onChangeStyleFrontText,
      onAdd: onAddStyleFrontText,
      onRemove: onRemoveStyleFrontText
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: frontText,
      onChange: onPickCssLibraryFrontText
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Separator",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Separator"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: separator.options.text,
      onChange: newVal => {
        var options = { ...separator.options,
          text: newVal
        };
        setAttributes({
          separator: { ...separator,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: separator,
      onChange: onChangeStyleSeparator,
      onAdd: onAddStyleSeparator,
      onRemove: onRemoveStyleSeparator
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: separator,
      onChange: onPickCssLibrarySeparator
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Items Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Caetgory Items"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, itemSelector, '{}', " ")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, ".pg-postCategories a", '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Separator"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, separatorSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, frontTextSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Post Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postCountSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_16__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_17__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, categories.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, "No Tags Found"), categories.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagWrapper, blockProps, icon.options.position == 'beforeFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "frontText inline-block"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, frontText.options.text)), icon.options.position == 'afterFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforeItems' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), categories.map((x, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, items.options.linkTo != undefined && items.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
        title: x.name
      }, linkAttrItems, {
        className: items.options.class,
        href: x.link
      }), icon.options.position == 'beforeItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "termTitle"
      }, items.options.prefix, x.name, items.options.postfix), items.options.postCount == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "postCount"
      }, "(", x.count, ")"), icon.options.position == 'afterItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), items.options.linkTo != undefined && items.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
        onClick: ev => ev.preventDefault(),
        target: items.options.linkTarget,
        title: x.name
      }, linkAttrItems, {
        className: items.options.class,
        href: x.link
      }), icon.options.position == 'beforeItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "termTitle"
      }, items.options.prefix, x.name, items.options.postfix), items.options.postCount == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "postCount"
      }, "(", x.count, ")"), icon.options.position == 'afterItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), categories.length > index + 1 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "separator",
        dangerouslySetInnerHTML: {
          __html: separator.options.text
        }
      }));
    }), icon.options.position == 'afterItems' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-taxonomies/index.js":
/*!*********************************************!*\
  !*** ./src/blocks/post-taxonomies/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");

















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__.registerBlockType)("post-grid/post-taxonomies", {
  apiVersion: 2,
  title: "Post Terms",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "27.61",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.42",
      y: "27.61",
      width: "9.96",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "22.91",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "18.22",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "6.39",
      width: "36",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "0.07",
      y: "13.09",
      width: "5.42",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "8.3",
      y: "13.09",
      width: "5.42",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "16.53",
      y: "13.09",
      width: "5.42",
      height: "2"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          class: '',
          tag: 'div'
        },
        styles: {
          display: {},
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    taxonomies: {
      type: 'object',
      default: {
        options: {
          taxName: ''
        }
      }
    },
    items: {
      type: 'object',
      default: {
        options: {
          prefix: '',
          postfix: '',
          linkTo: 'termUrl',
          linkToCustomMeta: '',
          linkToAuthorMeta: '',
          customUrl: '',
          maxCount: 99,
          postCount: false,
          class: ' item',
          linkTarget: '',
          linkAttr: []
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: '',
          position: 'beforeFronttext',

          /*before, after, prefix, postfix */
          class: 'icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {},
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          fontWeight: {
            "Desktop": "700"
          },
          textDecoration: {} //overline, line-through, underline

        }
      }
    },
    separator: {
      type: 'object',
      default: {
        options: {
          class: 'inline-block',
          text: ', '
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {}
        }
      }
    },
    frontText: {
      type: 'object',
      default: {
        options: {
          text: 'Tags: ',
          class: 'inline-block'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var items = attributes.items;
    var separator = attributes.separator;
    var frontText = attributes.frontText;
    var icon = attributes.icon;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var taxonomies = attributes.taxonomies;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [postObjects, setPostObjects] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]);
    const CustomTagWrapper = `${wrapper.options.tag}`; // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    const itemSelector = blockClass + ' .item';
    const itemTitleSelector = blockClass + ' .termTitle';
    const separatorSelector = blockClass + ' .separator';
    const frontTextSelector = blockClass + ' .frontText';
    const postCountSelector = blockClass + ' .postCount';
    const iconSelector = blockClass + ' .icon';
    var iconPositonArgsBasic = {
      none: {
        label: 'Choose Position',
        value: ''
      },
      beforeFronttext: {
        label: 'Before Front text',
        value: 'beforeFronttext'
      },
      afterFronttext: {
        label: 'After Front text',
        value: 'afterFronttext'
      },
      beforeItems: {
        label: 'Before Items',
        value: 'beforeItems'
      },
      afterItems: {
        label: 'After Items',
        value: 'afterItems'
      },
      beforeItem: {
        label: 'Before Each Items',
        value: 'beforeItem',
        isPro: true
      },
      afterItem: {
        label: 'After Each Items',
        value: 'afterItem',
        isPro: true
      }
    };
    let iconPositonArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__.applyFilters)('iconPositonArgs', iconPositonArgsBasic);

    function setIconPosition(option, index) {
      var options = { ...icon.options,
        position: option.value
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    var linkToArgsBasic = {
      noUrl: {
        label: 'No URL',
        value: ''
      },
      termUrl: {
        label: 'Term URL',
        value: 'termUrl'
      },
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = linkToArgsBasic;

    function setFieldLinkTo(option, index) {
      var options = { ...items.options,
        linkTo: option.value
      };
      setAttributes({
        items: { ...items,
          options: options
        }
      });
    }

    var breakPointList = [];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    const [categoryCount, setcategoryCount] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(0); // Using the hook.

    const [postCategoriesData, setPostCategoriesData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [categories, setCategories] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [postCategoriesX, setPostCategoriesX] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__.useEntityProp)('postType', postType, taxonomies.options.taxName, postId);
    var dummyCats = [{
      "id": 1,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 1",
      "slug": "category-1",
      "taxonomy": "category_tax"
    }, {
      "id": 2,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 2",
      "slug": "category-2",
      "taxonomy": "category_tax"
    }, {
      "id": 3,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 3",
      "slug": "category-3",
      "taxonomy": "category_tax"
    }, {
      "id": 4,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 4",
      "slug": "category-4",
      "taxonomy": "category_tax"
    }, {
      "id": 5,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 5",
      "slug": "category-5",
      "taxonomy": "category_tax"
    }, {
      "id": 6,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 6",
      "slug": "category-6",
      "taxonomy": "category_tax"
    }];
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setPostCategoriesData([]);
      setCategories([]);
      setcategoryCount(categories.length - 1);

      if (postCategoriesX != undefined) {
        for (x in postCategoriesX) {
          var catId = postCategoriesX[x];
          var assd = x;

          if (x) {
            _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
              path: '/wp/v2/' + taxonomies.options.taxName + '/' + catId,
              method: 'GET'
            }).then(res => {
              setPostCategoriesData(current => [...current, res]);
              setCategories(current => [...current, res]);
            });
          }
        }
      } else {
        setPostCategoriesData(dummyCats);
        setCategories(dummyCats);
      }
    }, [postCategoriesX]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var asdasd = postCategoriesData.slice(0, items.options.maxCount);
      setCategories(asdasd);
    }, [postCategoriesData]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var maxCount = items.options.maxCount.length > 0 ? items.options.maxCount : 99;

      if (postCategoriesX != undefined && postCategoriesX.length > 0) {
        setcategoryCount(categories.length - 1);
        var asdasd = postCategoriesData.slice(0, maxCount);
        setCategories(asdasd);
      } else {
        var asdasd = dummyCats.slice(0, maxCount);
        setCategories(asdasd);
      }
    }, [items]);
    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);

    function setTaxonomy(option, index) {
      var options = { ...taxonomies.options,
        taxName: option.id
      };
      setAttributes({
        taxonomies: { ...taxonomies,
          options: options
        }
      }); // var attrExist = false;
      // var data = queryPrams[index];
      // var multiple = data.multiple;
      // var isExist = queryArgs.items.map((item) => {
      //   if (item.id == index) {
      //     return true;
      //   }
      // })
      // var items = queryArgs.items.concat([data])
      // setAttributes({ queryArgs: { items: items } });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ postTitle: postTitle });
      // setAttributes({ wrapper: wrapper });

      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
        path: '/post-grid/v2/post_type_objects',
        method: 'POST',
        data: {
          postTypes: [postType]
        }
      }).then(res => {
        setPostObjects(res);
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryItems(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        items[sudoScource] = sudoScourceArgs;
      });
      var itemsX = Object.assign({}, items);
      setAttributes({
        items: itemsX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibrarySeparator(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        separator[sudoScource] = sudoScourceArgs;
      });
      var separatorX = Object.assign({}, separator);
      setAttributes({
        separator: separatorX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryFrontText(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        frontText[sudoScource] = sudoScourceArgs;
      });
      var frontTextX = Object.assign({}, frontText);
      setAttributes({
        frontText: frontTextX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleItems(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, items);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        items: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItems(sudoScource, key) {
      var object = myStore.deletePropertyDeep(items, [sudoScource, key, breakPointX]);
      setAttributes({
        items: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItems(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, items);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        items: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleFrontText(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleFrontText(sudoScource, key) {
      var object = myStore.deletePropertyDeep(frontText, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleFrontText(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        frontText: object
      });
    }

    function onChangeStyleSeparator(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleSeparator(sudoScource, key) {
      var object = myStore.deletePropertyDeep(separator, [sudoScource, key, breakPointX]);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleSeparator(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        separator: object
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [items]);

    var linkAttrObj = () => {
      var sdsd = {};
      items.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    const post = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecord('postType', context['postType'], context['postId']));
    const termstaxonomy = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecords('taxonomy', 'category', [4, 5]));
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-post-terms`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3 my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Select Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: postObjects,
      buttonTitle: "Choose",
      onChange: setTaxonomy,
      values: taxonomies.options.taxName
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: taxonomies.options.taxName,
      onChange: newVal => {
        var options = { ...taxonomies.options,
          taxName: newVal
        };
        setAttributes({
          taxonomies: { ...taxonomies,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Items",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.ToggleControl, {
      label: "Display Post Count",
      help: items.options.postCount ? 'Post Count Enabled' : 'Post Count Disabled',
      checked: items.options.postCount ? true : false,
      onChange: e => {
        var options = { ...items.options,
          postCount: items.options.postCount ? false : true
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Item Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.class,
      onChange: newVal => {
        var options = { ...items.options,
          class: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Max Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.maxCount,
      onChange: newVal => {
        var options = { ...items.options,
          maxCount: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: items.options.linkTo == undefined || items.options.linkTo.length == 0 ? 'Choose' : linkToArgs[items.options.linkTo] == undefined ? '' : linkToArgs[items.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), items.options.linkTo != undefined && items.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, items.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Author Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...items.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), items.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...items.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), items.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), items.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
      onClick: ev => {
        var options = { ...items.options,
          customUrl: ''
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(LinkControl, {
      settings: [],
      value: items.options.customUrl,
      onChange: newVal => {
        var options = { ...items.options,
          customUrl: newVal.url
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", items.options.customUrl.length != 0 ? items.options.customUrl : 'No link', " ")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.SelectControl, {
      label: "",
      value: items.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...items.options,
          linkTarget: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.prefix,
      onChange: newVal => {
        var options = { ...items.options,
          prefix: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: items.options.postfix,
      onChange: newVal => {
        var options = { ...items.options,
          postfix: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = items.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...items.options,
          linkAttr: sdsd
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), items.options.linkAttr.length > 0 && items.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: items.options.linkAttr[i].id,
        onChange: newVal => {
          items.options.linkAttr[i].id = newVal;
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          items.options.linkAttr[i].val = newVal;
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          items.options.linkAttr.splice(i, 1);
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: items,
      onChange: onChangeStyleItems,
      onAdd: onAddStyleItems,
      onRemove: onRemoveStyleItems
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: items,
      onChange: onPickCssLibraryItems
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: iconPositonArgs,
      buttonTitle: icon.options.position.length == 0 ? 'Choose' : iconPositonArgs[icon.options.position].label,
      onChange: setIconPosition,
      values: []
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Front Text",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: frontText.options.text,
      onChange: newVal => {
        var options = { ...frontText.options,
          text: newVal
        };
        setAttributes({
          frontText: { ...frontText,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: frontText,
      onChange: onChangeStyleFrontText,
      onAdd: onAddStyleFrontText,
      onRemove: onRemoveStyleFrontText
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: frontText,
      onChange: onPickCssLibraryFrontText
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Separator",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Separator"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: separator.options.text,
      onChange: newVal => {
        var options = { ...separator.options,
          text: newVal
        };
        setAttributes({
          separator: { ...separator,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: separator,
      onChange: onChangeStyleSeparator,
      onAdd: onAddStyleSeparator,
      onRemove: onRemoveStyleSeparator
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: separator,
      onChange: onPickCssLibrarySeparator
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Items Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Caetgory Items"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, itemSelector, '{}', " ")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, ".pg-postCategories a", '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Separator"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, separatorSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, frontTextSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Post Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postCountSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_17__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_18__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, taxonomies.options.taxName.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-slate-300 p-10 "
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "w-[400px] mx-auto my-0"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Select Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_16__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: postObjects,
      buttonTitle: "Choose",
      onChange: setTaxonomy,
      values: taxonomies.options.taxName
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_9__.__experimentalInputControl, {
      value: taxonomies.options.taxName,
      onChange: newVal => {
        var options = { ...taxonomies.options,
          taxName: newVal
        };
        setAttributes({
          taxonomies: { ...taxonomies,
            options: options
          }
        });
      }
    }))))), taxonomies.options.taxName.length > 0 && categories.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, "No Terms Found"), taxonomies.options.taxName.length > 0 && categories.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagWrapper, blockProps, icon.options.position == 'beforeFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "frontText inline-block"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, frontText.options.text)), icon.options.position == 'afterFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforeItems' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), categories.map((x, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, items.options.linkTo != undefined && items.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
        title: x.name
      }, linkAttrItems, {
        className: items.options.class
      }), icon.options.position == 'beforeItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "termTitle"
      }, items.options.prefix, x.name, items.options.postfix), items.options.postCount == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "postCount"
      }, "(", x.count, ")"), icon.options.position == 'afterItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), items.options.linkTo != undefined && items.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
        onClick: ev => ev.preventDefault(),
        target: items.options.linkTarget,
        title: x.name
      }, linkAttrItems, {
        className: items.options.class,
        href: x.link
      }), icon.options.position == 'beforeItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "termTitle"
      }, items.options.prefix, x.name, items.options.postfix), items.options.postCount == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "postCount"
      }, "(", x.count, ")"), icon.options.position == 'afterItem' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: icon.options.class,
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), categories.length > index + 1 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "separator",
        dangerouslySetInnerHTML: {
          __html: separator.options.text
        }
      }));
    }), icon.options.position == 'afterItems' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/post-title/index.js":
/*!****************************************!*\
  !*** ./src/blocks/post-title/index.js ***!
  \****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_templates__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/templates */ "./src/components/templates/index.js");

















const {
  RawHTML
} = wp.element;










var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/post-title", {
  apiVersion: 2,
  title: "Post Title",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "25.42",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      x: "16.42",
      y: "25.42",
      width: "9.96",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "20.72",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "16.02",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "8.58",
      width: "36",
      height: "2.35"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'h2',
          class: ''
        },
        styles: {}
      }
    },
    postTitle: {
      type: 'object',
      default: {
        options: {
          tag: '',
          limitBy: '',

          /*word, character*/
          limitCount: 99,
          isLink: true,
          linkTo: 'postUrl',

          /*postUrl, homeUrl, authorUrl, authorLink, mailTo, custom, customField */
          linkToAuthorMeta: '',
          linkToCustomMeta: '',
          linkTarget: '_blank',
          linkAttr: [],
          customUrl: '',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix',
          position: 'beforebegin ' // beforebegin , afterbegin 

        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix',
          position: 'afterend' // beforeend , afterend 

        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    let postTitle = attributes.postTitle;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false); //console.log(wp.data.select('postgrid-shop').getBreakPoint());
    // var deviceType = wp.data.select('core/edit-post').__experimentalGetPreviewDeviceType();
    // console.log(deviceType);

    const {
      deviceType
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.useSelect)(select => {
      const {
        __experimentalGetPreviewDeviceType
      } = select('core/edit-post');
      return {
        deviceType: __experimentalGetPreviewDeviceType()
      };
    }, []);
    var linkToArgsBasic = {
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__.applyFilters)('linkToArgs', linkToArgsBasic);
    var limitByArgsBasic = {
      none: {
        label: 'Choose..',
        value: ''
      },
      word: {
        label: 'Word',
        value: 'word'
      },
      character: {
        label: 'Character',
        value: 'character',
        isPro: true
      }
    };
    let limitByArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__.applyFilters)('limitByArgs', limitByArgsBasic);
    const [currentPostTitle, setCurrentPostTitle] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'title', postId);
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {}, [wrapper]); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var postTitleSelector = '';

    if (wrapper.options.tag.length != 0) {
      if (postTitle.options.isLink) {
        postTitleSelector = blockClass + ' a';
      } else {
        postTitleSelector = blockClass;
      }
    } else {
      postTitleSelector = blockClass;
    }

    function setFieldLinkTo(option, index) {
      var options = { ...postTitle.options,
        linkTo: option.value
      };
      setAttributes({
        postTitle: { ...postTitle,
          options: options
        }
      });
    }

    function setLimitBy(option, index) {
      var options = { ...postTitle.options,
        limitBy: option.value
      };
      setAttributes({
        postTitle: { ...postTitle,
          options: options
        }
      });
    }

    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    const [postTitleEdited, setpostTitleEdited] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(currentPostTitle);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var count = postTitle.options.limitCount > 0 ? postTitle.options.limitCount : 999;

      if (postTitle.options.limitBy == 'character') {
        setpostTitleEdited(currentPostTitle.substring(0, count));
      } else {
        setpostTitleEdited(currentPostTitle.split(" ").splice(0, count).join(" "));
      }
    }, [postTitle]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var count = postTitle.options.limitCount > 0 ? postTitle.options.limitCount : 0;
      var currentPostTitleX = currentPostTitle.length > 0 ? currentPostTitle : 'What is Lorem Ipsum?';

      if (postTitle.options.limitBy == 'character') {
        setpostTitleEdited(currentPostTitleX.substring(0, count));
      } else {
        setpostTitleEdited(currentPostTitleX.split(" ").splice(0, count).join(" "));
      }
    }, [currentPostTitle]);

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostTitle(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postTitle[sudoScource] = sudoScourceArgs;
      });
      var postTitleX = Object.assign({}, postTitle);
      setAttributes({
        postTitle: postTitleX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postTitleSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      var object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onResetWrapper(sudoScources) {
      let obj = Object.assign({}, wrapper);
      Object.entries(sudoScources).map(args => {
        var sudoScource = args[0];

        if (obj[sudoScource] == undefined) {} else {
          obj[sudoScource] = {};
          var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
          var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector]);
          setAttributes({
            blockCssY: {
              items: cssObject
            }
          });
        }
      });
      setAttributes({
        wrapper: obj
      });
    }

    function onChangeStylePostTitle(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postTitle);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postTitle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postTitleSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostTitle(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postTitle, [sudoScource, key, breakPointX]);
      setAttributes({
        postTitle: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postTitleSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostTitle(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postTitle);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postTitle: object
      });
    }

    function onResetPostTitle(sudoScources) {
      let obj = Object.assign({}, postTitle);
      Object.entries(sudoScources).map(args => {
        var sudoScource = args[0];

        if (obj[sudoScource] == undefined) {} else {
          obj[sudoScource] = {};
          var elementSelector = myStore.getElementSelector(sudoScource, postTitleSelector);
          var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector]);
          setAttributes({
            blockCssY: {
              items: cssObject
            }
          });
        }
      });
      setAttributes({
        postTitle: obj
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onResetPrefix(sudoScources) {
      let obj = Object.assign({}, prefix);
      Object.entries(sudoScources).map(args => {
        var sudoScource = args[0];

        if (obj[sudoScource] == undefined) {} else {
          obj[sudoScource] = {};
          var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
          var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector]);
          setAttributes({
            blockCssY: {
              items: cssObject
            }
          });
        }
      });
      setAttributes({
        prefix: obj
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    function onResetPostfix(sudoScources) {
      let obj = Object.assign({}, postfix);
      Object.entries(sudoScources).map(args => {
        var sudoScource = args[0];

        if (obj[sudoScource] == undefined) {} else {
          obj[sudoScource] = {};
          var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
          var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector]);
          setAttributes({
            blockCssY: {
              items: cssObject
            }
          });
        }
      });
      setAttributes({
        postfix: obj
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPostTitle(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, postTitle);
      obj[sudoScource] = cssObj;
      setAttributes({
        postTitle: obj
      });
      var selector = myStore.getElementSelector(sudoScource, postTitleSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPrefix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, prefix);
      obj[sudoScource] = cssObj;
      setAttributes({
        prefix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, prefixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPostfix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, postfix);
      obj[sudoScource] = cssObj;
      setAttributes({
        postfix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, postfixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
    }, [postTitle]);

    var linkAttrObj = () => {
      var sdsd = {};
      postTitle.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    var postUrl = postTitle.options.customUrl != undefined && postTitle.options.customUrl.length > 0 ? postTitle.options.customUrl : currentPostUrl;
    const CustomTagWrapper = `${wrapper.options.tag}`;
    const CustomTagPostTitle = postTitle.options.tag.length != 0 ? `${postTitle.options.tag}` : 'div';
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__.useBlockProps)({
      className: ` ${blockId} pg-post-title`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_15__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: {
            styles: wrapper.styles,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper,
      onReset: onResetWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_18__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Post Title",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_15__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
      label: "Linked?",
      help: postTitle.options.isLink ? 'Linked to URL' : 'Not linked to URL.',
      checked: postTitle.options.isLink ? true : false,
      onChange: e => {
        var options = { ...postTitle.options,
          isLink: postTitle.options.isLink ? false : true
        };
        setAttributes({
          postTitle: { ...postTitle,
            options: options
          }
        });
      }
    }), !postTitle.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: postTitle.options.tag,
      options: [{
        label: 'No tag',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...postTitle.options,
          tag: newVal
        };
        setAttributes({
          postTitle: { ...postTitle,
            options: options
          }
        });
      }
    })), postTitle.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_14__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: postTitle.options.linkTo == undefined ? 'Choose' : linkToArgs[postTitle.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-500 p-2 my-3 text-white"
    }, linkToArgs[postTitle.options.linkTo] != undefined ? linkToArgs[postTitle.options.linkTo].label : ''), postTitle.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Author Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: postTitle.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...postTitle.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          postTitle: { ...postTitle,
            options: options
          }
        });
      }
    })), postTitle.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: postTitle.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...postTitle.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          postTitle: { ...postTitle,
            options: options
          }
        });
      }
    })), postTitle.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), postTitle.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
      onClick: ev => {
        var options = { ...postTitle.options,
          customUrl: ''
        };
        setAttributes({
          postTitle: { ...postTitle,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_9__.__experimentalLinkControl, {
      settings: [],
      value: postTitle.options.customUrl,
      onChange: newVal => {
        var options = { ...postTitle.options,
          customUrl: newVal.url
        };
        setAttributes({
          postTitle: { ...postTitle,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", postTitle.options.customUrl.length != 0 ? postTitle.options.customUrl : 'No link', " ")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: postTitle.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...postTitle.options,
          linkTarget: newVal
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    }))), postTitle.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = postTitle.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...postTitle.options,
          linkAttr: sdsd
        };
        setAttributes({
          postTitle: { ...postTitle,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), postTitle.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: postTitle.options.linkAttr[i].id,
        onChange: newVal => {
          postTitle.options.linkAttr[i].id = newVal;
          var ssdsd = postTitle.options.linkAttr.concat([]);
          var options = { ...postTitle.options,
            linkAttr: ssdsd
          };
          setAttributes({
            postTitle: { ...postTitle,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        placeholder: "Value",
        className: "mr-2",
        value: x.val,
        onChange: newVal => {
          postTitle.options.linkAttr[i].val = newVal;
          var ssdsd = postTitle.options.linkAttr.concat([]);
          var options = { ...postTitle.options,
            linkAttr: ssdsd
          };
          setAttributes({
            postTitle: { ...postTitle,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          postTitle.options.linkAttr.splice(i, 1);
          var ssdsd = postTitle.options.linkAttr.concat([]);
          var options = { ...postTitle.options,
            linkAttr: ssdsd
          };
          setAttributes({
            postTitle: { ...postTitle,
              options: options
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Limit By"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_14__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: limitByArgs,
      buttonTitle: "Choose",
      onChange: setLimitBy,
      values: []
    })), postTitle.options.limitBy.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-500 my-3 text-white p-2"
    }, limitByArgs[postTitle.options.limitBy].label), (postTitle.options.limitBy == 'word' || postTitle.options.limitBy == 'character') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Limit Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: postTitle.options.limitCount,
      onChange: newVal => {
        var options = { ...postTitle.options,
          limitCount: newVal
        };
        setAttributes({
          postTitle: { ...postTitle,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: postTitle,
      onChange: onChangeStylePostTitle,
      onAdd: onAddStylePostTitle,
      onRemove: onRemoveStylePostTitle,
      onBulkAdd: onBulkAddPostTitle,
      onReset: onResetPostTitle
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_18__["default"], {
      blockId: blockId,
      obj: postTitle,
      onChange: onPickCssLibraryPostTitle
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_15__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: {
            styles: prefix.styles,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: prefix.options.position,
      options: [{
        label: 'None',
        value: 'none'
      }, {
        label: 'Before Post Title',
        value: 'beforebegin'
      }, {
        label: 'Start of Post Title',
        value: 'afterbegin'
      }],
      onChange: newVal => {
        var options = { ...prefix.options,
          position: newVal
        };
        setAttributes({
          prefix: { ...prefix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix,
      onBulkAdd: onBulkAddPrefix,
      onReset: onResetPrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_18__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_15__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: postfix.options.position,
      options: [{
        label: 'None',
        value: 'none'
      }, {
        label: 'After Post Title',
        value: 'afterend'
      }, {
        label: 'End of Post Title',
        value: 'beforeend'
      }],
      onChange: newVal => {
        var options = { ...postfix.options,
          position: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix,
      onBulkAdd: onBulkAddPostfix,
      onReset: onResetPostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_18__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Title link"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postTitleSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagWrapper, blockProps, postTitle.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, prefix.options.position == 'beforebegin' && prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      onClick: handleLinkClick
    }, linkAttrItems, {
      href: postUrl,
      target: postTitle.options.linkTarget
    }), prefix.options.position == 'afterbegin' && prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), postTitleEdited, postfix.options.position == 'beforeend' && postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), postfix.options.position == 'afterend' && postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), !postTitle.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postTitle.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, prefix.options.position != 'none' && prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), postTitleEdited, postfix.options.position != 'none' && postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), postTitle.options.tag.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, prefix.options.position == 'beforebegin' && prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagPostTitle, null, prefix.options.position == 'afterbegin' && prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), postTitleEdited, postfix.options.position == 'beforeend' && postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), postfix.options.position == 'afterend' && postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)))), wrapper.options.tag.length == 0 && postTitle.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, prefix.options.position == 'beforebegin' && prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      onClick: handleLinkClick
    }, blockProps, linkAttrItems, {
      href: postUrl,
      target: postTitle.options.linkTarget
    }), prefix.options.position == 'afterbegin' && prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), postTitleEdited, postfix.options.position == 'beforeend' && postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), postfix.options.position == 'afterend' && postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), wrapper.options.tag.length == 0 && !postTitle.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, postTitle.options.tag.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagPostTitle, blockProps, prefix.options.position != 'none' && prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), postTitleEdited, postfix.options.position != 'none' && postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), postTitle.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTagPostTitle, blockProps, prefix.options.position != 'none' && prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), postTitleEdited, postfix.options.position != 'none' && postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/progress-bar/index.js":
/*!******************************************!*\
  !*** ./src/blocks/progress-bar/index.js ***!
  \******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./variations */ "./src/blocks/progress-bar/variations.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_css_keyframes__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../../components/css-keyframes */ "./src/components/css-keyframes/index.js");
















const {
  RawHTML
} = wp.element;
















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/progress-bar", {
  apiVersion: 2,
  title: "Progress Bar",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      y: "9.82",
      width: "36",
      height: "16.37",
      rx: "1.21"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "2.81",
      y: "12.78",
      width: "15.19",
      height: "10.45",
      rx: "0.92"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#fff",
      d: "M23.3,14.06A2.6,2.6,0,0,1,24,12.17a2.7,2.7,0,0,1,2-.76,2.76,2.76,0,0,1,2.06.75,2.67,2.67,0,0,1,.73,1.9v.68a2.6,2.6,0,0,1-.73,1.88,2.73,2.73,0,0,1-2.05.75A2.77,2.77,0,0,1,24,16.62a2.56,2.56,0,0,1-.73-1.88Zm1.7.68a1.37,1.37,0,0,0,.28.86,1,1,0,0,0,.81.34,1,1,0,0,0,.79-.34,1.31,1.31,0,0,0,.28-.86v-.68a1.31,1.31,0,0,0-.28-.86,1,1,0,0,0-.8-.36.94.94,0,0,0-.8.36,1.37,1.37,0,0,0-.28.86Zm1.52,8.71-1.25-.66,6.25-10,1.25.66Zm2.9-2.18a2.63,2.63,0,0,1,.74-1.89,3.19,3.19,0,0,1,4.11,0A2.63,2.63,0,0,1,35,21.27V22a2.59,2.59,0,0,1-.73,1.89,2.73,2.73,0,0,1-2,.75,2.76,2.76,0,0,1-2.07-.76A2.59,2.59,0,0,1,29.42,22Zm1.71.68a1.26,1.26,0,0,0,.3.85,1,1,0,0,0,.8.36,1,1,0,0,0,.82-.33,1.46,1.46,0,0,0,.24-.88v-.68a1.35,1.35,0,0,0-.28-.86,1,1,0,0,0-.8-.36.94.94,0,0,0-.8.36,1.35,1.35,0,0,0-.28.86Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    progressData: {
      type: 'object',
      default: {
        type: '',
        // vertical, horizontal, circle, semi-circle, line
        animate: '',
        // onVisible, onLoad, onPageLoad
        animateDuration: 1,
        animateIteration: 2,
        animateDelay: 2,
        fill: 45,
        unit: '%'
      }
    },
    progressInfo: {
      type: 'object',
      default: {
        options: {
          class: '',
          position: 'beforeBar'
        },
        styles: {}
      }
    },
    progressBar: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    progressFill: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    progressCount: {
      type: 'object',
      default: {
        options: {
          position: 'afterLabel',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    circleOverlay: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    circleMask: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    progressLabel: {
      type: 'object',
      default: {
        options: {
          text: 'Digital Marketing',
          position: '',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          position: '',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'far fa-calendar-alt',
          position: 'beforeprogressCount',

          /*before, after,  */
          class: 'number-count-icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    // keyframes: {
    //   type: 'object',
    //   default: {
    //     pgAnimate1: {
    //       name: 'pgAnimate1',
    //       frames: {
    //         '0': { 'background-color': 'red', left: '0px', top: '0px' },
    //         '100': { 'background-color': 'yellow' }
    //       }
    //     },
    //     pgAnimate2: {
    //       name: 'pgAnimate2',
    //       frames: {
    //         '0': { 'background-color': 'red', left: '0px', top: '0px' },
    //         '100': { 'background-color': 'yellow' }
    //       }
    //     },
    //   },
    // },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: [],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var wrapper = attributes.wrapper;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var icon = attributes.icon;
    let progressBar = attributes.progressBar;
    var progressLabel = attributes.progressLabel;
    var progressCount = attributes.progressCount;
    var progressFill = attributes.progressFill;
    var progressData = attributes.progressData;
    var progressInfo = attributes.progressInfo;
    var keyframes = attributes.keyframes;
    var circleOverlay = attributes.circleOverlay;
    var circleMask = attributes.circleMask;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var progressBarSelector = blockClass + ' .progress-bar';
    var progressFillSelector = blockClass + ' .progress-fill';
    var progressCountSelector = blockClass + ' .progress-count';
    var progressLabelSelector = blockClass + ' .progress-label';
    const iconSelector = blockClass + ' .progress-icon';
    const circleOverlaySelector = blockClass + ' .progress-circle-overlay';
    const circleMaskSelector = blockClass + ' .progress-circle-mask';
    var progressInfoSelector = blockClass + ' .progress-info';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {// var start = parseInt(progressData.options.start)
      // var end = parseInt(progressData.options.end)
      // var duration = parseInt(progressData.options.duration)
    }, [progressData]);

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleProgressCount(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, progressCount);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        progressCount: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressCountSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleProgressCount(sudoScource, key) {
      var object = myStore.deletePropertyDeep(progressCount, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressCountSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleProgressCount(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, progressCount);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        progressCount: object
      });
    }

    function onChangeStyleProgressLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, progressLabel);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        progressLabel: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressLabelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleProgressLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(progressLabel, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressLabelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleProgressLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, progressLabel);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        progressLabel: object
      });
    }

    function onChangeStyleProgressBar(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, progressBar);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        progressBar: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressBarSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleProgressBar(sudoScource, key) {
      var object = myStore.deletePropertyDeep(progressBar, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressBarSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleProgressBar(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, progressBar);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        progressBar: object
      });
    }

    function onChangeStyleProgressFill(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, progressFill);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        progressFill: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressFillSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleProgressFill(sudoScource, key) {
      var object = myStore.deletePropertyDeep(progressFill, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressFillSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleProgressFill(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, progressFill);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        progressFill: object
      });
    }

    function onChangeStyleCircleOverlay(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, circleOverlay);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        circleOverlay: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, circleOverlaySelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleCircleOverlay(sudoScource, key) {
      var object = myStore.deletePropertyDeep(circleOverlay, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, circleOverlaySelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleCircleOverlay(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, circleOverlay);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        circleOverlay: object
      });
    }

    function onChangeStyleCircleMask(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, circleMask);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        circleMask: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, circleMaskSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleCircleMask(sudoScource, key) {
      var object = myStore.deletePropertyDeep(circleMask, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, circleMaskSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleCircleMask(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, circleMask);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        circleMask: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleProgressInfo(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, progressInfo);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        progressInfo: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressInfoSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleProgressInfo(sudoScource, key) {
      var object = myStore.deletePropertyDeep(progressInfo, [sudoScource, key, breakPointX]);
      setAttributes({
        progressInfo: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, progressInfoSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleProgressInfo(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, progressInfo);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        progressInfo: object
      });
    }

    String.prototype.strtr = function (dic) {
      const str = this.toString(),
            makeToken = inx => `{{###~${inx}~###}}`,
            tokens = Object.keys(dic).map((key, inx) => ({
        key,
        val: dic[key],
        token: makeToken(inx)
      })),
            tokenizedStr = tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.key, "g"), entry.token), str);

      return tokens.reduce((carry, entry) => carry.replace(new RegExp(entry.token, "g"), entry.val), tokenizedStr);
    };

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ progressBar: progressBar });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {}, [progressBar]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-progress-bar`
    });

    function onChangeKeyframes(args) {
      console.log('##########');
      console.log('KeyFrames New');
      console.log(args); //attributes['keyframes'] = {};

      setAttributes({
        keyframes: args
      });
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: progressData.type,
      options: [{
        label: 'Choose Type',
        value: ''
      }, {
        label: 'Vertical',
        value: 'vertical'
      }, {
        label: 'Horizontal',
        value: 'horizontal'
      } // { label: 'Circular Border', value: 'circleBorder' },
      // { label: 'Circular Fill', value: 'circleFill' },
      // { label: 'Semi Circular', value: 'circleBorderSemi' },
      ],
      onChange: newVal => {
        setAttributes({
          progressData: { ...progressData,
            type: newVal
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Fill?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      type: "number",
      className: "mr-2",
      value: progressData.fill,
      onChange: newVal => {
        setAttributes({
          progressData: { ...progressData,
            fill: newVal
          }
        }); //var styles = { ...progressFill.styles, width: { Desktop: newVal + '%' } };
        //setAttributes({ progressFill: { ...progressFill, styles: styles } });

        onChangeStyleProgressFill('styles', newVal + '%', 'width');
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Animate On"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: progressData.animate == undefined ? '' : progressData.animate,
      options: [{
        label: 'No Animation',
        value: ''
      }, {
        label: 'onVisible',
        value: 'onVisible'
      }, {
        label: 'onLoad',
        value: 'onLoad'
      }],
      onChange: newVal => {
        // var options = { ...progressData.options, animate: newVal };
        setAttributes({
          progressData: { ...progressData,
            animate: newVal
          }
        });
      }
    })), progressData.animate != undefined && progressData.animate.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Duration?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      type: "number",
      className: "mr-2",
      value: progressData.duration,
      onChange: newVal => {
        setAttributes({
          progressData: { ...progressData,
            duration: newVal
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Progress Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Text?"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      type: "text",
      className: "mr-2",
      value: progressLabel.options.text,
      onChange: newVal => {
        var options = { ...progressLabel.options,
          text: newVal
        };
        setAttributes({
          progressLabel: { ...progressLabel,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: progressLabel.options.position,
      options: [{
        label: 'Before Bar',
        value: 'beforeBar'
      }, {
        label: 'Before Fill',
        value: 'beforeFill'
      }, {
        label: 'After Fill',
        value: 'afterFill'
      }, {
        label: 'Inside Fill',
        value: 'insideFill'
      }, {
        label: 'After Bar',
        value: 'afterBar'
      }],
      onChange: newVal => {
        var options = { ...progressLabel.options,
          position: newVal
        };
        setAttributes({
          progressLabel: { ...progressLabel,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: progressLabel,
      onChange: onChangeStyleProgressLabel,
      onAdd: onAddStyleProgressLabel,
      onRemove: onRemoveStyleProgressLabel
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Progress Count",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Counter Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: progressCount.options.position,
      options: [{
        label: 'Before Bar',
        value: 'beforeBar'
      }, {
        label: 'Before Fill',
        value: 'beforeFill'
      }, {
        label: 'Inside Fill',
        value: 'insideFill'
      }, {
        label: 'After Fill',
        value: 'afterFill'
      }, {
        label: 'After Bar',
        value: 'afterBar'
      }, {
        label: 'Before Label',
        value: 'beforeLabel'
      }, {
        label: 'After Label',
        value: 'afterLabel'
      }],
      onChange: newVal => {
        var options = { ...progressCount.options,
          position: newVal
        };
        setAttributes({
          progressCount: { ...progressCount,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: progressCount,
      onChange: onChangeStyleProgressCount,
      onAdd: onAddStyleProgressCount,
      onRemove: onRemoveStyleProgressCount
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Progress Bar",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: progressBar,
      onChange: onChangeStyleProgressBar,
      onAdd: onAddStyleProgressBar,
      onRemove: onRemoveStyleProgressBar
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Progress Fill",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: progressFill,
      onChange: onChangeStyleProgressFill,
      onAdd: onAddStyleProgressFill,
      onRemove: onRemoveStyleProgressFill
    })))), progressData.type == 'circleBorder' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Circle Overlay",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: circleOverlay,
      onChange: onChangeStyleCircleOverlay,
      onAdd: onAddStyleCircleOverlay,
      onRemove: onRemoveStyleCircleOverlay
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Circle Mask",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: circleMask,
      onChange: onChangeStyleCircleMask,
      onAdd: onAddStyleCircleMask,
      onRemove: onRemoveStyleCircleMask
    }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_19__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Progress Info",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Info Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: progressInfo.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Bar',
        value: 'beforeBar'
      }, {
        label: 'After Bar',
        value: 'afterBar'
      }],
      onChange: newVal => {
        var options = { ...progressInfo.options,
          position: newVal
        };
        setAttributes({
          progressInfo: { ...progressInfo,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: progressInfo,
      onChange: onChangeStyleProgressInfo,
      onAdd: onAddStyleProgressInfo,
      onRemove: onRemoveStyleProgressInfo
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_15__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, !progressData.type && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400 hidden hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        replaceInnerBlocks(clientId, createBlocksFromInnerBlocksTemplate([['post-grid/text', {}]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_11__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 bg-gray-400 cursor-pointer hover:bg-gray-500 relative",
        onClick: ev => {
          if (variation.isPro) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var atts = variation.atts;
          var wrapper = { ...atts.wrapper
          };
          var progressData = { ...atts.progressData
          };
          var progressInfo = { ...atts.progressInfo
          };
          var progressBar = { ...atts.progressBar
          };
          var progressFill = { ...atts.progressFill
          };
          var progressCount = { ...atts.progressCount
          };
          var progressLabel = { ...atts.progressLabel
          };
          var icon = { ...atts.icon
          };
          var circleMask = { ...atts.circleMask
          };
          var circleOverlay = { ...atts.circleOverlay
          };
          var blockCssY = { ...atts.blockCssY
          };
          var customCss = { ...atts.customCss
          };
          var blockCssObj = {};
          blockCssObj[wrapperSelector] = wrapper;
          blockCssObj[progressInfoSelector] = progressInfo;
          blockCssObj[progressBarSelector] = progressBar;
          blockCssObj[progressFillSelector] = progressFill;
          blockCssObj[progressCountSelector] = progressCount;
          blockCssObj[progressLabelSelector] = progressLabel;
          blockCssObj[iconSelector] = icon;
          blockCssObj[circleMaskSelector] = circleMask;
          blockCssObj[circleOverlaySelector] = circleOverlay;
          setAttributes({
            wrapper: wrapper,
            progressData: progressData,
            progressInfo: progressInfo,
            progressBar: progressBar,
            progressFill: progressFill,
            progressCount: progressCount,
            progressLabel: progressLabel,
            icon: icon,
            circleMask: circleMask,
            circleOverlay: circleOverlay,
            customCss: customCss
          });
          var blockCssRules = myStore.getBlockCssRules(blockCssObj);
          var items = { ...blockCssY.items,
            ...blockCssRules
          };
          setAttributes({
            blockCssY: {
              items: items
            }
          }); // replaceInnerBlocks(
          //   clientId,
          //   createBlocksFromInnerBlocksTemplate(variation.innerBlocks),
          //   true
          // );
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), progressData.type == 'horizontal' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, progressInfo.options.position == 'beforeBar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-info"
    }, icon.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), progressCount.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), progressLabel.options.position.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-bar"
    }, progressLabel.options.position == 'beforeFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'beforeFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-fill"
    }, progressLabel.options.position == 'insideFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'insideFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill)), progressLabel.options.position == 'afterFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill)), progressInfo.options.position == 'afterBar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-info"
    }, icon.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), progressCount.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), progressLabel.options.position.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill))), progressData.type == 'vertical' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, progressInfo.options.position == 'beforeBar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-info"
    }, icon.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), progressCount.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), progressLabel.options.position.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-bar"
    }, progressLabel.options.position == 'beforeFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'beforeFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-fill"
    }, progressLabel.options.position == 'insideFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'insideFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill)), progressLabel.options.position == 'afterFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill)), progressInfo.options.position == 'afterBar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-info"
    }, icon.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), progressCount.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), progressLabel.options.position.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill))), progressData.type == 'circleBorder' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, progressInfo.options.position == 'beforeBar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-info"
    }, progressCount.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), icon.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), progressLabel.options.position.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "circle-wrap progress-bar"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "mask full progress-circle-mask"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "fill progress-fill"
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "mask half progress-circle-mask"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "fill progress-fill"
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "inside-circle progress-circle-overlay"
    }, "  ")), progressInfo.options.position == 'afterBar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-info"
    }, progressInfo.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), icon.options.position == 'beforePrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), progressCount.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), progressLabel.options.position.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill))), progressData.type == 'circleFill' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, progressInfo.options.position == 'beforeBar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-info"
    }, progressInfo.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), icon.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), progressCount.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), progressLabel.options.position.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "circle-wrap progress-bar"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "mask full"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "fill progress-fill"
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "mask half"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      class: "fill progress-fill"
    }))), progressInfo.options.position == 'afterBar' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-info"
    }, progressInfo.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), icon.options.position == 'beforePrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), progressCount.options.position == 'beforeLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill), progressLabel.options.position.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-label"
    }, progressLabel.options.text), progressCount.options.position == 'afterLabel' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "progress-count"
    }, progressData.fill)))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/progress-bar/variations.js":
/*!***********************************************!*\
  !*** ./src/blocks/progress-bar/variations.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__);


/**
 * WordPress dependencies
 */


let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('isProFeature', true);
/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: 'layout-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-1'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-1'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {},
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "beforeBar"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "justifyContent": {
          "Desktop": "space-between"
        },
        "padding": {
          "Desktop": "10px 0px 10px 0px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        },
        "height": {
          "Desktop": "50px"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "height": {
          "Desktop": "50px"
        },
        "width": {
          "Desktop": "40%"
        }
      }
    },
    progressCount: {
      "options": {
        "position": "afterLabel",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    progressLabel: {
      "options": {
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-2',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-2'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-2'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {},
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "beforeBar"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "justifyContent": {
          "Desktop": "space-between"
        },
        "paddingBottom": {
          "Desktop": "10px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "width": {
          "Desktop": "70%"
        }
      }
    },
    progressCount: {
      "options": {
        "position": "afterLabel",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    progressLabel: {
      "options": {
        "tag": "div",
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "order": {
          "Desktop": "10"
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-3',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-3'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-3'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {
          "Desktop": "0px 100px 0px 0px"
        },
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "afterBar"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "justifyContent": {
          "Desktop": "space-between"
        },
        "paddingTop": {
          "Desktop": "10px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "width": {
          "Desktop": "60%"
        }
      }
    },
    progressCount: {
      "options": {
        "position": "afterLabel",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    progressLabel: {
      "options": {
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-4',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-4'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-4'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {},
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "afterBar"
      },
      "styles": {
        "display": {
          "Desktop": "flex"
        },
        "justifyContent": {
          "Desktop": "space-between"
        },
        "paddingTop": {
          "Desktop": "10px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "width": {
          "Desktop": "80%"
        }
      }
    },
    progressCount: {
      "options": {
        "position": "afterLabel",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    progressLabel: {
      "options": {
        "tag": "div",
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "order": {
          "Desktop": "10"
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-5',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-5'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-5'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {},
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "beforeBar"
      },
      "styles": {
        "display": {},
        "paddingBottom": {
          "Desktop": "10px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "width": {
          "Desktop": "50%"
        },
        "paddingBottom": {}
      }
    },
    progressCount: {
      "options": {
        "tag": "div",
        "position": "insideFill",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#ffffff"
        },
        "fontSize": {},
        "padding": {
          "Desktop": "10px 10px 10px 10px"
        },
        "backgroundColor": {}
      }
    },
    progressLabel: {
      "options": {
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-6',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-6'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-6'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {},
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "beforeBar"
      },
      "styles": {
        "display": {},
        "paddingBottom": {
          "Desktop": "10px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "width": {
          "Desktop": "50%"
        },
        "paddingBottom": {},
        "position": {
          "Desktop": "relative"
        }
      }
    },
    progressCount: {
      "options": {
        "tag": "div",
        "position": "insideFill",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#ffffff"
        },
        "fontSize": {},
        "padding": {
          "Desktop": "5px 8px 5px 8px"
        },
        "backgroundColor": {
          "Desktop": "#A084CF"
        },
        "position": {
          "Desktop": "absolute"
        },
        "right": {
          "Desktop": "0px"
        },
        "top": {
          "Desktop": "50%"
        },
        "transform": {
          "Desktop": "translateY(-50%) "
        }
      }
    },
    progressLabel: {
      "options": {
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-7',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-7'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-7'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {},
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "beforeBar"
      },
      "styles": {
        "display": {},
        "paddingBottom": {
          "Desktop": "10px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "width": {
          "Desktop": "75%"
        },
        "paddingBottom": {},
        "position": {
          "Desktop": "relative"
        }
      }
    },
    progressCount: {
      "options": {
        "tag": "div",
        "position": "insideFill",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#ffffff"
        },
        "fontSize": {},
        "padding": {
          "Desktop": "4px 8px 4px 8px"
        },
        "backgroundColor": {
          "Desktop": "#774360"
        },
        "position": {
          "Desktop": "absolute"
        },
        "right": {
          "Desktop": "-14px"
        },
        "top": {
          "Desktop": "50%"
        },
        "transform": {
          "Desktop": "translateY(-50%) "
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        }
      }
    },
    progressLabel: {
      "options": {
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-7',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-7'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-7'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {},
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "beforeBar"
      },
      "styles": {
        "display": {},
        "paddingBottom": {
          "Desktop": "10px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "width": {
          "Desktop": "75%"
        },
        "paddingBottom": {},
        "position": {
          "Desktop": "relative"
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        }
      }
    },
    progressCount: {
      "options": {
        "tag": "div",
        "position": "insideFill",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#ffffff"
        },
        "fontSize": {},
        "padding": {
          "Desktop": "4px 8px 4px 8px"
        },
        "backgroundColor": {
          "Desktop": "#774360"
        },
        "position": {
          "Desktop": "absolute"
        },
        "right": {
          "Desktop": "10px"
        },
        "top": {
          "Desktop": "50%"
        },
        "transform": {
          "Desktop": "translateY(-50%) "
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        }
      }
    },
    progressLabel: {
      "options": {
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-8',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-8'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-8'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {},
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "beforeBar"
      },
      "styles": {
        "display": {},
        "paddingBottom": {
          "Desktop": "10px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        },
        "position": {
          "Desktop": "relative"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "width": {
          "Desktop": "75%"
        },
        "paddingBottom": {},
        "position": {},
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        }
      }
    },
    progressCount: {
      "options": {
        "tag": "div",
        "position": "afterFill",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#ffffff"
        },
        "fontSize": {},
        "padding": {
          "Desktop": "4px 8px 4px 8px"
        },
        "backgroundColor": {
          "Desktop": "#774360"
        },
        "position": {
          "Desktop": "absolute"
        },
        "right": {
          "Desktop": "10px"
        },
        "top": {
          "Desktop": "50%"
        },
        "transform": {
          "Desktop": "translateY(-50%) "
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        }
      }
    },
    progressLabel: {
      "options": {
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}, {
  name: 'layout-9',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-9'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('layout-9'),
  isPro: false,
  //isPro: !isProFeature ? false : true,
  atts: {
    wrapper: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "margin": {},
        "paddingBottom": {
          "Desktop": "50px"
        }
      }
    },
    progressData: {
      "type": "horizontal",
      "animate": "onVisible",
      "animateDuration": 1,
      "animateIteration": 2,
      "animateDelay": 2,
      "fill": 45,
      "unit": "%"
    },
    progressInfo: {
      "options": {
        "tag": "div",
        "class": "",
        "position": "beforeBar"
      },
      "styles": {
        "display": {},
        "paddingBottom": {
          "Desktop": "10px"
        }
      }
    },
    progressBar: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#9DD6DF"
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        },
        "position": {
          "Desktop": "relative !important"
        }
      }
    },
    progressFill: {
      "options": {
        "tag": "div",
        "class": ""
      },
      "styles": {
        "color": {},
        "fontSize": {},
        "height": {
          "Desktop": "50px"
        },
        "backgroundColor": {
          "Desktop": "#18978F"
        },
        "width": {
          "Desktop": "75%"
        },
        "paddingBottom": {},
        "position": {
          "Desktop": "relative"
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        }
      }
    },
    progressCount: {
      "options": {
        "tag": "div",
        "position": "insideFill",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": "#ffffff"
        },
        "fontSize": {},
        "padding": {
          "Desktop": "4px 8px 4px 8px"
        },
        "backgroundColor": {
          "Desktop": "#774360"
        },
        "position": {
          "Desktop": "absolute"
        },
        "right": {},
        "top": {
          "Desktop": "50%"
        },
        "transform": {
          "Desktop": "translateY(-50%) "
        },
        "borderRadius": {
          "Desktop": "50px 50px 50px 50px"
        },
        "left": {
          "Desktop": "8px"
        }
      }
    },
    progressLabel: {
      "options": {
        "text": "Digital Marketing",
        "position": "",
        "class": ""
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    icon: {
      "options": {
        "library": "fontAwesome",
        "position": "beforeprogressCount",
        "srcType": "class",
        "iconSrc": "far fa-calendar-alt",
        "class": "number-count-icon"
      },
      "styles": {
        "color": {
          "Desktop": ""
        },
        "backgroundColor": {
          "Desktop": ""
        },
        "fontSize": {
          "Desktop": ""
        }
      }
    },
    circleMask: {},
    circleOverlay: {},
    blockId: "",
    customCss: "",
    blockCssY: {
      items: {}
    }
  },
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 160 80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "13.33",
    width: "76.67",
    height: "23.34"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#1d4ed8",
    x: "41.67",
    y: "43.33",
    width: "76.67",
    height: "23.34"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/read-more/index.js":
/*!***************************************!*\
  !*** ./src/blocks/read-more/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
















const {
  RawHTML
} = wp.element;















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/read-more", {
  apiVersion: 2,
  title: "Read More",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.42",
      y: "21.43",
      width: "9.96",
      height: "2.35"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "21.61",
      width: "13.97",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "16.91",
      width: "36",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#8db1ff",
      y: "12.22",
      width: "36",
      height: "2"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    readMore: {
      type: 'object',
      default: {
        options: {
          text: 'Read More',
          linkTo: 'postUrl',
          linkTarget: '_blank',
          customUrl: '',
          linkToAuthorMeta: '',
          linkToCustomMeta: '',
          linkAttr: [],
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {},
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          letterSpacing: {},
          fontFamily: {},
          fontWeight: {
            "Desktop": "700"
          },
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: '',
          position: '',

          /*before, after, prefix, postfix */
          class: 'readmore-icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          display: {},
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          fontWeight: {
            "Desktop": "700"
          },
          textDecoration: {} //overline, line-through, underline

        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    linkAttr: {
      "type": "array",
      "default": []
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var readMore = attributes.readMore;
    var icon = attributes.icon;
    var linkAttr = attributes.linkAttr;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [currentPostContent, setCurrentpostContent] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'content', postId);
    const [customFields, setCustomFields] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    const [linkPickerPosttitle, setLinkPickerPosttitle] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    var redmoreSelector = blockClass + ' .readmore';

    if (readMore.options.linkTo.length == 0) {
      var redmoreSelector = blockClass + ' .text';
    } else {
      var redmoreSelector = blockClass + ' .readmore';
    }

    const iconSelector = blockClass + ' .readmore-icon';
    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';
    var linkToArgsBasic = {
      noUrl: {
        label: 'No URL',
        value: ''
      },
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    let linkToArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_9__.applyFilters)('linkToArgs', linkToArgsBasic);

    function setFieldLinkTo(option, index) {
      var options = { ...readMore.options,
        linkTo: option.value
      };
      setAttributes({
        readMore: { ...readMore,
          options: options
        }
      });
    }

    function getMetaField(metaKey) {
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7___default()({
        path: '/post-grid/v2/get_post_meta',
        method: 'POST',
        data: {
          postId: postId,
          meta_key: metaKey
        }
      }).then(res => {
        if (res['meta_value'] != undefined && res['meta_value'].length > 0) {
          customFields[metaKey] = res['meta_value'];
          setCustomFields({});
          setCustomFields(customFields);
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    const [linkPickerExcerpt, setLinkPickerExcerpt] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [linkPickerReadmore, setLinkPickerReadmore] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_10__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryReadMore(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        readMore[sudoScource] = sudoScourceArgs;
      });
      var readMoreX = Object.assign({}, readMore);
      setAttributes({
        readMore: readMoreX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, redmoreSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleReadmore(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, readMore);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        readMore: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, redmoreSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleReadmore(sudoScource, key) {
      var object = myStore.deletePropertyDeep(readMore, [sudoScource, key, breakPointX]);
      setAttributes({
        readMore: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, redmoreSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleReadmore(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, readMore);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        readMore: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddReadmore(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, readMore);
      obj[sudoScource] = cssObj;
      setAttributes({
        readMore: obj
      });
      var selector = myStore.getElementSelector(sudoScource, redmoreSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddIcon(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, icon);
      obj[sudoScource] = cssObj;
      setAttributes({
        icon: obj
      });
      var selector = myStore.getElementSelector(sudoScource, iconSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPrefix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, prefix);
      obj[sudoScource] = cssObj;
      setAttributes({
        prefix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, prefixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPostfix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, postfix);
      obj[sudoScource] = cssObj;
      setAttributes({
        postfix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, postfixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    var [linkAttrItemsReadmore, setlinkAttrItemsReadmore] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var sdsd = {};
      readMore.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItemsReadmore(sdsd);
    }, [readMore]);
    var postUrl = readMore.options.customUrl != undefined && readMore.options.customUrl.length > 0 ? readMore.options.customUrl : currentPostUrl;
    const CustomTag = `${wrapper.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-read-more`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Read More",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Read More Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: readMore.options.text,
      onChange: newVal => {
        var options = { ...readMore.options,
          text: newVal
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_20__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: readMore.options.linkTo == undefined || readMore.options.linkTo.length == 0 ? 'Choose' : linkToArgs[readMore.options.linkTo].label,
      onChange: setFieldLinkTo,
      values: []
    })), readMore.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, readMore.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Author Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: readMore.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...readMore.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    })), readMore.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: readMore.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...readMore.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    })), readMore.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: linkPickerPosttitle ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        setLinkPickerPosttitle(prev => !prev);
      }
    }), readMore.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
      onClick: ev => {
        var options = { ...readMore.options,
          customUrl: ''
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
        setLinkPickerPosttitle(false);
      }
    }), linkPickerPosttitle && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.__experimentalLinkControl, {
      settings: [],
      value: readMore.options.customUrl,
      onChange: newVal => {
        var options = { ...readMore.options,
          customUrl: newVal.url
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", readMore.options.customUrl.length != 0 ? readMore.options.customUrl : 'No link', " ")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: readMore.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...readMore.options,
          linkTarget: newVal
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = readMore.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...readMore.options,
          linkAttr: sdsd
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      }
    }, "Add")), readMore.options.linkAttr != undefined && readMore.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: readMore.options.linkAttr[i].id,
        onChange: newVal => {
          readMore.options.linkAttr[i].id = newVal;
          var ssdsd = readMore.options.linkAttr.concat([]);
          var options = { ...readMore.options,
            linkAttr: ssdsd
          };
          setAttributes({
            readMore: { ...readMore,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          readMore.options.linkAttr[i].val = newVal;
          var ssdsd = readMore.options.linkAttr.concat([]);
          var options = { ...readMore.options,
            linkAttr: ssdsd
          };
          setAttributes({
            readMore: { ...readMore,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          readMore.options.linkAttr.splice(i, 1);
          var ssdsd = readMore.options.linkAttr.concat([]);
          var options = { ...readMore.options,
            linkAttr: ssdsd
          };
          setAttributes({
            readMore: { ...readMore,
              options: options
            }
          });
        }
      })));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: readMore,
      onChange: onChangeStyleReadmore,
      onAdd: onAddStyleReadmore,
      onRemove: onRemoveStyleReadmore,
      onBulkAdd: onBulkAddReadmore
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: readMore,
      onChange: onPickCssLibraryReadMore
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_14__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Readmore Text',
        value: 'beforeReadmore'
      }, {
        label: 'After Readmore Text',
        value: 'afterReadmore'
      }, {
        label: 'Before Prefix',
        value: 'beforePrefix'
      }, {
        label: 'After Prefix',
        value: 'afterPrefix'
      }, {
        label: 'Before Postfix',
        value: 'beforePostfix'
      }, {
        label: 'After Postfix',
        value: 'afterPostfix'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon,
      onBulkAdd: onBulkAddIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: { ...prefix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix,
      onBulkAdd: onBulkAddPrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_21__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_23__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix,
      onBulkAdd: onBulkAddPostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_22__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_24__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Excerpt Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Read More"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, redmoreSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Prefix Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Postfix Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_15__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_16__["default"], {
      utm: {
        utm_source: 'BlockReadMore',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, blockProps, icon.options.position == 'beforePrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'afterPrefix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), readMore.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "readmore",
      onClick: handleLinkClick
    }, linkAttrItemsReadmore, {
      target: readMore.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforeReadmore' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
      className: "text",
      tagName: 'span',
      value: readMore.options.text,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: content => {
        var options = { ...readMore.options,
          text: content
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
    }), icon.options.position == 'afterReadmore' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), readMore.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
      className: "text",
      tagName: 'span',
      value: readMore.options.text,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: content => {
        var options = { ...readMore.options,
          text: content
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
    }), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, readMore.options.linkTo.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      className: "readmore",
      onClick: handleLinkClick
    }, linkAttrItemsReadmore, {
      target: readMore.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforeReadmore' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
      className: "text",
      tagName: 'span',
      value: readMore.options.text,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: content => {
        var options = { ...readMore.options,
          text: content
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
    }), icon.options.position == 'afterReadmore' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), readMore.options.linkTo.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      className: "readmore",
      onClick: handleLinkClick
    }, linkAttrItemsReadmore, {
      target: readMore.options.linkTarget,
      href: postUrl
    }), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforeReadmore' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, {
      className: "text",
      tagName: 'span',
      value: readMore.options.text,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: content => {
        var options = { ...readMore.options,
          text: content
        };
        setAttributes({
          readMore: { ...readMore,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
    }), icon.options.position == 'afterReadmore' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforePostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text), icon.options.position == 'afterPostfix' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/shortcode/index.js":
/*!***************************************!*\
  !*** ./src/blocks/shortcode/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/plus.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");















const {
  RawHTML
} = wp.element;








var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_4__.registerBlockType)("post-grid/shortcode", {
  apiVersion: 2,
  title: "Shortcode",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "5.51 28.64 0 28.64 0 7.36 5.51 7.36 5.51 9.28 1.92 9.28 1.92 26.72 5.51 26.72 5.51 28.64"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("polygon", {
      fill: "#1d4ed8",
      points: "36 28.64 30.48 28.64 30.48 26.72 34.08 26.72 34.08 9.28 30.48 9.28 30.48 7.36 36 7.36 36 28.64"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "4.42",
      y: "15.46",
      width: "26.73",
      height: "5.08"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          class: 'inline-block'
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {},
          margin: {}
        }
      }
    },
    shortcodeClassic: {
      "type": "string",
      "default": ''
    },
    shortcode: {
      type: 'object',
      default: {
        options: {
          key: '',
          id: '',
          prefix: '',
          postfix: '',
          prams: []
        },
        styles: {
          color: {
            Desktop: ''
          },
          padding: {},
          margin: {}
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var shortcode = attributes.shortcode;
    var shortcodeClassic = attributes.shortcodeClassic;
    var wrapper = attributes.wrapper;
    var items = attributes.items;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [metaValue, setMetaValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null);
    const [metaHtml, setMetaHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    const [metaArgs, setMetaArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null);
    const [linkPickerText, setLinkPickerText] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    const [shortcodePrams, setShortcodePrams] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
      id: '',
      label: '',
      val: ''
    }); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    const itemSelector = blockClass + ' .item';
    const postCountSelector = blockClass + ' .postCount';
    const [shortcodes, setshortcodes] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
      yith_wcwl_add_to_wishlist: {
        label: 'YITH - Add to Wishlist',
        value: 'yith_wcwl_add_to_wishlist',
        args: [{
          id: 'product_id',
          label: 'Product Id',
          val: '{currentPostId}'
        }]
      },
      yasr_overall_rating: {
        label: 'YASR- overall rating',
        value: 'yasr_overall_rating',
        args: [{
          id: 'size',
          label: 'Size',
          val: '15'
        }, {
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      yasr_visitor_votes: {
        label: 'YASR - visitor votes',
        value: 'yasr_visitor_votes',
        args: [{
          id: 'size',
          label: 'Size',
          val: '15'
        }, {
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      wp_postviews: {
        label: 'WP-PostViews',
        value: 'views',
        args: [{
          id: 'id',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      wp_postratings: {
        label: 'WP-PostRatings',
        value: 'wp_postratings',
        args: [{
          id: 'id',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      site_reviews_summary: {
        label: 'Site Reviews - Summary',
        value: 'site_reviews_summary',
        args: [{
          id: 'hide',
          label: 'Hide',
          val: ''
        }, {
          id: 'assigned_to',
          label: 'Assigned To',
          val: ''
        }, {
          id: 'class',
          label: 'Class',
          val: ''
        }]
      },
      ratingwidget: {
        label: 'Rating-Widget',
        value: 'ratingwidget',
        args: [{
          id: 'post_id',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      ratemypostresult: {
        label: 'Rate my Post - Result',
        value: 'ratemypost-result',
        args: [{
          id: 'post_id',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      ratemypost: {
        label: 'Rate my Post',
        value: 'ratemypost',
        args: [{
          id: 'id',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      postviews: {
        label: 'Post Views Counter',
        value: 'post-views',
        args: [{
          id: 'id',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      pvcp_1: {
        label: 'Page Visit Counter',
        value: 'pvcp_1',
        args: [{
          id: 'postid',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      pvc_stats: {
        label: 'Page Views Count',
        value: 'pvc_stats',
        args: [{
          id: 'postid',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      mr_rating_result: {
        label: 'Multi Rating - Result',
        value: 'mr_rating_result',
        args: [{
          id: 'post_id',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      mr_rating_form: {
        label: 'Multi Rating',
        value: 'mr_rating_form',
        args: [{
          id: 'post_id',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      },
      likebtn: {
        label: 'Like Button Rating',
        value: 'likebtn',
        args: {}
      },
      kkratings: {
        label: 'KK Star Ratings',
        value: 'kkratings',
        args: [{
          id: 'size',
          label: 'Size',
          val: '15'
        }, {
          id: 'id',
          label: 'Post Id',
          val: '{currentPostId}'
        }]
      }
    });
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      console.log(shortcode);
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1___default()({
        path: '/post-grid/v2/get_shortcode',
        method: 'POST',
        data: {
          postId: postId,
          meta_key: shortcode.options.key,
          prams: shortcode.options.prams
        }
      }).then(res => {
        console.log(res.html);
        setMetaHtml(res.html); //setMetaArgs(res.args);
      });
    }, [shortcode]);
    var breakPointList = [];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ numberCount: numberCount });
      // setAttributes({ wrapper: wrapper });

      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [items]);
    const post = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_6__.useSelect)(select => select('core').getEntityRecord('postType', context['postType'], context['postId']));
    const termstaxonomy = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_6__.useSelect)(select => select('core').getEntityRecords('taxonomy', 'category', [4, 5]));
    console.log(blockId);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps)({
      className: ` ${blockId} pg-shortcode`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Shortcode Key",
      initialOpen: true
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      className: "mb-3"
    }, "Choose Shortcode "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_13__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: shortcodes,
      buttonTitle: "Choose",
      onChange: (option, index) => {
        var options = { ...shortcode.options,
          id: option.id,
          key: option.value,
          prams: option.args
        };
        setAttributes({
          shortcode: { ...shortcode,
            options: options
          }
        });
      },
      values: "",
      value: shortcode.options.key
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Shortcode Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      placeholder: "Shortcode key",
      value: shortcode.options.key,
      onChange: newVal => {
        let result = newVal.includes("[");

        if (result) {
          var shortcodeStr = newVal.replace('[', '');
          shortcodeStr = shortcodeStr.replace(']', '');
          var shortcodeArr = shortcodeStr.split(' ');
          var shortcodeKey = shortcodeArr[0];
          newVal = shortcodeKey;
          shortcodeArr.shift();
          var attsGroups = [];
          var options = { ...shortcode.options
          };
          console.log(options);
          shortcodeArr.map(x => {
            var shortcodePrams = {};
            var attrArr = x.split('=');
            shortcodePrams.id = attrArr[0] == undefined ? '' : attrArr[0];
            shortcodePrams.label = attrArr[0] == undefined ? '' : attrArr[0];
            shortcodePrams.val = attrArr[1] == undefined ? '' : attrArr[1].replaceAll('"', '');
            options.prams.push(shortcodePrams);
          });
          setAttributes({
            shortcode: { ...shortcode,
              options: options
            }
          });
        }

        var options = { ...shortcode.options,
          key: newVal
        };
        setAttributes({
          shortcode: { ...shortcode,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "You can paste the shortcode, please use following format when pasting"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, "[shortcode attr1=\"value1\" attr2=\"value2\"]"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Parameters"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      className: linkPickerText ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_17__["default"],
      onClick: ev => {
        setLinkPickerText(prev => !prev);
      }
    }, "Add"), linkPickerText && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Popover, {
      position: "bottom right "
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-3 w-60"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "ID"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: shortcodePrams.id,
      onChange: newVal => {
        setShortcodePrams({ ...shortcodePrams,
          id: newVal
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: shortcodePrams.label,
      onChange: newVal => {
        setShortcodePrams({ ...shortcodePrams,
          label: newVal
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: shortcodePrams.val,
      onChange: newVal => {
        setShortcodePrams({ ...shortcodePrams,
          val: newVal
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Button, {
      variant: "secondary",
      onClick: ev => {
        var options = { ...shortcode.options
        };
        options.prams.push(shortcodePrams);
        setAttributes({
          shortcode: { ...shortcode,
            options: options
          }
        }); // shortcodePrams.id = '';
        // shortcodePrams.label = '';
        // shortcodePrams.val = '';
      }
    }, "Add Parameter")))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, shortcode.options.prams != undefined && shortcode.options.prams.map((arg, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "my-2 bg-gray-300"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "bg-gray-500 px-3 text-white"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, arg.label, " (", arg.id, ")"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        class: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var options = { ...shortcode.options
          };
          options.prams.splice(index, 1);
          setAttributes({
            shortcode: { ...shortcode,
              options: options
            }
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
        xmlns: "http://www.w3.org/2000/svg",
        viewBox: "0 0 24 24",
        width: "24",
        height: "24",
        "aria-hidden": "true",
        focusable: "false"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
        d: "M13 11.8l6.1-6.3-1-1-6.1 6.2-6.1-6.2-1 1 6.1 6.3-6.5 6.7 1 1 6.5-6.6 6.5 6.6 1-1z"
      }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "px-3 py-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
        value: arg.val,
        onChange: newVal => {
          var options = { ...shortcode.options
          };
          options.prams[index].val = newVal;
          setAttributes({
            shortcode: { ...shortcode,
              options: options
            }
          });
        }
      })));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_14__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_18__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_15__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
      value: wrapper.options.class,
      onChange: newVal => {
        var options = { ...wrapper.options,
          class: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_15__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Items Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Caetgory Items"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, itemSelector, '{}', " ")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, ".pg-shortcode a", '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Post Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, postCountSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, shortcode.options.key.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_13__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: shortcodes,
      buttonTitle: "Choose",
      onChange: (option, index) => {
        var options = { ...shortcode.options,
          key: option.value
        };
        setAttributes({
          shortcode: { ...shortcode,
            options: options
          }
        });
      },
      values: "",
      value: shortcode.options.key
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RawHTML, null, metaHtml))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/social-share/index.js":
/*!******************************************!*\
  !*** ./src/blocks/social-share/index.js ***!
  \******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/menu.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
















const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/social-share", {
  apiVersion: 2,
  title: "Social Share",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M13.29,34.32H1.5a.19.19,0,0,0-.08,0A1.73,1.73,0,0,1,0,32.6V21.24a1.72,1.72,0,0,1,1.71-1.71H13.08a1.67,1.67,0,0,1,1.45.82,2.08,2.08,0,0,1,.26.68V32.82l0,.08a1.75,1.75,0,0,1-.84,1.19A2.52,2.52,0,0,1,13.29,34.32ZM9.77,33.16h3.16a.61.61,0,0,0,.7-.7V21.38a.61.61,0,0,0-.69-.7H1.85a.61.61,0,0,0-.69.69V32.48a.6.6,0,0,0,.68.68h6c.06,0,.11,0,.16,0V28.45H6.25V26.66H8v-.2c0-.47,0-.94,0-1.41a2.64,2.64,0,0,1,2.56-2.28H11.7s.08,0,.11,0v1.77H10.69a.87.87,0,0,0-.93.93v1.18h2.09l-.3,1.79H9.77Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M26.58,19.53h4.1a1.13,1.13,0,0,0,.32,0,8.67,8.67,0,0,1,1.83.18,3.68,3.68,0,0,1,2.63,2A5.38,5.38,0,0,1,36,24c0,2,0,3.91,0,5.86a5.55,5.55,0,0,1-.17,1.28,3.76,3.76,0,0,1-2.28,2.77,6.11,6.11,0,0,1-2.16.38c-1.67.06-3.34,0-5,0a9.37,9.37,0,0,1-1.83-.17,3.82,3.82,0,0,1-2.67-1.88,5.18,5.18,0,0,1-.58-2.08,5.34,5.34,0,0,0-.05-.69V24.26l0-.22a7.78,7.78,0,0,1,.17-1.36,3.78,3.78,0,0,1,2.45-2.8,6,6,0,0,1,2-.32A5.54,5.54,0,0,0,26.58,19.53Zm8.07,7.17V25a11,11,0,0,0-.13-1.9,2.39,2.39,0,0,0-1.78-2,7.41,7.41,0,0,0-2-.25H27.18a15.49,15.49,0,0,0-2.36.12,2.43,2.43,0,0,0-2.12,2,9.36,9.36,0,0,0-.19,2.18c0,1.31,0,2.62,0,3.94a7.45,7.45,0,0,0,.17,1.76,2.5,2.5,0,0,0,1.9,2,7,7,0,0,0,1.64.17c1.4,0,2.79,0,4.19,0a9.59,9.59,0,0,0,2.07-.16,2.43,2.43,0,0,0,2-1.83,6.14,6.14,0,0,0,.2-1.48C34.67,28.57,34.67,27.63,34.65,26.7Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M32.4,26.92a3.8,3.8,0,1,1-3.8-3.8A3.79,3.79,0,0,1,32.4,26.92Zm-3.79-2.46a2.46,2.46,0,1,0,2.45,2.47A2.45,2.45,0,0,0,28.61,24.46Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M32.55,23.86a.89.89,0,1,1,0-1.77.89.89,0,1,1,0,1.77Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M14.1,1.68h7.79a.21.21,0,0,0,.13,0,3.66,3.66,0,0,1,1.41.46,3.8,3.8,0,0,1,2,3.45c0,2.34,0,4.68,0,7a4.19,4.19,0,0,1-.12,1,3.85,3.85,0,0,1-3.68,2.93c-2.43,0-4.85,0-7.28,0a3.14,3.14,0,0,1-1.1-.19,3.79,3.79,0,0,1-2.59-2.81c-.05-.18-.08-.36-.12-.55V5.23c0-.13,0-.27.08-.4a3.84,3.84,0,0,1,2.91-3A5.54,5.54,0,0,0,14.1,1.68ZM24.48,9.14V5.71a3,3,0,0,0-.26-1.33,2.89,2.89,0,0,0-2.76-1.73c-2.31,0-4.62,0-6.92,0a2.81,2.81,0,0,0-1.28.27,2.87,2.87,0,0,0-1.74,2.76c0,2.3,0,4.61,0,6.92a3,3,0,0,0,3.05,3h6.55c.23,0,.46,0,.69,0A2.89,2.89,0,0,0,24,14.25a3,3,0,0,0,.47-1.69Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.4,7.24a2.3,2.3,0,0,1,3.76-1.58,4.35,4.35,0,0,0,1.07-.23.41.41,0,0,1,.47.07.48.48,0,0,1,.17.49,2.62,2.62,0,0,1-.5,1.16,2.29,2.29,0,0,0-.46,1.19,5.42,5.42,0,0,1-2.27,3.78,5.24,5.24,0,0,1-2.59,1,5.69,5.69,0,0,1-2.94-.43,6.31,6.31,0,0,1-.73-.38.48.48,0,0,1,.26-.91,3.55,3.55,0,0,0,1.48-.17.61.61,0,0,0,.22-.1,6.78,6.78,0,0,1-.81-.7,3.6,3.6,0,0,1-1-1.72,5.26,5.26,0,0,1,0-1.37A5.85,5.85,0,0,1,13.7,6a1.22,1.22,0,0,1,.09-.27.47.47,0,0,1,.76-.12c.17.16.32.34.49.5a4.75,4.75,0,0,0,2.3,1.13Zm4.18-.64a.9.9,0,0,0-.24,0,.71.71,0,0,1-.78-.18A1.15,1.15,0,0,0,20,6.15a1.3,1.3,0,0,0-1.63,1.52.48.48,0,0,1-.37.59.91.91,0,0,1-.33,0,5.52,5.52,0,0,1-3-1.14A.78.78,0,0,0,14.51,7c0,.31,0,.62-.06.93a2.23,2.23,0,0,0,.69,1.74,5.86,5.86,0,0,0,1.36,1.06.48.48,0,0,1,0,.84,4.18,4.18,0,0,1-.87.5s-.08,0-.07.06a4,4,0,0,0,.78.07,6.81,6.81,0,0,0,.78-.05,4.28,4.28,0,0,0,2.46-1.22A4.67,4.67,0,0,0,21,7.73a.94.94,0,0,1,.18-.54C21.32,7,21.44,6.81,21.58,6.6Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          class: 'icon',
          position: 'beforeLabel'
          /*beforeLabel, afterLabel, beforeCount, afterCount*/

        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    label: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    count: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    elements: {
      "type": "object",
      "default": {
        options: {
          linkTarget: '_blank',
          showLabel: false,
          showCount: false,
          showIcon: true,
          iconPositon: 'beforeLabel' // beforeLabel, afterLabel, beforeCount, afterCount

        },
        styles: {
          color: {
            Desktop: '#18978F'
          },
          backgroundColor: {},
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: '5px 5px 5px 5px'
          },
          display: {},
          borderRadius: {},
          fontSize: {
            Desktop: '35px'
          },
          lineHeight: {},
          letterSpacing: {},
          fontWeight: {},
          textDecoration: {},
          //overline, line-through, underline
          textTransform: {}
        },
        items: [{
          id: 'facebook',
          label: 'Facebook',
          count: 125,
          url: 'https://www.facebook.com/sharer.php?u={URL}',
          siteIcon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: 'fab fa-facebook-square'
          },
          styles: {
            color: {
              Desktop: ''
            },
            backgroundColor: {},
            padding: {
              Desktop: ''
            },
            margin: {
              Desktop: ''
            },
            display: {}
          }
        }, {
          id: 'twitter',
          label: 'Twitter',
          count: 125,
          url: 'https://twitter.com/intent/tweet?url={URL}',
          siteIcon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: 'fab fa-twitter-square'
          },
          styles: {
            color: {
              Desktop: ''
            },
            backgroundColor: {},
            padding: {
              Desktop: ''
            },
            margin: {
              Desktop: ''
            },
            display: {}
          }
        }, {
          id: 'linkedin',
          label: 'Linkedin',
          count: 125,
          url: 'https://www.linkedin.com/shareArticle?mini=true&url={URL}&title={TITLE}',
          siteIcon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: 'fab fa-linkedin'
          },
          styles: {
            color: {
              Desktop: ''
            },
            backgroundColor: {},
            padding: {
              Desktop: ''
            },
            margin: {
              Desktop: ''
            },
            display: {}
          }
        }]
      } // avatar, name, description, id

    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var elements = attributes.elements;
    var icon = attributes.icon;
    var label = attributes.label;
    var count = attributes.count;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType'];
    var wrapperSelector = blockClass; // Wrapper CSS Class Selectors

    var itemSelector = blockClass + ' .media-item';
    var iconSelector = blockClass + ' .media-item .icon';
    var labelSelector = blockClass + ' .media-item .media-label';
    var countSelector = blockClass + ' .media-item .media-count';
    var [breakPointX, setBreakPointX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(myStore.getBreakPoint());
    var [loading, setLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    var [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_7__.useEntityProp)('postType', postType, 'link', postId);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      blockCssY.items[itemSelector] = { ...blockCssY.items[itemSelector],
        'font-size': {
          "Desktop": "30px"
        }
      };
      blockCssY.items[itemSelector] = { ...blockCssY.items[itemSelector],
        'margin-top': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[itemSelector] = { ...blockCssY.items[itemSelector],
        'margin-right': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[itemSelector] = { ...blockCssY.items[itemSelector],
        'margin-bottom': {
          "Desktop": "10px"
        }
      };
      blockCssY.items[itemSelector] = { ...blockCssY.items[itemSelector],
        'margin-left': {
          "Desktop": "10px"
        }
      };
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      elements.items.map((x, index) => {
        var styles = x.styles;
        Object.entries(styles).map(y => {
          var attrId = y[0];
          var attrVal = y[1];

          if (Object.keys(attrVal).length != 0) {
            var attrIdX = '';

            if (attrId == 'backgroundColor') {
              attrIdX = 'background-color';
            } else if (attrId == 'textAlign') {
              attrIdX = 'text-align';
            } else {
              attrIdX = attrId;
            }

            if (blockCssY.items[itemSelector + '.item-' + index] == undefined) {
              blockCssY.items[itemSelector + '.item-' + index] = {};
              blockCssY.items[itemSelector + '.item-' + index][attrIdX] = attrVal;
            } else {
              blockCssY.items[itemSelector + '.item-' + index][attrIdX] = attrVal;
            }

            setAttributes({
              blockCssY: {
                items: blockCssY.items
              }
            });
          }
        });
      });
      setTimeout(x => {//setAttributes({ blockCssY: { items: newValuesObjX } });
      }, 2000);
    }, [elements]);

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    var mediaSites = [{
      id: 'email',
      label: 'Mail',
      count: 125,
      url: 'mailto:?subject={TITLE}&body={URL}',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fas fa-envelope'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'skype',
      label: 'Skype',
      count: 125,
      url: 'https://web.skype.com/share?url={URL}',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fab fa-skype'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'whatsapp',
      label: 'WhatsApp',
      count: 125,
      url: 'https://api.whatsapp.com/send?text={URL} - {TITLE}',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fab fa-whatsapp-square'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'tumblr',
      label: 'Tumblr',
      count: 125,
      url: 'https://www.tumblr.com/share/link?url={URL}',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fab fa-tumblr-square'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'viber',
      label: 'Viber',
      count: 125,
      url: 'viber://chat?number=12345678',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fab fa-viber'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, // {
    //   id: 'instagram', label: 'Instagram', count: 125, url: 'https://www.facebook.com/sharer.php?u={URL}', siteIcon: { library: 'fontAwesome', srcType: "class", /*class, html, img, svg */ iconSrc: 'fab fa-square-instagram', },
    //   styles: {
    //     
    //     color: { Desktop: '' },
    //     backgroundColor: {},
    //   padding: { Desktop: '' },
    //   margin: { Desktop: '' },
    //     display: {},
    //   },
    // },
    {
      id: 'reddit',
      label: 'Reddit',
      count: 125,
      url: 'http://www.reddit.com/submit?title={TITLE}&url={URL}',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fab fa-reddit-square'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'facebook',
      label: 'Facebook',
      count: 125,
      url: 'https://www.facebook.com/sharer.php?u={URL}',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fab fa-facebook-square'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'twitter',
      label: 'Twitter',
      count: 125,
      url: 'https://twitter.com/intent/tweet?url={URL}',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fab fa-twitter-square'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'linkedin',
      label: 'Linkedin',
      count: 125,
      url: 'https://www.linkedin.com/shareArticle?mini=true&url={URL}&title={TITLE}',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fab fa-linkedin'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }, {
      id: 'pinterest',
      label: 'Pinterest',
      count: 125,
      url: 'https://www.pinterest.com/pin/create/button/?url={URL}&media={IMAGE}',
      siteIcon: {
        library: 'fontAwesome',
        srcType: "class",

        /*class, html, img, svg */
        iconSrc: 'fab fa-pinterest-square'
      },
      styles: {
        color: {
          Desktop: ''
        },
        backgroundColor: {
          Desktop: ''
        },
        padding: {
          Desktop: ''
        },
        margin: {
          Desktop: ''
        }
      }
    }];

    function addMedia(option, index) {
      //var isExist = elements.items.find(x => x.label === option.label);
      //if (isExist == undefined) {
      //}
      var elementsX = elements.items.push(option);
      setAttributes({
        elements: { ...elements,
          items: elements.items
        }
      });
    }

    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleElements(sudoScource, newVal, attr) {
      var sudoScourceX = { ...elements[sudoScource]
      };
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      sudoScourceX[attr][breakPointX] = newVal;

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      Object.entries(sudoScourceX).map(args => {
        var argAttr = myStore.cssAttrParse(args[0]);
        var argAttrVal = args[1];
        blockCssY.items[elementSelector][argAttr] = argAttrVal;
      });
      setAttributes({
        blockCssY: {
          items: blockCssY.items
        }
      });
      setAttributes({
        elements: { ...elements
        }
      });
    }

    function onRemoveStyleElements(sudoScource, key) {
      var object = myStore.deletePropertyDeep(elements, [sudoScource, key, breakPointX]);
      setAttributes({
        elements: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleElements(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, elements);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        elements: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(label, [sudoScource, key, breakPointX]);
      setAttributes({
        label: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, labelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, label);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        label: object
      });
    }

    function onChangeStyleCount(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, count);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        count: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, countSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleCount(sudoScource, key) {
      var object = myStore.deletePropertyDeep(count, [sudoScource, key, breakPointX]);
      setAttributes({
        count: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, countSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleCount(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, count);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        count: object
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);

    function onChangeBreakPoint(x, index) {
      var asdsdsd = wp.data.dispatch('postgrid-shop').setBreakPoint(x.value);
      asdsdsd.then(res => {
        setBreakPointX(res.breakpoint);
        ;
        myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      });
    }

    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-social-share`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Items",
      initialOpen: true
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Add Media"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_14__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: mediaSites,
      buttonTitle: "Choose",
      onChange: addMedia,
      values: ""
    })), elements.items.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-red-400 text-white my-3  px-3 py-2 text-center"
    }, "No media added"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__.ReactSortable, {
      list: elements.items,
      handle: '.handle',
      setList: item => {
        setAttributes({
          elements: { ...elements,
            items: item
          }
        });
      }
    }, elements.items.map((item, index) => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      key: item.id,
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          var elementsX = elements.items.splice(index, 1);
          setAttributes({
            elements: { ...elements,
              items: elements.items
            }
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "handle cursor-pointer hover:bg-blue-500 hover:text-white px-1 py-1"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"]
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "mx-2"
      }, item.label)),
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Label"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: item.label,
      onChange: newVal => {
        elements.items[index].label = newVal;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "URL"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: item.url,
      onChange: newVal => {
        elements.items[index].url = newVal;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: item.count,
      onChange: newVal => {
        elements.items[index].count = newVal;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_19__["default"], {
      library: item.siteIcon.library,
      srcType: item.siteIcon.srcType,
      iconSrc: item.siteIcon.iconSrc,
      onChange: arg => {
        //var options = { ...icon.options, srcType: arg.srcType, library: arg.library, iconSrc: arg.iconSrc };
        //setAttributes({ icon: { ...icon, options: options } });
        elements.items[index].siteIcon = {
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][breakPointX].icon,
      value: breakPointX
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ColorPalette, {
      value: elements.items[index].styles.color[breakPointX],
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_13__["default"],
      enableAlpha: true,
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(elements.items[index].styles.color).length == 0) {
          newValuesObj[breakPointX] = newVal;
        } else {
          newValuesObj = elements.items[index].styles.color;
          newValuesObj[breakPointX] = newVal;
        }

        var styles = { ...elements.items[index].styles,
          color: newValuesObj
        };
        elements.items[index].styles = styles;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Background Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][breakPointX].icon,
      value: breakPointX
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ColorPalette, {
      value: elements.items[index].styles.backgroundColor != undefined ? elements.items[index].styles.backgroundColor[breakPointX] : '',
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_13__["default"],
      enableAlpha: true,
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(elements.items[index].styles.backgroundColor).length == 0) {
          newValuesObj[breakPointX] = newVal;
        } else {
          newValuesObj = elements.items[index].styles.backgroundColor;
          newValuesObj[breakPointX] = newVal;
        }

        var styles = { ...elements.items[index].styles,
          backgroundColor: newValuesObj
        };
        elements.items[index].styles = styles;
        setAttributes({
          elements: { ...elements,
            items: elements.items
          }
        }); // var newValuesObjX = {};
        // if (blockCssY.items[itemSelector] == undefined) {
        //   newValuesObjX[itemSelector] = { ...blockCssY.items[itemSelector], 'background-color': newValuesObj };
        // } else {
        //   newValuesObjX[itemSelector] = { ...blockCssY.items[itemSelector], 'background-color': newValuesObj };
        // }
        //setAttributes({ blockCssY: { items: newValuesObjX } });
      }
    })))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: elements,
      onChange: onChangeStyleElements,
      onAdd: onAddStyleElements,
      onRemove: onRemoveStyleElements
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Label',
        value: 'beforeLabel'
      }, {
        label: 'After Label',
        value: 'afterLabel'
      } // { label: 'Before Count', value: 'beforeCount' },
      // { label: 'After Count', value: 'afterCount' },
      ],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      className: "my-3",
      label: "Display icon?",
      help: elements.options.showIcon ? 'Icon is displaying' : 'Icon is hidden',
      checked: elements.options.showIcon ? true : false,
      onChange: e => {
        var options = { ...elements.options,
          showIcon: elements.options.showIcon ? false : true
        };
        setAttributes({
          elements: { ...elements,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      className: "my-3",
      label: "Display label?",
      help: elements.options.showLabel ? 'Label is displaying' : 'Label is hidden',
      checked: elements.options.showLabel ? true : false,
      onChange: e => {
        var options = { ...elements.options,
          showLabel: elements.options.showLabel ? false : true
        };
        setAttributes({
          elements: { ...elements,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: label,
      onChange: onChangeStyleLabel,
      onAdd: onAddStyleLabel,
      onRemove: onRemoveStyleLabel
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Count",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      className: "my-3",
      label: "Display count?",
      help: elements.options.showCount ? 'Count is displaying' : 'Count is hidden',
      checked: elements.options.showCount ? true : false,
      onChange: e => {
        var options = { ...elements.options,
          showCount: elements.options.showCount ? false : true
        };
        setAttributes({
          elements: { ...elements,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: count,
      onChange: onChangeStyleCount,
      onAdd: onAddStyleCount,
      onRemove: onRemoveStyleCount
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Item Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, itemSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_16__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_17__["default"], {
      utm: {
        utm_source: 'BlockPostExcerpt',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, elements.items.map((x, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        onClick: handleLinkClick,
        className: 'media-item item-' + index,
        href: x.url
      }, elements.options.showLabel && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "media-label"
      }, x.label), elements.options.showIcon && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: `icon ${x.siteIcon.iconSrc}`
      }), elements.options.showCount && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "media-count"
      }, "(", x.count, ")"));
    })));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/star-rate/index.js":
/*!***************************************!*\
  !*** ./src/blocks/star-rate/index.js ***!
  \***************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link-off.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/star-rate", {
  apiVersion: 2,
  title: "Star Rate",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M4.39,13.53h.17A.63.63,0,0,1,5,14l.21.44.71,1.49a.49.49,0,0,0,.39.3l.45.07,1.67.25a.55.55,0,0,1,.47.37.54.54,0,0,1-.12.59l-.17.18c-.46.47-.93.94-1.39,1.42a.57.57,0,0,0-.17.48c.12.75.25,1.5.37,2.25a.55.55,0,0,1-.22.57.49.49,0,0,1-.58,0l-1.83-1a.61.61,0,0,0-.65,0c-.61.35-1.22.68-1.83,1a.51.51,0,0,1-.58,0,.55.55,0,0,1-.23-.54c.11-.73.23-1.45.36-2.17a.63.63,0,0,0-.15-.6c-.46-.48-.93-.95-1.4-1.43A1,1,0,0,1,0,17.18V17s0,0,0,0a.53.53,0,0,1,.45-.42l.19,0,1.81-.27a.7.7,0,0,0,.61-.44c.27-.6.57-1.2.85-1.81A.7.7,0,0,1,4.39,13.53Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.91,13.53h.18a.65.65,0,0,1,.45.43c.06.15.14.29.21.44.23.5.46,1,.7,1.49a.52.52,0,0,0,.39.3l.46.07,1.67.25a.57.57,0,0,1,.35,1l-.17.18-1.4,1.42a.53.53,0,0,0-.16.48c.12.75.24,1.5.37,2.25a.55.55,0,0,1-.22.57.51.51,0,0,1-.59,0l-1.83-1a.59.59,0,0,0-.64,0c-.61.35-1.23.68-1.84,1a.5.5,0,0,1-.57,0,.51.51,0,0,1-.23-.54c.11-.73.23-1.45.35-2.17a.63.63,0,0,0-.14-.6l-1.4-1.43a1,1,0,0,1-.33-.46V17l0,0a.56.56,0,0,1,.45-.42l.19,0c.61-.09,1.21-.19,1.82-.27a.68.68,0,0,0,.6-.44c.28-.6.57-1.2.85-1.81A.7.7,0,0,1,17.91,13.53Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#8db1ff",
      d: "M31.44,13.53h.17a.63.63,0,0,1,.45.43l.21.44L33,15.89a.49.49,0,0,0,.39.3l.45.07,1.67.25a.55.55,0,0,1,.47.37.54.54,0,0,1-.12.59l-.17.18c-.46.47-.93.94-1.39,1.42a.57.57,0,0,0-.17.48c.12.75.25,1.5.37,2.25a.55.55,0,0,1-.22.57.51.51,0,0,1-.59,0c-.6-.33-1.22-.66-1.82-1a.61.61,0,0,0-.65,0c-.61.35-1.22.68-1.83,1a.51.51,0,0,1-.58,0,.55.55,0,0,1-.23-.54c.11-.73.23-1.45.36-2.17a.63.63,0,0,0-.15-.6c-.46-.48-.93-.95-1.4-1.43a1,1,0,0,1-.32-.46V17s0,0,0,0a.53.53,0,0,1,.45-.42l.19,0,1.81-.27a.7.7,0,0,0,.61-.44c.27-.6.57-1.2.85-1.81A.68.68,0,0,1,31.44,13.53Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: '',
          attr: []
        },
        styles: {
          color: {
            Desktop: ''
          },
          borderRadius: {}
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-check-circle',
          class: 'text-icon',
          text: 'Custom Text',
          isLink: true,
          linkTo: 'postUrl',

          /*postUrl, homeUrl, authorUrl, authorLink, mailTo, custom, customField */
          linkToAuthorMeta: '',
          linkToCustomMeta: '',
          linkTarget: '_blank',
          customUrl: '',
          linkAttr: []
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    prefix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'prefix'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    postfix: {
      type: 'object',
      default: {
        options: {
          text: '',
          class: 'postfix'
        },
        styles: {
          color: {
            Desktop: ''
          }
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    linkAttr: {
      "type": "array",
      "default": []
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var icon = attributes.icon;
    var prefix = attributes.prefix;
    var postfix = attributes.postfix;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [currentPostContent, setCurrentpostContent] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'content', postId);
    const [customFields, setCustomFields] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
    const [currentPostUrl, setCurrentPostUrl] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__.useEntityProp)('postType', postType, 'link', postId);
    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(''); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    const textSelector = blockClass + ' .text';
    const iconSelector = blockClass + ' .text-icon';
    const prefixSelector = blockClass + ' .prefix';
    const postfixSelector = blockClass + ' .postfix';

    function getMetaField(metaKey) {
      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7___default()({
        path: '/post-grid/v2/get_post_meta',
        method: 'POST',
        data: {
          postId: postId,
          meta_key: metaKey
        }
      }).then(res => {
        if (res['meta_value'] != undefined && res['meta_value'].length > 0) {
          customFields[metaKey] = res['meta_value'];
          setCustomFields({});
          setCustomFields(customFields);
        }
      });
    }

    var linkToArgs = {
      postUrl: {
        label: 'Post URL',
        value: 'postUrl'
      },
      homeUrl: {
        label: 'Home URL',
        value: 'homeUrl'
      },
      authorUrl: {
        label: 'Author URL',
        value: 'authorUrl'
      },
      authorLink: {
        label: 'Author Link',
        value: 'authorLink'
      },
      authorMail: {
        label: 'Author Mail',
        value: 'authorMail',
        isPro: true
      },
      authorMeta: {
        label: 'Author Meta',
        value: 'authorMeta',
        isPro: true
      },
      customField: {
        label: 'Custom Field',
        value: 'customField',
        isPro: true
      },
      customUrl: {
        label: 'Custom URL',
        value: 'customUrl',
        isPro: true
      }
    };
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    const [linkPickerExcerpt, setLinkPickerExcerpt] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const [linkPickerText, setLinkPickerText] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      ;
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function setFieldLinkTo(option, index) {
      var options = { ...icon.options,
        linkTo: option.value
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onPickCssLibraryWrapper(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        wrapper[sudoScource] = sudoScourceArgs;
      });
      var wrapperX = Object.assign({}, wrapper);
      setAttributes({
        wrapper: wrapperX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPrefix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        prefix[sudoScource] = sudoScourceArgs;
      });
      var prefixX = Object.assign({}, prefix);
      setAttributes({
        prefix: prefixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPostfix(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        postfix[sudoScource] = sudoScourceArgs;
      });
      var postfixX = Object.assign({}, postfix);
      setAttributes({
        postfix: postfixX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStylePrefix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePrefix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(prefix, [sudoScource, key, breakPointX]);
      setAttributes({
        prefix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, prefixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePrefix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, prefix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        prefix: object
      });
    }

    function onChangeStylePostfix(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePostfix(sudoScource, key) {
      var object = myStore.deletePropertyDeep(postfix, [sudoScource, key, breakPointX]);
      setAttributes({
        postfix: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, postfixSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePostfix(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, postfix);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        postfix: object
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddIcon(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, icon);
      obj[sudoScource] = cssObj;
      setAttributes({
        icon: obj
      });
      var selector = myStore.getElementSelector(sudoScource, iconSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPrefix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, prefix);
      obj[sudoScource] = cssObj;
      setAttributes({
        prefix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, prefixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onBulkAddPostfix(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, postfix);
      obj[sudoScource] = cssObj;
      setAttributes({
        postfix: obj
      });
      var selector = myStore.getElementSelector(sudoScource, postfixSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    var [linkAttrItemsText, setlinkAttrItemsText] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    var [wrapAttrItems, setwrapAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var sdsd = {};
      icon.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItemsText(sdsd);
    }, [icon]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var sdsd = {};

      if (wrapper.options.attr != undefined) {
        wrapper.options.attr.map(x => {
          if (x.val) sdsd[x.id] = x.val;
        });
      }

      setwrapAttrItems(sdsd);
    }, [wrapper]);
    var postUrl = icon.options.customUrl != undefined && icon.options.customUrl.length > 0 ? icon.options.customUrl : currentPostUrl;
    const CustomTag = `${wrapper.options.tag}`;
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-star-rate`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }, {
        label: 'BUTTON',
        value: 'button'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        if (wrapper.options.attr == undefined) {
          wrapper.options.attr = {};
        }

        var sdsd = wrapper.options.attr.concat({
          id: '',
          val: ''
        });
        var options = { ...wrapper.options,
          attr: sdsd
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }, "Add")), wrapper.options.attr != undefined && wrapper.options.attr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: wrapper.options.attr[i].id,
        onChange: newVal => {
          wrapper.options.attr[i].id = newVal;
          var ssdsd = wrapper.options.attr.concat([]);
          var options = { ...wrapper.options,
            attr: ssdsd
          };
          setAttributes({
            wrapper: { ...wrapper,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          wrapper.options.attr[i].val = newVal;
          var ssdsd = wrapper.options.attr.concat([]);
          var options = { ...wrapper.options,
            attr: ssdsd
          };
          setAttributes({
            wrapper: { ...wrapper,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          wrapper.options.attr.splice(i, 1);
          var ssdsd = wrapper.options.attr.concat([]);
          var options = { ...wrapper.options,
            attr: ssdsd
          };
          setAttributes({
            wrapper: { ...wrapper,
              options: options
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onPickCssLibraryWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_13__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
      label: "Linked to URL?",
      help: icon.options.isLink ? 'Linked to URL?' : 'Not Linked.',
      checked: icon.options.isLink ? true : false,
      onChange: e => {
        var options = { ...icon.options,
          isLink: icon.options.isLink ? false : true
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }), icon.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_19__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: linkToArgs,
      buttonTitle: "Choose",
      onChange: setFieldLinkTo,
      values: []
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "bg-gray-500 p-2 my-3 text-white"
    }, linkToArgs[icon.options.linkTo] != undefined ? linkToArgs[icon.options.linkTo].label : ''), icon.options.linkTo == 'authorMeta' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Author Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: icon.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...icon.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    })), icon.options.linkTo == 'customField' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Meta Key"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: icon.options.linkToAuthorMeta,
      onChange: newVal => {
        var options = { ...icon.options,
          linkToAuthorMeta: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: icon.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          linkTarget: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), icon.options.linkTo == 'customUrl' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Url"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: linkPickerText ? "!bg-gray-400" : '',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
      onClick: ev => {
        setLinkPickerText(prev => !prev);
      }
    }), icon.options.customUrl.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Button, {
      className: "!text-red-500 ml-2",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
      onClick: ev => {
        var options = { ...icon.options,
          customUrl: ''
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }), linkPickerText && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.__experimentalLinkControl, {
      settings: [],
      value: icon.options.customUrl,
      onChange: newVal => {
        var options = { ...icon.options,
          customUrl: newVal.url
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        }); //setLinkPickerText(false)
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "font-bold"
    }, "Linked to:"), " ", icon.options.customUrl.length != 0 ? icon.options.customUrl : 'No link', " ")))), icon.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = icon.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...icon.options,
          linkAttr: sdsd
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }, "Add")), icon.options.linkAttr != undefined && icon.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        placeholder: "Name",
        className: "mr-2",
        value: icon.options.linkAttr[i].id,
        onChange: newVal => {
          icon.options.linkAttr[i].id = newVal;
          var ssdsd = icon.options.linkAttr.concat([]);
          var options = { ...icon.options,
            linkAttr: ssdsd
          };
          setAttributes({
            icon: { ...icon,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          icon.options.linkAttr[i].val = newVal;
          var ssdsd = icon.options.linkAttr.concat([]);
          var options = { ...icon.options,
            linkAttr: ssdsd
          };
          setAttributes({
            icon: { ...icon,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          icon.options.linkAttr.splice(i, 1);
          var ssdsd = icon.options.linkAttr.concat([]);
          var options = { ...icon.options,
            linkAttr: ssdsd
          };
          setAttributes({
            icon: { ...icon,
              options: options
            }
          });
        }
      })));
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon,
      onBulkAdd: onBulkAddIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Prefix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: prefix.options.text,
      onChange: newVal => {
        var options = { ...prefix.options,
          text: newVal
        };
        setAttributes({
          prefix: { ...prefix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: prefix,
      onChange: onChangeStylePrefix,
      onAdd: onAddStylePrefix,
      onRemove: onRemoveStylePrefix,
      onBulkAdd: onBulkAddPrefix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: prefix,
      onChange: onPickCssLibraryPrefix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Postfix",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
      value: postfix.options.text,
      onChange: newVal => {
        var options = { ...postfix.options,
          text: newVal
        };
        setAttributes({
          postfix: { ...postfix,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: postfix,
      onChange: onChangeStylePostfix,
      onAdd: onAddStylePostfix,
      onRemove: onRemoveStylePostfix,
      onBulkAdd: onBulkAddPostfix
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_23__["default"], {
      blockId: blockId,
      obj: postfix,
      onChange: onPickCssLibraryPostfix
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Prefix Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, prefixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Postfix Selector"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postfixSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_14__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_15__["default"], {
      utm: {
        utm_source: 'BlockReadMore',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, wrapper.options.tag && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(CustomTag, (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, wrapAttrItems), prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "text",
      onClick: handleLinkClick
    }, linkAttrItemsText, {
      target: icon.options.linkTarget,
      href: postUrl
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }))), !icon.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text)), wrapper.options.tag.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, prefix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: prefix.options.class
    }, prefix.options.text), icon.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
      className: "text",
      onClick: handleLinkClick
    }, linkAttrItemsText, {
      target: text.options.linkTarget,
      href: postUrl
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), !icon.options.isLink && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })), postfix.options.text && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: postfix.options.class
    }, postfix.options.text))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/tabs-nested-item/index.js":
/*!**********************************************!*\
  !*** ./src/blocks/tabs-nested-item/index.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");














const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/tabs-nested-item", {
  apiVersion: 2,
  title: "Tabs Nested Item",
  parent: ['post-grid/tabs-nested'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "10.75",
      width: "10.72",
      height: "3.64"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#8db1ff",
      d: "M1.94,12.09a.12.12,0,0,1,.08,0l.64.75a.11.11,0,1,1-.17.13l-.55-.65L1.38,13a.11.11,0,0,1-.15,0,.1.1,0,0,1,0-.15l.64-.75A.12.12,0,0,1,1.94,12.09Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "3.46",
      y: "12.09",
      width: "5.71",
      height: "0.96"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "12.64",
      y: "10.75",
      width: "10.72",
      height: "3.64"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M14.58,13.05a.09.09,0,0,1-.08,0l-.64-.74a.11.11,0,1,1,.16-.14l.56.65.56-.65a.11.11,0,1,1,.16.14l-.64.74A.09.09,0,0,1,14.58,13.05Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.11",
      y: "12.09",
      width: "5.71",
      height: "0.96"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "25.28",
      y: "10.75",
      width: "10.72",
      height: "3.64"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M27.22,13.05a.09.09,0,0,1-.08,0l-.64-.74a.11.11,0,0,1,.16-.14l.56.65.56-.65a.11.11,0,1,1,.16.14L27.3,13A.09.09,0,0,1,27.22,13.05Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "28.75",
      y: "12.09",
      width: "5.71",
      height: "0.96"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "16.58",
      width: "36",
      height: "8.66"
    }))
  },
  attributes: {
    navItem: {
      type: 'object',
      default: {
        options: {
          viewType: 'horizontal',
          //horizontal, vertical
          class: '',
          activeTab: ''
        },
        styles: {}
      }
    },
    activeNavItem: {
      type: 'object',
      default: {
        options: {
          viewType: 'horizontal',
          //horizontal, vertical
          class: ''
        },
        styles: {}
      }
    },
    navLabel: {
      type: 'object',
      default: {
        options: {
          viewType: 'horizontal',
          //horizontal, vertical
          class: ''
        },
        styles: {}
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-angle-down',
          position: 'before',

          /* before, after */
          class: 'icon'
        },
        styles: {}
      }
    },
    iconToggle: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-angle-down',
          position: 'before',

          /* before, after */
          class: 'icon-toggle'
        },
        styles: {}
      }
    },
    panelWrap: {
      type: 'object',
      default: {
        options: {
          viewType: 'horizontal',
          //horizontal, vertical
          position: 'left',
          // left, right, center
          class: ''
        },
        styles: {}
      }
    },
    activeTab: {
      "type": "string"
    },
    uid: {
      "type": "string"
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var uid = attributes.uid;
    var activeTab = attributes.activeTab;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var navItem = attributes.navItem;
    var panelWrap = attributes.panelWrap;
    var icon = attributes.icon;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_7__.applyFilters)('isProFeature', true);
    var breakPointX = myStore.getBreakPoint(); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var panelWrapSelector = '.' + blockId + '-pg-tabs-panel';
    var navItemSelector = '.' + blockId + '-nav-item';
    var iconSelector = '.' + blockId + '-nav-icon';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onChangeStyleNavItem(sudoScource, newVal, attr) {
      console.log(navItemSelector);
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, navItem);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        navItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navItemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      console.log(cssItems);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleNavItem(sudoScource, key) {
      var object = myStore.deletePropertyDeep(navItem, [sudoScource, key, breakPointX]);
      setAttributes({
        navItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navItemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleNavItem(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, navItem);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        navItem: object
      });
    }

    function onChangeStylePanelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, panelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        panelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, panelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylePanelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(panelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        panelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, panelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylePanelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, panelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        panelWrap: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onPickCssLibraryNavItem(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        navItem[sudoScource] = sudoScourceArgs;
      });
      var navItemX = Object.assign({}, navItem);
      setAttributes({
        navItem: navItemX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, navItemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryPanelWrap(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        panelWrap[sudoScource] = sudoScourceArgs;
      });
      var panelWrapX = Object.assign({}, panelWrap);
      setAttributes({
        panelWrap: panelWrapX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, panelWrapSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`; //console.log(iconHtml);

      setIconHtml(iconHtml);
    }, [icon]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)();
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      if (!uid) {
        setAttributes({
          uid: clientId
        });
      }
    }, []);
    const display = activeTab === uid ? 'block' : 'none';
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Nav Item",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: navItem.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...navItem.options,
          tag: newVal
        };
        setAttributes({
          navItem: { ...navItem,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: navItem,
      onChange: onChangeStyleNavItem,
      onAdd: onAddStyleNavItem,
      onRemove: onRemoveStyleNavItem
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: navItem,
      onChange: onPickCssLibraryNavItem
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Content Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: panelWrap.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...panelWrap.options,
          tag: newVal
        };
        setAttributes({
          panelWrap: { ...panelWrap,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: panelWrap,
      onChange: onChangeStylePanelWrap,
      onAdd: onAddStylePanelWrap,
      onRemove: onRemoveStylePanelWrap
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: panelWrap,
      onChange: onPickCssLibraryPanelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_17__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: arg => {
        var options = { ...icon.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Left',
        value: 'left'
      }, {
        label: 'Right',
        value: 'right'
      }, {
        label: 'Before',
        value: 'before'
      }, {
        label: 'After',
        value: 'after'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_19__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: `pg-tabs-panel ${blockId}-pg-tabs-panel ${activeTab === uid ? 'pg-tabs-panel-active' : ''}`,
      'data-tab-id': uid,
      style: {
        display
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InnerBlocks, {
      renderAppender: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InnerBlocks.ButtonBlockAppender, null)
    })));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes; //const blockProps = useBlockProps.save({});
    //const { children, ...innerBlocksProps } = useInnerBlocksProps.save(blockProps);

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InnerBlocks.Content, null); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/tabs-nested/index.js":
/*!*****************************************!*\
  !*** ./src/blocks/tabs-nested/index.js ***!
  \*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/plus.js");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _variations__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./variations */ "./src/blocks/tabs-nested/variations.js");


















const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/tabs-nested", {
  apiVersion: 2,
  title: "Tabs",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "10.75",
      width: "10.72",
      height: "3.64"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#8db1ff",
      d: "M1.94,12.09a.12.12,0,0,1,.08,0l.64.75a.11.11,0,1,1-.17.13l-.55-.65L1.38,13a.11.11,0,0,1-.15,0,.1.1,0,0,1,0-.15l.64-.75A.12.12,0,0,1,1.94,12.09Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "3.46",
      y: "12.09",
      width: "5.71",
      height: "0.96"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "12.64",
      y: "10.75",
      width: "10.72",
      height: "3.64"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M14.58,13.05a.09.09,0,0,1-.08,0l-.64-.74a.11.11,0,1,1,.16-.14l.56.65.56-.65a.11.11,0,1,1,.16.14l-.64.74A.09.09,0,0,1,14.58,13.05Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "16.11",
      y: "12.09",
      width: "5.71",
      height: "0.96"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#8db1ff",
      x: "25.28",
      y: "10.75",
      width: "10.72",
      height: "3.64"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M27.22,13.05a.09.09,0,0,1-.08,0l-.64-.74a.11.11,0,0,1,.16-.14l.56.65.56-.65a.11.11,0,1,1,.16.14L27.3,13A.09.09,0,0,1,27.22,13.05Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "28.75",
      y: "12.09",
      width: "5.71",
      height: "0.96"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
      fill: "#1d4ed8",
      y: "16.58",
      width: "36",
      height: "8.66"
    }))
  },
  attributes: {
    items: {
      type: 'array',
      default: [{
        isActive: false,
        headerText: 'What is Lorem Ipsum?',
        content: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.',
        icon: '',
        iconToggle: '',
        styles: {}
      }]
    },
    navsWrap: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          display: {
            Desktop: ''
          }
        }
      }
    },
    navItem: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          },
          color: {
            Desktop: ''
          },
          display: {
            Desktop: ''
          }
        }
      }
    },
    activeNavItem: {
      type: 'object',
      default: {
        options: {
          class: '',
          id: ''
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          },
          color: {
            Desktop: ''
          },
          display: {
            Desktop: ''
          }
        }
      }
    },
    navLabel: {
      type: 'object',
      default: {
        options: {
          class: ''
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          },
          color: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-angle-down',
          position: 'before',

          /* before, after */
          class: 'icon'
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          },
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    iconToggle: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-angle-down',
          position: 'before',

          /* before, after */
          class: 'icon-toggle'
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          },
          color: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    panelWrap: {
      type: 'object',
      default: {
        options: {
          position: 'left',
          // left, right, center
          class: ''
        },
        styles: {
          backgroundColor: {
            Desktop: ''
          },
          color: {
            Desktop: ''
          }
        }
      }
    },
    tabs: {
      "type": "array",
      "default": []
    },
    activeTab: {
      "type": "string"
    },
    wrapper: {
      type: 'object',
      default: {
        options: {
          content: '',
          tag: 'div',
          class: ''
        },
        styles: {
          color: {
            Desktop: ''
          },
          display: {},
          position: {},
          overflow: {}
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: [],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var tabs = attributes.tabs;
    var activeTab = attributes.activeTab;
    var icon = attributes.icon;
    var navsWrap = attributes.navsWrap;
    var navItem = attributes.navItem;
    var activeNavItem = attributes.activeNavItem;
    var navLabel = attributes.navLabel;
    var panelWrap = attributes.panelWrap;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var childBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlocksByClientId(clientId)[0].innerBlocks;
    let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_8__.applyFilters)('isProFeature', true); //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [iconPickerIndex, setIconPickerIndex] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(99);
    const [iconPickerEnable, setIconPickerEnable] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var navsWrapSelector = blockClass + ' .navs-wrapper';
    var navItemSelector = blockClass + ' .nav-item';
    var activeNavItemSelector = blockClass + ' .nav-item-active';
    var navLabelSelector = blockClass + ' .nav-label';
    var panelWrapSelector = blockClass + ' .panels-wrap';
    var navIconSelector = blockClass + ' .nav-icon';
    var iconToggleSelector = blockClass + ' .nav-icon-toggle';
    const {
      replaceInnerBlocks
    } = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useDispatch)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store);
    const hasInnerBlocks = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.useSelect)(select => select(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.store).getBlocks(clientId).length > 0, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss); //console.log(blockCssY.items);
    }, [blockCssY]);

    function bulkCssGenerate(cssObj) {
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var selector = args[0];
        Object.entries(args[1]).map(x => {
          var attr = x[0];
          var cssPropty = myStore.cssAttrParse(attr);

          if (stylesObj[selector] == undefined) {
            stylesObj[selector] = {};
          }

          if (stylesObj[selector][cssPropty] == undefined) {
            stylesObj[selector][cssPropty] = {};
          }

          stylesObj[selector][cssPropty] = x[1];
        });
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      }; //console.log(cssItemsX);

      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleNavLabel(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, navLabel);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        navLabel: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navLabelSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleNavLabel(sudoScource, key) {
      var object = myStore.deletePropertyDeep(navLabel, [sudoScource, key, breakPointX]);
      setAttributes({
        navLabel: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navLabelSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleNavLabel(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, navLabel);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        navLabel: object
      });
    }

    function onPickCssLibraryNavLabel(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        navLabel[sudoScource] = sudoScourceArgs;
      });
      var navLabelX = Object.assign({}, navLabel);
      setAttributes({
        navLabel: navLabelX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, navLabelSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStylepanelWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, panelWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        panelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, panelWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStylepanelWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(panelWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        panelWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, panelWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStylepanelWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, panelWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        panelWrap: object
      });
    }

    function onPickCssLibrarypanelWrap(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        panelWrap[sudoScource] = sudoScourceArgs;
      });
      var panelWrapX = Object.assign({}, panelWrap);
      setAttributes({
        panelWrap: panelWrapX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, panelWrapSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navIconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navIconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, navIconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleNavsWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, navsWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        navsWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navsWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleNavsWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(navsWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        navsWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navsWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleNavsWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, navsWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        navsWrap: object
      });
    }

    function onPickCssLibraryNavsWrap(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        navsWrap[sudoScource] = sudoScourceArgs;
      });
      var navsWrapX = Object.assign({}, navsWrap);
      setAttributes({
        navsWrap: navsWrapX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, navsWrapSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleNavItem(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, navItem);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        navItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navItemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleNavItem(sudoScource, key) {
      var object = myStore.deletePropertyDeep(navItem, [sudoScource, key, breakPointX]);
      setAttributes({
        navItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, navItemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleNavItem(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, navItem);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        navItem: object
      });
    }

    function onPickCssLibraryNavItem(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        navItem[sudoScource] = sudoScourceArgs;
      });
      var navItemX = Object.assign({}, navItem);
      setAttributes({
        navItem: navItemX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, navItemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleActiveNavItem(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, activeNavItem);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        activeNavItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, activeNavItemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleActiveNavItem(sudoScource, key) {
      var object = myStore.deletePropertyDeep(activeNavItem, [sudoScource, key, breakPointX]);
      setAttributes({
        activeNavItem: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, activeNavItemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleActiveNavItem(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, activeNavItem);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        activeNavItem: object
      });
    }

    function onPickCssLibraryActiveNavItem(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        activeNavItem[sudoScource] = sudoScourceArgs;
      });
      var activeNavItemX = Object.assign({}, activeNavItem);
      setAttributes({
        activeNavItem: activeNavItemX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, activeNavItemSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    const ALLOWED_BLOCKS = ['post-grid/tabs-nested-item'];
    const MY_TEMPLATE = [['post-grid/tabs-nested-item', {}], ['post-grid/tabs-nested-item', {}]];
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: `${(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)().className} ${blockId} `
    });
    const innerBlocksProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useInnerBlocksProps)(blockProps, {
      allowedBlocks: ALLOWED_BLOCKS,
      __experimentalDirectInsert: true,
      //template: MY_TEMPLATE,
      templateInsertUpdatesSelection: true
    });

    const setActiveTab = uid => {
      setAttributes({
        activeTab: uid
      });
      const parentBlock = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.select)('core/block-editor').getBlock(clientId);
      parentBlock.innerBlocks.forEach(innerBlock => {
        (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').updateBlockAttributes(innerBlock.clientId, {
          activeTab: uid
        });
      });
    };

    const addNewTab = () => {
      const tab = (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlock)('post-grid/tabs-nested-item');
      const position = tabs.length;
      (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_3__.dispatch)('core/block-editor').insertBlock(tab, position, clientId);
      setAttributes({
        tabs: [...tabs, {
          uid: tab.clientId,
          title: `Tab ${tabs.length + 1}`,
          icon: {
            library: 'fontAwesome',
            srcType: "class",

            /*class, html, img, svg */
            iconSrc: ''
          }
        }]
      }); //setActiveTab(tab.clientId);
    };

    const tabTitleChange = newValue => {
      setAttributes({
        tabs: [...tabs.map(t => {
          return t.uid === activeTab ? { ...t,
            title: newValue
          } : t;
        })]
      });
    };

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      if (tabs.length && !activeTab) {//setActiveTab(tabs[0].uid);
      }
    }, [tabs]);
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Navs Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: navsWrap,
      onChange: onChangeStyleNavsWrap,
      onAdd: onAddStyleNavsWrap,
      onRemove: onRemoveStyleNavsWrap
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: navsWrap,
      onChange: onPickCssLibraryNavsWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Nav Item",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: navItem,
      onChange: onChangeStyleNavItem,
      onAdd: onAddStyleNavItem,
      onRemove: onRemoveStyleNavItem
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: navItem,
      onChange: onPickCssLibraryNavItem
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Active Nav Item",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: activeNavItem,
      onChange: onChangeStyleActiveNavItem,
      onAdd: onAddStyleActiveNavItem,
      onRemove: onRemoveStyleActiveNavItem
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: activeNavItem,
      onChange: onPickCssLibraryActiveNavItem
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Nav Label",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: navLabel,
      onChange: onChangeStyleNavLabel,
      onAdd: onAddStyleNavLabel,
      onRemove: onRemoveStyleNavLabel
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: navLabel,
      onChange: onPickCssLibraryNavLabel
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Content Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: panelWrap,
      onChange: onChangeStylepanelWrap,
      onAdd: onAddStylepanelWrap,
      onRemove: onRemoveStylepanelWrap
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: panelWrap,
      onChange: onPickCssLibrarypanelWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Nav Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_17__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: arg => {
        var options = { ...icon.options,
          srcType: arg.srcType,
          library: arg.library,
          iconSrc: arg.iconSrc
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before',
        value: 'before'
      }, {
        label: 'After',
        value: 'after'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), !hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "border p-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between mb-5"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "text-xl rounded-sm"
    }, "Click to pick a variation"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-orange-400 hover:bg-orange-300 px-4 py-1 text-white cursor-pointer",
      onClick: ev => {
        replaceInnerBlocks(clientId, (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)([['post-grid/accordion-nested-item', {}]]), true);
      }
    }, "Skip")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ""
    }, _variations__WEBPACK_IMPORTED_MODULE_22__["default"].map(variation => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "text-center inline-block m-4 w-32 align-top p-4 bg-gray-400 cursor-pointer hover:bg-gray-500 relative",
        onClick: ev => {
          if (variation.isPro) {
            alert('Sorry this variation only vailable in pro version');
            return false;
          }

          var atts = variation.atts;
          var wrapper = { ...atts.wrapper
          };
          var navsWrap = { ...atts.navsWrap
          };
          var navItem = { ...atts.navItem
          };
          var activeNavItem = { ...atts.activeNavItem
          };
          var panelWrap = { ...atts.panelWrap
          };
          var navLabel = { ...atts.navLabel
          };
          var labelCounter = { ...atts.labelCounter
          };
          var icon = { ...atts.icon
          };
          var iconToggle = { ...atts.iconToggle
          };
          var blockCssY = { ...atts.blockCssY
          };
          var customCss = { ...atts.customCss
          };
          var blockCssObj = {};
          blockCssObj[wrapperSelector] = wrapper;
          blockCssObj[activeNavItemSelector] = activeNavItem;
          blockCssObj[panelWrapSelector] = panelWrap;
          blockCssObj[navLabelSelector] = navLabel;
          blockCssObj[navsWrapSelector] = navsWrap;
          blockCssObj[navItemSelector] = navItem;
          blockCssObj[navIconSelector] = icon;
          blockCssObj[iconToggleSelector] = iconToggle;
          setAttributes({
            wrapper: wrapper,
            navsWrap: navsWrap,
            navItem: navItem,
            activeNavItem: activeNavItem,
            panelWrap: panelWrap,
            navLabel: navLabel,
            icon: icon,
            iconToggle: iconToggle,
            customCss: customCss
          });
          var blockCssRules = myStore.getBlockCssRules(blockCssObj);
          var items = { ...blockCssY.items,
            ...blockCssRules
          };
          setAttributes({
            blockCssY: {
              items: items
            }
          });
          var innerBlocksTemplate = (0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.createBlocksFromInnerBlocksTemplate)(variation.innerBlocks);
          console.log(innerBlocksTemplate[0].clientId);
          replaceInnerBlocks(clientId, innerBlocksTemplate, true); // console.log(variation.innerBlocks);

          setAttributes({
            tabs: [...tabs, {
              uid: innerBlocksTemplate[0].clientId,
              title: `Tab ${tabs.length + 1}`,
              icon: {
                library: 'fontAwesome',
                srcType: "class",

                /*class, html, img, svg */
                iconSrc: ''
              }
            }]
          });
          setActiveTab(innerBlocksTemplate[0].clientId); //addNewTab();
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.icon), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, variation.title), variation.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-amber-400 rounded-sm text-sm inline-block  bg-opacity-90 text-white hover:text-white absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        className: "block px-3",
        href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
      }, "Pro")));
    })))), hasInnerBlocks && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", innerBlocksProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: ' navs-wrapper  '
    }, tabs.map((tab, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        key: tab.uid,
        className: ` ${tab.uid === activeTab ? '  nav-item-active' : `nav-item pg${tab.uid.split('-').pop()}-nav-item`}`,
        role: "tab",
        tabIndex: index,
        onClick: () => setActiveTab(tab.uid)
      }, icon.options.position == 'before' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, tab.icon.iconSrc == undefined || tab.icon.iconSrc.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "nav-icon",
        onClick: ev => {
          setIconPickerIndex(index);
          setIconPickerEnable(!iconPickerEnable);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: icon.options.iconSrc
      })), iconPickerEnable && iconPickerIndex != index && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "nav-icon",
        onClick: ev => {
          setIconPickerIndex(index);
          setIconPickerEnable(!iconPickerEnable);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: tab.icon.iconSrc
      })), iconPickerIndex == index && iconPickerEnable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_17__["default"], {
        library: tab.icon.library,
        srcType: tab.icon.srcType,
        iconSrc: tab.icon.iconSrc,
        onChange: arg => {
          tabs[index].icon = {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          };
          setAttributes({
            tabs: tabs
          });
          setIconPickerEnable(!iconPickerEnable);
          setIconPickerIndex(99);
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.RichText, {
        className: " nav-label",
        tagName: "div",
        value: tab.title,
        onChange: tabTitleChange
      }), icon.options.position == 'after' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, tab.icon.iconSrc == undefined || tab.icon.iconSrc.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "nav-icon",
        onClick: ev => {
          setIconPickerIndex(index);
          setIconPickerEnable(!iconPickerEnable);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: icon.options.iconSrc
      })), iconPickerEnable && iconPickerIndex != index && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "nav-icon",
        onClick: ev => {
          setIconPickerIndex(index);
          setIconPickerEnable(!iconPickerEnable);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: tab.icon.iconSrc
      })), iconPickerIndex == index && iconPickerEnable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_17__["default"], {
        library: tab.icon.library,
        srcType: tab.icon.srcType,
        iconSrc: tab.icon.iconSrc,
        onChange: arg => {
          tabs[index].icon = {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          };
          setAttributes({
            tabs: tabs
          });
          setIconPickerEnable(!iconPickerEnable);
          setIconPickerIndex(99);
        }
      })));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "nav-item ",
      onClick: addNewTab
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "nav-icon"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"], {
      fill: "#ddd",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"]
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: 'panels-wrap'
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks, {
      allowedBlocks: ['post-grid/tabs-nested-item'],
      renderAppender: false
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    var attributes = props.attributes;
    var tabs = attributes.tabs;
    var blockId = attributes.blockId;
    var activeTab = attributes.activeTab;
    var icon = attributes.icon;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save({
      className: `${_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps.save().className} ${blockId} pg-tabs`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InnerBlocks.Content, null); //return null;
  }
});

/***/ }),

/***/ "./src/blocks/tabs-nested/variations.js":
/*!**********************************************!*\
  !*** ./src/blocks/tabs-nested/variations.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);


/**
 * WordPress dependencies
 */

/**
 * Template option choices for predefined columns layouts.
 */

const variations = [{
  name: 'preset-1',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-1'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-1'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        justifyContent: {
          "Desktop": "start"
        }
      }
    },
    navItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        backgroundColor: {
          "Desktop": "#3236ff"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        justifyContent: {},
        alignItems: {
          "Desktop": "center"
        },
        cursor: {
          "Desktop": "pointer"
        }
      }
    },
    activeNavItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        display: {
          "Desktop": "flex"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        alignItems: {
          "Desktop": "center"
        }
      }
    },
    navLabel: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        padding: {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {
        fontSize: {
          "Desktop": "20px"
        }
      }
    },
    panelWrap: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        padding: {
          "Desktop": "10px 10px 10px 10px"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        }
      }
    }
  },
  innerBlocks: [['post-grid/tabs-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    header: {
      options: {
        text: 'Accordion Header',
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {}
    },
    title: 'Tab 1'
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 500 169.7"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("defs", null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M19.71,13.65a1.07,1.07,0,0,1,.82.38L27,21.61a1.08,1.08,0,0,1-.11,1.52A1.09,1.09,0,0,1,25.39,23l-5.68-6.63L14,23a1.09,1.09,0,0,1-1.53.11,1.07,1.07,0,0,1-.12-1.52L18.89,14A1.08,1.08,0,0,1,19.71,13.65Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "35.26",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "128.7",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M148.41,23.4a1.1,1.1,0,0,1-.82-.38l-6.5-7.58A1.09,1.09,0,0,1,142.74,14l5.67,6.62L154.09,14a1.08,1.08,0,1,1,1.64,1.41L149.23,23A1.07,1.07,0,0,1,148.41,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "163.96",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "257.4",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M277.11,23.4a1.1,1.1,0,0,1-.82-.38l-6.5-7.58a1.08,1.08,0,0,1,.12-1.53,1.07,1.07,0,0,1,1.52.12l5.68,6.62L282.79,14a1.08,1.08,0,1,1,1.64,1.41L277.93,23A1.07,1.07,0,0,1,277.11,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "292.66",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "37.04",
    width: "500",
    height: "132.66"
  }))
}, {
  name: 'preset-2',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-2'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-2'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        justifyContent: {
          "Desktop": "center"
        }
      }
    },
    navItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        backgroundColor: {
          "Desktop": "#3236ff"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        justifyContent: {},
        alignItems: {
          "Desktop": "center"
        },
        cursor: {
          "Desktop": "pointer"
        }
      }
    },
    activeNavItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        display: {
          "Desktop": "flex"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        alignItems: {
          "Desktop": "center"
        }
      }
    },
    navLabel: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        padding: {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {
        fontSize: {
          "Desktop": "20px"
        }
      }
    },
    panelWrap: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        padding: {
          "Desktop": "10px 10px 10px 10px"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        }
      }
    }
  },
  innerBlocks: [['post-grid/tabs-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    header: {
      options: {
        text: 'Accordion Header',
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {}
    },
    title: 'Tab 1'
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 500 169.7"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("defs", null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "66.75",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M86.46,13.65a1.07,1.07,0,0,1,.82.38l6.5,7.58a1.08,1.08,0,0,1-.11,1.52A1.09,1.09,0,0,1,92.14,23l-5.68-6.63L80.78,23a1.08,1.08,0,0,1-1.64-1.41L85.64,14A1.07,1.07,0,0,1,86.46,13.65Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "102.01",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "195.45",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M215.16,23.4a1.08,1.08,0,0,1-.82-.38l-6.5-7.58a1.08,1.08,0,0,1,.12-1.53,1.07,1.07,0,0,1,1.52.12l5.68,6.62L220.84,14a1.08,1.08,0,1,1,1.64,1.41L216,23A1.07,1.07,0,0,1,215.16,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "230.71",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "324.15",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M343.86,23.4A1.08,1.08,0,0,1,343,23l-6.5-7.58a1.08,1.08,0,0,1,.12-1.53,1.07,1.07,0,0,1,1.52.12l5.68,6.62L349.54,14a1.08,1.08,0,1,1,1.64,1.41L344.68,23A1.07,1.07,0,0,1,343.86,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "359.41",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "37.04",
    width: "500",
    height: "132.66"
  }))
}, {
  name: 'preset-3',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-3'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-3'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        justifyContent: {
          "Desktop": "end"
        }
      }
    },
    navItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        backgroundColor: {
          "Desktop": "#3236ff"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        justifyContent: {},
        alignItems: {
          "Desktop": "center"
        },
        cursor: {
          "Desktop": "pointer"
        }
      }
    },
    activeNavItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        display: {
          "Desktop": "flex"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        alignItems: {
          "Desktop": "center"
        }
      }
    },
    navLabel: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        padding: {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {
        fontSize: {
          "Desktop": "20px"
        }
      }
    },
    panelWrap: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        padding: {
          "Desktop": "10px 10px 10px 10px"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        }
      }
    }
  },
  innerBlocks: [['post-grid/tabs-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    header: {
      options: {
        text: 'Accordion Header',
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {}
    },
    title: 'Tab 1'
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 500 169.7"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "133.5",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M153.21,13.65A1.07,1.07,0,0,1,154,14l6.5,7.58A1.08,1.08,0,0,1,158.89,23l-5.68-6.63L147.53,23a1.08,1.08,0,0,1-1.64-1.41l6.5-7.58A1.07,1.07,0,0,1,153.21,13.65Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "168.76",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "262.2",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M281.91,23.4a1.07,1.07,0,0,1-.82-.38l-6.5-7.58a1.08,1.08,0,0,1,.12-1.53,1.07,1.07,0,0,1,1.52.12l5.68,6.62L287.59,14a1.07,1.07,0,0,1,1.52-.12,1.08,1.08,0,0,1,.12,1.53L282.73,23A1.07,1.07,0,0,1,281.91,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "297.46",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "390.9",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M410.61,23.4a1.07,1.07,0,0,1-.82-.38l-6.5-7.58a1.08,1.08,0,0,1,.12-1.53,1.07,1.07,0,0,1,1.52.12l5.68,6.62L416.29,14a1.07,1.07,0,0,1,1.52-.12,1.08,1.08,0,0,1,.12,1.53L411.43,23A1.07,1.07,0,0,1,410.61,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "426.16",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "37.04",
    width: "500",
    height: "132.66"
  }))
}, {
  name: 'preset-4',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-4'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-4'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        justifyContent: {
          "Desktop": "space-between"
        }
      }
    },
    navItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        backgroundColor: {
          "Desktop": "#3236ff"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        justifyContent: {},
        alignItems: {
          "Desktop": "center"
        },
        cursor: {
          "Desktop": "pointer"
        }
      }
    },
    activeNavItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        display: {
          "Desktop": "flex"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        alignItems: {
          "Desktop": "center"
        }
      }
    },
    navLabel: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        padding: {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {
        fontSize: {
          "Desktop": "20px"
        }
      }
    },
    panelWrap: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        padding: {
          "Desktop": "10px 10px 10px 10px"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        }
      }
    }
  },
  innerBlocks: [['post-grid/tabs-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    header: {
      options: {
        text: 'Accordion Header',
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {}
    },
    title: 'Tab 1'
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 500 169.7"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("defs", null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "37.04",
    width: "500",
    height: "132.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M19.71,13.65a1.07,1.07,0,0,1,.82.38L27,21.61a1.08,1.08,0,0,1-.11,1.52A1.09,1.09,0,0,1,25.39,23l-5.68-6.63L14,23a1.09,1.09,0,0,1-1.53.11,1.07,1.07,0,0,1-.12-1.52L18.89,14A1.08,1.08,0,0,1,19.71,13.65Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "35.26",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "195.45",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M215.16,23.4a1.08,1.08,0,0,1-.82-.38l-6.5-7.58a1.08,1.08,0,0,1,.12-1.53,1.07,1.07,0,0,1,1.52.12l5.68,6.62L220.84,14a1.08,1.08,0,1,1,1.64,1.41L216,23A1.07,1.07,0,0,1,215.16,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "230.71",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "390.9",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M410.61,23.4a1.07,1.07,0,0,1-.82-.38l-6.5-7.58a1.08,1.08,0,0,1,.12-1.53,1.07,1.07,0,0,1,1.52.12l5.68,6.62L416.29,14a1.07,1.07,0,0,1,1.52-.12,1.08,1.08,0,0,1,.12,1.53L411.43,23A1.07,1.07,0,0,1,410.61,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "426.16",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }))
}, {
  name: 'preset-5',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-5'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-5'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        justifyContent: {
          "Desktop": "space-around"
        }
      }
    },
    navItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        backgroundColor: {
          "Desktop": "#3236ff"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        justifyContent: {},
        alignItems: {
          "Desktop": "center"
        },
        cursor: {
          "Desktop": "pointer"
        }
      }
    },
    activeNavItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        display: {
          "Desktop": "flex"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        margin: {
          "Desktop": "0px 5px 0px 0px"
        },
        alignItems: {
          "Desktop": "center"
        }
      }
    },
    navLabel: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        padding: {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {
        fontSize: {
          "Desktop": "20px"
        }
      }
    },
    panelWrap: {
      options: {
        class: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        padding: {
          "Desktop": "10px 10px 10px 10px"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        }
      }
    }
  },
  innerBlocks: [['post-grid/tabs-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    header: {
      options: {
        text: 'Accordion Header',
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {}
    },
    title: 'Tab 1'
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 500 169.7"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    y: "37.04",
    width: "500",
    height: "132.66"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "24.4",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M44.11,13.65a1.07,1.07,0,0,1,.82.38l6.5,7.58A1.08,1.08,0,0,1,49.79,23l-5.68-6.63L38.43,23a1.08,1.08,0,0,1-1.64-1.41L43.29,14A1.07,1.07,0,0,1,44.11,13.65Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "59.66",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "198",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M217.71,23.4a1.1,1.1,0,0,1-.82-.38l-6.5-7.58A1.09,1.09,0,0,1,212,14l5.67,6.62L223.39,14A1.09,1.09,0,1,1,225,15.44L218.54,23A1.1,1.1,0,0,1,217.71,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "233.26",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "371.61",
    width: "109.1",
    height: "37.04"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M391.32,23.4a1.07,1.07,0,0,1-.82-.38L384,15.44a1.08,1.08,0,0,1,.12-1.53,1.07,1.07,0,0,1,1.52.12l5.68,6.62L397,14a1.07,1.07,0,0,1,1.52-.12,1.08,1.08,0,0,1,.12,1.53L392.14,23A1.07,1.07,0,0,1,391.32,23.4Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "406.87",
    y: "13.65",
    width: "58.16",
    height: "9.75"
  }))
}, {
  name: 'preset-6',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-6'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-6'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          "Desktop": "block"
        }
      }
    },
    navItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        backgroundColor: {
          "Desktop": "#3236ff"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        },
        width: {
          "Desktop": "250px"
        },
        alignItems: {
          "Desktop": "center"
        },
        cursor: {
          "Desktop": "pointer"
        }
      }
    },
    activeNavItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        display: {
          "Desktop": "flex"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        },
        alignItems: {
          "Desktop": "center"
        },
        width: {
          "Desktop": "250px"
        }
      }
    },
    navLabel: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        padding: {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {
        fontSize: {
          "Desktop": "20px"
        }
      }
    },
    panelWrap: {
      options: {
        class: ''
      },
      styles: {
        width: {
          "Desktop": "100%"
        },
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        padding: {
          "Desktop": "10px 10px 10px 10px"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        }
      }
    }
  },
  innerBlocks: [['post-grid/tabs-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    header: {
      options: {
        text: 'Accordion Header',
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {}
    },
    title: 'Tab 1'
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 500 132.66"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("defs", null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    width: "152.68",
    height: "34.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M18.17,12.58a1,1,0,0,1,.76.35l6,7a1,1,0,1,1-1.51,1.3l-5.24-6.1-5.23,6.1a1,1,0,1,1-1.52-1.3l6-7A1,1,0,0,1,18.17,12.58Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "32.51",
    y: "12.58",
    width: "53.63",
    height: "8.99"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "49.17",
    width: "152.68",
    height: "34.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M18.17,70.75a1,1,0,0,1-.75-.35l-6-7a1,1,0,1,1,1.52-1.3l5.23,6.1,5.24-6.1a1,1,0,1,1,1.51,1.3l-6,7A1,1,0,0,1,18.17,70.75Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "32.51",
    y: "61.76",
    width: "53.63",
    height: "8.99"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    y: "98.35",
    width: "152.68",
    height: "34.15"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M18.17,119.92a1,1,0,0,1-.75-.35l-6-7a1,1,0,1,1,1.52-1.3l5.23,6.11,5.24-6.11a1,1,0,1,1,1.51,1.3l-6,7A1,1,0,0,1,18.17,119.92Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "32.51",
    y: "110.93",
    width: "53.63",
    height: "8.99"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "131.21",
    width: "368.79",
    height: "132.66"
  }))
}, {
  name: 'preset-7',
  title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-7'),
  description: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)('preset-7'),
  isPro: false,
  atts: {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        }
      }
    },
    navsWrap: {
      options: {
        class: ''
      },
      styles: {
        display: {
          "Desktop": "block"
        },
        order: {
          "Desktop": "10"
        }
      }
    },
    navItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        display: {
          "Desktop": "flex"
        },
        "color": {
          "Desktop": "#ffffff"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        backgroundColor: {
          "Desktop": "#3236ff"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        },
        width: {
          "Desktop": "250px"
        },
        alignItems: {
          "Desktop": "center"
        },
        cursor: {
          "Desktop": "pointer"
        }
      }
    },
    activeNavItem: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        display: {
          "Desktop": "flex"
        },
        padding: {
          "Desktop": "5px 15px 5px 15px"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        },
        alignItems: {
          "Desktop": "center"
        },
        width: {
          "Desktop": "250px"
        }
      }
    },
    navLabel: {
      options: {
        viewType: 'horizontal',
        position: 'left',
        class: '',
        activeTab: ''
      },
      styles: {
        padding: {
          "Desktop": "0px 10px 0px 10px"
        }
      }
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {
        fontSize: {
          "Desktop": "20px"
        }
      }
    },
    panelWrap: {
      options: {
        class: ''
      },
      styles: {
        width: {
          "Desktop": "100%"
        },
        backgroundColor: {
          "Desktop": "#afb1ff"
        },
        padding: {
          "Desktop": "10px 10px 10px 10px"
        },
        margin: {
          "Desktop": "0px 0px 0px 0px"
        }
      }
    }
  },
  innerBlocks: [['post-grid/tabs-nested-item', {
    wrapper: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    content: {
      options: {
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    header: {
      options: {
        text: 'Accordion Header',
        tag: 'div',
        class: ''
      },
      styles: {}
    },
    icon: {
      options: {
        library: 'fontAwesome',
        srcType: "class",
        iconSrc: 'fas fa-angle-down',
        position: 'before',
        class: 'icon'
      },
      styles: {}
    },
    title: 'Tab 1'
  }]],
  scope: ['block'],
  icon: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 500 132.66"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("defs", null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "347.29",
    width: "152.69",
    height: "34.15",
    transform: "translate(847.27 34.15) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#3c3c3b",
    d: "M481.8,12.58a1,1,0,0,0-.76.35l-6,7a1,1,0,1,0,1.52,1.3l5.23-6.1,5.24,6.1a1,1,0,0,0,1.4.11,1,1,0,0,0,.11-1.41l-6-7A1,1,0,0,0,481.8,12.58Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "413.84",
    y: "12.58",
    width: "53.63",
    height: "8.99",
    transform: "translate(881.31 34.15) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "347.29",
    y: "49.18",
    width: "152.69",
    height: "34.15",
    transform: "translate(847.27 132.51) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M481.8,70.75a1,1,0,0,0,.76-.35l6-7a1,1,0,0,0-.11-1.41,1,1,0,0,0-1.4.11l-5.24,6.1-5.23-6.1a1,1,0,1,0-1.52,1.3l6,7A1,1,0,0,0,481.8,70.75Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "413.84",
    y: "61.76",
    width: "53.63",
    height: "8.99",
    transform: "translate(881.31 132.51) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#3c3c3b",
    x: "347.29",
    y: "98.35",
    width: "152.69",
    height: "34.15",
    transform: "translate(847.27 230.86) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    fill: "#ffffff",
    d: "M481.8,119.92a1,1,0,0,0,.76-.34l6-7a1,1,0,0,0-.11-1.41,1,1,0,0,0-1.4.11l-5.24,6.1-5.23-6.1a1,1,0,1,0-1.52,1.3l6,7A1,1,0,0,0,481.8,119.92Z"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "413.84",
    y: "110.94",
    width: "53.63",
    height: "8.99",
    transform: "translate(881.31 230.86) rotate(-180)"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
    fill: "#ffffff",
    x: "0.02",
    width: "368.8",
    height: "132.66"
  }))
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (variations);

/***/ }),

/***/ "./src/blocks/tabs/index.js":
/*!**********************************!*\
  !*** ./src/blocks/tabs/index.js ***!
  \**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_css_cursor__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/css-cursor */ "./src/components/css-cursor/index.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");















const {
  RawHTML
} = wp.element;














var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/tabs", {
  apiVersion: 2,
  title: "Tabs",
  parent: ['post-grid/accordion-nested'],
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      width: "24",
      height: "24",
      viewBox: "0 0 24 24",
      fill: "none",
      xmlns: "http://www.w3.org/2000/svg"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      d: "M19.3872 3.62674H3.62677C2.66363 3.62674 1.87561 4.41476 1.87561 5.3779V17.636C1.87561 18.5991 2.66363 19.3872 3.62677 19.3872H19.3872C20.3503 19.3872 21.1383 18.5991 21.1383 17.636V5.3779C21.1383 4.41476 20.3503 3.62674 19.3872 3.62674ZM18.5116 17.636H4.50235C4.02078 17.636 3.62677 17.242 3.62677 16.7604V6.25348C3.62677 5.77191 4.02078 5.3779 4.50235 5.3779H12.3826V8.00463C12.3826 8.4862 12.7766 8.88021 13.2581 8.88021H19.3872V16.7604C19.3872 17.242 18.9932 17.636 18.5116 17.636Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          content: '',
          tag: 'div',
          class: 'pg-accordion'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          }
        }
      }
    },
    items: {
      type: 'array',
      default: [{
        isActive: false,
        headerText: 'What is Lorem Ipsum?',
        content: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.',
        icon: '',
        iconToggle: '',
        styles: {}
      }]
    },
    header: {
      type: 'object',
      default: {
        options: {
          text: 'What is Lorem Ipsum?',
          tag: 'div',
          class: 'tab-nav '
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          cursor: {},
          borderRadius: {},
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    headerActive: {
      type: 'object',
      default: {
        options: {
          text: 'What is Lorem Ipsum?',
          tag: 'div',
          class: 'tab-nav ',
          activeIndex: 0
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    headerWrap: {
      type: 'object',
      default: {
        options: {
          tag: 'div',
          class: 'tabs-navs '
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    content: {
      type: 'object',
      default: {
        options: {
          text: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.',
          tag: 'div',
          class: 'pg-accordion-content'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-right',
          class: 'icon',
          positon: 'beforeHeader',
          enableToggle: 'yes'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    iconToggle: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: 'fas fa-chevron-down',
          class: 'iconToggle'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          padding: {
            Desktop: ''
          },
          margin: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          },
          lineHeight: {},
          fontWeight: {
            "Desktop": "700"
          },
          textDecoration: {} //overline, line-through, underline

        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var items = attributes.items;
    var wrapper = attributes.wrapper;
    var headerWrap = attributes.headerWrap;
    var header = attributes.header;
    var headerActive = attributes.headerActive;
    var content = attributes.content;
    var icon = attributes.icon;
    var iconToggle = attributes.iconToggle;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
    const [isOpen, setisOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Wrapper CSS Class Selectors

    var wrapperSelector = blockClass;
    var headerWrapSelector = blockClass + ' .tabs-navs';
    var headerSelector = blockClass + ' .tab-nav';
    var headerActiveSelector = blockClass + ' .tab-nav.active';
    var contentSelector = blockClass + ' .pg-accordion-content';
    const iconSelector = blockClass + ' .icon-wrap';
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);
    const [iconToggleHtml, setIconToggleHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      var iconSrc = iconToggle.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconToggleHtml(iconHtml);
    }, [iconToggle]);

    function handleLinkClick(ev) {
      ev.stopPropagation();
      ev.preventDefault();
      return false;
    }

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onChangeIconToggle(arg) {
      var options = { ...iconToggle.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        iconToggle: { ...iconToggle,
          options: options
        }
      });
    }

    function onPickCssLibraryHeader(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        header[sudoScource] = sudoScourceArgs;
      });
      var headerX = Object.assign({}, header);
      setAttributes({
        header: headerX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryContent(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        content[sudoScource] = sudoScourceArgs;
      });
      var contentX = Object.assign({}, content);
      setAttributes({
        content: contentX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onPickCssLibraryIcon(args) {
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        icon[sudoScource] = sudoScourceArgs;
      });
      var iconX = Object.assign({}, icon);
      setAttributes({
        icon: iconX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var cssItems = Object.assign(blockCssY.items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleHeaderWrap(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, headerWrap);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        headerWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerWrapSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeaderWrap(sudoScource, key) {
      var object = myStore.deletePropertyDeep(headerWrap, [sudoScource, key, breakPointX]);
      setAttributes({
        headerWrap: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerWrapSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeaderWrap(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, headerWrap);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        headerWrap: object
      });
    }

    function onChangeStyleHeader(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, header);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        header: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeader(sudoScource, key) {
      var object = myStore.deletePropertyDeep(header, [sudoScource, key, breakPointX]);
      setAttributes({
        header: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeader(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, header);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        header: object
      });
    }

    function onChangeStyleContent(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, content);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        content: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleContent(sudoScource, key) {
      var object = myStore.deletePropertyDeep(content, [sudoScource, key, breakPointX]);
      setAttributes({
        content: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, contentSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleContent(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, content);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        content: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleHeaderActive(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, headerActive);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        headerActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerActiveSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleHeaderActive(sudoScource, key) {
      var object = myStore.deletePropertyDeep(headerActive, [sudoScource, key, breakPointX]);
      setAttributes({
        headerActive: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, headerActiveSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleHeaderActive(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, headerActive);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        headerActive: object
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.useBlockProps)({
      className: ` ${blockId} pg-tabs`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.BlockControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.AlignmentToolbar, {
      value: wrapper.styles.textAlign,
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(wrapper.styles.textAlign).length == 0) {
          newValuesObj[breakPointX] = newVal;
        } else {
          newValuesObj = wrapper.styles.textAlign;
          newValuesObj[breakPointX] = newVal;
        }

        var styles = { ...wrapper.styles,
          textAlign: newValuesObj
        };
        setAttributes({
          wrapper: { ...wrapper,
            styles: styles
          }
        });
        var itemsX = { ...blockCssY.items
        };
        itemsX[wrapperSelector] = { ...blockCssY.items[wrapperSelector],
          'text-align': newValuesObj
        };
        setAttributes({
          blockCssY: {
            items: itemsX
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2",
      title: "header",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Navs Wrap",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: headerWrap,
      onChange: onChangeStyleHeaderWrap,
      onAdd: onAddStyleHeaderWrap,
      onRemove: onRemoveStyleHeaderWrap
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Navs",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: header.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...header.options,
          tag: newVal
        };
        setAttributes({
          header: { ...header,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: header,
      onChange: onChangeStyleHeader,
      onAdd: onAddStyleHeader,
      onRemove: onRemoveStyleHeader
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_22__["default"], {
      blockId: blockId,
      obj: header,
      onChange: onPickCssLibraryHeader
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Navs - Active",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: headerActive,
      onChange: onChangeStyleHeaderActive,
      onAdd: onAddStyleHeaderActive,
      onRemove: onRemoveStyleHeaderActive
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Content",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: content.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...content.options,
          tag: newVal
        };
        setAttributes({
          content: { ...content,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: content,
      onChange: onChangeStyleContent,
      onAdd: onAddStyleContent,
      onRemove: onRemoveStyleContent
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_22__["default"], {
      blockId: blockId,
      obj: content,
      onChange: onPickCssLibraryContent
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_19__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_16__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Choose Toggled Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_16__["default"], {
      library: iconToggle.options.library,
      srcType: iconToggle.options.srcType,
      iconSrc: iconToggle.options.iconSrc,
      onChange: onChangeIconToggle
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Header Text',
        value: 'beforeHeader'
      }, {
        label: 'After Header Text',
        value: 'afterHeader'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Enable Icon Toggle"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.SelectControl, {
      label: "",
      value: icon.options.enableToggle,
      options: [{
        label: 'Yes',
        value: 'yes'
      }, {
        label: 'No',
        value: 'no'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          enableToggle: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_21__["default"], {
      obj: wrapper,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_20__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_22__["default"], {
      blockId: blockId,
      obj: icon,
      onChange: onPickCssLibraryIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("code", null, wrapperSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_5__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_12__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_13__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 p-2 px-5 text-white text-center my-4 cursor-pointer",
      onClick: ev => {
        var itemx = items.concat({
          isActive: false,
          headerText: 'What is Lorem Ipsum?',
          content: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.',
          icon: '',
          iconToggle: '',
          styles: {}
        });
        setAttributes({
          items: itemx
        });
      }
    }, "Add"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: headerWrap.options.class
    }, items.map((item, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: `inline-block cursor-pointer ${headerActive.options.activeIndex == i ? 'active' : ''} ${header.options.class}`,
        onClick: ev => {
          var options = { ...headerActive.options,
            activeIndex: i
          };
          setAttributes({
            headerActive: { ...headerActive,
              options: options
            }
          });
        }
      }, icon.options.position == 'beforeHeader' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, icon.options.enableToggle == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, headerActive.options.activeIndex != i && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap ",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), headerActive.options.activeIndex == i && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap ",
        dangerouslySetInnerHTML: {
          __html: iconToggleHtml
        }
      })), icon.options.enableToggle == 'no' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap ",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.RichText, {
        tagName: "span",
        value: item.headerText,
        allowedFormats: ['core/bold', 'core/italic', 'core/link'],
        onChange: content => {
          items[i].headerText = content;
          var ssdsd = items.concat([]);
          setAttributes({
            items: ssdsd
          });
        },
        placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Start Writing...')
      }), icon.options.position == 'afterHeader' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, icon.options.enableToggle == 'yes' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, headerActive.options.activeIndex != i && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap float-right",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), headerActive.options.activeIndex == i && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap float-right",
        dangerouslySetInnerHTML: {
          __html: iconToggleHtml
        }
      })), icon.options.enableToggle == 'no' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "icon-wrap float-right",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "text-lg cursor-pointer px-2 text-red-500  py-1 float-right icon-close",
        onClick: ev => {
          items.splice(i, 1);
          var ssdsd = items.concat([]);
          setAttributes({
            items: ssdsd
          });
          ev.preventDefault();
        }
      })));
    })), items.map((item, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, headerActive.options.activeIndex == i && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_7__.RichText, {
        className: content.options.class,
        tagName: "div",
        value: item.content,
        allowedFormats: ['core/bold', 'core/italic', 'core/link'],
        onChange: content => {
          items[i].content = content;
          var ssdsd = items.concat([]);
          setAttributes({
            items: ssdsd
          });
        },
        placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__.__)('Start Writing...')
      }));
    }))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null; //return null;
  }
});

/***/ }),

/***/ "./src/blocks/terms-list/index.js":
/*!****************************************!*\
  !*** ./src/blocks/terms-list/index.js ***!
  \****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
















const {
  RawHTML
} = wp.element;













var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_5__.registerBlockType)("post-grid/terms-list", {
  apiVersion: 2,
  title: "Terms List",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "4",
      y: "9.27",
      width: "8.95",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M0,4.62v11.3H16.94V4.62Zm14.94,9.3H2V6.62H14.94Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "4",
      y: "24.73",
      width: "8.95",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M0,20.08v11.3H16.94V20.08Zm14.94,9.3H2v-7.3H14.94Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "23.06",
      y: "9.27",
      width: "8.95",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19.06,4.62v11.3H36V4.62ZM34,13.92H21.06V6.62H34Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
      fill: "#1d4ed8",
      x: "23.06",
      y: "24.73",
      width: "8.95",
      height: "2"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19.06,20.08v11.3H36V20.08ZM34,29.38H21.06v-7.3H34Z"
    }))
  },
  attributes: {
    wrapper: {
      type: 'object',
      default: {
        options: {
          class: 'inline-block'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    taxonomies: {
      type: 'object',
      default: {
        options: {
          taxName: ''
        }
      }
    },
    items: {
      type: 'object',
      default: {
        options: {
          prefix: '',
          postfix: '',
          viewType: 'list',
          // inline, grid, list, accordion
          hierarchicaly: false,
          queryPosts: false,
          accordionOpen: false,
          linkToTerm: false,
          postCountPosition: 'beforeTitle',
          //beforeTitle, afterTtile, afterPosts, beforePosts
          postCountText: 'Total Posts %s',
          gridColNumber: {},
          gridColGap: '15px',
          gridRowGap: '15px',
          hideEmpty: false,
          maxCount: 99,
          postCount: false,
          class: 'item inline-block',
          linkTarget: '',
          linkAttr: []
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    icon: {
      type: 'object',
      default: {
        options: {
          library: 'fontAwesome',
          srcType: "class",

          /*class, html, img, svg */
          iconSrc: '',
          position: 'beforeFronttext',

          /*before, after, prefix, postfix */
          class: 'icon'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    separator: {
      type: 'object',
      default: {
        options: {
          class: 'inline-block',
          text: ', '
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    frontText: {
      type: 'object',
      default: {
        options: {
          text: 'Tags: ',
          class: 'inline-block'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          },
          fontSize: {
            Desktop: ''
          }
        }
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    }
  },
  usesContext: ["postId", "loopIndex", "postType", "queryId"],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var wrapper = attributes.wrapper;
    var items = attributes.items;
    var separator = attributes.separator;
    var frontText = attributes.frontText;
    var icon = attributes.icon;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var taxonomies = attributes.taxonomies;
    var postId = context['postId'];
    var postType = context['postType']; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [postObjects, setPostObjects] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Wrapper CSS Class Selectors

    const wrapperSelector = blockClass;
    const itemSelector = blockClass + ' .item';
    const itemTitleSelector = blockClass + ' .termTitle';
    const separatorSelector = blockClass + ' .separator';
    const frontTextSelector = blockClass + ' .frontText';
    const postCountSelector = blockClass + ' .postCount';
    const iconSelector = blockClass + ' .icon';
    var breakPointList = [];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    const [categoryCount, setcategoryCount] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(0); // Using the hook.

    const [postCategoriesData, setPostCategoriesData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [categories, setCategories] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]); // Using the hook.

    const [postCategoriesX, setPostCategoriesX] = (0,_wordpress_core_data__WEBPACK_IMPORTED_MODULE_4__.useEntityProp)('postType', postType, taxonomies.options.taxName, postId);
    var dummyCats = [{
      "id": 1,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 1",
      "slug": "category-1",
      "taxonomy": "category_tax"
    }, {
      "id": 2,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 2",
      "slug": "category-2",
      "taxonomy": "category_tax",
      children: [{
        "id": 21,
        "count": 1,
        "description": "",
        "link": "#",
        "name": "Child Category 1",
        "slug": "category-3",
        "taxonomy": "category_tax"
      }, {
        "id": 22,
        "count": 1,
        "description": "",
        "link": "#",
        "name": "Child Category 2",
        "slug": "category-3",
        "taxonomy": "category_tax"
      }, {
        "id": 23,
        "count": 1,
        "description": "",
        "link": "#",
        "name": "Child Category 3",
        "slug": "category-3",
        "taxonomy": "category_tax"
      }],
      posts: [{
        "link": "#",
        "name": "Post Title 1"
      }, {
        "link": "#",
        "name": "Post Title 2"
      }, {
        "link": "#",
        "name": "Post Title 3"
      }]
    }, {
      "id": 3,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 3",
      "slug": "category-3",
      "taxonomy": "category_tax"
    }, {
      "id": 4,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 4",
      "slug": "category-4",
      "taxonomy": "category_tax"
    }, {
      "id": 5,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 5",
      "slug": "category-5",
      "taxonomy": "category_tax"
    }, {
      "id": 6,
      "count": 1,
      "description": "",
      "link": "#",
      "name": "Category 6",
      "slug": "category-6",
      "taxonomy": "category_tax"
    }];
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setPostCategoriesData([]);
      setCategories([]);
      setcategoryCount(categories.length - 1);

      if (postCategoriesX != undefined) {
        for (x in postCategoriesX) {
          var catId = postCategoriesX[x];
          var assd = x;

          if (x) {
            _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
              path: '/wp/v2/' + taxonomies.options.taxName + '/' + catId,
              method: 'GET'
            }).then(res => {
              setPostCategoriesData(current => [...current, res]);
              setCategories(current => [...current, res]);
            });
          }
        }
      } else {
        setPostCategoriesData(dummyCats);
        setCategories(dummyCats);
      }
    }, [postCategoriesX]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var asdasd = postCategoriesData.slice(0, items.options.maxCount);
      setCategories(asdasd);
    }, [postCategoriesData]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var maxCount = items.options.maxCount.length > 0 ? items.options.maxCount : 99;

      if (postCategoriesX != undefined && postCategoriesX.length > 0) {
        setcategoryCount(categories.length - 1);
        var asdasd = postCategoriesData.slice(0, maxCount);
        setCategories(asdasd);
      } else {
        var asdasd = dummyCats.slice(0, maxCount);
        setCategories(asdasd);
      }
    }, [items]);
    const [iconHtml, setIconHtml] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      var iconSrc = icon.options.iconSrc;
      var iconHtml = `<span class="${iconSrc}"></span>`;
      setIconHtml(iconHtml);
    }, [icon]);

    function setTaxonomy(option, index) {
      var options = { ...taxonomies.options,
        taxName: option.id
      };
      setAttributes({
        taxonomies: { ...taxonomies,
          options: options
        }
      }); // var attrExist = false;
      // var data = queryPrams[index];
      // var multiple = data.multiple;
      // var isExist = queryArgs.items.map((item) => {
      //   if (item.id == index) {
      //     return true;
      //   }
      // })
      // var items = queryArgs.items.concat([data])
      // setAttributes({ queryArgs: { items: items } });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      }); // setAttributes({ postTitle: postTitle });
      // setAttributes({ wrapper: wrapper });

      _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
        path: '/post-grid/v2/post_type_objects',
        method: 'POST',
        data: {
          postTypes: [postType]
        }
      }).then(res => {
        setPostObjects(res);
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);

    function onChangeIcon(arg) {
      var options = { ...icon.options,
        srcType: arg.srcType,
        library: arg.library,
        iconSrc: arg.iconSrc
      };
      setAttributes({
        icon: { ...icon,
          options: options
        }
      });
    }

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onChangeStyleItems(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, item);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        item: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItems(sudoScource, key) {
      var object = myStore.deletePropertyDeep(item, [sudoScource, key, breakPointX]);
      setAttributes({
        item: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItems(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, items);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        items: object
      });
    }

    function onChangeStyleIcon(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleIcon(sudoScource, key) {
      var object = myStore.deletePropertyDeep(icon, [sudoScource, key, breakPointX]);
      setAttributes({
        icon: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, iconSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleIcon(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, icon);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        icon: object
      });
    }

    function onChangeStyleFrontText(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleFrontText(sudoScource, key) {
      var object = myStore.deletePropertyDeep(frontText, [sudoScource, key, breakPointX]);
      setAttributes({
        frontText: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, frontTextSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleFrontText(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, frontText);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        frontText: object
      });
    }

    function onChangeStyleSeparator(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleSeparator(sudoScource, key) {
      var object = myStore.deletePropertyDeep(separator, [sudoScource, key, breakPointX]);
      setAttributes({
        separator: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, separatorSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleSeparator(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, separator);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        separator: object
      });
    }

    var [linkAttrItems, setlinkAttrItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({}); // Using the hook.

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      linkAttrObj();
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [items]);

    var linkAttrObj = () => {
      var sdsd = {};
      items.options.linkAttr.map(x => {
        if (x.val) sdsd[x.id] = x.val;
      });
      setlinkAttrItems(sdsd);
    };

    const post = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecord('postType', context['postType'], context['postId']));
    const termstaxonomy = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_7__.useSelect)(select => select('core').getEntityRecords('taxonomy', 'category', [4, 5]));

    function onChangeBreakPoint(x, index) {
      var asdsdsd = wp.data.dispatch('postgrid-shop').setBreakPoint(x.value);
      asdsdsd.then(res => {
        setBreakPointX(res.breakpoint);
        myStore.generateBlockCss(blockCssY.items, blockId, customCss);
      });
    }

    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.useBlockProps)({
      className: ` ${blockId} pg-terms-list`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Select Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_15__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: postObjects,
      buttonTitle: "Choose",
      onChange: setTaxonomy,
      values: taxonomies.options.taxName
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: taxonomies.options.taxName,
      onChange: newVal => {
        var options = { ...taxonomies.options,
          taxName: newVal
        };
        setAttributes({
          taxonomies: { ...taxonomies,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: wrapper.options.class,
      onChange: newVal => {
        var options = { ...wrapper.options,
          class: newVal
        };
        setAttributes({
          wrapper: { ...wrapper,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Items",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "View Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: items.options.viewType,
      options: [{
        label: 'Accordion',
        value: 'accordion'
      }, {
        label: 'Inline',
        value: 'inline'
      }, {
        label: 'Grid',
        value: 'grid'
      }, {
        label: 'List',
        value: 'list'
      }],
      onChange: newVal => {
        var options = { ...items.options,
          viewType: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Query Posts"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: items.options.queryPosts,
      options: [{
        label: 'True',
        value: 1
      }, {
        label: 'False',
        value: 0
      }],
      onChange: newVal => {
        var options = { ...items.options,
          queryPosts: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Hide Empty Terms"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: items.options.hideEmpty,
      options: [{
        label: 'True',
        value: 1
      }, {
        label: 'False',
        value: 0
      }],
      onChange: newVal => {
        var options = { ...items.options,
          hideEmpty: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), items.options.viewType == 'accordion' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Accordion Open"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: items.options.accordionOpen,
      options: [{
        label: 'True',
        value: 1
      }, {
        label: 'False',
        value: 0
      }],
      onChange: newVal => {
        var options = { ...items.options,
          accordionOpen: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), items.options.viewType == 'grid' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Post Count Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: items.options.postCountPosition,
      options: [{
        label: 'Before Title',
        value: 'beforeTitle'
      }, {
        label: 'After Ttile',
        value: 'afterTtile'
      }, {
        label: 'Before Posts',
        value: 'beforePosts'
      }, {
        label: 'After Posts',
        value: 'afterPosts'
      }],
      onChange: newVal => {
        var options = { ...items.options,
          postCountPosition: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Post Count Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.postCountText,
      onChange: newVal => {
        var options = { ...items.options,
          postCountText: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", null, "Column Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChangeBreakPoint,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][breakPointX].icon,
      value: breakPointX
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.gridColNumber == undefined || items.options.gridColNumber[breakPointX] == undefined ? 1 : items.options.gridColNumber[breakPointX].val,
      type: "number",
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(items.options.gridColNumber).length == 0) {
          newValuesObj[breakPointX] = {
            val: newVal,
            unit: 'fr'
          };
        } else {
          var unit = newValuesObj[breakPointX] != undefined ? newValuesObj[breakPointX].unit : 'fr';
          newValuesObj = items.options.gridColNumber;
          newValuesObj[breakPointX] = {
            val: newVal,
            unit: unit
          };
        }

        var options = { ...items.options,
          gridColNumber: newValuesObj
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      className: "mb-0",
      value: items.options.gridColNumber == undefined || items.options.gridColNumber[breakPointX] == undefined ? 'fr' : items.options.gridColNumber[breakPointX].unit,
      options: [{
        label: 'fr',
        value: 'fr'
      }, {
        label: 'px',
        value: 'px'
      }, {
        label: '%',
        value: '%'
      }, {
        label: 'em',
        value: 'em'
      }],
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(items.options.gridColNumber).length == 0) {
          newValuesObj[breakPointX] = {
            val: 1,
            unit: newVal
          };
        } else {
          var val = newValuesObj[breakPointX] != undefined ? newValuesObj[breakPointX].val : 'fr';
          newValuesObj = items.options.gridColNumber;
          newValuesObj[breakPointX] = {
            val: val,
            unit: newVal
          };
        }

        var options = { ...items.options,
          gridColNumber: newValuesObj
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link To Term"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: items.options.linkToTerm,
      options: [{
        label: 'True',
        value: 1
      }, {
        label: 'False',
        value: 0
      }],
      onChange: newVal => {
        var options = { ...items.options,
          linkToTerm: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), items.options.viewType == 'accordion' || items.options.viewType == 'list' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Hierarchicaly"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: items.options.hierarchicaly,
      options: [{
        label: 'True',
        value: 1
      }, {
        label: 'False',
        value: 0
      }],
      onChange: newVal => {
        var options = { ...items.options,
          hierarchicaly: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.ToggleControl, {
      label: "Display Post Count",
      help: items.options.postCount ? 'Post Count Enabled' : 'Post Count Disabled',
      checked: items.options.postCount ? true : false,
      onChange: e => {
        var options = { ...items.options,
          postCount: items.options.postCount ? false : true
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Item Class"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.class,
      onChange: newVal => {
        var options = { ...items.options,
          class: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Max Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.maxCount,
      onChange: newVal => {
        var options = { ...items.options,
          maxCount: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Link Target"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: items.options.linkTarget,
      options: [{
        label: '_self',
        value: '_self'
      }, {
        label: '_blank',
        value: '_blank'
      }, {
        label: '_parent',
        value: '_parent'
      }, {
        label: '_top',
        value: '_top'
      }],
      onChange: newVal => {
        var options = { ...items.options,
          linkTarget: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.prefix,
      onChange: newVal => {
        var options = { ...items.options,
          prefix: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Postfix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: items.options.postfix,
      onChange: newVal => {
        var options = { ...items.options,
          postfix: newVal
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Attributes"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: " cursor-pointer px-3 text-white py-1 bg-blue-600",
      onClick: ev => {
        var sdsd = items.options.linkAttr.concat({
          id: '',
          val: ''
        });
        var options = { ...items.options,
          linkAttr: sdsd
        };
        setAttributes({
          items: { ...items,
            options: options
          }
        });
        linkAttrObj();
      }
    }, "Add")), items.options.linkAttr.length > 0 && items.options.linkAttr.map((x, i) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Name",
        value: items.options.linkAttr[i].id,
        onChange: newVal => {
          items.options.linkAttr[i].id = newVal;
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
        className: "mr-2",
        placeholder: "Value",
        value: x.val,
        onChange: newVal => {
          items.options.linkAttr[i].val = newVal;
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "text-lg cursor-pointer px-3 text-white py-1 bg-red-400 icon-close",
        onClick: ev => {
          items.options.linkAttr.splice(i, 1);
          var ssdsd = items.options.linkAttr.concat([]);
          var options = { ...items.options,
            linkAttr: ssdsd
          };
          setAttributes({
            items: { ...items,
              options: options
            }
          });
        }
      })));
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: items,
      onChange: onChangeStyleItems,
      onAdd: onAddStyleItems,
      onRemove: onRemoveStyleItems
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Icon",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Choose Icon"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_19__["default"], {
      library: icon.options.library,
      srcType: icon.options.srcType,
      iconSrc: icon.options.iconSrc,
      onChange: onChangeIcon
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Icon postion"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.SelectControl, {
      label: "",
      value: icon.options.position,
      options: [{
        label: 'Choose Position',
        value: ''
      }, {
        label: 'Before Front text',
        value: 'beforeFronttext'
      }, {
        label: 'After Front text',
        value: 'afterFronttext'
      }, {
        label: 'Before Items',
        value: 'beforeItems'
      }, {
        label: 'After Items',
        value: 'afterItems'
      }],
      onChange: newVal => {
        var options = { ...icon.options,
          position: newVal
        };
        setAttributes({
          icon: { ...icon,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: icon,
      onChange: onChangeStyleIcon,
      onAdd: onAddStyleIcon,
      onRemove: onRemoveStyleIcon
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Front Text",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: frontText.options.text,
      onChange: newVal => {
        var options = { ...frontText.options,
          text: newVal
        };
        setAttributes({
          frontText: { ...frontText,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleFrontText,
      onAdd: onAddStyleFrontText,
      onRemove: onRemoveStyleFrontText
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Separator",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_20__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Separator"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: separator.options.text,
      onChange: newVal => {
        var options = { ...separator.options,
          text: newVal
        };
        setAttributes({
          separator: { ...separator,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_21__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_22__["default"], {
      obj: wrapper,
      onChange: onChangeStyleSeparator,
      onAdd: onAddStyleSeparator,
      onRemove: onRemoveStyleSeparator
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Items Wrapper"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, wrapperSelector, '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Caetgory Items"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, itemSelector, '{}', " ")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, ".pg-postCategories a", '{/* your CSS here*/}'))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Separator"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, separatorSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Front Text"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, frontTextSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Post Count"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, postCountSelector, '{/* your CSS here*/}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_16__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_17__["default"], {
      utm: {
        utm_source: 'BlockPostTitle',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, taxonomies.options.taxName.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Select Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_15__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: postObjects,
      buttonTitle: "Choose",
      onChange: setTaxonomy,
      values: taxonomies.options.taxName
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Custom Taxonomy"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_8__.__experimentalInputControl, {
      value: taxonomies.options.taxName,
      onChange: newVal => {
        var options = { ...taxonomies.options,
          taxName: newVal
        };
        setAttributes({
          taxonomies: { ...taxonomies,
            options: options
          }
        });
      }
    }))), taxonomies.options.taxName.length > 0 && categories.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, "No Terms Found"), taxonomies.options.taxName.length > 0 && categories.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", blockProps, icon.options.position == 'beforeFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "frontText inline-block"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(RawHTML, null, frontText.options.text)), icon.options.position == 'afterFronttext' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), icon.options.position == 'beforeItems' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), categories.map((x, index) => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
        onClick: ev => ev.preventDefault(),
        target: items.options.linkTarget,
        title: x.name
      }, linkAttrItems, {
        className: items.options.class,
        href: x.link
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "termTitle"
      }, items.options.prefix, x.name, items.options.postfix), items.options.postCount == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "postCount"
      }, "(", x.count, ")"), categories.length > index + 1 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "separator"
      }, separator.options.text, " "));
    }), icon.options.position == 'afterItems' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon.options.class,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Live Preview is not avilable at the moment, please visit page and see it."))));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/text/index.js":
/*!**********************************!*\
  !*** ./src/blocks/text/index.js ***!
  \**********************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../store */ "./src/store.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _components_typography__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/typography */ "./src/components/typography/index.js");
/* harmony import */ var _components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/mail-subscribe */ "./src/components/mail-subscribe/index.js");
/* harmony import */ var _components_contact_support__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/contact-support */ "./src/components/contact-support/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
















const {
  RawHTML
} = wp.element;












var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_2__.registerBlockType)("post-grid/text", {
  apiVersion: 2,
  title: "Text",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    text: {
      type: 'object',
      default: {
        options: {
          content: 'Hi...',
          tag: 'div',
          class: 'pg-text'
        },
        styles: {// textAlign: {Desktop: ''},
          // color: { Desktop: '' },
          // padding: { Desktop: '' },
          // margin: { Desktop: '' },
          // fontSize: { Desktop: '' },
          // lineHeight: {Desktop: ''},
          // letterSpacing: {Desktop: ''},
          // fontFamily: {Desktop: ''},
          // fontWeight: {Desktop: ''},
          // textDecoration: {Desktop: ''}, //overline, line-through, underline
          // textTransform: {Desktop: ''},
        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    customCss: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    }
  },
  usesContext: [],
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var context = props.context;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    var text = attributes.text;
    var customCss = attributes.customCss;
    var blockCssY = attributes.blockCssY; //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

    var breakPointX = myStore.getBreakPoint();
    const [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const CustomTag = `${text.options.tag}`; // Wrapper CSS Class Selectors

    var textSelector = blockClass;
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      setAttributes({
        customCss: customCss
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [customCss]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockId]);
    var breakPointList = [{
      label: 'Select..',
      icon: '',
      value: ''
    }];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_9__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    function onPickCssLibraryText(args) {
      console.log(args);
      var textX = Object.assign({}, text);
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        textX[sudoScource] = sudoScourceArgs;
      });
      setAttributes({
        text: textX
      });
      var styleObj = {};
      Object.entries(args).map(x => {
        var sudoScource = x[0];
        var sudoScourceArgs = x[1];
        var elementSelector = myStore.getElementSelector(sudoScource, textSelector);
        var sudoObj = {};
        Object.entries(sudoScourceArgs).map(y => {
          var cssPropty = y[0];
          var cssProptyVal = y[1];
          var cssProptyKey = myStore.cssAttrParse(cssPropty);
          sudoObj[cssProptyKey] = cssProptyVal;
        });
        styleObj[elementSelector] = sudoObj;
      });
      var blockCssYX = { ...blockCssY
      };
      var items = { ...blockCssYX.items
      };
      var cssItems = Object.assign(items, styleObj);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onChangeStyleText(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, text);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        text: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, textSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleText(sudoScource, key) {
      var object = myStore.deletePropertyDeep(text, [sudoScource, key, breakPointX]);
      setAttributes({
        text: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, textSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleText(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, text);
      const object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        text: object
      });
    }

    function onBulkAddText(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, text);
      obj[sudoScource] = cssObj;
      setAttributes({
        text: obj
      });
      var selector = myStore.getElementSelector(sudoScource, textSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.useBlockProps)({
      className: ` ${blockId} pg-text`
    });
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-3",
      title: "Text",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Text",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
      activeTab: "options",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
      label: "",
      value: text.options.tag,
      options: [{
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }],
      onChange: newVal => {
        var options = { ...text.options,
          tag: newVal
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_20__["default"], {
      obj: text,
      onChange: onChangeStyleText,
      onAdd: onAddStyleText,
      onRemove: onRemoveStyleText,
      onBulkAdd: onBulkAddText
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_19__["default"], {
      name: "css"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_css_library__WEBPACK_IMPORTED_MODULE_21__["default"], {
      blockId: blockId,
      obj: text,
      onChange: onPickCssLibraryText
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
      title: "Custom Style",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, "Please use following class selector to apply your custom CSS"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", {
      className: "font-bold"
    }, "Text "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("p", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("code", null, textSelector, '{}', " "))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.TextareaControl, {
      label: "Custom CSS",
      help: "Do not use 'style' tag",
      value: customCss,
      onChange: value => {
        setAttributes({
          customCss: value
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "px-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_mail_subscribe__WEBPACK_IMPORTED_MODULE_13__["default"], null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_contact_support__WEBPACK_IMPORTED_MODULE_14__["default"], {
      utm: {
        utm_source: 'BlockText',
        utm_campaign: 'PostGridCombo',
        utm_content: 'BlockOptions'
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_8__.RichText, (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, blockProps, {
      tagName: CustomTag,
      value: text.options.content,
      allowedFormats: ['core/bold', 'core/italic', 'core/link'],
      onChange: content => {
        var options = { ...text.options,
          content: content
        };
        setAttributes({
          text: { ...text,
            options: options
          }
        });
      },
      placeholder: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)('Start Writing...')
    })));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/blocks/wordpress-org/index.js":
/*!*******************************************!*\
  !*** ./src/blocks/wordpress-org/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_styles__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../components/styles */ "./src/components/styles/index.js");
/* harmony import */ var _components_css_library__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/css-library */ "./src/components/css-library/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
















var myStore = wp.data.select('postgrid-shop');
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_1__.registerBlockType)("post-grid/wordpress-org", {
  apiVersion: 2,
  title: "wordpress-org",
  icon: {
    // Specifying a background color to appear with the icon e.g.: in the inserter.
    background: '#fff',
    // Specifying a color for the icon (optional: if not set, a readable color will be automatically defined)
    foreground: '#fff',
    // Specifying an icon for the block
    src: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
      xmlns: "http://www.w3.org/2000/svg",
      viewBox: "0 0 36 36"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M17.53,16.56a1.07,1.07,0,0,0-1.06,1.06v7.93H2.12V11.2h7.93a1.06,1.06,0,0,0,0-2.12H1.81A1.81,1.81,0,0,0,0,10.89v15a1.81,1.81,0,0,0,1.81,1.81h15a1.81,1.81,0,0,0,1.81-1.81V17.62A1.06,1.06,0,0,0,17.53,16.56Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
      fill: "#1d4ed8",
      d: "M19,11.63l-3-3a1.07,1.07,0,0,0-1.5,0l-9,9a1.06,1.06,0,0,0-.31.75v3A1.07,1.07,0,0,0,6.3,22.43h3a1.06,1.06,0,0,0,.75-.31l9-9A1.07,1.07,0,0,0,19,11.63Zm-4.5,3L8.86,20.31H7.36v-1.5L13,13.14Zm2.25-2.25-.75.75-1.49-1.49.75-.75Z"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "24.85",
      cy: "25.36",
      r: "2.31"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("circle", {
      fill: "#1d4ed8",
      cx: "33.69",
      cy: "25.36",
      r: "2.31"
    }))
  },
  attributes: {
    elements: {
      "type": "object",
      "default": {
        items: [{
          id: 'name',
          label: "Plugin Name",
          prefix: 'Plugin Name: '
        }, {
          id: 'version',
          label: "Version",
          prefix: 'Version: '
        }]
      }
    },
    wrapper: {
      type: 'object',
      default: {
        options: {
          tag: 'ul',
          class: ''
        },
        styles: {}
      }
    },
    item: {
      type: 'object',
      default: {
        options: {
          class: 'item',
          tag: 'li'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    thumb: {
      type: 'object',
      default: {
        options: {
          class: 'thumb'
        },
        styles: {
          color: {
            Desktop: ''
          },
          backgroundColor: {
            Desktop: ''
          }
        }
      }
    },
    object: {
      type: 'object',
      default: {
        options: {
          type: 'plugin',
          // plugin, theme
          slug: 'post-grid' // 

        }
      }
    },
    blockId: {
      "type": "string",
      "default": ''
    },
    blockCssY: {
      "type": "object",
      "default": {
        items: {}
      }
    },
    customCss: {
      "type": "string",
      "default": ''
    }
  },
  supports: {
    "align": ["wide", "full"]
  },
  category: "post-grid",
  edit: function (props) {
    var attributes = props.attributes;
    var setAttributes = props.setAttributes;
    var clientId = props.clientId;
    var blockId = attributes.blockId;
    var blockCssY = attributes.blockCssY;
    var customCss = attributes.customCss;
    var object = attributes.object;
    var wrapper = attributes.wrapper;
    var item = attributes.item;
    var thumb = attributes.thumb;
    var elements = attributes.elements;
    var blockIdX = attributes.blockId ? attributes.blockId : 'pg' + clientId.split('-').pop();
    var blockClass = '.' + blockIdX;
    const wrapperSelector = blockClass;
    const itemSelector = blockClass + ' .item';
    const thumbSelector = blockClass + ' .thumb';
    const CustomTagWrapper = wrapper.options.tag == undefined ? 'ul' : `${wrapper.options.tag}`;
    const CustomTagItem = item.options.tag.length == undefined ? 'li' : `${item.options.tag}`;
    var [loading, seloading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Using the hook.

    var [debounce, setDebounce] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Using the hook.

    var [objectData, seobjectData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Using the hook.

    var breakPointX = myStore.getBreakPoint();
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      setAttributes({
        blockId: blockIdX
      });
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [clientId]);
    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      myStore.generateBlockCss(blockCssY.items, blockId, customCss);
    }, [blockCssY]);
    const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.useBlockProps)({
      className: ` ${blockId} pg-wordpress-org`
    });
    var pluginFields = {
      name: {
        id: 'name',
        label: "Plugin Name",
        prefix: 'Plugin Name: '
      },
      version: {
        id: 'version',
        label: "Version",
        prefix: 'Version:'
      },
      author: {
        id: 'author',
        label: "Author",
        prefix: 'Author'
      },
      author_profile: {
        id: 'author_profile',
        label: "Author Profile",
        prefix: 'Author Profile'
      },
      contributors: {
        id: 'contributors',
        label: "Contributors",
        prefix: 'Contributors',
        isLinked: true
      },
      requires: {
        id: 'requires',
        label: "Require WP Version",
        prefix: 'WP Version: '
      },
      tested: {
        id: 'tested',
        label: "Tested WP Version",
        prefix: 'WP Tested Version: '
      },
      requires_php: {
        id: 'requires_php',
        label: "Require PHP Version",
        prefix: 'PHP Version: '
      },
      requires_plugins: {
        id: 'requires_plugins',
        label: "Require Plugins",
        prefix: 'Require Plugins: '
      },
      rating: {
        id: 'rating',
        label: "Rating",
        prefix: 'Rating',
        type: 'star'
      },
      ratings: {
        id: 'ratings',
        label: "Ratings",
        prefix: 'Ratings',
        type: 'star'
      },
      num_ratings: {
        id: 'num_ratings',
        label: "Num Ratings",
        prefix: 'Num Ratings',
        type: 'star'
      },
      support_threads: {
        id: 'support_threads',
        label: "Support Threads",
        prefix: 'Support Threads'
      },
      support_threads_resolved: {
        id: 'support_threads_resolved',
        label: "Support Threads Resolved",
        prefix: 'Support Threads Resolved'
      },
      active_installs: {
        id: 'active_installs',
        label: "Active Install",
        prefix: 'Active Install: '
      },
      last_updated: {
        id: 'last_updated',
        label: "Last Update",
        prefix: 'Last Update: '
      },
      added: {
        id: 'added',
        label: "Creation Time",
        prefix: 'Creation Time: '
      },
      homepage: {
        id: 'homepage',
        label: "Homepage",
        prefix: 'Homepage:',
        isLinked: true,
        linkText: 'Homepage'
      },
      download_link: {
        id: 'download_link',
        label: "Download Link",
        prefix: 'Download Link',
        isLinked: true,
        linkText: 'Download'
      },
      tags: {
        id: 'tags',
        label: "Tags",
        prefix: 'Tags:'
      },
      banners: {
        id: 'banners',
        label: "Thumbnail",
        prefix: 'Thumbnail',
        size: "high",
        isLinked: false
      }
    };
    var themeFields = {
      name: {
        id: 'name',
        label: "Name",
        prefix: 'Theme Name: '
      },
      version: {
        id: 'version',
        label: "Version",
        prefix: 'Version:'
      },
      preview_url: {
        id: 'preview_url',
        label: "Preview URL",
        prefix: 'Preview URL',
        isLinked: true,
        linkText: 'Preview'
      },
      author: {
        id: 'author',
        label: "Author",
        prefix: 'Author'
      },
      screenshot_url: {
        id: 'screenshot_url',
        label: "Screenshot"
      },
      ratings: {
        id: 'ratings',
        label: "Ratings",
        prefix: 'Ratings'
      },
      rating: {
        id: 'rating',
        label: "Rating",
        prefix: 'Rating',
        type: 'star'
      },
      num_ratings: {
        id: 'num_ratings',
        label: "Number of Ratings"
      },
      reviews_url: {
        id: 'reviews_url',
        label: "Reviews URL",
        isLinked: true,
        linkText: 'Reviews'
      },
      last_updated: {
        id: 'last_updated',
        label: "Last Update",
        prefix: 'Last Update: '
      },
      creation_time: {
        id: 'creation_time',
        label: "Creation Time",
        prefix: 'Creation Time: '
      },
      homepage: {
        id: 'homepage',
        label: "Homepage",
        prefix: 'Homepage:',
        isLinked: true,
        linkText: 'Homepage'
      },
      tags: {
        id: 'tags',
        label: "Tags",
        prefix: 'Tags: '
      },
      download_link: {
        id: 'download_link',
        label: "Download Link",
        prefix: 'Download Link',
        isLinked: true,
        linkText: 'Download'
      },
      requires: {
        id: 'requires',
        label: "Require WP Version",
        prefix: 'WP Version: '
      },
      requires_php: {
        id: 'requires_php',
        label: "Require PHP Version",
        prefix: 'PHP Version: '
      },
      is_commercial: {
        id: 'is_commercial',
        label: "Is Commercial",
        prefix: 'Is Commercial'
      },
      external_support_url: {
        id: 'external_support_url',
        label: "External Support URL",
        prefix: 'External Support URL',
        isLinked: true,
        linkText: 'Support URL'
      },
      external_repository_url: {
        id: 'external_repository_url',
        label: "External Sepository URL",
        prefix: 'External Sepository URL',
        isLinked: true,
        linkText: 'Repository'
      }
    };
    var allFields = { ...pluginFields,
      ...themeFields
    };
    var objectTypes = {
      plugin: {
        label: 'Plugins',
        value: 'plugin'
      },
      theme: {
        label: 'Themes',
        value: 'theme'
      }
    };

    var RemoveQueryPram = function (_ref) {
      let {
        title,
        index
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-move"
      }, title));
    };

    function setUserField(option, index) {
      //var isExist = elements.items.find(x => x.label === option.label);
      //if (isExist == undefined) {
      //}
      var elementsX = elements.items.push(option);
      setAttributes({
        elements: {
          items: elements.items
        }
      });
    }

    (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
      seloading(true);
      var postData = {
        slug: object.options.slug,
        type: object.options.type
      };
      clearTimeout(debounce);
      debounce = setTimeout(() => {
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_5___default()({
          path: '/post-grid/v2/wordpress_org_data',
          method: 'POST',
          data: postData
        }).then(res => {
          seloading(false);
          console.log('res', res);

          if (res.data == undefined) {} else {
            //var data = JSON.parse(res.data);
            //console.log('data', data);
            seobjectData(res.data);
          }
        });
      }, 2000);
    }, [object.options.slug]);

    function onChangeStyleWrapper(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, wrapper);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleWrapper(sudoScource, key) {
      var object = myStore.deletePropertyDeep(wrapper, [sudoScource, key, breakPointX]);
      setAttributes({
        wrapper: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleWrapper(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, wrapper);
      var object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        wrapper: object
      });
    }

    function onResetWrapper(sudoScources) {
      let obj = Object.assign({}, wrapper);
      Object.entries(sudoScources).map(args => {
        var sudoScource = args[0];

        if (obj[sudoScource] == undefined) {} else {
          obj[sudoScource] = {};
          var elementSelector = myStore.getElementSelector(sudoScource, wrapperSelector);
          var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector]);
          setAttributes({
            blockCssY: {
              items: cssObject
            }
          });
        }
      });
      setAttributes({
        wrapper: obj
      });
    }

    function onBulkAddWrapper(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, wrapper);
      obj[sudoScource] = cssObj;
      setAttributes({
        wrapper: obj
      });
      var selector = myStore.getElementSelector(sudoScource, wrapperSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleThumb(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, thumb);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        thumb: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, thumbSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleThumb(sudoScource, key) {
      var object = myStore.deletePropertyDeep(thumb, [sudoScource, key, breakPointX]);
      setAttributes({
        thumb: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, thumbSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleThumb(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, thumb);
      var object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        thumb: object
      });
    }

    function onResetThumb(sudoScources) {
      let obj = Object.assign({}, thumb);
      Object.entries(sudoScources).map(args => {
        var sudoScource = args[0];

        if (obj[sudoScource] == undefined) {} else {
          obj[sudoScource] = {};
          var elementSelector = myStore.getElementSelector(sudoScource, thumbSelector);
          var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector]);
          setAttributes({
            blockCssY: {
              items: cssObject
            }
          });
        }
      });
      setAttributes({
        thumb: obj
      });
    }

    function onBulkAddThumb(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, thumb);
      obj[sudoScource] = cssObj;
      setAttributes({
        thumb: obj
      });
      var selector = myStore.getElementSelector(sudoScource, thumbSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    function onChangeStyleItem(sudoScource, newVal, attr) {
      var path = [sudoScource, attr, breakPointX];
      let obj = Object.assign({}, item);
      const object = myStore.updatePropertyDeep(obj, path, newVal);
      setAttributes({
        item: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(attr);

      if (blockCssY.items[elementSelector] == undefined) {
        blockCssY.items[elementSelector] = {};
      }

      var cssPath = [elementSelector, cssPropty, breakPointX];
      const cssItems = myStore.updatePropertyDeep(blockCssY.items, cssPath, newVal);
      setAttributes({
        blockCssY: {
          items: cssItems
        }
      });
    }

    function onRemoveStyleItem(sudoScource, key) {
      var object = myStore.deletePropertyDeep(item, [sudoScource, key, breakPointX]);
      setAttributes({
        item: object
      });
      var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
      var cssPropty = myStore.cssAttrParse(key);
      var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector, cssPropty, breakPointX]);
      setAttributes({
        blockCssY: {
          items: cssObject
        }
      });
    }

    function onAddStyleItem(sudoScource, key) {
      var path = [sudoScource, key, breakPointX];
      let obj = Object.assign({}, item);
      var object = myStore.addPropertyDeep(obj, path, '');
      setAttributes({
        item: object
      });
    }

    function onResetItem(sudoScources) {
      let obj = Object.assign({}, item);
      Object.entries(sudoScources).map(args => {
        var sudoScource = args[0];

        if (obj[sudoScource] == undefined) {} else {
          obj[sudoScource] = {};
          var elementSelector = myStore.getElementSelector(sudoScource, itemSelector);
          var cssObject = myStore.deletePropertyDeep(blockCssY.items, [elementSelector]);
          setAttributes({
            blockCssY: {
              items: cssObject
            }
          });
        }
      });
      setAttributes({
        item: obj
      });
    }

    function onBulkAddItem(sudoScource, cssObj) {
      // var path = [sudoScource, attr, breakPointX]
      let obj = Object.assign({}, item);
      obj[sudoScource] = cssObj;
      setAttributes({
        item: obj
      });
      var selector = myStore.getElementSelector(sudoScource, itemSelector);
      var stylesObj = {};
      Object.entries(cssObj).map(args => {
        var attr = args[0];
        var cssPropty = myStore.cssAttrParse(attr);

        if (stylesObj[selector] == undefined) {
          stylesObj[selector] = {};
        }

        if (stylesObj[selector][cssPropty] == undefined) {
          stylesObj[selector][cssPropty] = {};
        }

        stylesObj[selector][cssPropty] = args[1];
      });
      var cssItems = { ...blockCssY.items
      };
      var cssItemsX = { ...cssItems,
        ...stylesObj
      };
      setAttributes({
        blockCssY: {
          items: cssItemsX
        }
      });
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.InspectorControls, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-3",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Object Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: objectTypes,
      buttonTitle: objectTypes[object.options.type] == undefined ? 'Choose' : objectTypes[object.options.type].label,
      onChange: option => {
        var options = { ...object.options,
          type: option.value
        };
        setAttributes({
          object: {
            styles: object.styles,
            options: options
          }
        });
      },
      values: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Slug"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.__experimentalInputControl, {
      value: object.options.slug,
      onChange: newVal => {
        var options = { ...object.options,
          slug: newVal
        };
        setAttributes({
          object: { ...object,
            options: options
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, object.options.type == 'plugin' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Add Fields"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: pluginFields,
      buttonTitle: "Choose",
      onChange: setUserField,
      values: ""
    }))), object.options.type == 'theme' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Add Fields"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_11__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: themeFields,
      buttonTitle: "Choose",
      onChange: setUserField,
      values: ""
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(react_sortablejs__WEBPACK_IMPORTED_MODULE_6__.ReactSortable, {
      list: elements.items,
      setList: item => {
        setAttributes({
          elements: {
            items: item
          }
        });
      }
    }, elements.items.map((item, index) => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      key: item.id,
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelBody, {
      title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveQueryPram, {
        title: allFields[item.id] == undefined ? "" : allFields[item.id].label,
        index: index
      }),
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Button, {
      onClick: ev => {
        ev.preventDefault();
        ev.stopPropagation();
        var elementsX = elements.items.splice(index, 1);
        setAttributes({
          elements: {
            items: elements.items
          }
        });
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_12__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_13__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Prefix"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.__experimentalInputControl, {
      value: item.prefix,
      onChange: newVal => {
        elements.items[index].prefix = newVal;
        setAttributes({
          elements: {
            items: elements.items
          }
        });
      }
    })), (item.id == 'homepage' || item.id == 'download_link' || item.id == 'preview_url' || item.id == 'contributors') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "linkText"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.__experimentalInputControl, {
      value: item.linkText,
      onChange: newVal => {
        elements.items[index].linkText = newVal;
        setAttributes({
          elements: {
            items: elements.items
          }
        });
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.ToggleControl, {
      className: "my-3",
      label: "Is Linked?",
      help: elements.items[index].isLinked ? 'Link Enabled' : 'Link Disabled',
      checked: elements.items[index].isLinked ? true : false,
      onChange: e => {
        elements.items[index].isLinked = elements.items[index].isLinked ? false : true;
        setAttributes({
          elements: {
            items: elements.items
          }
        });
      }
    }))))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelBody, {
      title: "Wrapper",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_7__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_14__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_15__["default"],
        className: 'tab-style'
      }, {
        name: 'css',
        title: 'CSS Library',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_15__["default"],
        className: 'tab-css'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_8__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Wrapper Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.SelectControl, {
      label: "",
      value: wrapper.options.tag,
      options: [{
        label: 'No Wrapper',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }, {
        label: 'ul',
        value: 'ul'
      }, {
        label: 'ol',
        value: 'ol'
      }],
      onChange: newVal => {
        var options = { ...wrapper.options,
          tag: newVal
        };
        setAttributes({
          wrapper: {
            styles: wrapper.styles,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_8__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_9__["default"], {
      blockId: blockId,
      obj: wrapper,
      onChange: onChangeStyleWrapper,
      onAdd: onAddStyleWrapper,
      onRemove: onRemoveStyleWrapper,
      onBulkAdd: onBulkAddWrapper,
      onReset: onResetWrapper
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelBody, {
      title: "Thumb",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_7__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_14__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_15__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_8__["default"], {
      name: "options"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_8__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_9__["default"], {
      blockId: blockId,
      obj: thumb,
      onChange: onChangeStyleThumb,
      onAdd: onAddStyleThumb,
      onRemove: onRemoveStyleThumb,
      onBulkAdd: onBulkAddThumb,
      onReset: onResetThumb
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelBody, {
      title: "item",
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_7__["default"], {
      activeTab: "styles",
      orientation: "horizontal",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: 'options',
        title: 'Options',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_14__["default"],
        className: 'tab-settings'
      }, {
        name: 'styles',
        title: 'Styles',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_15__["default"],
        className: 'tab-style'
      }]
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_8__["default"], {
      name: "options"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "item Tag"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.SelectControl, {
      label: "",
      value: item.options.tag,
      options: [{
        label: 'No item',
        value: ''
      }, {
        label: 'H1',
        value: 'h1'
      }, {
        label: 'H2',
        value: 'h2'
      }, {
        label: 'H3',
        value: 'h3'
      }, {
        label: 'H4',
        value: 'h4'
      }, {
        label: 'H5',
        value: 'h5'
      }, {
        label: 'H6',
        value: 'h6'
      }, {
        label: 'SPAN',
        value: 'span'
      }, {
        label: 'DIV',
        value: 'div'
      }, {
        label: 'P',
        value: 'p'
      }, {
        label: 'ul',
        value: 'ul'
      }, {
        label: 'li',
        value: 'li'
      }],
      onChange: newVal => {
        var options = { ...item.options,
          tag: newVal
        };
        setAttributes({
          item: {
            styles: item.styles,
            options: options
          }
        });
      }
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_8__["default"], {
      name: "styles"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_styles__WEBPACK_IMPORTED_MODULE_9__["default"], {
      blockId: blockId,
      obj: item,
      onChange: onChangeStyleItem,
      onAdd: onAddStyleItem,
      onRemove: onRemoveStyleItem,
      onBulkAdd: onBulkAddItem,
      onReset: onResetItem
    }))))), loading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", blockProps, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Spinner, null)), loading == false && objectData != null && object.options.type == 'plugin' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagWrapper, blockProps, elements.items.map(x => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.id == 'name' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.name), " "), x.id == 'version' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.version), " "), x.id == 'author' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.author), " "), x.id == 'author_profile' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.author_profile), " "), x.id == 'contributors' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ul", null, objectData.contributors != null && Object.entries(objectData.contributors).map((x, i) => {
        var data = x[1];
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
          href: data.profile
        }, data.display_name));
      })))), x.id == 'tested' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.tested), " "), x.id == 'requires' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.requires), " "), x.id == 'requires_php' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.requires_php), " "), x.id == 'requires_plugins' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.requires_plugins), " "), x.id == 'rating' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.rating), " "), x.id == 'ratings' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, Object.entries(objectData.ratings).map((x, i) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", null, x[0], ": ", x[1]);
      }))), x.id == 'num_ratings' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.num_ratings), " "), x.id == 'support_threads' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.support_threads), " "), x.id == 'support_threads_resolved' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.support_threads_resolved), " "), x.id == 'active_installs' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.active_installs), " "), x.id == 'last_updated' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.last_updated), " "), x.id == 'added' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, objectData.added), " "), x.id == 'homepage' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: objectData.homepage
      }, x.linkText), !x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, objectData.homepage))), x.id == 'download_link' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: objectData.download_link
      }, x.linkText), !x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, objectData.download_link))), x.id == 'banners' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: thumb.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
        src: objectData.banners == undefined ? "" : objectData.banners.high,
        alt: objectData.name
      })), x.id == 'tags' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, x.prefix), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, Object.entries(objectData.tags).map((x, i) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", null, " ", x[1]);
      }))));
    })), loading == false && objectData != null && object.options.type == 'theme' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagWrapper, blockProps, elements.items.map(x => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.id == 'name' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.name), x.id == 'version' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.version), x.id == 'is_commercial' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, objectData.is_commercial && "Yes", !objectData.is_commercial && "No"), x.id == 'preview_url' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: objectData.preview_url
      }, x.linkText), !x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, objectData.preview_url)), x.id == 'author' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.author), x.id == 'screenshot_url' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: objectData.screenshot_url
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
        src: objectData.screenshot_url == undefined ? "" : objectData.screenshot_url,
        alt: objectData.name
      })), !x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
        src: objectData.screenshot_url == undefined ? "" : objectData.screenshot_url,
        alt: objectData.name
      })), x.id == 'ratings' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", Object.entries(objectData.ratings).map((x, i) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", null, i + 1, " : ", x);
      })), x.id == 'rating' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.rating), x.id == 'num_ratings' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.num_ratings), x.id == 'reviews_url' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: objectData.reviews_url
      }, x.linkText), !x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, objectData.reviews_url)), x.id == 'last_updated' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.last_updated), x.id == 'creation_time' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.creation_time), x.id == 'homepage' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: objectData.homepage
      }, x.linkText), !x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, objectData.homepage)), x.id == 'tags' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", Object.entries(objectData.tags).map((x, i) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", null, " ", x[1]);
      })), x.id == 'download_link' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: objectData.download_link
      }, x.linkText), !x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, objectData.download_link)), x.id == 'requires' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.requires), x.id == 'requires_php' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.requires_php), x.id == 'is_commercial' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, " ", objectData.is_commercial), x.id == 'external_support_url' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: objectData.external_support_url
      }, x.linkText), !x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, objectData.external_support_url)), x.id == 'external_repository_url' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(CustomTagItem, {
        className: item.options.class
      }, x.prefix, x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        href: objectData.external_repository_url
      }, x.linkText), !x.isLinked && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, objectData.external_repository_url)));
    })));
  },
  save: function (props) {
    // to make a truly dynamic block, we're handling front end by render_callback under index.php file
    return null;
  }
});

/***/ }),

/***/ "./src/breakpoints.js":
/*!****************************!*\
  !*** ./src/breakpoints.js ***!
  \****************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
// const breakPoints = {
//   sm: { name: 'Small', id: 'sm', icon: '<span class="icon-mobile-phone"></span>', min: 0, max: 640 },
//   md: { name: 'Medium', id: 'md', icon: '<span class="icon-tablet"></span>', min: 641, max: 768 },
//   lg: { name: 'Large', id: 'lg', icon: '<span class="icon-laptop"></span>', min: 769, max: 1024 },
//   xl: { name: 'Extra-Large', id: 'xl', icon: '<span class="icon-desktop"></span>', min: 1025, max: 1280 },
//   xl2: { name: '2 Extra-Large', id: 'xl2', icon: '<span class="icon-television"></span>', min: 1281, max: 1536 }
// };
const breakPoints = {
  Mobile: {
    name: 'Mobile',
    id: 'Mobile',
    icon: '<span class="icon-mobile-phone"></span>',
    min: 0,
    max: 767
  },
  Tablet: {
    name: 'Tablet',
    id: 'Tablet',
    icon: '<span class="icon-tablet"></span>',
    min: 768,
    max: 991
  },
  Desktop: {
    name: 'Desktop',
    id: 'Desktop',
    icon: '<span class="icon-desktop"></span>',
    min: 992,
    max: 1280
  }
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (breakPoints);

/***/ }),

/***/ "./src/colors-presets.js":
/*!*******************************!*\
  !*** ./src/colors-presets.js ***!
  \*******************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
const colorsPresets = [{
  name: '9DD6DF',
  color: '#9DD6DF'
}, {
  name: '18978F',
  color: '#18978F'
}, {
  name: 'A084CF',
  color: '#A084CF'
}, {
  name: 'DFBB9D',
  color: '#DFBB9D'
}, {
  name: '774360',
  color: '#774360'
}, {
  name: '3AB0FF',
  color: '#3AB0FF'
}, {
  name: '51557E',
  color: '#51557E'
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (colorsPresets);

/***/ }),

/***/ "./src/components/breakpoint-switch/index.js":
/*!***************************************************!*\
  !*** ./src/components/breakpoint-switch/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;


class breakpointSwitch extends Component {
  render() {
    const {
      position,
      variant,
      iconList,
      //[{"label":"Select..","icon":"","value":""}]
      buttonTitle,
      onChange,
      activeIcon,
      value
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "inline-block"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: position,
      renderToggle: _ref => {
        let {
          isOpen,
          onToggle
        } = _ref;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: "p-1 px-2 cursor-pointer",
          title: buttonTitle,
          variant: variant,
          onClick: onToggle,
          "aria-expanded": isOpen
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RawHTML, {
          className: "text-sm "
        }, activeIcon));
      },
      renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: ""
      }, iconList.map((x, index) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: ' text-lg px-2 font-bold border-b inline-block hover:bg-blue-400 hover:text-white cursor-pointer',
          onClick: ev => {
            onChange(x, index);
          }
        }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
          class: "icon-close"
        })), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RawHTML, null, x.icon));
      }))
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (breakpointSwitch);

/***/ }),

/***/ "./src/components/breakpoint-toggle/index.js":
/*!***************************************************!*\
  !*** ./src/components/breakpoint-toggle/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");


const {
  Component,
  RawHTML
} = wp.element;




var myStore = wp.data.select('postgrid-shop');

class BreakpointToggle extends Component {
  constructor() {
    super(...arguments);

    (0,_babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__["default"])(this, "state", {
      breakPointX: myStore.getBreakPoint()
    });

    (0,_babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_0__["default"])(this, "setBreakPoint", x => {
      var asdsdsd = wp.data.dispatch('postgrid-shop').setBreakPoint(x.value);
      this.setState({
        breakPointX: x.value
      });
    });
  }

  render() {
    var that = this;
    const {
      position,
      variant,
      iconList,
      //[{"label":"Select..","icon":"","value":""}]
      buttonTitle,
      onChange,
      activeIcon,
      value
    } = this.props;

    function onChangeX(x) {}

    var breakPointList = [];

    for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_4__["default"]) {
      var item = _breakpoints__WEBPACK_IMPORTED_MODULE_4__["default"][x];
      breakPointList.push({
        label: item.name,
        icon: item.icon,
        value: item.id
      });
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, this.state.breakPointX, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_3__["default"], {
      position: "bottom",
      variant: "secondary",
      iconList: breakPointList,
      buttonTitle: "Break Point Switch",
      onChange: onChange,
      activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_4__["default"][this.state.breakPointX].icon,
      value: value
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BreakpointToggle);

/***/ }),

/***/ "./src/components/contact-support/index.js":
/*!*************************************************!*\
  !*** ./src/components/contact-support/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;





class PGContactSupport extends Component {
  render() {
    var {
      utm
    } = this.props;

    function ContactHtml(props) {
      var utmPrams = new URLSearchParams(utm).toString();
      var docUrl = 'https://getpostgrid.com/documentations/?' + utmPrams + '&utm_medium=Docsbutton';
      var tutsUrl = 'https://www.youtube.com/playlist?list=PL0QP7T2SN94bpTVghETSePuVvRROpuEW6';
      var supportCreate = 'https://pickplugins.com/create-support-ticket/?' + utmPrams + '&utm_medium=createSupportButton';
      var reviewUrl = 'https://wordpress.org/support/plugin/post-grid/reviews/#new-post';
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "grid grid-cols-2 gap-2 my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: ""
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        href: docUrl,
        className: "bg-blue-600 hover:text-white font-bold text-[16px] px-5 py-2 block text-center text-white rounded"
      }, "Docs")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: ""
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        href: tutsUrl,
        className: "bg-blue-600 hover:text-white font-bold text-[16px] px-5 py-2 block text-center text-white rounded"
      }, "Tutorials")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "col-span-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        href: supportCreate,
        className: "bg-blue-600 hover:text-white font-bold text-[16px] px-5 py-2 block text-center text-white rounded"
      }, "Create Support Ticket")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "col-span-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
        target: "_blank",
        href: reviewUrl,
        className: "bg-amber-500 hover:text-white font-bold text-[16px] px-5 py-2 block text-center text-white rounded"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        class: "dashicons dashicons-star-filled"
      }), " Write Your Reviews")));
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(ContactHtml, {
      utm: utm
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGContactSupport);

/***/ }),

/***/ "./src/components/css-align-content/index.js":
/*!***************************************************!*\
  !*** ./src/components/css-align-content/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    stretch: {
      "label": "stretch",
      "value": "stretch"
    },
    center: {
      "label": "center",
      "value": "center"
    },
    'flex-start': {
      "label": "flex start	",
      "value": "flex-start"
    },
    'flex-end': {
      "label": "flex end	",
      "value": "flex-end"
    },
    'space-between': {
      "label": "space between",
      "value": "space-between"
    },
    'space-around': {
      "label": "space around",
      "value": "space-around"
    },
    'space-evenly': {
      "label": "space evenly",
      "value": "space-evenly"
    },
    start: {
      "label": "start",
      "value": "start"
    },
    end: {
      "label": "end",
      "value": "end"
    },
    normal: {
      "label": "normal",
      "value": "normal"
    },
    start: {
      "label": "start",
      "value": "start"
    },
    baseline: {
      "label": "baseline",
      "value": "baseline"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Align Content",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1]; // console.log('x value', x)

      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'alignContent');
          } else {
            props.onChange(x.value, 'alignContent');
          } // props.onChange(x.value, 'alignContent');

        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      console.log(align);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'alignContent');
      } else {
        props.onChange(align + ' !important', 'alignContent');
      }
    }
  }));
}

class PGcssAlignContent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssAlignContent);

/***/ }),

/***/ "./src/components/css-align-items/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-align-items/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    stretch: {
      "label": "stretch",
      "value": "stretch"
    },
    center: {
      "label": "center",
      "value": "center"
    },
    'flex-start': {
      "label": "flex start	",
      "value": "flex-start"
    },
    'flex-end': {
      "label": "flex end	",
      "value": "flex-end"
    },
    'space-between': {
      "label": "space between",
      "value": "space-between"
    },
    'space-around': {
      "label": "space around",
      "value": "space-around"
    },
    'space-evenly': {
      "label": "space evenly",
      "value": "space-evenly"
    },
    start: {
      "label": "start",
      "value": "start"
    },
    end: {
      "label": "end",
      "value": "end"
    },
    normal: {
      "label": "normal",
      "value": "normal"
    },
    start: {
      "label": "start",
      "value": "start"
    },
    baseline: {
      "label": "baseline",
      "value": "baseline"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Align Items",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // props.onChange(x.value, 'alignItems');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'alignItems');
          } else {
            props.onChange(x.value, 'alignItems');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'alignItems');
      } else {
        props.onChange(align + ' !important', 'alignItems');
      }
    }
  }));
}

class PGcssAlignItems extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssAlignItems);

/***/ }),

/***/ "./src/components/css-align-self/index.js":
/*!************************************************!*\
  !*** ./src/components/css-align-self/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    auto: {
      "label": "auto",
      "value": "auto"
    },
    stretch: {
      "label": "Stretch",
      "value": "stretch"
    },
    center: {
      "label": "Center",
      "value": "center"
    },
    'flex-start': {
      "label": "Flex start	",
      "value": "flex-start"
    },
    'flex-end': {
      "label": "Flex end	",
      "value": "flex-end"
    },
    normal: {
      "label": "normal",
      "value": "normal"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    'self-end': {
      "label": "self-end",
      "value": "self-end"
    },
    ' self-start': {
      "label": " self-start",
      "value": " self-start"
    },
    start: {
      "label": "start",
      "value": "start"
    },
    end: {
      "label": "end",
      "value": "end"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Align Self",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'alignSelf');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'alignSelf');
          } else {
            props.onChange(x.value, 'alignSelf');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'alignSelf');
      } else {
        props.onChange(align + ' !important', 'alignSelf');
      }
    }
  }));
}

class PGcssAlignSelf extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssAlignSelf);

/***/ }),

/***/ "./src/components/css-aspect-ratio/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-aspect-ratio/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? 'auto' : props.val;
  var valX = valZ != 'auto' ? valZ.split("/")[0] : 1;
  var valY = valZ != 'auto' ? valZ.split("/")[1] : 1;
  const [isAuto, setisAuto] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes("auto") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isAuto ? 'Auto' : 'Auto?',
    checked: isAuto,
    onChange: arg => {
      setisAuto(isAuto => !isAuto);
      props.onChange('auto', 'aspectRatio');
    }
  }), !isAuto && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: valX,
    type: "number",
    onChange: newVal => {
      props.onChange(newVal + '/' + valY, 'aspectRatio');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "mx-2"
  }, " / "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: valY,
    type: "number",
    onChange: newVal => {
      props.onChange(valX + '/' + newVal, 'aspectRatio');
    }
  })));
}

class PGcssAspectRatio extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssAspectRatio);

/***/ }),

/***/ "./src/components/css-backdrop-filter/index.js":
/*!*****************************************************!*\
  !*** ./src/components/css-backdrop-filter/index.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");

const {
  Component
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val != undefined ? props.val.split(" ") : [];
  const [valArgs, setvalArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]);

  function addFilter(option, index) {
    var isExist = valArgs.find(x => x.id === option.value);

    if (isExist == undefined) {
      var obj = {};
      obj['id'] = option.value;
      obj['val'] = option.val;
      obj['unit'] = option.unit;
      valArgs.push(obj);
      var str = '';
      valArgs.map(x => {
        str += x.id + '(' + x.val + x.unit + ') ';
      });
      props.onChange(str, 'backdropFilter');
    }
  }

  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    var filtered = valParts.filter(Boolean);
    var res = filtered.map(x => {
      if (x.length != 0) {
        var argVal = x != undefined ? x.match(/-?\d+/g)[0] : 1;
        var argId = x != undefined ? x.match(/[a-zA-Z]+/g)[0] : '';
        return {
          id: argId,
          val: argVal
        };
      }
    });
    setvalArgs(res);
  }, [props.val]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {//onChange('contrast(200%) brightness(150%) blur(10%)', 'filter');
  }, [valArgs]);
  const [filterArgs, setfilterArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    blur: {
      label: 'Blur',
      value: 'blur',
      val: '1',
      unit: 'px'
    },
    brightness: {
      label: 'Brightness',
      value: 'brightness',
      val: '10',
      unit: '%'
    },
    contrast: {
      label: 'Contrast',
      value: 'contrast',
      val: '10',
      unit: '%'
    },
    grayscale: {
      label: 'Grayscale',
      value: 'grayscale',
      val: '10',
      unit: '%'
    },
    'hue-rotate': {
      label: 'Hue-rotate',
      value: 'hue-rotate',
      val: '10',
      unit: 'deg'
    },
    invert: {
      label: 'Invert',
      value: 'invert',
      val: '10',
      unit: '%'
    },
    opacity: {
      label: 'Opacity',
      value: 'opacity',
      val: '10',
      unit: '%'
    },
    saturate: {
      label: 'Saturate',
      value: 'saturate',
      val: '10',
      unit: '%'
    },
    sepia: {
      label: 'Sepia',
      value: 'sepia',
      val: '10',
      unit: '%'
    }
  });
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_2__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: filterArgs,
    buttonTitle: "Add Filter",
    onChange: addFilter,
    values: ""
  })), valArgs != undefined && valArgs.map((arg, i) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex my-3 items-center justify-between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, filterArgs[arg.id].label), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.val,
      type: "number",
      min: 0,
      max: 100,
      onChange: newVal => {
        valArgs[i].val = newVal; // setvalArgs(valArgs);

        var str = '';
        valArgs.map(x => {
          str += x.id + '(' + x.val + x.unit + ') ';
        });
        props.onChange(str, 'backdropFilter');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "hover:bg-red-500 bg-red-400 text-white ml-1 inline-block p-1 cursor-pointer",
      onClick: ev => {
        valArgs.splice(i, 1);
        setvalArgs(valArgs);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "dashicons dashicons-no-alt"
    }))));
  }));
}

class PGcssBackdropFilter extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackdropFilter);

/***/ }),

/***/ "./src/components/css-backface-visibility/index.js":
/*!*********************************************************!*\
  !*** ./src/components/css-backface-visibility/index.js ***!
  \*********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    visible: {
      "label": "Visible",
      "value": "visible"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'backfaceVisibility');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'backfaceVisibility');
          } else {
            props.onChange(x.value, 'backfaceVisibility');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'backfaceVisibility');
      } else {
        props.onChange(align + ' !important', 'backfaceVisibility');
      }
    }
  }));
}

class PGcssBackfaceVisibility extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackfaceVisibility);

/***/ }),

/***/ "./src/components/css-background-attachment/index.js":
/*!***********************************************************!*\
  !*** ./src/components/css-background-attachment/index.js ***!
  \***********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    scroll: {
      "label": "Scroll",
      "value": "scroll"
    },
    fixed: {
      "label": "Fixed",
      "value": "fixed"
    },
    local: {
      "label": "Local",
      "value": "local"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Background Attachment",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'backgroundAttachment');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'backgroundAttachment');
          } else {
            props.onChange(x.value, 'backgroundAttachment');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'backgroundAttachment');
      } else {
        props.onChange(align + ' !important', 'backgroundAttachment');
      }
    }
  }));
}

class PGcssBackgroundAttachment extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundAttachment);

/***/ }),

/***/ "./src/components/css-background-blend-mode/index.js":
/*!***********************************************************!*\
  !*** ./src/components/css-background-blend-mode/index.js ***!
  \***********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    normal: {
      "label": "Normal",
      "value": "normal"
    },
    multiply: {
      "label": "Multiply",
      "value": "multiply"
    },
    screen: {
      "label": "Screen",
      "value": "screen"
    },
    overlay: {
      "label": "Overlay",
      "value": "overlay"
    },
    darken: {
      "label": "Darken",
      "value": "darken"
    },
    lighten: {
      "label": "Lighten",
      "value": "lighten"
    },
    'color-dodge': {
      "label": "Color dodge",
      "value": "color-dodge"
    },
    saturation: {
      "label": "Saturation",
      "value": "saturation"
    },
    color: {
      "label": "Color",
      "value": "color"
    },
    luminosity: {
      "label": "Luminosity",
      "value": "luminosity"
    },
    exclusion: {
      "label": "exclusion",
      "value": "exclusion"
    },
    hue: {
      "label": "hue",
      "value": "hue"
    },
    'color-burn': {
      "label": "color-burn",
      "value": "color-burn"
    },
    'difference': {
      "label": "difference",
      "value": "difference"
    },
    'hard-light': {
      "label": "hard-light",
      "value": "hard-light"
    },
    'soft-light': {
      "label": "soft-light",
      "value": "soft-light"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Background Blend Mode",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'backgroundBlendMode');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'backgroundBlendMode');
          } else {
            props.onChange(x.value, 'backgroundBlendMode');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'backgroundBlendMode');
      } else {
        props.onChange(align + ' !important', 'backgroundBlendMode');
      }
    }
  }));
}

class PGcssBackgroundBlendMode extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundBlendMode);

/***/ }),

/***/ "./src/components/css-background-clip/index.js":
/*!*****************************************************!*\
  !*** ./src/components/css-background-clip/index.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    'border-box': {
      "label": "Border box",
      "value": "border-box"
    },
    'padding-box': {
      "label": "Padding box",
      "value": "padding-box"
    },
    'content-box': {
      "label": "Content box",
      "value": "content-box"
    },
    'revert-layer': {
      "label": "revert-layer",
      "value": "revert-layer"
    },
    text: {
      "label": "text",
      "value": "text"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Background Blend Mode",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'backgroundClip');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'backgroundClip');
          } else {
            props.onChange(x.value, 'backgroundClip');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'backgroundClip');
      } else {
        props.onChange(align + ' !important', 'backgroundClip');
      }
    }
  }));
}

class PGcssBackgroundClip extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundClip);

/***/ }),

/***/ "./src/components/css-background-color/index.js":
/*!******************************************************!*\
  !*** ./src/components/css-background-color/index.js ***!
  \******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [val, setval] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
    position: "bottom right"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "p-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    label: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      console.log(valArgs);
      console.log(isImportant);
      console.log(val);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(val, 'backgroundColor');
      } else {
        props.onChange(val + ' !important', 'backgroundColor');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ColorPalette, {
    value: val,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      //props.onChange(newVal, 'backgroundColor');
      console.log(valArgs);
      console.log(isImportant);
      console.log(val);
      setval(newVal);

      if (isImportant) {
        props.onChange(newVal + ' !important', 'backgroundColor');
      } else {
        props.onChange(newVal, 'backgroundColor');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Global Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
    label: "",
    value: val,
    options: [{
      label: 'Choose',
      value: ''
    }, {
      label: 'Inherit',
      value: 'inherit'
    }, {
      label: 'Initial',
      value: 'initial'
    }, {
      label: 'Revert',
      value: 'revert'
    }, {
      label: 'Revert-layer',
      value: 'revert-layer'
    }, {
      label: 'Unset',
      value: 'unset'
    }],
    onChange: newVal => {
      setval(newVal);

      if (isImportant) {
        props.onChange(newVal + ' !important', 'backgroundColor');
      } else {
        props.onChange(newVal, 'backgroundColor');
      }
    }
  })))));
}

class PGcssBackgroundColor extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      enableAlpha,
      onChange,
      label
    } = this.props;
    console.log(val);
    var colorVal = val.replace(' !important', '');
    var placeholderStyle = {
      backgroundImage: 'repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0),repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0)',
      backgroundPosition: '0 0,25px 25px',
      backgroundSize: '50px 50px',
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    var defaultbtnStyle = {
      backgroundImage: 'repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0),repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0)',
      backgroundPosition: '0 0,25px 25px',
      backgroundSize: '50px 50px',
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    var btnStyle = {
      backgroundColor: val,
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "relative h-10",
      style: placeholderStyle
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "absolute w-full  h-full top-0 left-0 text-center",
      style: btnStyle,
      onClick: this.handleToggleClick
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "w-full text-center left-0 top-1/2 -translate-y-1/2\t absolute"
    }, val == undefined ? 'Set Color' : colorVal)))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      enableAlpha: enableAlpha,
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundColor);

/***/ }),

/***/ "./src/components/css-background-image/index.js":
/*!******************************************************!*\
  !*** ./src/components/css-background-image/index.js ***!
  \******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");

const {
  Component,
  RawHTML
} = wp.element;









function Html(props) {
  if (!props.warn) {
    return null;
  }

  var typeArgs = {
    url: {
      label: 'Image URL',
      id: 'url'
    },
    //conicGradient: { label: 'Conic Gradient', id: 'conicGradient' },
    linearGradient: {
      label: 'Linear Gradient',
      id: 'linearGradient'
    },
    radialGradient: {
      label: 'Radial Gradient',
      id: 'radialGradient'
    } // repeatingConicGradient: { label: 'Repeating Conic Gradient', id: 'repeatingConicGradient' },
    // repeatingLinearGradient: { label: 'Repeating Linear Gradient', id: 'repeatingLinearGradient' },
    // repeatingRadialGradient: { label: 'Repeating Radial Gradient', id: 'repeatingRadialGradient' },

  };
  var valX = props.val == undefined || props.val == null || props.val.length == 0 ? '' : props.val;
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valX.split(",  ").filter(n => n));

  var RemoveQueryPram = function (_ref) {
    let {
      index,
      arg
    } = _ref;
    var typeName = '';

    if (arg.includes("url")) {
      typeName = 'URL';
    } else if (arg.includes("conic-gradient")) {
      typeName = 'Conic Gradient';
    } else if (arg.includes("linear-gradient")) {
      typeName = 'Linear Gradient';
    } else if (arg.includes("radial-gradient")) {
      typeName = 'Radial Gradient';
    } else if (arg.includes("repeating-conic-gradient")) {
      typeName = 'R Conic Gradient';
    } else if (arg.includes("repeating-linear-gradient")) {
      typeName = 'R Linear Gradient';
    } else if (arg.includes("repeating-radial-gradient")) {
      typeName = 'R Radial Gradient';
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
      onClick: ev => {
        valArgs.splice(index, 1);
        var ssdsd = valArgs.concat([]);
        setValArgs(ssdsd);
        var valString = ssdsd.join(',  ');
        props.onChange(valString, 'backgroundImage');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "mx-2"
    }, typeName.length == 0 ? '#' + index : typeName));
  };

  const ALLOWED_MEDIA_TYPES = ['image'];
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_3__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: typeArgs,
    buttonTitle: "Add",
    onChange: (option, index) => {
      if (option.id == 'url') {
        var dsdsf = valArgs.concat('url()');
      } else if (option.id == 'linearGradient') {
        var dsdsf = valArgs.concat("linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)");
      } else if (option.id == 'radialGradient') {
        var dsdsf = valArgs.concat("radial-gradient(#12c2e9 0%,#c471ed 50%,#f64f59 100%)");
      } else if (option.id == 'conicGradient') {
        var dsdsf = valArgs.concat("conic-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)");
      }

      setValArgs(dsdsf);
      var valString = valArgs.join(',  ');
      props.onChange(valString, 'backgroundImage');
    },
    values: ""
  })), valArgs.length != 0 && valArgs.map((x, index) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
      initialOpen: false,
      title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveQueryPram, {
        index: index,
        arg: x
      })
    }, x.includes("url") && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-3"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
      src: x.replace('url(', '').replace(')', ''),
      alt: ""
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      className: "mr-2",
      value: x.replace('url(', '').replace(')', ''),
      placeholder: "Image URL",
      onChange: newVal => {
        valArgs[index] = 'url(' + newVal + ')';
        setValArgs(valArgs);
        var valString = valArgs.join(',  ');
        props.onChange(valString, 'backgroundImage');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.MediaUploadCheck, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.MediaUpload, {
      class: "bg-blue-500",
      onSelect: media => {
        // media.id
        valArgs[index] = 'url(' + media.url + ')';
        setValArgs(valArgs);
        var valString = valArgs.join(',  ');
        props.onChange(valString, 'backgroundImage');
      },
      onClose: () => {},
      allowedTypes: ALLOWED_MEDIA_TYPES,
      render: _ref2 => {
        let {
          open
        } = _ref2;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          className: "my-3 bg-blue-500 text-white border border-solid border-gray-300 text-center w-full",
          onClick: open
        }, "Open Media Library");
      }
    }))), !x.includes("url") && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.GradientPicker, {
      value: x == null || x == undefined ? null : x,
      onChange: currentGradient => {
        console.log(currentGradient);

        if (currentGradient == undefined) {
          valArgs.splice(index, 1);
          var ssdsd = valArgs.concat([]);
          setValArgs(ssdsd);
          var valString = ssdsd.join(',  ');
        } else {
          valArgs[index] = currentGradient;
          setValArgs(valArgs);
          var valString = valArgs.join(',  ');
        }

        console.log(valString);
        props.onChange(valString, 'backgroundImage');
      },
      gradients: [{
        name: 'JShine',
        gradient: 'linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)',
        slug: 'jshine'
      }, {
        name: 'Moonlit Asteroid',
        gradient: 'linear-gradient(135deg,#0F2027 0%, #203A43 0%, #2c5364 100%)',
        slug: 'moonlit-asteroid'
      }, {
        name: 'Rastafarie',
        gradient: 'linear-gradient(135deg,#1E9600 0%, #FFF200 0%, #FF0000 100%)',
        slug: 'rastafari'
      }]
    }));
  }));
}

class PGcssBackgroundImage extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundImage);

/***/ }),

/***/ "./src/components/css-background-origin/index.js":
/*!*******************************************************!*\
  !*** ./src/components/css-background-origin/index.js ***!
  \*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    'border-box': {
      "label": "border-box",
      "value": "border-box"
    },
    'padding-box': {
      "label": "padding-box",
      "value": "padding-box"
    },
    'content-box': {
      "label": "content-box",
      "value": "content-box"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Background Blend Mode",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'backgroundOrigin');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'backgroundOrigin');
          } else {
            props.onChange(x.value, 'backgroundOrigin');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'backgroundOrigin');
      } else {
        props.onChange(align + ' !important', 'backgroundOrigin');
      }
    }
  }));
}

class PGcssBackgroundOrigin extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundOrigin);

/***/ }),

/***/ "./src/components/css-background-position/index.js":
/*!*********************************************************!*\
  !*** ./src/components/css-background-position/index.js ***!
  \*********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = [{
    label: 'left top',
    value: 'left top'
  }, {
    label: 'left center',
    value: 'left center'
  }, {
    label: 'left bottom',
    value: 'left bottom'
  }, {
    label: 'right top',
    value: 'right top'
  }, {
    label: 'right center',
    value: 'right center'
  }, {
    label: 'right bottom',
    value: 'right bottom'
  }, {
    label: 'center top',
    value: 'center top'
  }, {
    label: 'center center',
    value: 'center center'
  }, {
    label: 'center bottom',
    value: 'center bottom'
  }, {
    label: "inherit",
    value: "inherit"
  }, {
    label: "initial",
    value: "initial"
  }, {
    label: "revert",
    value: "revert"
  }, {
    label: "unset",
    value: "unset"
  }];
  const [isCustom, setisCustom] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.match(/-?\d+/g) == null ? false : true);
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [position, setposition] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.includes("!important") ? true : false);
  const [ValX, setValX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0] == undefined || valArgs[0].match(/-?\d+/g) == null ? 0 : valArgs[0].match(/-?\d+/g)[0]);
  const [valUnitX, setvalUnitX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0] == undefined || valArgs[0].match(/[a-zA-Z%]+/g) == null ? 'px' : valArgs[0].match(/[a-zA-Z%]+/g)[0]);
  const [ValY, setValY] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined || valArgs[1].match(/-?\d+/g) == null ? 0 : valArgs[1].match(/-?\d+/g)[0]);
  const [valUnitY, setvalUnitY] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined || valArgs[1].match(/[a-zA-Z%]+/g) == null ? 'px' : valArgs[1].match(/[a-zA-Z%]+/g)[0]); // var ValX = (valArgs[0] == undefined || valArgs[0].match(/-?\d+/g) == null) ? 0 : valArgs[0].match(/-?\d+/g)[0];
  // var valUnitX = (valArgs[0] == undefined || valArgs[0].match(/[a-zA-Z%]+/g) == null) ? 'px' : valArgs[0].match(/[a-zA-Z%]+/g)[0];
  // var ValY = (valArgs[1] == undefined || valArgs[1].match(/-?\d+/g) == null) ? 0 : valArgs[1].match(/-?\d+/g)[0];
  // var valUnitY = (valArgs[1] == undefined || valArgs[1].match(/[a-zA-Z%]+/g) == null) ? 'px' : valArgs[1].match(/[a-zA-Z%]+/g)[0];

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: ""
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    label: isCustom ? 'Custom Value enabled?' : 'Custom Value?',
    checked: isCustom,
    onChange: arg => {
      //console.log(arg);
      setisCustom(isCustom => !isCustom);
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center my-3"
  }, !isCustom && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, position.length == 0 ? 'Select...' : position));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, args.map(x => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setisCustom(false);
          setposition(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'backgroundPosition');
          } else {
            props.onChange(x.value, 'backgroundPosition');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), isCustom && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: ValX,
    type: "number",
    onChange: newVal => {
      console.log(valArgs);
      setValX(newVal);

      if (isImportant) {
        props.onChange(newVal + valUnitX + ' ' + ValY + valUnitY + ' ' + '!important', 'backgroundPosition');
      } else {
        props.onChange(newVal + valUnitX + ' ' + ValY + valUnitY, 'backgroundPosition');
      }
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "mx-2"
  }, " / "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: ValY,
    type: "number",
    onChange: newVal => {
      console.log(valArgs);
      setValY(newVal);

      if (isImportant) {
        props.onChange(ValX + valUnitX + ' ' + newVal + valUnitY + ' ' + '!important', 'backgroundPosition');
      } else {
        props.onChange(ValX + valUnitX + ' ' + newVal + valUnitY, 'backgroundPosition');
      }
    }
  }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    label: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (isCustom) {
          props.onChange(ValX + valUnitX + ' ' + ValY + valUnitY, 'backgroundPosition');
        } else {
          props.onChange(position, 'backgroundPosition');
        }
      } else {
        if (isCustom) {
          props.onChange(ValX + valUnitX + ' ' + ValY + valUnitY + ' ' + '!important', 'backgroundPosition');
        } else {
          props.onChange(position + ' !important', 'backgroundPosition');
        }
      }
    }
  }));
}

class PGcssBackgroundPosition extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundPosition);

/***/ }),

/***/ "./src/components/css-background-repeat/index.js":
/*!*******************************************************!*\
  !*** ./src/components/css-background-repeat/index.js ***!
  \*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    repeat: {
      "label": "Repeat",
      "value": "repeat"
    },
    'repeat-x': {
      "label": "Repeat X",
      "value": "repeat-x"
    },
    'repeat-y': {
      "label": "Repeat Y",
      "value": "repeat-y"
    },
    'no-repeat': {
      "label": "No repeat",
      "value": "no-repeat"
    },
    space: {
      "label": "Space",
      "value": "space"
    },
    round: {
      "label": "Round",
      "value": "round"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Background Repeat",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'backgroundRepeat');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'backgroundRepeat');
          } else {
            props.onChange(x.value, 'backgroundRepeat');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'backgroundRepeat');
      } else {
        props.onChange(align + ' !important', 'backgroundRepeat');
      }
    }
  }));
}

class PGcssBackgroundRepeat extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundRepeat);

/***/ }),

/***/ "./src/components/css-background-size/index.js":
/*!*****************************************************!*\
  !*** ./src/components/css-background-size/index.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");

const {
  Component,
  RawHTML
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    auto: {
      "label": "auto",
      "value": "auto"
    },
    cover: {
      "label": "Cover",
      "value": "cover"
    },
    contain: {
      "label": "Contain",
      "value": "contain"
    },
    custom: {
      "label": "Custom",
      "value": "custom"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  const [isMultiple, setisMultiple] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.includes(", ") ? true : false);
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(isMultiple ? props.val.split(", ") : props.val.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.includes("!important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: ""
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "cursor-pointer bg-blue-500 text-white px-3 py-1 my-3",
    onClick: ev => {
      valArgs.push('auto');
      setValArgs(valArgs);
      props.onChange(valArgs.join(' '), 'backgroundSize');
    }
  }, "Add"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    label: isMultiple ? 'Multiple (Enabled)' : 'Multiple?',
    checked: isMultiple,
    onChange: arg => {
      setisMultiple(isMultiple => !isMultiple);
      console.log(isMultiple);

      if (isMultiple) {
        if (isImportant) {
          props.onChange(valArgs.join(' ') + ' !important', 'backgroundSize');
        } else {
          props.onChange(valArgs.join(' '), 'backgroundSize');
        }
      } else {
        if (isImportant) {
          props.onChange(valArgs.join(', ') + ' !important', 'backgroundSize');
        } else {
          props.onChange(valArgs.join(', '), 'backgroundSize');
        }
      }
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, valArgs.map((item, i) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex my-1"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-red-500 text-white",
      onClick: ev => {
        valArgs.splice(i, 1);

        if (isMultiple) {
          if (isImportant) {
            props.onChange(valArgs.join(', ') + ' !important', 'backgroundSize');
          } else {
            props.onChange(valArgs.join(', '), 'backgroundSize');
          }
        } else {
          if (isImportant) {
            props.onChange(valArgs.join(' ') + ' !important', 'backgroundSize');
          } else {
            props.onChange(valArgs.join(' '), 'backgroundSize');
          }
        }
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"], {
      fill: "#fff",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: _ref => {
        let {
          isOpen,
          onToggle
        } = _ref;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "Background Repeat",
          onClick: onToggle,
          "aria-expanded": isOpen
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: " "
        }, args[item] == undefined ? 'Custom' : args[item].label));
      },
      renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "w-32"
      }, Object.entries(args).map(args => {
        var index = args[0];
        var x = args[1];
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
          onClick: ev => {
            if (x.value == 'custom') {
              valArgs[i] = '0px';
            } else {
              valArgs[i] = x.value;
            }

            props.onChange(valArgs.join(' '), 'backgroundSize');
            setValArgs(valArgs);
            console.log(x.value);
          }
        }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
      }))
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null), item.match(/-?\d+/g) != null && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: item.match(/-?\d+/g) == null ? '0' : item.match(/-?\d+/g)[0],
      type: "number",
      onChange: newVal => {
        //console.log(newVal);
        if (newVal.length > 0) {
          valArgs[i] = newVal + item.match(/[a-zA-Z%]+/g)[0];
          props.onChange(valArgs.join(' '), 'backgroundSize');
          setValArgs(valArgs);
        }
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom left",
      renderToggle: _ref2 => {
        let {
          isOpen,
          onToggle
        } = _ref2;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: " "
        }, item.match(/[a-zA-Z%]+/g) == null ? 'Select...' : unitArgs[item.match(/[a-zA-Z%]+/g)[0]] == undefined ? '' : unitArgs[item.match(/[a-zA-Z%]+/g)[0]].label));
      },
      renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "w-32"
      }, Object.entries(unitArgs).map(y => {
        var index = y[0];
        var x = y[1];
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
          onClick: ev => {
            var val = item.match(/-?\d+/g) == null ? 0 : item.match(/-?\d+/g)[0];
            valArgs[i] = val + x.value;
            props.onChange(valArgs.join(' '), 'backgroundSize');
            setValArgs(valArgs);
          }
        }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
      }))
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null));
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    label: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isMultiple) {
        if (isImportant) {
          props.onChange(valArgs.join(', ').replace('!important', ''), 'backgroundSize');
        } else {
          props.onChange(valArgs.join(', ') + ' !important', 'backgroundSize');
        }
      } else {
        if (isImportant) {
          props.onChange(valArgs.join(' ').replace('!important', ''), 'backgroundSize');
        } else {
          props.onChange(valArgs.join(' ') + ' !important', 'backgroundSize');
        }
      }
    }
  }));
}

class PGcssBackgroundSize extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundSize);

/***/ }),

/***/ "./src/components/css-bg-color/index.js":
/*!**********************************************!*\
  !*** ./src/components/css-bg-color/index.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
    position: "bottom right"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "p-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ColorPalette, {
    value: props.value,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(newVal, 'bgColor');
    }
  }))));
}

class PGcssBgColor extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      enableAlpha,
      onChange,
      label
    } = this.props;
    var placeholderStyle = {
      backgroundImage: 'repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0),repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0)',
      backgroundPosition: '0 0,25px 25px',
      backgroundSize: '50px 50px',
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    var defaultbtnStyle = {
      backgroundImage: 'repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0),repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0)',
      backgroundPosition: '0 0,25px 25px',
      backgroundSize: '50px 50px',
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    var btnStyle = {
      backgroundColor: val,
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
      className: "text-sm"
    }, "This css property is depricated, please use ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("strong", null, "Background Color"), " instead"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "relative h-10",
      style: placeholderStyle
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "absolute w-full  h-full top-0 left-0 text-center",
      style: btnStyle,
      onClick: this.handleToggleClick
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "w-full text-center left-0 top-1/2 -translate-y-1/2\t absolute"
    }, val == undefined ? 'Set Color' : val)))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      enableAlpha: enableAlpha,
      value: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBgColor);

/***/ }),

/***/ "./src/components/css-border-bottom/index.js":
/*!***************************************************!*\
  !*** ./src/components/css-border-bottom/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");

const {
  Component,
  RawHTML
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val != undefined ? props.val.split(" ") : ['0px', 'solid', '#000000'];
  var widthVal = valParts[0] != undefined ? valParts[0] : '0px';
  var styleVal = valParts[1] != undefined ? valParts[1] : 'solid';
  var colorVal = valParts[2] != undefined ? valParts[2] : '#000000';
  var outlineStyleArgs = {
    none: {
      "label": "None",
      "value": "none"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    dotted: {
      "label": "Dotted",
      "value": "dotted"
    },
    dashed: {
      "label": "Dashed",
      "value": "dashed"
    },
    solid: {
      "label": "Solid",
      "value": "solid"
    },
    double: {
      "label": "Double",
      "value": "double"
    },
    groove: {
      "label": "Groove",
      "value": "groove"
    },
    ridge: {
      "label": "Ridge",
      "value": "ridge"
    },
    inset: {
      "label": "Inset",
      "value": "inset"
    },
    outset: {
      "label": "Outset",
      "value": "outset"
    }
  };
  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    // "%": { "label": "%", "value": "%" },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    } // none: { "label": "none", "value": "none" },
    // inherit: { "label": "inherit", "value": "inherit" },
    // initial: { "label": "initial", "value": "initial" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },

  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = widthVal.match(/-?\d+/g) != null ? widthVal.match(/-?\d+/g)[0] : 1;
  var widthUnitX = widthVal.match(/[a-zA-Z%]+/g) != null ? widthVal.match(/[a-zA-Z%]+/g)[0] : 'px';
  const [widthValY, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(colorVal);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Width"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthValY,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);
      props.onChange(newVal + widthUnitY + ' ' + styleVal + ' ' + colorVal, 'borderBottom');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, widthUnitY != undefined ? unitArgs[widthUnitY].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);
          props.onChange(widthValY + x.value + ' ' + styleVal + ' ' + colorVal, 'borderBottom');
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2 flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Style"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref2 => {
      let {
        isOpen,
        onToggle
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(outlineStyleArgs).map(arg => {
      var index = arg[0];
      var x = arg[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          props.onChange(widthVal + ' ' + x.value + ' ' + colorVal, 'borderBottom');
          setoutlineStyleVal(x.value);
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
    value: outlineColorVal,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(widthVal + ' ' + styleVal + ' ' + newVal, 'borderBottom');
      setoutlineColorVal(newVal);
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthVal + ' ' + styleVal + ' ' + colorVal, 'borderBottom');
      } else {
        props.onChange(widthVal + ' ' + styleVal + ' ' + colorVal + ' !important', 'borderBottom');
      }
    }
  }));
}

class PGcssBorderBottom extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderBottom);

/***/ }),

/***/ "./src/components/css-border-collapse/index.js":
/*!*****************************************************!*\
  !*** ./src/components/css-border-collapse/index.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = [{
    "label": "separate",
    "value": "separate"
  }, {
    "label": "collapse",
    "value": "collapse"
  }, {
    "label": "initial",
    "value": "initial"
  }, {
    "label": "inherit",
    "value": "inherit"
  }, {
    "label": "revert",
    "value": "revert"
  }, {
    "label": "unset",
    "value": "unset"
  }];
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, args.map(x => {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'borderCollapse');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'borderCollapse');
          } else {
            props.onChange(x.value, 'borderCollapse');
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'borderCollapse');
      } else {
        props.onChange(align + ' !important', 'borderCollapse');
      }
    }
  }));
}

class PGcssBorderCollapse extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderCollapse);

/***/ }),

/***/ "./src/components/css-border-image/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-border-image/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
const {
  Component,
  RawHTML
} = wp.element;









function Html(props) {
  if (!props.warn) {
    return null;
  }

  const ALLOWED_MEDIA_TYPES = ['image'];
  var valZ = props.val == undefined || props.val == null || props.val.length == 0 ? 'url(border.png)  20 20 20 20/  20px 20px 20px 20px /  18px 14px 9px 4px  round' : props.val;
  var source = valZ == undefined ? '' : valZ.split("  ")[0];
  var slice = valZ == undefined ? 10 : valZ.split("  ")[1].replace('/', '');
  var width = valZ == undefined ? 10 : valZ.split("  ")[2].replace('/', '');
  var outset = valZ == undefined ? 10 : valZ.split("  ")[3];
  var repeat = valZ == undefined ? '' : valZ.split("  ")[4];
  slice = slice.replaceAll(' ', 'px ');
  slice = slice + 'px';
  var imageVal = source.replace('url("', '');
  imageVal = imageVal.replace('")', '');
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "Source")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "my-3"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
    src: imageVal,
    alt: ""
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
    className: "mr-2",
    value: imageVal.replace('url(', '').replace(')', ''),
    placeholder: "Image URL",
    onChange: newVal => {
      var sliceX = slice.replaceAll('px', '');
      props.onChange('url(' + newVal + ')  ' + sliceX + '/  ' + width + '/  ' + outset + '  ' + repeat, 'borderImage');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.MediaUploadCheck, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.MediaUpload, {
    class: "bg-blue-500",
    onSelect: media => {
      // media.id
      var sliceX = slice.replaceAll('px', '');
      props.onChange('url(' + media.url + ')  ' + sliceX + '/  ' + width + '/  ' + outset + '  ' + repeat, 'borderImage');
    },
    onClose: () => {},
    allowedTypes: ALLOWED_MEDIA_TYPES,
    render: _ref => {
      let {
        open
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
        className: "my-3 bg-blue-500 text-white border border-solid border-gray-300 text-center w-full",
        onClick: open
      }, "Open Media Library");
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "Slice")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalBoxControl, {
    label: "",
    values: {
      top: slice.split(' ')[0],
      right: slice.split(' ')[1],
      bottom: slice.split(' ')[2],
      left: slice.split(' ')[3]
    },
    onChange: nextValues => {
      var top = parseInt(nextValues.top);
      var right = parseInt(nextValues.right);
      var bottom = parseInt(nextValues.bottom);
      var left = parseInt(nextValues.left);
      var sliceX = top + ' ' + right + ' ' + bottom + ' ' + left;
      props.onChange(source + '  ' + sliceX + '/  ' + width + '/  ' + outset + '  ' + repeat, 'borderImage');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "Width")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalBoxControl, {
    label: "",
    values: {
      top: width.split(' ')[0],
      right: width.split(' ')[1],
      bottom: width.split(' ')[2],
      left: width.split(' ')[3]
    },
    onChange: nextValues => {
      var sliceX = slice.replaceAll('px', '');
      var top = nextValues.top;
      var right = nextValues.right;
      var bottom = nextValues.bottom;
      var left = nextValues.left;
      var widthX = top + ' ' + right + ' ' + bottom + ' ' + left;
      props.onChange(source + '  ' + sliceX + '/  ' + widthX + '/  ' + outset + '  ' + repeat, 'borderImage');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "Outset")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalBoxControl, {
    label: "",
    values: {
      top: outset.split(' ')[0],
      right: outset.split(' ')[1],
      bottom: outset.split(' ')[2],
      left: outset.split(' ')[3]
    },
    onChange: nextValues => {
      var sliceX = slice.replaceAll('px', '');
      var top = nextValues.top;
      var right = nextValues.right;
      var bottom = nextValues.bottom;
      var left = nextValues.left;
      var outsetX = top + ' ' + right + ' ' + bottom + ' ' + left;
      props.onChange(source + '  ' + sliceX + '/  ' + width + '/  ' + outsetX + '  ' + repeat, 'borderImage');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "Repeat"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.SelectControl, {
    label: "",
    value: repeat,
    options: [{
      label: 'Stretch',
      value: 'stretch'
    }, {
      label: 'Repeat',
      value: 'repeat'
    }, {
      label: 'Round',
      value: 'round'
    }, {
      label: 'Space',
      value: 'space'
    }, {
      label: 'Fill',
      value: 'fill'
    }],
    onChange: newVal => {
      var sliceX = slice.replaceAll('px', '');
      props.onChange(source + '  ' + sliceX + '/  ' + width + '/  ' + outset + '  ' + newVal, 'borderImage');
    }
  })));
}

class PGcssBorderImage extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderImage);

/***/ }),

/***/ "./src/components/css-border-left/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-border-left/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");

const {
  Component,
  RawHTML
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val != undefined ? props.val.split(" ") : ['0px', 'solid', '#000000'];
  var widthVal = valParts[0] != undefined ? valParts[0] : '0px';
  var styleVal = valParts[1] != undefined ? valParts[1] : 'solid';
  var colorVal = valParts[2] != undefined ? valParts[2] : '#000000';
  var outlineStyleArgs = {
    none: {
      "label": "None",
      "value": "none"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    dotted: {
      "label": "Dotted",
      "value": "dotted"
    },
    dashed: {
      "label": "Dashed",
      "value": "dashed"
    },
    solid: {
      "label": "Solid",
      "value": "solid"
    },
    double: {
      "label": "Double",
      "value": "double"
    },
    groove: {
      "label": "Groove",
      "value": "groove"
    },
    ridge: {
      "label": "Ridge",
      "value": "ridge"
    },
    inset: {
      "label": "Inset",
      "value": "inset"
    },
    outset: {
      "label": "Outset",
      "value": "outset"
    }
  };
  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    // "%": { "label": "%", "value": "%" },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    } // none: { "label": "none", "value": "none" },
    // inherit: { "label": "inherit", "value": "inherit" },
    // initial: { "label": "initial", "value": "initial" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },

  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = widthVal.match(/-?\d+/g) != null ? widthVal.match(/-?\d+/g)[0] : 1;
  var widthUnitX = widthVal.match(/[a-zA-Z%]+/g) != null ? widthVal.match(/[a-zA-Z%]+/g)[0] : 'px';
  const [widthValY, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(colorVal);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Width"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthValY,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);
      props.onChange(newVal + widthUnitY + ' ' + styleVal + ' ' + colorVal, 'borderLeft');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, widthUnitY != undefined ? unitArgs[widthUnitY].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);
          props.onChange(widthValY + x.value + ' ' + styleVal + ' ' + colorVal, 'borderLeft');
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2 flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Style"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref2 => {
      let {
        isOpen,
        onToggle
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(outlineStyleArgs).map(arg => {
      var index = arg[0];
      var x = arg[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          props.onChange(widthVal + ' ' + x.value + ' ' + colorVal, 'borderLeft');
          setoutlineStyleVal(x.value);
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
    value: outlineColorVal,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(widthVal + ' ' + styleVal + ' ' + newVal, 'borderLeft');
      setoutlineColorVal(newVal);
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(outlineWidthVal + ' ' + outlineStyleVal + ' ' + outlineColorVal, 'borderLeft');
      } else {
        props.onChange(outlineWidthVal + ' ' + outlineStyleVal + ' ' + outlineColorVal + ' !important', 'borderLeft');
      }
    }
  }));
}

class PGcssBorderLeft extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderLeft);

/***/ }),

/***/ "./src/components/css-border-radius/index.js":
/*!***************************************************!*\
  !*** ./src/components/css-border-radius/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
const {
  Component,
  RawHTML
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }

  var important = '';

  if (typeof props.val == 'object') {
    var topX = props.val.top;
    var rightX = props.val.right;
    var bottomX = props.val.bottom;
    var leftX = props.val.left;
    var important = '';
  } else {
    var valParts = props.val != undefined ? props.val.split(" ") : ['5px', '5px', '5px', '5px', ''];
    var topX = valParts[0];
    var rightX = valParts[1];
    var bottomX = valParts[2];
    var leftX = valParts[3];
    var important = valParts[4];
  }

  const [valX, setvalX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
    top: topX,
    right: rightX,
    bottom: bottomX,
    left: leftX
  });
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(valParts.includes("!important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalBoxControl, {
    label: "",
    values: valX,
    onChange: nextValues => {
      // setvalX({ top: nextValues.top, right: nextValues.right, bottom: nextValues.bottom, left: nextValues.left })
      // props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left, 'borderRadius');
      setvalX({
        top: nextValues.top,
        right: nextValues.right,
        bottom: nextValues.bottom,
        left: nextValues.left
      });

      if (isImportant) {
        props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left + ' !important', 'borderRadius');
      } else {
        props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left, 'borderRadius');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(valX.top + ' ' + valX.right + ' ' + valX.bottom + ' ' + valX.left, 'borderRadius');
      } else {
        props.onChange(valX.top + ' ' + valX.right + ' ' + valX.bottom + ' ' + valX.left + ' !important', 'borderRadius');
      }
    }
  }));
}

class PGcssBorderRadius extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderRadius);

/***/ }),

/***/ "./src/components/css-border-right/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-border-right/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");

const {
  Component,
  RawHTML
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val != undefined ? props.val.split(" ") : ['0px', 'solid', '#000000'];
  var widthVal = valParts[0] != undefined ? valParts[0] : '0px';
  var styleVal = valParts[1] != undefined ? valParts[1] : 'solid';
  var colorVal = valParts[2] != undefined ? valParts[2] : '#000000';
  var outlineStyleArgs = {
    none: {
      "label": "None",
      "value": "none"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    dotted: {
      "label": "Dotted",
      "value": "dotted"
    },
    dashed: {
      "label": "Dashed",
      "value": "dashed"
    },
    solid: {
      "label": "Solid",
      "value": "solid"
    },
    double: {
      "label": "Double",
      "value": "double"
    },
    groove: {
      "label": "Groove",
      "value": "groove"
    },
    ridge: {
      "label": "Ridge",
      "value": "ridge"
    },
    inset: {
      "label": "Inset",
      "value": "inset"
    },
    outset: {
      "label": "Outset",
      "value": "outset"
    }
  };
  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    // "%": { "label": "%", "value": "%" },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    } // none: { "label": "none", "value": "none" },
    // inherit: { "label": "inherit", "value": "inherit" },
    // initial: { "label": "initial", "value": "initial" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },

  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = widthVal.match(/-?\d+/g) != null ? widthVal.match(/-?\d+/g)[0] : 1;
  var widthUnitX = widthVal.match(/[a-zA-Z%]+/g) != null ? widthVal.match(/[a-zA-Z%]+/g)[0] : 'px';
  const [widthValY, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(colorVal);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Width"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthValY,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);
      props.onChange(newVal + widthUnitY + ' ' + styleVal + ' ' + colorVal, 'borderRight');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, widthUnitY != undefined ? unitArgs[widthUnitY].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);
          props.onChange(widthValY + x.value + ' ' + styleVal + ' ' + colorVal, 'borderRight');
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2 flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Style"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref2 => {
      let {
        isOpen,
        onToggle
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(outlineStyleArgs).map(arg => {
      var index = arg[0];
      var x = arg[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          props.onChange(widthVal + ' ' + x.value + ' ' + colorVal, 'borderRight');
          setoutlineStyleVal(x.value);
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
    value: outlineColorVal,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(widthVal + ' ' + styleVal + ' ' + newVal, 'borderRight');
      setoutlineColorVal(newVal);
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(outlineWidthVal + ' ' + outlineStyleVal + ' ' + outlineColorVal, 'borderRight');
      } else {
        props.onChange(outlineWidthVal + ' ' + outlineStyleVal + ' ' + outlineColorVal + ' !important', 'borderRight');
      }
    }
  }));
}

class PGcssBorderRight extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderRight);

/***/ }),

/***/ "./src/components/css-border-spacing/index.js":
/*!****************************************************!*\
  !*** ./src/components/css-border-spacing/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");

const {
  Component,
  RawHTML
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '1px 1px #000000' : props.val;
  var valParts = valZ != undefined ? valZ.split(" ") : ['1px', '1px', '#000000'];
  var horizontalVal = valParts[0];
  var vericalVal = valParts[1];
  var colorVal = valParts[2];
  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    // auto: { "label": "AUTO", "value": "auto" },
    // "%": { "label": "%", "value": "%" },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  var horizontalValX = horizontalVal != undefined ? horizontalVal.match(/-?\d+/g)[0] : 1;
  var horizontalUnitX = horizontalVal != undefined ? horizontalVal.match(/[a-zA-Z%]+/g)[0] : 'px';
  var vericalValX = vericalVal != undefined ? vericalVal.match(/-?\d+/g)[0] : 1;
  var vericalUnitX = vericalVal != undefined ? vericalVal.match(/[a-zA-Z%]+/g)[0] : 'px';
  const [horizontalValY, sethorizontalVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(horizontalValX);
  const [horizontalUnitY, sethorizontalUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(horizontalUnitX);
  const [vericalValY, setvericalVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(vericalValX);
  const [vericalUnitY, setvericalUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(vericalUnitX);
  const [outlinehorizontalVal, setoutlinehorizontalVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(horizontalVal);
  const [outlinevericalVal, setoutlinevericalVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(vericalVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(colorVal);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "grid grid-cols-2 gap-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Horizontal"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: horizontalValY,
    type: "number",
    onChange: newVal => {
      sethorizontalVal(newVal);
      props.onChange(newVal + horizontalUnitY + ' ' + outlinevericalVal, 'borderSpacing');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, horizontalUnitY != undefined ? unitArgs[horizontalUnitY].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          sethorizontalUnit(x.value);
          props.onChange(horizontalValY + x.value + ' ' + outlinevericalVal, 'borderSpacing');
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Verical"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: vericalValY,
    type: "number",
    onChange: newVal => {
      setvericalVal(newVal);
      props.onChange(outlinehorizontalVal + ' ' + newVal + vericalUnitY, 'borderSpacing');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref2 => {
      let {
        isOpen,
        onToggle
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, vericalUnitY != undefined ? unitArgs[vericalUnitY].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setvericalUnit(x.value);
          props.onChange(outlinehorizontalVal + ' ' + vericalValY + x.value, 'borderSpacing');
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(horizontalVal + ' ' + vericalVal + ' ', 'borderSpacing');
      } else {
        props.onChange(horizontalVal + ' ' + vericalVal + ' ' + ' !important', 'borderSpacing');
      }
    }
  }));
}

class PGcssBorderSpacing extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    var args = {
      fill: {
        "label": "fill",
        "value": "fill"
      },
      contain: {
        "label": "contain",
        "value": "contain"
      },
      cover: {
        "label": "cover",
        "value": "cover"
      },
      'scale-down': {
        "label": "scale-down",
        "value": "scale-down"
      },
      none: {
        "label": "none",
        "value": "none"
      }
    };
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderSpacing);

/***/ }),

/***/ "./src/components/css-border-top/index.js":
/*!************************************************!*\
  !*** ./src/components/css-border-top/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");

const {
  Component,
  RawHTML
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val != undefined ? props.val.split(" ") : ['0px', 'solid', '#000000'];
  var widthVal = valParts[0] != undefined ? valParts[0] : '0px';
  var styleVal = valParts[1] != undefined ? valParts[1] : 'solid';
  var colorVal = valParts[2] != undefined ? valParts[2] : '#000000';
  var outlineStyleArgs = {
    none: {
      "label": "None",
      "value": "none"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    dotted: {
      "label": "Dotted",
      "value": "dotted"
    },
    dashed: {
      "label": "Dashed",
      "value": "dashed"
    },
    solid: {
      "label": "Solid",
      "value": "solid"
    },
    double: {
      "label": "Double",
      "value": "double"
    },
    groove: {
      "label": "Groove",
      "value": "groove"
    },
    ridge: {
      "label": "Ridge",
      "value": "ridge"
    },
    inset: {
      "label": "Inset",
      "value": "inset"
    },
    outset: {
      "label": "Outset",
      "value": "outset"
    }
  };
  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    // "%": { "label": "%", "value": "%" },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    } // none: { "label": "none", "value": "none" },
    // inherit: { "label": "inherit", "value": "inherit" },
    // initial: { "label": "initial", "value": "initial" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },

  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = widthVal.match(/-?\d+/g) != null ? widthVal.match(/-?\d+/g)[0] : 1;
  var widthUnitX = widthVal.match(/[a-zA-Z%]+/g) != null ? widthVal.match(/[a-zA-Z%]+/g)[0] : 'px';
  const [widthValY, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(colorVal);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Width"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthValY,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);
      props.onChange(newVal + widthUnitY + ' ' + styleVal + ' ' + colorVal, 'borderTop');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, widthUnitY != undefined ? unitArgs[widthUnitY].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);
          props.onChange(widthValY + x.value + ' ' + styleVal + ' ' + colorVal, 'borderTop');
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2 flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Style"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref2 => {
      let {
        isOpen,
        onToggle
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(outlineStyleArgs).map(arg => {
      var index = arg[0];
      var x = arg[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          props.onChange(widthVal + ' ' + x.value + ' ' + colorVal, 'borderTop');
          setoutlineStyleVal(x.value);
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
    value: outlineColorVal,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(widthVal + ' ' + styleVal + ' ' + newVal, 'borderTop');
      setoutlineColorVal(newVal);
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthVal + ' ' + styleVal + ' ' + colorVal, 'borderTop');
      } else {
        props.onChange(widthVal + ' ' + styleVal + ' ' + colorVal + ' !important', 'borderTop');
      }
    }
  }));
}

class PGcssBorderTop extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderTop);

/***/ }),

/***/ "./src/components/css-border/index.js":
/*!********************************************!*\
  !*** ./src/components/css-border/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");

const {
  Component,
  RawHTML
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val != undefined ? props.val.split(" ") : ['0px', 'solid', '#000000'];
  var widthVal = valParts[0] != undefined ? valParts[0] : '0px';
  var styleVal = valParts[1] != undefined ? valParts[1] : 'solid';
  var colorVal = valParts[2] != undefined ? valParts[2] : '#000000';
  var outlineStyleArgs = {
    none: {
      "label": "None",
      "value": "none"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    dotted: {
      "label": "Dotted",
      "value": "dotted"
    },
    dashed: {
      "label": "Dashed",
      "value": "dashed"
    },
    solid: {
      "label": "Solid",
      "value": "solid"
    },
    double: {
      "label": "Double",
      "value": "double"
    },
    groove: {
      "label": "Groove",
      "value": "groove"
    },
    ridge: {
      "label": "Ridge",
      "value": "ridge"
    },
    inset: {
      "label": "Inset",
      "value": "inset"
    },
    outset: {
      "label": "Outset",
      "value": "outset"
    }
  };
  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    // "%": { "label": "%", "value": "%" },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    } // none: { "label": "none", "value": "none" },
    // inherit: { "label": "inherit", "value": "inherit" },
    // initial: { "label": "initial", "value": "initial" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },

  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = widthVal.match(/-?\d+/g) != null ? widthVal.match(/-?\d+/g)[0] : 1;
  var widthUnitX = widthVal.match(/[a-zA-Z%]+/g) != null ? widthVal.match(/[a-zA-Z%]+/g)[0] : 'px';
  const [widthValY, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(colorVal);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Width"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthValY,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);
      props.onChange(newVal + widthUnitY + ' ' + styleVal + ' ' + colorVal, 'border');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, widthUnitY != undefined ? unitArgs[widthUnitY].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);
          props.onChange(widthValY + x.value + ' ' + styleVal + ' ' + colorVal, 'border');
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2 flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Style"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref2 => {
      let {
        isOpen,
        onToggle
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(outlineStyleArgs).map(arg => {
      var index = arg[0];
      var x = arg[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          props.onChange(widthVal + ' ' + x.value + ' ' + colorVal, 'border');
          setoutlineStyleVal(x.value);
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Border Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
    value: outlineColorVal,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(widthVal + ' ' + styleVal + ' ' + newVal, 'border');
      setoutlineColorVal(newVal);
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthVal + ' ' + styleVal + ' ' + colorVal, 'border');
      } else {
        props.onChange(widthVal + ' ' + styleVal + ' ' + colorVal + ' !important', 'border');
      }
    }
  }));
}

class PGcssBorder extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorder);

/***/ }),

/***/ "./src/components/css-bottom/index.js":
/*!********************************************!*\
  !*** ./src/components/css-bottom/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };

  if (typeof props.val == 'object') {
    var valZ = props.val.val + props.val.unit;
  } else {
    var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  }

  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'bottom');
        } else {
          props.onChange(widthUnit, 'bottom');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'bottom');
        } else {
          props.onChange(newVal + widthUnit, 'bottom');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'bottom');
            } else {
              props.onChange(x.value, 'bottom');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'bottom');
            } else {
              props.onChange(widthVal + x.value, 'bottom');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'bottom');
        } else {
          props.onChange(widthVal + widthUnit, 'bottom');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'bottom');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'bottom');
        }
      }
    }
  }));
}

class PGcssBottom extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBottom);

/***/ }),

/***/ "./src/components/css-box-shadow/index.js":
/*!************************************************!*\
  !*** ./src/components/css-box-shadow/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");

const {
  Component,
  RawHTML
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px 0px 10px 5px #50547d4f' : props.val; // var valZ = (props.val == null || props.val == undefined || props.val.length == 0) ? '0px' : props.val;

  var h = valZ != undefined ? parseInt(valZ.split(" ")[0].match(/-?\d+/g)[0]) : 0;
  var v = valZ != undefined ? parseInt(valZ.split(" ")[1].match(/-?\d+/g)[0]) : 0;
  var blur = valZ != undefined ? parseInt(valZ.split(" ")[2].match(/-?\d+/g)[0]) : 10;
  var spread = valZ != undefined ? parseInt(valZ.split(" ")[3].match(/-?\d+/g)[0]) : 5;
  var color = valZ != undefined ? valZ.split(" ")[4] : '#dddddd';
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "H-Offset")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.RangeControl, {
    min: "-100",
    max: "100",
    step: "1",
    currentInput: h,
    value: h,
    onChange: newVal => {
      props.onChange(newVal + 'px ' + v + 'px ' + blur + 'px ' + spread + 'px ' + color, 'boxShadow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "V-Offset")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.RangeControl, {
    min: "-100",
    max: "100",
    step: "1",
    value: v,
    onChange: newVal => {
      props.onChange(h + 'px ' + newVal + 'px ' + blur + 'px ' + spread + 'px ' + color, 'boxShadow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Blur")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.RangeControl, {
    min: "0",
    max: "100",
    step: "1",
    value: blur,
    onChange: newVal => {
      props.onChange(h + 'px ' + v + 'px ' + newVal + 'px ' + spread + 'px ' + color, 'boxShadow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Spread")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.RangeControl, {
    min: "0",
    max: "100",
    step: "1",
    value: spread,
    onChange: newVal => {
      props.onChange(h + 'px ' + v + 'px ' + blur + 'px ' + newVal + 'px ' + color, 'boxShadow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
    value: color,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_1__["default"],
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(h + 'px ' + v + 'px ' + blur + 'px ' + spread + 'px ' + newVal, 'boxShadow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(h + 'px ' + v + 'px ' + blur + 'px ' + spread + 'px ' + color, 'boxShadow');
      } else {
        props.onChange(h + 'px ' + v + 'px ' + blur + 'px ' + spread + 'px ' + color + ' !important', 'boxShadow');
      }
    }
  }));
}

class PGcssBoxShadow extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBoxShadow);

/***/ }),

/***/ "./src/components/css-box-sizing/index.js":
/*!************************************************!*\
  !*** ./src/components/css-box-sizing/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    'border-box': {
      "label": "border-box",
      "value": "border-box"
    },
    'content-box': {
      "label": "content-box",
      "value": "content-box"
    } // none: { "label": "none", "value": "none" },
    // inherit: { "label": "inherit", "value": "inherit" },
    // initial: { "label": "initial", "value": "initial" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },

  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Box Sizing",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'boxSizing');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'boxSizing');
          } else {
            props.onChange(x.value, 'boxSizing');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'boxSizing');
      } else {
        props.onChange(align + ' !important', 'boxSizing');
      }
    }
  }));
}

class PGcssBoxSizing extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBoxSizing);

/***/ }),

/***/ "./src/components/css-clear/index.js":
/*!*******************************************!*\
  !*** ./src/components/css-clear/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    none: {
      "label": "None",
      "value": "none"
    },
    left: {
      "label": "Left",
      "value": "left"
    },
    right: {
      "label": "Right",
      "value": "right"
    },
    both: {
      "label": "Both",
      "value": "both"
    },
    "inline-end": {
      "label": "inline-end",
      "value": "inline-end"
    },
    "inline-start": {
      "label": "inline-start",
      "value": "inline-start"
    } // inherit: { "label": "inherit", "value": "inherit" },
    // initial: { "label": "initial", "value": "initial" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },

  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'clear');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'clear');
          } else {
            props.onChange(x.value, 'clear');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'clear');
      } else {
        props.onChange(align + ' !important', 'clear');
      }
    }
  }));
}

class PGcssClear extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssClear);

/***/ }),

/***/ "./src/components/css-clip/index.js":
/*!******************************************!*\
  !*** ./src/components/css-clip/index.js ***!
  \******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
const {
  Component,
  RawHTML
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val;

  if (typeof props.val == 'object') {
    var topX = props.val.top;
    var rightX = props.val.right;
    var bottomX = props.val.bottom;
    var leftX = props.val.left;
  } else {
    var valParts = props.val != undefined ? props.val.split(" ") : ['5px', '5px', '5px', '5px'];
    var topX = valParts[0];
    var rightX = valParts[1];
    var bottomX = valParts[2];
    var leftX = valParts[3];
  }

  const [valX, setvalX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
    top: topX,
    right: rightX,
    bottom: bottomX,
    left: leftX
  });
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalBoxControl, {
    label: "",
    values: valX,
    onChange: nextValues => {
      setvalX({
        top: nextValues.top,
        right: nextValues.right,
        bottom: nextValues.bottom,
        left: nextValues.left
      }); //nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left

      props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left, 'clip');
    }
  }));
}

class PGcssClip extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssClip);

/***/ }),

/***/ "./src/components/css-color/index.js":
/*!*******************************************!*\
  !*** ./src/components/css-color/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [val, setval] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
    position: "bottom right"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "p-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    label: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(val, 'color');
      } else {
        props.onChange(val + ' !important', 'color');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ColorPalette, {
    value: val,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      //props.onChange(newVal, 'color');
      setval(newVal);

      if (isImportant) {
        props.onChange(newVal + ' !important', 'color');
      } else {
        props.onChange(newVal, 'color');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Global Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
    label: "",
    value: val,
    options: [{
      label: 'Choose',
      value: ''
    }, {
      label: 'Inherit',
      value: 'inherit'
    }, {
      label: 'Initial',
      value: 'initial'
    }, {
      label: 'Revert',
      value: 'revert'
    }, {
      label: 'Revert-layer',
      value: 'revert-layer'
    }, {
      label: 'Unset',
      value: 'unset'
    }],
    onChange: newVal => {
      setval(newVal);

      if (isImportant) {
        props.onChange(newVal + ' !important', 'color');
      } else {
        props.onChange(newVal, 'color');
      }
    }
  })))));
}

class PGcssColor extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      enableAlpha,
      onChange,
      label
    } = this.props;
    console.log(val);
    var colorVal = val.replace(' !important', '');
    var placeholderStyle = {
      backgroundImage: 'repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0),repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0)',
      backgroundPosition: '0 0,25px 25px',
      backgroundSize: '50px 50px',
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    var defaultbtnStyle = {
      backgroundImage: 'repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0),repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0)',
      backgroundPosition: '0 0,25px 25px',
      backgroundSize: '50px 50px',
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    var btnStyle = {
      backgroundColor: val,
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "relative h-10",
      style: placeholderStyle
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "absolute w-full  h-full top-0 left-0 text-center",
      style: btnStyle,
      onClick: this.handleToggleClick
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "w-full text-center left-0 top-1/2 -translate-y-1/2\t absolute"
    }, val == undefined ? 'Set Color' : colorVal)))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      enableAlpha: enableAlpha,
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssColor);

/***/ }),

/***/ "./src/components/css-column-count/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-column-count/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: align,
    type: "number",
    onChange: newVal => {
      //setwidthVal(newVal);
      setalign(newVal);

      if (isImportant) {
        props.onChange(newVal + ' !important', 'columnCount');
      } else {
        props.onChange(newVal, 'columnCount');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'columnCount');
      } else {
        props.onChange(align + ' !important', 'columnCount');
      }
    }
  }));
}

class PGcssColumnCount extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssColumnCount);

/***/ }),

/***/ "./src/components/css-column-gap/index.js":
/*!************************************************!*\
  !*** ./src/components/css-column-gap/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'width');
        } else {
          props.onChange(widthUnit, 'width');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'width');
        } else {
          props.onChange(newVal + widthUnit, 'width');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'columnGap');
            } else {
              props.onChange(x.value, 'columnGap');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'columnGap');
            } else {
              props.onChange(widthVal + x.value, 'columnGap');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'columnGap');
        } else {
          props.onChange(widthVal + widthUnit, 'columnGap');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'columnGap');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'columnGap');
        }
      }
    }
  }));
}

class PGcssColumnGap extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssColumnGap);

/***/ }),

/***/ "./src/components/css-column-rule/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-column-rule/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");

const {
  Component,
  RawHTML
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val.length == 0 || props.val == undefined ? ['0px', 'solid', '#000000', ''] : props.val.split(" ");
  var widthVal = valParts[0] != undefined ? valParts[0] : '0px';
  var styleVal = valParts[1] != undefined ? valParts[1] : 'solid';
  var colorVal = valParts[2] != undefined ? valParts[2] : '#000000';
  var importantVal = valParts[3] != undefined ? valParts[3] : '';
  var outlineStyleArgs = {
    none: {
      "label": "None",
      "value": "none"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    dotted: {
      "label": "Dotted",
      "value": "dotted"
    },
    dashed: {
      "label": "Dashed",
      "value": "dashed"
    },
    solid: {
      "label": "Solid",
      "value": "solid"
    },
    double: {
      "label": "Double",
      "value": "double"
    },
    groove: {
      "label": "Groove",
      "value": "groove"
    },
    ridge: {
      "label": "Ridge",
      "value": "ridge"
    },
    inset: {
      "label": "Inset",
      "value": "inset"
    },
    outset: {
      "label": "Outset",
      "value": "outset"
    }
  };
  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var widthValX = widthVal.match(/-?\d+/g) != null ? widthVal.match(/-?\d+/g)[0] : 1;
  var widthUnitX = widthVal.match(/[a-zA-Z%]+/g) != null ? widthVal.match(/[a-zA-Z%]+/g)[0] : 'px';
  const [widthValY, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [outlineimportantVal, setoutlineimportantVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(importantVal.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "      valParts: ", JSON.stringify(valParts)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "      widthVal: ", JSON.stringify(widthVal)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "      styleVal: ", JSON.stringify(styleVal)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "      colorVal: ", JSON.stringify(colorVal)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Width"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthValY,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);

      if (outlineimportantVal) {
        props.onChange(newVal + widthUnitY + ' ' + styleVal + ' ' + colorVal + ' ' + '!important', 'columnRule');
      } else {
        props.onChange(newVal + widthUnitY + ' ' + styleVal + ' ' + colorVal, 'columnRule');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, unitArgs[widthUnitY] == undefined ? 'Select...' : unitArgs[widthUnitY].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (outlineimportantVal) {
            props.onChange(widthValY + x.value + ' ' + styleVal + ' ' + colorVal + ' ' + '!important', 'columnRule');
          } else {
            props.onChange(widthValY + x.value + ' ' + styleVal + ' ' + colorVal, 'columnRule');
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2 flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Style"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref2 => {
      let {
        isOpen,
        onToggle
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, outlineStyleArgs[styleVal] == undefined ? 'Select...' : outlineStyleArgs[styleVal].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(outlineStyleArgs).map(arg => {
      var index = arg[0];
      var x = arg[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          if (outlineimportantVal) {
            props.onChange(widthVal + ' ' + x.value + ' ' + colorVal + ' ' + '!important', 'columnRule');
          } else {
            props.onChange(widthVal + ' ' + x.value + ' ' + colorVal, 'columnRule');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
    value: colorVal,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      console.log(widthVal);

      if (outlineimportantVal) {
        props.onChange(widthVal + ' ' + styleVal + ' ' + newVal + ' ' + '!important', 'columnRule');
      } else {
        props.onChange(widthVal + ' ' + styleVal + ' ' + newVal, 'columnRule');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: outlineimportantVal ? 'Important Enabled' : 'Important?',
    checked: outlineimportantVal,
    onChange: arg => {
      setoutlineimportantVal(outlineimportantVal => !outlineimportantVal);

      if (outlineimportantVal) {
        props.onChange(widthVal + ' ' + styleVal + ' ' + colorVal, 'columnRule');
      } else {
        props.onChange(widthVal + ' ' + styleVal + ' ' + colorVal + ' ' + '!important', 'columnRule');
      }
    }
  }));
}

class PGcssColumnRule extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssColumnRule);

/***/ }),

/***/ "./src/components/css-content/index.js":
/*!*********************************************!*\
  !*** ./src/components/css-content/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var content = props.val == null || props.val == undefined ? '' : props.val.replaceAll('"', '');
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: content,
    type: "text",
    onChange: newVal => {
      //setwidthVal(newVal);
      props.onChange('"' + newVal + '"', 'content');
    }
  }));
}

class PGcssContent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssContent);

/***/ }),

/***/ "./src/components/css-cursor/index.js":
/*!********************************************!*\
  !*** ./src/components/css-cursor/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    auto: {
      "label": "auto",
      "value": "auto"
    },
    pointer: {
      "label": "pointer",
      "value": "pointer"
    },
    progress: {
      "label": "progress",
      "value": "progress"
    },
    alias: {
      "label": "alias",
      "value": "alias"
    },
    cell: {
      "label": "cell",
      "value": "cell"
    },
    copy: {
      "label": "copy",
      "value": "copy"
    },
    crosshair: {
      "label": "crosshair",
      "value": "crosshair"
    },
    default: {
      "label": "default",
      "value": "default"
    },
    grab: {
      "label": "grab",
      "value": "grab"
    },
    grabbing: {
      "label": "grabbing",
      "value": "grabbing"
    },
    help: {
      "label": "help",
      "value": "help"
    },
    move: {
      "label": "move",
      "value": "move"
    },
    'col-resize': {
      "label": "col-resize",
      "value": "col-resize"
    },
    'context-menu': {
      "label": "context-menu",
      "value": "context-menu"
    },
    'e-resize': {
      "label": "e-resize",
      "value": "e-resize"
    },
    'ew-resize': {
      "label": "ew-resize",
      "value": "ew-resize"
    },
    'n-resize': {
      "label": "n-resize",
      "value": "n-resize"
    },
    'ne-resize': {
      "label": "ne-resize",
      "value": "ne-resize"
    },
    'nesw-resize': {
      "label": "nesw-resize",
      "value": "nesw-resize"
    },
    'ns-resize': {
      "label": "ns-resize",
      "value": "ns-resize"
    },
    'nw-resize': {
      "label": "nw-resize",
      "value": "nw-resize"
    },
    'nwse-resize': {
      "label": "nwse-resize",
      "value": "nwse-resize"
    },
    'no-drop': {
      "label": "no-drop",
      "value": "no-drop"
    },
    'none': {
      "label": "none",
      "value": "none"
    },
    'not-allowed': {
      "label": "not-allowed",
      "value": "not-allowed"
    },
    'row-resize': {
      "label": "row-resize",
      "value": "row-resize"
    },
    's-resize;': {
      "label": "s-resize;",
      "value": "s-resize;"
    },
    'se-resize': {
      "label": "se-resize",
      "value": "se-resize"
    },
    'sw-resize': {
      "label": "sw-resize",
      "value": "sw-resize"
    },
    'text': {
      "label": "text",
      "value": "text"
    },
    'w-resize': {
      "label": "w-resize",
      "value": "w-resize"
    },
    'wait': {
      "label": "wait",
      "value": "wait"
    },
    'zoom-in': {
      "label": "zoom-in",
      "value": "zoom-in"
    },
    'zoom-out': {
      "label": "zoom-out",
      "value": "zoom-out"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'cursor');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'cursor');
          } else {
            props.onChange(x.value, 'cursor');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'cursor');
      } else {
        props.onChange(align + ' !important', 'cursor');
      }
    }
  }));
}

class PGcssCursor extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssCursor);

/***/ }),

/***/ "./src/components/css-direction/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-direction/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    ltr: {
      "label": "ltr",
      "value": "ltr"
    },
    rtl: {
      "label": "rtl",
      "value": "rtl"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Align Content",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'direction');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'direction');
          } else {
            props.onChange(x.value, 'direction');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'direction');
      } else {
        props.onChange(align + ' !important', 'direction');
      }
    }
  }));
}

class PGcssDirection extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssDirection);

/***/ }),

/***/ "./src/components/css-display/index.js":
/*!*********************************************!*\
  !*** ./src/components/css-display/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    none: {
      "label": "None",
      "value": "none"
    },
    block: {
      "label": "Block",
      "value": "block"
    },
    inline: {
      "label": "Inline",
      "value": "inline"
    },
    'inline-block': {
      "label": "Inline Block",
      "value": "inline-block"
    },
    grid: {
      "label": "Grid",
      "value": "grid"
    },
    flex: {
      "label": "Flex",
      "value": "flex"
    },
    contents: {
      "label": "contents",
      "value": "contents"
    },
    'inline-flex': {
      "label": "inline-flex",
      "value": "inline-flex"
    },
    'inline-grid': {
      "label": "inline-grid",
      "value": "inline-grid"
    },
    'inline-table': {
      "label": "inline-table",
      "value": "inline-table"
    },
    'list-item': {
      "label": "list-item",
      "value": "list-item"
    },
    // 'run-in': { "label": "run-in", "value": "run-in" },
    table: {
      "label": "table",
      "value": "table"
    },
    'table-caption': {
      "label": "table-caption",
      "value": "table-caption"
    },
    'table-column-group': {
      "label": "table-column-group",
      "value": "table-column-group"
    },
    'table-header-group': {
      "label": "table-header-group",
      "value": "table-header-group"
    },
    'table-footer-group': {
      "label": "table-footer-group",
      "value": "table-footer-group"
    },
    'table-row-group': {
      "label": "table-row-group",
      "value": "table-row-group"
    },
    'table-cell': {
      "label": "table-cell",
      "value": "table-cell"
    },
    'table-column': {
      "label": "table-column",
      "value": "table-column"
    },
    'table-row': {
      "label": "table-row",
      "value": "table-row"
    },
    'flow-root': {
      "label": "flow-root",
      "value": "flow-root"
    },
    'inline-grid': {
      "label": "inline-grid",
      "value": "inline-grid"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'display');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'display');
          } else {
            props.onChange(x.value, 'display');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'display');
      } else {
        props.onChange(align + ' !important', 'display');
      }
    }
  }));
}

class PGcssDisplay extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssDisplay);

/***/ }),

/***/ "./src/components/css-filter/index.js":
/*!********************************************!*\
  !*** ./src/components/css-filter/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");

const {
  Component
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val == null || props.val == undefined || props.val.length == 0 ? [] : props.val.split(" ");
  var [valArgs, setvalArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]);

  function addFilter(option, index) {
    var isExist = valArgs.find(x => x.id === option.value);

    if (isExist == undefined) {
      var obj = {};
      obj['id'] = option.value;
      obj['val'] = option.val;
      valArgs.push(obj);
      var str = '';
      valArgs.map(x => {
        if (x.id == 'blur') {
          str += x.id + '(' + x.val + 'px) ';
        } else if (x.id == 'hue-rotate') {
          str += x.id + '(' + x.val + 'deg) ';
        } else {
          str += x.id + '(' + x.val + '%) ';
        }
      });
      props.onChange(str, 'filter');
    }
  }

  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    var filtered = valParts.filter(Boolean);
    var res = filtered.map(x => {
      if (x.length != 0) {
        var argVal = x != undefined ? x.match(/-?\d+/g)[0] : 1;
        var argId = x != undefined ? x.match(/[a-zA-Z]+/g)[0] : '';
        return {
          id: argId,
          val: argVal
        };
      }
    });
    setvalArgs(res);
  }, [props.val]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {}, [valArgs]);
  const [filterArgs, setfilterArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    blur: {
      label: 'Blur',
      value: 'blur',
      val: '1',
      unit: 'px'
    },
    brightness: {
      label: 'Brightness',
      value: 'brightness',
      val: '10',
      unit: '%'
    },
    contrast: {
      label: 'Contrast',
      value: 'contrast',
      val: '10',
      unit: '%'
    },
    grayscale: {
      label: 'Grayscale',
      value: 'grayscale',
      val: '10',
      unit: '%'
    },
    'hue-rotate': {
      label: 'Hue-rotate',
      value: 'hue-rotate',
      val: '10',
      unit: 'deg'
    },
    invert: {
      label: 'Invert',
      value: 'invert',
      val: '10',
      unit: '%'
    },
    opacity: {
      label: 'Opacity',
      value: 'opacity',
      val: '10',
      unit: '%'
    },
    saturate: {
      label: 'Saturate',
      value: 'saturate',
      val: '10',
      unit: '%'
    },
    sepia: {
      label: 'Sepia',
      value: 'sepia',
      val: '10',
      unit: '%'
    }
  });
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_2__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: filterArgs,
    buttonTitle: "Add Filter",
    onChange: addFilter,
    values: ""
  })), valArgs != undefined && valArgs.map((arg, i) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex my-3 items-center justify-between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, filterArgs[arg.id] != undefined ? filterArgs[arg.id].label : arg.id), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.val,
      type: "number",
      min: 0,
      max: 100,
      onChange: newVal => {
        valArgs[i].val = newVal; // setvalArgs(valArgs);

        var str = '';
        valArgs.map(x => {
          if (x.id == 'blur') {
            str += x.id + '(' + x.val + 'px) ';
          } else if (x.id == 'hue-rotate') {
            str += x.id + '(' + x.val + 'deg) ';
          } else {
            str += x.id + '(' + x.val + '%) ';
          }
        });
        props.onChange(str, 'filter');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "hover:bg-red-500 bg-red-400 text-white ml-1 inline-block p-1 cursor-pointer",
      onClick: ev => {
        valArgs.splice(i, 1);
        setvalArgs(valArgs);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "dashicons dashicons-no-alt"
    }))));
  }));
}

class PGcssFilter extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFilter);

/***/ }),

/***/ "./src/components/css-flex-basis/index.js":
/*!************************************************!*\
  !*** ./src/components/css-flex-basis/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);
      props.onChange(newVal + widthUnit, 'flexBasis');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, props.val ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);
          props.onChange(widthVal + x.value, 'flexBasis');
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthVal + widthUnit, 'flexBasis');
      } else {
        props.onChange(widthVal + widthUnit + ' !important', 'flexBasis');
      }
    }
  }));
}

class PGcssFlexBasis extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexBasis);

/***/ }),

/***/ "./src/components/css-flex-direction/index.js":
/*!****************************************************!*\
  !*** ./src/components/css-flex-direction/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    row: {
      "label": "row",
      "value": "row"
    },
    'row-reverse': {
      "label": "row-reverse",
      "value": "row-reverse"
    },
    column: {
      "label": "column",
      "value": "column"
    },
    'column-reverse': {
      "label": "column-reverse",
      "value": "column-reverse"
    }
  };
  var valX = props.val == undefined || props.val == null || props.val.length == 0 ? 'wrap' : props.val;
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valX.split(" "));
  const [value, setValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[value] == undefined ? 'Select...' : args[value].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setValue(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'flexDirection');
          } else {
            props.onChange(x.value, 'flexDirection');
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    label: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(value, 'flexDirection');
      } else {
        props.onChange(value + ' !important', 'flexDirection');
      }
    }
  }));
}

class PGcssFlexDirection extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexDirection);

/***/ }),

/***/ "./src/components/css-flex-flow/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-flex-flow/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");

const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    row: {
      "label": "row",
      "value": "row"
    },
    "row-reverse": {
      "label": "row-reverse",
      "value": "row-reverse"
    },
    column: {
      "label": "column",
      "value": "column"
    },
    "column-reverse": {
      "label": "column-reverse",
      "value": "column-reverse"
    },
    nowrap: {
      "label": "nowrap",
      "value": "nowrap"
    },
    wrap: {
      "label": "wrap",
      "value": "wrap"
    },
    "wrap-reverse": {
      "label": "wrap-reverse",
      "value": "wrap-reverse"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    "revert-layer": {
      "label": "revert-layer",
      "value": "revert-layer"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '' : props.val;
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.split(" "));
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          valArgs.push(x.value);
          setValArgs(valArgs);
          props.onChange(valArgs.join(' '), 'flexFlow');
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), valArgs.map((x, i) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex items-center my-1 border hover:bg-gray-400 cursor-pointer"
    }, " ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-red-500 mr-2 p-1",
      onClick: ev => {
        valArgs.splice(i, 1);
        setValArgs(valArgs);
        props.onChange(valArgs.join(' '), 'flexFlow');
      }
    }, " ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"], {
      fill: '#fff',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"]
    }), " "), " ", x);
  }));
}

class PGcssFlexFlow extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexFlow);

/***/ }),

/***/ "./src/components/css-flex-grow/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-flex-grow/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4 justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);
      props.onChange(newVal, 'flexGrow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthValX, 'flexGrow');
      } else {
        props.onChange(widthValX + ' !important', 'flexGrow');
      }
    }
  }));
}

class PGcssFlexGrow extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexGrow);

/***/ }),

/***/ "./src/components/css-flex-shrink/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-flex-shrink/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4 justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);
      props.onChange(newVal, 'flexShrink');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthValX, 'flexShrink');
      } else {
        props.onChange(widthValX + ' !important', 'flexShrink');
      }
    }
  }));
}

class PGcssFlexShrink extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexShrink);

/***/ }),

/***/ "./src/components/css-flex-wrap/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-flex-wrap/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    nowrap: {
      "label": "nowrap",
      "value": "nowrap"
    },
    wrap: {
      "label": "wrap",
      "value": "wrap"
    },
    'wrap-reverse': {
      "label": "wrap-reverse",
      "value": "wrap-reverse"
    }
  };
  var valX = props.val == undefined || props.val == null || props.val.length == 0 ? 'wrap' : props.val;
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valX.split(" "));
  const [value, setValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[value] == undefined ? 'Select...' : args[value].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setValue(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'flexWrap');
          } else {
            props.onChange(x.value, 'flexWrap');
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    label: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(value, 'flexWrap');
      } else {
        props.onChange(value + ' !important', 'flexWrap');
      }
    }
  }));
}

class PGcssFlexWrap extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexWrap);

/***/ }),

/***/ "./src/components/css-float/index.js":
/*!*******************************************!*\
  !*** ./src/components/css-float/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    none: {
      "label": "None",
      "value": "none"
    },
    left: {
      "label": "Left",
      "value": "left"
    },
    right: {
      "label": "Right",
      "value": "right"
    },
    "inline-end": {
      "label": "inline-end",
      "value": "inline-end"
    },
    "inline-start": {
      "label": "inline-start",
      "value": "inline-start"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'float');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'float');
          } else {
            props.onChange(x.value, 'float');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'float');
      } else {
        props.onChange(align + ' !important', 'float');
      }
    }
  }));
}

class PGcssFloat extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFloat);

/***/ }),

/***/ "./src/components/css-font-family/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-font-family/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/plus.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__WEBPACK_IMPORTED_MODULE_2__);

const {
  Component
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var isLoaded = props.isLoaded;
  console.log(isLoaded);
  var fontsLibrary = ["ABeeZee", "Abel", "Abhaya Libre", "Aboreto", "Abril Fatface", "Abyssinica SIL", "Aclonica", "Acme", "Actor", "Adamina", "Advent Pro", "Agdasima", "Aguafina Script", "Akatab", "Akaya Kanadaka", "Akaya Telivigala", "Akronim", "Akshar", "Aladin", "Alata", "Alatsi", "Albert Sans", "Aldrich", "Alef", "Alegreya", "Alegreya SC", "Alegreya Sans", "Alegreya Sans SC", "Aleo", "Alex Brush", "Alexandria", "Alfa Slab One", "Alice", "Alike", "Alike Angular", "Alkalami", "Alkatra", "Allan", "Allerta", "Allerta Stencil", "Allison", "Allura", "Almarai", "Almendra", "Almendra Display", "Almendra SC", "Alumni Sans", "Alumni Sans Collegiate One", "Alumni Sans Inline One", "Alumni Sans Pinstripe", "Amarante", "Amaranth", "Amatic SC", "Amethysta", "Amiko", "Amiri", "Amiri Quran", "Amita", "Anaheim", "Andada Pro", "Andika", "Anek Bangla", "Anek Devanagari", "Anek Gujarati", "Anek Gurmukhi", "Anek Kannada", "Anek Latin", "Anek Malayalam", "Anek Odia", "Anek Tamil", "Anek Telugu", "Angkor", "Annie Use Your Telescope", "Anonymous Pro", "Antic", "Antic Didone", "Antic Slab", "Anton", "Antonio", "Anuphan", "Anybody", "Aoboshi One", "Arapey", "Arbutus", "Arbutus Slab", "Architects Daughter", "Archivo", "Archivo Black", "Archivo Narrow", "Are You Serious", "Aref Ruqaa", "Aref Ruqaa Ink", "Arima", "Arimo", "Arizonia", "Armata", "Arsenal", "Artifika", "Arvo", "Arya", "Asap", "Asap Condensed", "Asar", "Asset", "Assistant", "Astloch", "Asul", "Athiti", "Atkinson Hyperlegible", "Atma", "Atomic Age", "Aubrey", "Audiowide", "Autour One", "Average", "Average Sans", "Averia Gruesa Libre", "Averia Libre", "Averia Sans Libre", "Averia Serif Libre", "Azeret Mono", "B612", "B612 Mono", "BIZ UDGothic", "BIZ UDMincho", "BIZ UDPGothic", "BIZ UDPMincho", "Babylonica", "Bacasime Antique", "Bad Script", "Bagel Fat One", "Bahiana", "Bahianita", "Bai Jamjuree", "Bakbak One", "Ballet", "Baloo 2", "Baloo Bhai 2", "Baloo Bhaijaan 2", "Baloo Bhaina 2", "Baloo Chettan 2", "Baloo Da 2", "Baloo Paaji 2", "Baloo Tamma 2", "Baloo Tammudu 2", "Baloo Thambi 2", "Balsamiq Sans", "Balthazar", "Bangers", "Barlow", "Barlow Condensed", "Barlow Semi Condensed", "Barriecito", "Barrio", "Basic", "Baskervville", "Battambang", "Baumans", "Bayon", "Be Vietnam Pro", "Beau Rivage", "Bebas Neue", "Belanosima", "Belgrano", "Bellefair", "Belleza", "Bellota", "Bellota Text", "BenchNine", "Benne", "Bentham", "Berkshire Swash", "Besley", "Beth Ellen", "Bevan", "BhuTuka Expanded One", "Big Shoulders Display", "Big Shoulders Inline Display", "Big Shoulders Inline Text", "Big Shoulders Stencil Display", "Big Shoulders Stencil Text", "Big Shoulders Text", "Bigelow Rules", "Bigshot One", "Bilbo", "Bilbo Swash Caps", "BioRhyme", "BioRhyme Expanded", "Birthstone", "Birthstone Bounce", "Biryani", "Bitter", "Black And White Picture", "Black Han Sans", "Black Ops One", "Blaka", "Blaka Hollow", "Blaka Ink", "Blinker", "Bodoni Moda", "Bokor", "Bona Nova", "Bonbon", "Bonheur Royale", "Boogaloo", "Borel", "Bowlby One", "Bowlby One SC", "Braah One", "Brawler", "Bree Serif", "Bruno Ace", "Bruno Ace SC", "Brygada 1918", "Bubblegum Sans", "Bubbler One", "Buda", "Buenard", "Bungee", "Bungee Hairline", "Bungee Inline", "Bungee Outline", "Bungee Shade", "Bungee Spice", "Butcherman", "Butterfly Kids", "Cabin", "Cabin Condensed", "Cabin Sketch", "Caesar Dressing", "Cagliostro", "Cairo", "Cairo Play", "Caladea", "Calistoga", "Calligraffitti", "Cambay", "Cambo", "Candal", "Cantarell", "Cantata One", "Cantora One", "Caprasimo", "Capriola", "Caramel", "Carattere", "Cardo", "Carlito", "Carme", "Carrois Gothic", "Carrois Gothic SC", "Carter One", "Castoro", "Castoro Titling", "Catamaran", "Caudex", "Caveat", "Caveat Brush", "Cedarville Cursive", "Ceviche One", "Chakra Petch", "Changa", "Changa One", "Chango", "Charis SIL", "Charm", "Charmonman", "Chathura", "Chau Philomene One", "Chela One", "Chelsea Market", "Chenla", "Cherish", "Cherry Bomb One", "Cherry Cream Soda", "Cherry Swash", "Chewy", "Chicle", "Chilanka", "Chivo", "Chivo Mono", "Chokokutai", "Chonburi", "Cinzel", "Cinzel Decorative", "Clicker Script", "Climate Crisis", "Coda", "Codystar", "Coiny", "Combo", "Comfortaa", "Comforter", "Comforter Brush", "Comic Neue", "Coming Soon", "Comme", "Commissioner", "Concert One", "Condiment", "Content", "Contrail One", "Convergence", "Cookie", "Copse", "Corben", "Corinthia", "Cormorant", "Cormorant Garamond", "Cormorant Infant", "Cormorant SC", "Cormorant Unicase", "Cormorant Upright", "Courgette", "Courier Prime", "Cousine", "Coustard", "Covered By Your Grace", "Crafty Girls", "Creepster", "Crete Round", "Crimson Pro", "Crimson Text", "Croissant One", "Crushed", "Cuprum", "Cute Font", "Cutive", "Cutive Mono", "DM Mono", "DM Sans", "DM Serif Display", "DM Serif Text", "Dai Banna SIL", "Damion", "Dancing Script", "Dangrek", "Darker Grotesque", "Darumadrop One", "David Libre", "Dawning of a New Day", "Days One", "Dekko", "Dela Gothic One", "Delicious Handrawn", "Delius", "Delius Swash Caps", "Delius Unicase", "Della Respira", "Denk One", "Devonshire", "Dhurjati", "Didact Gothic", "Diphylleia", "Diplomata", "Diplomata SC", "Do Hyeon", "Dokdo", "Domine", "Donegal One", "Dongle", "Doppio One", "Dorsa", "Dosis", "DotGothic16", "Dr Sugiyama", "Duru Sans", "DynaPuff", "Dynalight", "EB Garamond", "Eagle Lake", "East Sea Dokdo", "Eater", "Economica", "Eczar", "Edu NSW ACT Foundation", "Edu QLD Beginner", "Edu SA Beginner", "Edu TAS Beginner", "Edu VIC WA NT Beginner", "El Messiri", "Electrolize", "Elsie", "Elsie Swash Caps", "Emblema One", "Emilys Candy", "Encode Sans", "Encode Sans Condensed", "Encode Sans Expanded", "Encode Sans SC", "Encode Sans Semi Condensed", "Encode Sans Semi Expanded", "Engagement", "Englebert", "Enriqueta", "Ephesis", "Epilogue", "Erica One", "Esteban", "Estonia", "Euphoria Script", "Ewert", "Exo", "Exo 2", "Expletus Sans", "Explora", "Fahkwang", "Familjen Grotesk", "Fanwood Text", "Farro", "Farsan", "Fascinate", "Fascinate Inline", "Faster One", "Fasthand", "Fauna One", "Faustina", "Federant", "Federo", "Felipa", "Fenix", "Festive", "Figtree", "Finger Paint", "Finlandica", "Fira Code", "Fira Mono", "Fira Sans", "Fira Sans Condensed", "Fira Sans Extra Condensed", "Fjalla One", "Fjord One", "Flamenco", "Flavors", "Fleur De Leah", "Flow Block", "Flow Circular", "Flow Rounded", "Foldit", "Fondamento", "Fontdiner Swanky", "Forum", "Fragment Mono", "Francois One", "Frank Ruhl Libre", "Fraunces", "Freckle Face", "Fredericka the Great", "Fredoka", "Freehand", "Fresca", "Frijole", "Fruktur", "Fugaz One", "Fuggles", "Fuzzy Bubbles", "GFS Didot", "GFS Neohellenic", "Gabriela", "Gaegu", "Gafata", "Gajraj One", "Galada", "Galdeano", "Galindo", "Gamja Flower", "Gantari", "Gasoek One", "Gayathri", "Gelasio", "Gemunu Libre", "Genos", "Gentium Book Plus", "Gentium Plus", "Geo", "Geologica", "Georama", "Geostar", "Geostar Fill", "Germania One", "Gideon Roman", "Gidugu", "Gilda Display", "Girassol", "Give You Glory", "Glass Antiqua", "Glegoo", "Gloock", "Gloria Hallelujah", "Glory", "Gluten", "Goblin One", "Gochi Hand", "Goldman", "Golos Text", "Gorditas", "Gothic A1", "Gotu", "Goudy Bookletter 1911", "Gowun Batang", "Gowun Dodum", "Graduate", "Grand Hotel", "Grandiflora One", "Grandstander", "Grape Nuts", "Gravitas One", "Great Vibes", "Grechen Fuemen", "Grenze", "Grenze Gotisch", "Grey Qo", "Griffy", "Gruppo", "Gudea", "Gugi", "Gulzar", "Gupter", "Gurajada", "Gwendolyn", "Habibi", "Hachi Maru Pop", "Hahmlet", "Halant", "Hammersmith One", "Hanalei", "Hanalei Fill", "Handjet", "Handlee", "Hanken Grotesk", "Hanuman", "Happy Monkey", "Harmattan", "Headland One", "Heebo", "Henny Penny", "Hepta Slab", "Herr Von Muellerhoff", "Hi Melody", "Hina Mincho", "Hind", "Hind Guntur", "Hind Madurai", "Hind Siliguri", "Hind Vadodara", "Holtwood One SC", "Homemade Apple", "Homenaje", "Hubballi", "Hurricane", "IBM Plex Mono", "IBM Plex Sans", "IBM Plex Sans Arabic", "IBM Plex Sans Condensed", "IBM Plex Sans Devanagari", "IBM Plex Sans Hebrew", "IBM Plex Sans JP", "IBM Plex Sans KR", "IBM Plex Sans Thai", "IBM Plex Sans Thai Looped", "IBM Plex Serif", "IM Fell DW Pica", "IM Fell DW Pica SC", "IM Fell Double Pica", "IM Fell Double Pica SC", "IM Fell English", "IM Fell English SC", "IM Fell French Canon", "IM Fell French Canon SC", "IM Fell Great Primer", "IM Fell Great Primer SC", "Ibarra Real Nova", "Iceberg", "Iceland", "Imbue", "Imperial Script", "Imprima", "Inconsolata", "Inder", "Indie Flower", "Ingrid Darling", "Inika", "Inknut Antiqua", "Inria Sans", "Inria Serif", "Inspiration", "Instrument Sans", "Instrument Serif", "Inter", "Inter Tight", "Irish Grover", "Island Moments", "Istok Web", "Italiana", "Italianno", "Itim", "Jacques Francois", "Jacques Francois Shadow", "Jaldi", "JetBrains Mono", "Jim Nightshade", "Joan", "Jockey One", "Jolly Lodger", "Jomhuria", "Jomolhari", "Josefin Sans", "Josefin Slab", "Jost", "Joti One", "Jua", "Judson", "Julee", "Julius Sans One", "Junge", "Jura", "Just Another Hand", "Just Me Again Down Here", "K2D", "Kablammo", "Kadwa", "Kaisei Decol", "Kaisei HarunoUmi", "Kaisei Opti", "Kaisei Tokumin", "Kalam", "Kameron", "Kanit", "Kantumruy Pro", "Karantina", "Karla", "Karma", "Katibeh", "Kaushan Script", "Kavivanar", "Kavoon", "Kdam Thmor Pro", "Keania One", "Kelly Slab", "Kenia", "Khand", "Khmer", "Khula", "Kings", "Kirang Haerang", "Kite One", "Kiwi Maru", "Klee One", "Knewave", "KoHo", "Kodchasan", "Koh Santepheap", "Kolker Brush", "Konkhmer Sleokchher", "Kosugi", "Kosugi Maru", "Kotta One", "Koulen", "Kranky", "Kreon", "Kristi", "Krona One", "Krub", "Kufam", "Kulim Park", "Kumar One", "Kumar One Outline", "Kumbh Sans", "Kurale", "La Belle Aurore", "Labrada", "Lacquer", "Laila", "Lakki Reddy", "Lalezar", "Lancelot", "Langar", "Lateef", "Lato", "Lavishly Yours", "League Gothic", "League Script", "League Spartan", "Leckerli One", "Ledger", "Lekton", "Lemon", "Lemonada", "Lexend", "Lexend Deca", "Lexend Exa", "Lexend Giga", "Lexend Mega", "Lexend Peta", "Lexend Tera", "Lexend Zetta", "Libre Barcode 128", "Libre Barcode 128 Text", "Libre Barcode 39", "Libre Barcode 39 Extended", "Libre Barcode 39 Extended Text", "Libre Barcode 39 Text", "Libre Barcode EAN13 Text", "Libre Baskerville", "Libre Bodoni", "Libre Caslon Display", "Libre Caslon Text", "Libre Franklin", "Licorice", "Life Savers", "Lilita One", "Lily Script One", "Limelight", "Linden Hill", "Lisu Bosa", "Literata", "Liu Jian Mao Cao", "Livvic", "Lobster", "Lobster Two", "Londrina Outline", "Londrina Shadow", "Londrina Sketch", "Londrina Solid", "Long Cang", "Lora", "Love Light", "Love Ya Like A Sister", "Loved by the King", "Lovers Quarrel", "Luckiest Guy", "Lugrasimo", "Lumanosimo", "Lunasima", "Lusitana", "Lustria", "Luxurious Roman", "Luxurious Script", "M PLUS 1", "M PLUS 1 Code", "M PLUS 1p", "M PLUS 2", "M PLUS Code Latin", "M PLUS Rounded 1c", "Ma Shan Zheng", "Macondo", "Macondo Swash Caps", "Mada", "Magra", "Maiden Orange", "Maitree", "Major Mono Display", "Mako", "Mali", "Mallanna", "Mandali", "Manjari", "Manrope", "Mansalva", "Manuale", "Marcellus", "Marcellus SC", "Marck Script", "Margarine", "Marhey", "Markazi Text", "Marko One", "Marmelad", "Martel", "Martel Sans", "Martian Mono", "Marvel", "Mate", "Mate SC", "Material Icons", "Material Icons Outlined", "Material Icons Round", "Material Icons Sharp", "Material Icons Two Tone", "Material Symbols Outlined", "Material Symbols Rounded", "Material Symbols Sharp", "Maven Pro", "McLaren", "Mea Culpa", "Meddon", "MedievalSharp", "Medula One", "Meera Inimai", "Megrim", "Meie Script", "Meow Script", "Merienda", "Merriweather", "Merriweather Sans", "Metal", "Metal Mania", "Metamorphous", "Metrophobic", "Michroma", "Milonga", "Miltonian", "Miltonian Tattoo", "Mina", "Mingzat", "Miniver", "Miriam Libre", "Mirza", "Miss Fajardose", "Mitr", "Mochiy Pop One", "Mochiy Pop P One", "Modak", "Modern Antiqua", "Mogra", "Mohave", "Moirai One", "Molengo", "Molle", "Monda", "Monofett", "Monomaniac One", "Monoton", "Monsieur La Doulaise", "Montaga", "Montagu Slab", "MonteCarlo", "Montez", "Montserrat", "Montserrat Alternates", "Montserrat Subrayada", "Moo Lah Lah", "Moon Dance", "Moul", "Moulpali", "Mountains of Christmas", "Mouse Memoirs", "Mr Bedfort", "Mr Dafoe", "Mr De Haviland", "Mrs Saint Delafield", "Mrs Sheppards", "Ms Madi", "Mukta", "Mukta Mahee", "Mukta Malar", "Mukta Vaani", "Mulish", "Murecho", "MuseoModerno", "My Soul", "Mynerve", "Mystery Quest", "NTR", "Nabla", "Nanum Brush Script", "Nanum Gothic", "Nanum Gothic Coding", "Nanum Myeongjo", "Nanum Pen Script", "Narnoor", "Neonderthaw", "Nerko One", "Neucha", "Neuton", "New Rocker", "New Tegomin", "News Cycle", "Newsreader", "Niconne", "Niramit", "Nixie One", "Nobile", "Nokora", "Norican", "Nosifer", "Notable", "Nothing You Could Do", "Noticia Text", "Noto Color Emoji", "Noto Emoji", "Noto Kufi Arabic", "Noto Music", "Noto Naskh Arabic", "Noto Nastaliq Urdu", "Noto Rashi Hebrew", "Noto Sans", "Noto Sans Adlam", "Noto Sans Adlam Unjoined", "Noto Sans Anatolian Hieroglyphs", "Noto Sans Arabic", "Noto Sans Armenian", "Noto Sans Avestan", "Noto Sans Balinese", "Noto Sans Bamum", "Noto Sans Bassa Vah", "Noto Sans Batak", "Noto Sans Bengali", "Noto Sans Bhaiksuki", "Noto Sans Brahmi", "Noto Sans Buginese", "Noto Sans Buhid", "Noto Sans Canadian Aboriginal", "Noto Sans Carian", "Noto Sans Caucasian Albanian", "Noto Sans Chakma", "Noto Sans Cham", "Noto Sans Cherokee", "Noto Sans Chorasmian", "Noto Sans Coptic", "Noto Sans Cuneiform", "Noto Sans Cypriot", "Noto Sans Cypro Minoan", "Noto Sans Deseret", "Noto Sans Devanagari", "Noto Sans Display", "Noto Sans Duployan", "Noto Sans Egyptian Hieroglyphs", "Noto Sans Elbasan", "Noto Sans Elymaic", "Noto Sans Ethiopic", "Noto Sans Georgian", "Noto Sans Glagolitic", "Noto Sans Gothic", "Noto Sans Grantha", "Noto Sans Gujarati", "Noto Sans Gunjala Gondi", "Noto Sans Gurmukhi", "Noto Sans HK", "Noto Sans Hanifi Rohingya", "Noto Sans Hanunoo", "Noto Sans Hatran", "Noto Sans Hebrew", "Noto Sans Imperial Aramaic", "Noto Sans Indic Siyaq Numbers", "Noto Sans Inscriptional Pahlavi", "Noto Sans Inscriptional Parthian", "Noto Sans JP", "Noto Sans Javanese", "Noto Sans KR", "Noto Sans Kaithi", "Noto Sans Kannada", "Noto Sans Kayah Li", "Noto Sans Kharoshthi", "Noto Sans Khmer", "Noto Sans Khojki", "Noto Sans Khudawadi", "Noto Sans Lao", "Noto Sans Lao Looped", "Noto Sans Lepcha", "Noto Sans Limbu", "Noto Sans Linear A", "Noto Sans Linear B", "Noto Sans Lisu", "Noto Sans Lycian", "Noto Sans Lydian", "Noto Sans Mahajani", "Noto Sans Malayalam", "Noto Sans Mandaic", "Noto Sans Manichaean", "Noto Sans Marchen", "Noto Sans Masaram Gondi", "Noto Sans Math", "Noto Sans Mayan Numerals", "Noto Sans Medefaidrin", "Noto Sans Meetei Mayek", "Noto Sans Mende Kikakui", "Noto Sans Meroitic", "Noto Sans Miao", "Noto Sans Modi", "Noto Sans Mongolian", "Noto Sans Mono", "Noto Sans Mro", "Noto Sans Multani", "Noto Sans Myanmar", "Noto Sans NKo", "Noto Sans Nabataean", "Noto Sans Nag Mundari", "Noto Sans Nandinagari", "Noto Sans New Tai Lue", "Noto Sans Newa", "Noto Sans Nushu", "Noto Sans Ogham", "Noto Sans Ol Chiki", "Noto Sans Old Hungarian", "Noto Sans Old Italic", "Noto Sans Old North Arabian", "Noto Sans Old Permic", "Noto Sans Old Persian", "Noto Sans Old Sogdian", "Noto Sans Old South Arabian", "Noto Sans Old Turkic", "Noto Sans Oriya", "Noto Sans Osage", "Noto Sans Osmanya", "Noto Sans Pahawh Hmong", "Noto Sans Palmyrene", "Noto Sans Pau Cin Hau", "Noto Sans Phags Pa", "Noto Sans Phoenician", "Noto Sans Psalter Pahlavi", "Noto Sans Rejang", "Noto Sans Runic", "Noto Sans SC", "Noto Sans Samaritan", "Noto Sans Saurashtra", "Noto Sans Sharada", "Noto Sans Shavian", "Noto Sans Siddham", "Noto Sans SignWriting", "Noto Sans Sinhala", "Noto Sans Sogdian", "Noto Sans Sora Sompeng", "Noto Sans Soyombo", "Noto Sans Sundanese", "Noto Sans Syloti Nagri", "Noto Sans Symbols", "Noto Sans Symbols 2", "Noto Sans Syriac", "Noto Sans Syriac Eastern", "Noto Sans TC", "Noto Sans Tagalog", "Noto Sans Tagbanwa", "Noto Sans Tai Le", "Noto Sans Tai Tham", "Noto Sans Tai Viet", "Noto Sans Takri", "Noto Sans Tamil", "Noto Sans Tamil Supplement", "Noto Sans Tangsa", "Noto Sans Telugu", "Noto Sans Thaana", "Noto Sans Thai", "Noto Sans Thai Looped", "Noto Sans Tifinagh", "Noto Sans Tirhuta", "Noto Sans Ugaritic", "Noto Sans Vai", "Noto Sans Vithkuqi", "Noto Sans Wancho", "Noto Sans Warang Citi", "Noto Sans Yi", "Noto Sans Zanabazar Square", "Noto Serif", "Noto Serif Ahom", "Noto Serif Armenian", "Noto Serif Balinese", "Noto Serif Bengali", "Noto Serif Devanagari", "Noto Serif Display", "Noto Serif Dogra", "Noto Serif Ethiopic", "Noto Serif Georgian", "Noto Serif Grantha", "Noto Serif Gujarati", "Noto Serif Gurmukhi", "Noto Serif HK", "Noto Serif Hebrew", "Noto Serif JP", "Noto Serif KR", "Noto Serif Kannada", "Noto Serif Khitan Small Script", "Noto Serif Khmer", "Noto Serif Khojki", "Noto Serif Lao", "Noto Serif Makasar", "Noto Serif Malayalam", "Noto Serif Myanmar", "Noto Serif NP Hmong", "Noto Serif Oriya", "Noto Serif Ottoman Siyaq", "Noto Serif SC", "Noto Serif Sinhala", "Noto Serif TC", "Noto Serif Tamil", "Noto Serif Tangut", "Noto Serif Telugu", "Noto Serif Thai", "Noto Serif Tibetan", "Noto Serif Toto", "Noto Serif Vithkuqi", "Noto Serif Yezidi", "Noto Traditional Nushu", "Nova Cut", "Nova Flat", "Nova Mono", "Nova Oval", "Nova Round", "Nova Script", "Nova Slim", "Nova Square", "Numans", "Nunito", "Nunito Sans", "Nuosu SIL", "Odibee Sans", "Odor Mean Chey", "Offside", "Oi", "Old Standard TT", "Oldenburg", "Ole", "Oleo Script", "Oleo Script Swash Caps", "Oooh Baby", "Open Sans", "Oranienbaum", "Orbit", "Orbitron", "Oregano", "Orelega One", "Orienta", "Original Surfer", "Oswald", "Outfit", "Over the Rainbow", "Overlock", "Overlock SC", "Overpass", "Overpass Mono", "Ovo", "Oxanium", "Oxygen", "Oxygen Mono", "PT Mono", "PT Sans", "PT Sans Caption", "PT Sans Narrow", "PT Serif", "PT Serif Caption", "Pacifico", "Padauk", "Padyakke Expanded One", "Palanquin", "Palanquin Dark", "Palette Mosaic", "Pangolin", "Paprika", "Parisienne", "Passero One", "Passion One", "Passions Conflict", "Pathway Extreme", "Pathway Gothic One", "Patrick Hand", "Patrick Hand SC", "Pattaya", "Patua One", "Pavanam", "Paytone One", "Peddana", "Peralta", "Permanent Marker", "Petemoss", "Petit Formal Script", "Petrona", "Philosopher", "Phudu", "Piazzolla", "Piedra", "Pinyon Script", "Pirata One", "Plaster", "Play", "Playball", "Playfair", "Playfair Display", "Playfair Display SC", "Plus Jakarta Sans", "Podkova", "Poiret One", "Poller One", "Poltawski Nowy", "Poly", "Pompiere", "Pontano Sans", "Poor Story", "Poppins", "Port Lligat Sans", "Port Lligat Slab", "Potta One", "Pragati Narrow", "Praise", "Prata", "Preahvihear", "Press Start 2P", "Pridi", "Princess Sofia", "Prociono", "Prompt", "Prosto One", "Proza Libre", "Public Sans", "Puppies Play", "Puritan", "Purple Purse", "Qahiri", "Quando", "Quantico", "Quattrocento", "Quattrocento Sans", "Questrial", "Quicksand", "Quintessential", "Qwigley", "Qwitcher Grypen", "REM", "Racing Sans One", "Radio Canada", "Radley", "Rajdhani", "Rakkas", "Raleway", "Raleway Dots", "Ramabhadra", "Ramaraja", "Rambla", "Rammetto One", "Rampart One", "Ranchers", "Rancho", "Ranga", "Rasa", "Rationale", "Ravi Prakash", "Readex Pro", "Recursive", "Red Hat Display", "Red Hat Mono", "Red Hat Text", "Red Rose", "Redacted", "Redacted Script", "Redressed", "Reem Kufi", "Reem Kufi Fun", "Reem Kufi Ink", "Reenie Beanie", "Reggae One", "Revalia", "Rhodium Libre", "Ribeye", "Ribeye Marrow", "Righteous", "Risque", "Road Rage", "Roboto", "Roboto Condensed", "Roboto Flex", "Roboto Mono", "Roboto Serif", "Roboto Slab", "Rochester", "Rock 3D", "Rock Salt", "RocknRoll One", "Rokkitt", "Romanesco", "Ropa Sans", "Rosario", "Rosarivo", "Rouge Script", "Rowdies", "Rozha One", "Rubik", "Rubik 80s Fade", "Rubik Beastly", "Rubik Bubbles", "Rubik Burned", "Rubik Dirt", "Rubik Distressed", "Rubik Gemstones", "Rubik Glitch", "Rubik Iso", "Rubik Marker Hatch", "Rubik Maze", "Rubik Microbe", "Rubik Mono One", "Rubik Moonrocks", "Rubik Pixels", "Rubik Puddles", "Rubik Spray Paint", "Rubik Storm", "Rubik Vinyl", "Rubik Wet Paint", "Ruda", "Rufina", "Ruge Boogie", "Ruluko", "Rum Raisin", "Ruslan Display", "Russo One", "Ruthie", "Rye", "STIX Two Text", "Sacramento", "Sahitya", "Sail", "Saira", "Saira Condensed", "Saira Extra Condensed", "Saira Semi Condensed", "Saira Stencil One", "Salsa", "Sanchez", "Sancreek", "Sansita", "Sansita Swashed", "Sarabun", "Sarala", "Sarina", "Sarpanch", "Sassy Frass", "Satisfy", "Sawarabi Gothic", "Sawarabi Mincho", "Scada", "Scheherazade New", "Schibsted Grotesk", "Schoolbell", "Scope One", "Seaweed Script", "Secular One", "Sedgwick Ave", "Sedgwick Ave Display", "Sen", "Send Flowers", "Sevillana", "Seymour One", "Shadows Into Light", "Shadows Into Light Two", "Shalimar", "Shantell Sans", "Shanti", "Share", "Share Tech", "Share Tech Mono", "Shippori Antique", "Shippori Antique B1", "Shippori Mincho", "Shippori Mincho B1", "Shizuru", "Shojumaru", "Short Stack", "Shrikhand", "Siemreap", "Sigmar", "Sigmar One", "Signika", "Signika Negative", "Silkscreen", "Simonetta", "Single Day", "Sintony", "Sirin Stencil", "Six Caps", "Skranji", "Slabo 13px", "Slabo 27px", "Slackey", "Slackside One", "Smokum", "Smooch", "Smooch Sans", "Smythe", "Sniglet", "Snippet", "Snowburst One", "Sofadi One", "Sofia", "Sofia Sans", "Sofia Sans Condensed", "Sofia Sans Extra Condensed", "Sofia Sans Semi Condensed", "Solitreo", "Solway", "Song Myung", "Sono", "Sonsie One", "Sora", "Sorts Mill Goudy", "Source Code Pro", "Source Sans 3", "Source Serif 4", "Space Grotesk", "Space Mono", "Special Elite", "Spectral", "Spectral SC", "Spicy Rice", "Spinnaker", "Spirax", "Splash", "Spline Sans", "Spline Sans Mono", "Squada One", "Square Peg", "Sree Krushnadevaraya", "Sriracha", "Srisakdi", "Staatliches", "Stalemate", "Stalinist One", "Stardos Stencil", "Stick", "Stick No Bills", "Stint Ultra Condensed", "Stint Ultra Expanded", "Stoke", "Strait", "Style Script", "Stylish", "Sue Ellen Francisco", "Suez One", "Sulphur Point", "Sumana", "Sunflower", "Sunshiney", "Supermercado One", "Sura", "Suranna", "Suravaram", "Suwannaphum", "Swanky and Moo Moo", "Syncopate", "Syne", "Syne Mono", "Syne Tactile", "Tai Heritage Pro", "Tajawal", "Tangerine", "Tapestry", "Taprom", "Tauri", "Taviraj", "Teko", "Tektur", "Telex", "Tenali Ramakrishna", "Tenor Sans", "Text Me One", "Texturina", "Thasadith", "The Girl Next Door", "The Nautigal", "Tienne", "Tillana", "Tilt Neon", "Tilt Prism", "Tilt Warp", "Timmana", "Tinos", "Tiro Bangla", "Tiro Devanagari Hindi", "Tiro Devanagari Marathi", "Tiro Devanagari Sanskrit", "Tiro Gurmukhi", "Tiro Kannada", "Tiro Tamil", "Tiro Telugu", "Titan One", "Titillium Web", "Tomorrow", "Tourney", "Trade Winds", "Train One", "Trirong", "Trispace", "Trocchi", "Trochut", "Truculenta", "Trykker", "Tsukimi Rounded", "Tulpen One", "Turret Road", "Twinkle Star", "Ubuntu", "Ubuntu Condensed", "Ubuntu Mono", "Uchen", "Ultra", "Unbounded", "Uncial Antiqua", "Underdog", "Unica One", "UnifrakturCook", "UnifrakturMaguntia", "Unkempt", "Unlock", "Unna", "Updock", "Urbanist", "VT323", "Vampiro One", "Varela", "Varela Round", "Varta", "Vast Shadow", "Vazirmatn", "Vesper Libre", "Viaoda Libre", "Vibes", "Vibur", "Victor Mono", "Vidaloka", "Viga", "Vina Sans", "Voces", "Volkhov", "Vollkorn", "Vollkorn SC", "Voltaire", "Vujahday Script", "Waiting for the Sunrise", "Wallpoet", "Walter Turncoat", "Warnes", "Water Brush", "Waterfall", "Wellfleet", "Wendy One", "Whisper", "WindSong", "Wire One", "Wix Madefor Display", "Wix Madefor Text", "Work Sans", "Xanh Mono", "Yaldevi", "Yanone Kaffeesatz", "Yantramanav", "Yatra One", "Yellowtail", "Yeon Sung", "Yeseva One", "Yesteryear", "Yomogi", "Yrsa", "Ysabeau", "Ysabeau Infant", "Ysabeau Office", "Ysabeau SC", "Yuji Boku", "Yuji Hentaigana Akari", "Yuji Hentaigana Akebono", "Yuji Mai", "Yuji Syuku", "Yusei Magic", "ZCOOL KuaiLe", "ZCOOL QingKe HuangYou", "ZCOOL XiaoWei", "Zen Antique", "Zen Antique Soft", "Zen Dots", "Zen Kaku Gothic Antique", "Zen Kaku Gothic New", "Zen Kurenaido", "Zen Loop", "Zen Maru Gothic", "Zen Old Mincho", "Zen Tokyo Zoo", "Zeyada", "Zhi Mang Xing", "Zilla Slab", "Zilla Slab Highlight"];
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '' : props.val;
  const [fonts, setfonts] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val == null || props.val == undefined || props.val.length == 0 ? [] : valZ.split(','));
  const [keyword, setkeyword] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
  const [fontsFiltered, setfontsFiltered] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: " mt-4"
  }, !isLoaded && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Spinner, null)), isLoaded && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(react_sortablejs__WEBPACK_IMPORTED_MODULE_2__.ReactSortable, {
    list: fonts,
    setList: item => {
      console.log(item);
      setfonts(item);
      props.onChange(item.toString(), 'fontFamily');
    }
  }, fonts.map((font, i) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      key: i,
      className: "flex my-3 items-center justify-between cursor-move hover:bg-gray-300"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex items-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-red-500 p-1 mr-2 cursor-pointer ",
      onClick: ev => {
        fonts.splice(i, 1);
        setfonts(fonts);
        props.onChange(fonts.toString(), 'fontFamily');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"], {
      fill: "#fff",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      style: {
        fontFamily: font
      }
    }, font)), i == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-yellow-500 p-1"
    }, "Primary"));
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: keyword,
    type: "text",
    autocomplete: "off",
    onChange: newVal => {
      setkeyword(newVal);
      var newValX = newVal.replace(/[^a-zA-Z ]/g, "");
      var newOptions = [];
      fontsLibrary.map(font => {
        let position = font.toLowerCase().search(newValX.toLowerCase());

        if (position < 0) {} else {
          newOptions.push(font);
        }
      });
      console.log(newOptions);
      setfontsFiltered(newOptions);
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "bg-gray-400 text-white p-1 px-2 cursor-pointer",
    onClick: ev => {
      fonts.unshift(keyword);
      var fontsY = fonts.slice(0, 3);
      setfonts(fontsY); //setfonts(fonts);

      props.onChange(fontsY.toString(), 'fontFamily');
    }
  }, "Add")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-3 h-60 overflow-y-scroll"
  }, keyword.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, fontsLibrary.map(font => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-1 my-1 bg-white hover:bg-gray-300 border flex items-center cursor-pointer",
      style: {
        fontFamily: font
      },
      onClick: ev => {
        var fontsX = fonts.unshift(font);
        var fontsY = fonts.slice(0, 3);
        setfonts(fontsY);
        props.onChange(fontsY.toString(), 'fontFamily');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"]
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, " ", font));
  })), keyword.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, fontsFiltered.map(font => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-1 my-1 bg-white hover:bg-gray-300 border flex items-center cursor-pointer",
      style: {
        fontFamily: font
      },
      onClick: ev => {
        var fontsX = fonts.unshift(font);
        var fontsY = fonts.slice(0, 3);
        setfonts(fontsY); //setfonts(fonts);

        props.onChange(fonts.toString(), 'fontFamily');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"]
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, " ", font));
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null));
}

class PGcssFontFamily extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true,
      isLoaded: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  componentDidMount() {
    setTimeout(() => {
      this.setState(state => ({
        isLoaded: !state.isLoaded
      }));
    }, 1000);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning,
      isLoaded: this.state.isLoaded
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontFamily);

/***/ }),

/***/ "./src/components/css-font-size/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-font-size/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    } // large: { "label": "large", "value": "large" },
    // larger: { "label": "larger", "value": "larger" },
    // medium: { "label": "medium", "value": "medium" },
    // small: { "label": "small", "value": "small" },
    // smaller: { "label": "smaller", "value": "smaller" },
    // "x-large": { "label": "x-large", "value": "x-large" },
    // "x-small": { "label": "x-small", "value": "x-small" },
    // "xx-large": { "label": "xx-large", "value": "xx-large" },
    // "xx-small": { "label": "xx-small", "value": "xx-small" },
    // "xxx-large": { "label": "xxx-large", "value": "xxx-large" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },
    // initial: { "label": "initial", "value": "initial" },
    // inherit: { "label": "inherit", "value": "inherit" },

  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g) == null ? 0 : valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    step: "0.01",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'fontSize');
        } else {
          props.onChange(widthUnit, 'fontSize');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'fontSize');
        } else {
          props.onChange(newVal + widthUnit, 'fontSize');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'fontSize');
            } else {
              props.onChange(x.value, 'fontSize');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'fontSize');
            } else {
              props.onChange(widthVal + x.value, 'fontSize');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'fontSize');
        } else {
          props.onChange(widthVal + widthUnit, 'fontSize');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'fontSize');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'fontSize');
        }
      }
    }
  }));
}

class PGcssFontSize extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontSize);

/***/ }),

/***/ "./src/components/css-font-stretch/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-font-stretch/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    'ultra-condensed': {
      "label": "ultra-condensed",
      "value": "ultra-condensed"
    },
    'extra-condensed': {
      "label": "extra-condensed",
      "value": "extra-condensed"
    },
    'condensed': {
      "label": "condensed",
      "value": "condensed"
    },
    'semi-condensed': {
      "label": "semi-condensed",
      "value": "semi-condensed"
    },
    'normal': {
      "label": "normal",
      "value": "normal"
    },
    'semi-expanded': {
      "label": "semi-expanded",
      "value": "semi-expanded"
    },
    'expanded': {
      "label": "expanded",
      "value": "expanded"
    },
    'extra-expanded': {
      "label": "extra-expanded",
      "value": "extra-expanded"
    },
    'ultra-expanded': {
      "label": "ultra-expanded",
      "value": "ultra-expanded"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'fontStretch');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'fontStretch');
          } else {
            props.onChange(x.value, 'fontStretch');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'fontStretch');
      } else {
        props.onChange(align + ' !important', 'fontStretch');
      }
    }
  }));
}

class PGcssFontStretch extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontStretch);

/***/ }),

/***/ "./src/components/css-font-style/index.js":
/*!************************************************!*\
  !*** ./src/components/css-font-style/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    normal: {
      "label": "normal",
      "value": "normal"
    },
    italic: {
      "label": "italic",
      "value": "italic"
    },
    oblique: {
      "label": "oblique",
      "value": "oblique"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'fontStyle');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'fontStyle');
          } else {
            props.onChange(x.value, 'fontStyle');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'fontStyle');
      } else {
        props.onChange(align + ' !important', 'fontStyle');
      }
    }
  }));
}

class PGcssFontStyle extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontStyle);

/***/ }),

/***/ "./src/components/css-font-variant-caps/index.js":
/*!*******************************************************!*\
  !*** ./src/components/css-font-variant-caps/index.js ***!
  \*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    'normal': {
      "label": "normal",
      "value": "normal"
    },
    'small-caps': {
      "label": "small-caps",
      "value": "small-caps"
    },
    'all-small-caps': {
      "label": "all-small-caps",
      "value": "all-small-caps"
    },
    'petite-caps': {
      "label": "petite-caps",
      "value": "petite-caps"
    },
    'all-petite-caps': {
      "label": "all-petite-caps",
      "value": "all-petite-caps"
    },
    'unicase': {
      "label": "unicase",
      "value": "unicase"
    },
    'titling-caps': {
      "label": "titling-caps",
      "value": "titling-caps"
    },
    'initial': {
      "label": "initial",
      "value": "initial"
    },
    'inherit': {
      "label": "inherit",
      "value": "inherit"
    },
    'unset': {
      "label": "unset",
      "value": "unset"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'fontVariantCaps');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'fontVariantCaps');
          } else {
            props.onChange(x.value, 'fontVariantCaps');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'fontVariantCaps');
      } else {
        props.onChange(align + ' !important', 'fontVariantCaps');
      }
    }
  }));
}

class PGcssFontVariantCaps extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontVariantCaps);

/***/ }),

/***/ "./src/components/css-font-weight/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-font-weight/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    'normal': {
      "label": "normal",
      "value": "normal"
    },
    'bold': {
      "label": "bold",
      "value": "bold"
    },
    'bolder': {
      "label": "bolder",
      "value": "bolder"
    },
    'lighter': {
      "label": "lighter",
      "value": "lighter"
    },
    '100': {
      "label": "100",
      "value": "100"
    },
    '200': {
      "label": "200",
      "value": "200"
    },
    '300': {
      "label": "300",
      "value": "300"
    },
    '400': {
      "label": "400",
      "value": "400"
    },
    '500': {
      "label": "500",
      "value": "500"
    },
    '600': {
      "label": "600",
      "value": "600"
    },
    '700': {
      "label": "700",
      "value": "700"
    },
    '800': {
      "label": "800",
      "value": "800"
    },
    '900': {
      "label": "900",
      "value": "900"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'fontWeight');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'fontWeight');
          } else {
            props.onChange(x.value, 'fontWeight');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'fontWeight');
      } else {
        props.onChange(align + ' !important', 'fontWeight');
      }
    }
  }));
}

class PGcssFontWeight extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontWeight);

/***/ }),

/***/ "./src/components/css-gap/index.js":
/*!*****************************************!*\
  !*** ./src/components/css-gap/index.js ***!
  \*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'gap');
        } else {
          props.onChange(widthUnit, 'gap');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'gap');
        } else {
          props.onChange(newVal + widthUnit, 'gap');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'gap');
            } else {
              props.onChange(x.value, 'gap');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'gap');
            } else {
              props.onChange(widthVal + x.value, 'gap');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'gap');
        } else {
          props.onChange(widthVal + widthUnit, 'gap');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'gap');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'gap');
        }
      }
    }
  }));
}

class PGcssGap extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGap);

/***/ }),

/***/ "./src/components/css-grid-column-end/index.js":
/*!*****************************************************!*\
  !*** ./src/components/css-grid-column-end/index.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4 justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal); // props.onChange(newVal, 'gridColumnEnd');

      if (isImportant) {
        props.onChange(newVal + ' !important', 'gridColumnEnd');
      } else {
        props.onChange(newVal, 'gridColumnEnd');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthVal, 'gridColumnEnd');
      } else {
        props.onChange(widthVal + ' !important', 'gridColumnEnd');
      }
    }
  }));
}

class PGcssGridColumnEnd extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridColumnEnd);

/***/ }),

/***/ "./src/components/css-grid-column-start/index.js":
/*!*******************************************************!*\
  !*** ./src/components/css-grid-column-start/index.js ***!
  \*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal); // props.onChange(newVal, 'gridColumnStart');

      if (isImportant) {
        props.onChange(newVal + ' !important', 'gridColumnStart');
      } else {
        props.onChange(newVal, 'gridColumnStart');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthVal, 'gridColumnStart');
      } else {
        props.onChange(widthVal + ' !important', 'gridColumnStart');
      }
    }
  }));
}

class PGcssGridColumnStart extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridColumnStart);

/***/ }),

/***/ "./src/components/css-grid-row-end/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-grid-row-end/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal); // props.onChange(newVal, 'gridRowEnd');

      if (isImportant) {
        props.onChange(newVal + ' !important', 'gridRowEnd');
      } else {
        props.onChange(newVal, 'gridRowEnd');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthVal, 'gridRowEnd');
      } else {
        props.onChange(widthVal + ' !important', 'gridRowEnd');
      }
    }
  }));
}

class PGcssGridRowEnd extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridRowEnd);

/***/ }),

/***/ "./src/components/css-grid-row-start/index.js":
/*!****************************************************!*\
  !*** ./src/components/css-grid-row-start/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4 justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal); // props.onChange(newVal, 'gridRowStart');

      if (isImportant) {
        props.onChange(newVal + ' !important', 'gridRowStart');
      } else {
        props.onChange(newVal, 'gridRowStart');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthVal, 'gridRowStart');
      } else {
        props.onChange(widthVal + ' !important', 'gridRowStart');
      }
    }
  }));
}

class PGcssGridRowStart extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridRowStart);

/***/ }),

/***/ "./src/components/css-grid-template-columns/index.js":
/*!***********************************************************!*\
  !*** ./src/components/css-grid-template-columns/index.js ***!
  \***********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");

const {
  Component,
  RawHTML
} = wp.element;







function Html(props) {
  if (!props.warn) {
    return null;
  }

  console.log(props.val); //var valParts = ['1fr', '1fr', '1fr'];

  var valParts = props.val == undefined || props.val == null || props.val.length == 0 ? ['1fr'] : props.val.split(" ");
  var unitArgs = {
    fr: {
      "label": "FR",
      "value": "fr"
    },
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    // "%": { "label": "%", "value": "%" },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    } // none: { "label": "none", "value": "none" },
    // inherit: { "label": "inherit", "value": "inherit" },
    // initial: { "label": "initial", "value": "initial" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },

  };
  const [valArgs, setvalArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valParts);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {}, [props.val]);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "bg-green-600 hover:bg-green-500 rounded-sm inline-block cursor-pointer text-white px-3 py-1 my-4",
    onClick: ev => {
      var valArgsX = valArgs.concat('1fr');
      setvalArgs(valArgsX);
      console.log(valArgsX.join(' '));
      props.onChange(valArgsX.join(' '), 'gridTemplateColumns');
    }
  }, "Add"), valArgs.map((part, index) => {
    var valNumber = part.match(/-?\d+/g) != null ? part.match(/-?\d+/g)[0] : 1;
    var valUnit = part.match(/[a-zA-Z%]+/g) != null ? part.match(/[a-zA-Z%]+/g)[0] : 'fr';
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between items-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-red-500  inline-block hover:bg-red-400 mx-3 p-1 cursor-pointer",
      onClick: ev => {
        valArgs.splice(index, 1);
        setvalArgs(valArgs);
        props.onChange(valArgs.join(' '), 'gridTemplateColumns');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
      fill: "#fff",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: valNumber,
      type: "number",
      onChange: newVal => {
        var valIndex = newVal + valUnit;
        valArgs[index] = valIndex;
        setvalArgs(valArgs);
        props.onChange(valArgs.join(' '), 'gridTemplateColumns');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom right",
      renderToggle: _ref => {
        let {
          isOpen,
          onToggle
        } = _ref;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: " "
        }, valUnit != undefined ? unitArgs[valUnit].label : 'Select...'));
      },
      renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "w-32"
      }, Object.entries(unitArgs).map(y => {
        var j = y[0];
        var x = y[1];
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
          onClick: ev => {
            console.log(index); //props.onChange(valNumber + x.value, 'border');

            var valIndex = valNumber + x.value;
            valArgs[index] = valIndex;
            setvalArgs(valArgs);
            props.onChange(valArgs.join(' '), 'gridTemplateColumns');
          }
        }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
      }))
    }))));
  }));
}

class PGcssGridTemplateColumns extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridTemplateColumns);

/***/ }),

/***/ "./src/components/css-grid-template-rows/index.js":
/*!********************************************************!*\
  !*** ./src/components/css-grid-template-rows/index.js ***!
  \********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");

const {
  Component,
  RawHTML
} = wp.element;







function Html(props) {
  if (!props.warn) {
    return null;
  } //var valParts = ['1fr', '1fr', '1fr'];


  var valParts = props.val == undefined || props.val == null || props.val.length == 0 ? ['1fr'] : props.val.split(" ");
  var unitArgs = {
    fr: {
      "label": "FR",
      "value": "fr"
    },
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    // "%": { "label": "%", "value": "%" },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    } // none: { "label": "none", "value": "none" },
    // inherit: { "label": "inherit", "value": "inherit" },
    // initial: { "label": "initial", "value": "initial" },
    // revert: { "label": "revert", "value": "revert" },
    // unset: { "label": "unset", "value": "unset" },

  };
  const [valArgs, setvalArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valParts);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {}, [props.val]);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "bg-green-600 hover:bg-green-500 rounded-sm inline-block cursor-pointer text-white px-3 py-1 my-4",
    onClick: ev => {
      var valArgsX = valArgs.concat('1fr');
      setvalArgs(valArgsX);
      console.log(valArgsX.join(' '));
      props.onChange(valArgsX.join(' '), 'gridTemplateRows');
    }
  }, "Add"), valArgs.map((part, index) => {
    var valNumber = part.match(/-?\d+/g) != null ? part.match(/-?\d+/g)[0] : 1;
    var valUnit = part.match(/[a-zA-Z%]+/g) != null ? part.match(/[a-zA-Z%]+/g)[0] : 'fr';
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between items-center"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-red-500  inline-block hover:bg-red-400 mx-3 p-1 cursor-pointer",
      onClick: ev => {
        valArgs.splice(index, 1);
        setvalArgs(valArgs);
        props.onChange(valArgs.join(' '), 'gridTemplateRows');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
      fill: "#fff",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: valNumber,
      type: "number",
      onChange: newVal => {
        var valIndex = newVal + valUnit;
        valArgs[index] = valIndex;
        setvalArgs(valArgs);
        props.onChange(valArgs.join(' '), 'gridTemplateRows');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom right",
      renderToggle: _ref => {
        let {
          isOpen,
          onToggle
        } = _ref;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: " "
        }, valUnit != undefined ? unitArgs[valUnit].label : 'Select...'));
      },
      renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "w-32"
      }, Object.entries(unitArgs).map(y => {
        var j = y[0];
        var x = y[1];
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
          onClick: ev => {
            console.log(index); //props.onChange(valNumber + x.value, 'border');

            var valIndex = valNumber + x.value;
            valArgs[index] = valIndex;
            setvalArgs(valArgs);
            props.onChange(valArgs.join(' '), 'gridTemplateRows');
          }
        }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
      }))
    }))));
  }));
}

class PGcssGridTemplateRows extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridTemplateRows);

/***/ }),

/***/ "./src/components/css-height/index.js":
/*!********************************************!*\
  !*** ./src/components/css-height/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };

  if (typeof props.val == 'object') {
    var valZ = props.val.val + props.val.unit;
  } else {
    var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  }

  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  var widthValX = valArgs[0] == undefined || valArgs[0].match(/-?\d+/g) == null ? 0 : valArgs[0].match(/-?\d+/g)[0];
  var widthUnitX = valArgs[0] == undefined || valArgs[0].match(/[a-zA-Z%]+/g) == null ? 'px' : valArgs[0].match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal); // if (widthUnit == 'auto') {
      //   props.onChange(widthUnit, 'height');
      // } else {
      //   props.onChange(newVal + widthUnit, 'height');
      // }

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'height');
        } else {
          props.onChange(widthUnit, 'height');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'height');
        } else {
          props.onChange(newVal + widthUnit, 'height');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'height');
            } else {
              props.onChange(x.value, 'height');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'height');
            } else {
              props.onChange(widthVal + x.value, 'height');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'height');
        } else {
          props.onChange(widthVal + widthUnit, 'height');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'height');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'height');
        }
      }
    }
  }));
}

class PGcssHeight extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssHeight);

/***/ }),

/***/ "./src/components/css-justify-content/index.js":
/*!*****************************************************!*\
  !*** ./src/components/css-justify-content/index.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    start: {
      "label": "start",
      "value": "start"
    },
    end: {
      "label": "end",
      "value": "end"
    },
    left: {
      "label": "left",
      "value": "left"
    },
    center: {
      "label": "center",
      "value": "center"
    },
    right: {
      "label": "right",
      "value": "right"
    },
    stretch: {
      "label": "stretch",
      "value": "stretch"
    },
    'flex-start': {
      "label": "flex start	",
      "value": "flex-start"
    },
    'flex-end': {
      "label": "flex end	",
      "value": "flex-end"
    },
    'space-between': {
      "label": "space between",
      "value": "space-between"
    },
    'space-around': {
      "label": "space around",
      "value": "space-around"
    },
    'space-evenly': {
      "label": "space evenly",
      "value": "space-evenly"
    },
    normal: {
      "label": "normal",
      "value": "normal"
    },
    start: {
      "label": "start",
      "value": "start"
    },
    baseline: {
      "label": "baseline",
      "value": "baseline"
    },
    revert: {
      "label": "revert",
      "value": "revert"
    },
    unset: {
      "label": "unset",
      "value": "unset"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Align Content",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // props.onChange(x.value, 'justifyContent');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'justifyContent');
          } else {
            props.onChange(x.value, 'justifyContent');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'justifyContent');
      } else {
        props.onChange(align + ' !important', 'justifyContent');
      }
    }
  }));
}

class PGcssJustifyContent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssJustifyContent);

/***/ }),

/***/ "./src/components/css-keyframes/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-keyframes/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");

const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }

  var [debounce, setDebounce] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Using the hook.

  var [keyframesX, setkeyframesX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.keyframes); // Using the hook.

  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    console.log('useEffect');
    console.log(keyframesX);
    props.onChange(keyframesX);
  }, [keyframesX]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    console.log('useEffect');
    console.log(props.keyframes);
  }, [props.keyframes]);

  function FrameTitle(_ref) {
    let {
      entryIndex,
      frameIndex
    } = _ref;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-red-500 text-white p-1 mr-1 rounded-sm ",
      onClick: ev => {
        console.log(frameIndex);
        var keyframes = { ...keyframesX
        };
        delete keyframes[entryIndex].frames[frameIndex];
        setkeyframesX(keyframes);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"], {
      fill: "#fff",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, frameIndex), "%");
  }

  function EntryTitle(_ref2) {
    let {
      entryIndex,
      name
    } = _ref2;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-red-500 text-white p-1 mr-1 rounded-sm ",
      onClick: ev => {
        var keyframes = { ...keyframesX
        };
        delete keyframes[entryIndex];
        setkeyframesX(keyframes);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"], {
      fill: "#fff",
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, name));
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: " mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "bg-blue-500 inline-block cursor-pointer my-3 text-white px-3 py-2",
    onClick: ev => {
      var length = Object.entries(keyframesX).length;
      const d = new Date();
      let time = d.getTime();
      var keyframes = { ...keyframesX
      };
      keyframes[time] = {
        name: 'pgAnimate' + (length + 1),
        frames: {
          '0': {
            'background-color': 'red'
          },
          '100': {
            'background-color': 'yellow',
            left: '0px',
            top: '0px'
          }
        }
      };
      setkeyframesX(keyframes);
    }
  }, "Add"), Object.entries(keyframesX).map(entry => {
    var entryIndex = entry[0];
    var args = entry[1];
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
      title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(EntryTitle, {
        name: args.name,
        entryIndex: entryIndex
      }),
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Animation Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      type: "text",
      className: "mr-2",
      value: args.name,
      onChange: newVal => {
        var keyframes = { ...keyframesX
        };
        keyframes[entryIndex]['name'] = newVal;
        setkeyframesX(keyframes);
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-blue-500 inline-block cursor-pointer my-2 text-white px-3 py-2",
      onClick: ev => {
        var keyframes = { ...keyframesX
        };
        var frames = keyframes[entryIndex].frames;
        console.log(frames); // var num = Math.random() * 100;
        // var numX = Math.floor(num);
        // console.log(numX);
        //frames[40] = { 'background-color': 'red' }
        //setkeyframesX(keyframes);
      }
    }, "Add"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-5"
    }, Object.entries(args.frames).map(x => {
      var frameIndex = x[0];
      var frameAttr = x[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
        title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(FrameTitle, {
          entryIndex: entryIndex,
          frameIndex: frameIndex
        }),
        initialOpen: false
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
        for: ""
      }, "Frame Step"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
        type: "number",
        className: "mr-2",
        value: frameIndex,
        onChange: newVal => {
          var keyframes = { ...keyframesX
          };
          var framesArgs = keyframes[entryIndex].frames[frameIndex];
          keyframes[entryIndex].frames[newVal] = framesArgs;
          delete keyframes[entryIndex].frames[frameIndex];
          setkeyframesX(keyframes);
        }
      }), "%"), Object.entries(frameAttr).map(attr => {
        var attrIndex = attr[0];
        var attrVal = attr[1];
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, attrIndex);
      }));
    })));
  }));
}

class PGcssKeyframes extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      keyframes,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      keyframes: keyframes,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssKeyframes);

/***/ }),

/***/ "./src/components/css-left/index.js":
/*!******************************************!*\
  !*** ./src/components/css-left/index.js ***!
  \******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };

  if (typeof props.val == 'object') {
    var valZ = props.val.val + props.val.unit;
  } else {
    var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  }

  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'left');
        } else {
          props.onChange(widthUnit, 'left');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'left');
        } else {
          props.onChange(newVal + widthUnit, 'left');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'left');
            } else {
              props.onChange(x.value, 'left');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'left');
            } else {
              props.onChange(widthVal + x.value, 'left');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'left');
        } else {
          props.onChange(widthVal + widthUnit, 'left');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'left');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'left');
        }
      }
    }
  }));
}

class PGcssLeft extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssLeft);

/***/ }),

/***/ "./src/components/css-letter-spacing/index.js":
/*!****************************************************!*\
  !*** ./src/components/css-letter-spacing/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g) == null ? 0 : valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'letterSpacing');
        } else {
          props.onChange(widthUnit, 'letterSpacing');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'letterSpacing');
        } else {
          props.onChange(newVal + widthUnit, 'letterSpacing');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Letter Spacing",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, props.val ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'letterSpacing');
            } else {
              props.onChange(x.value, 'letterSpacing');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'letterSpacing');
            } else {
              props.onChange(widthVal + x.value, 'letterSpacing');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'letterSpacing');
        } else {
          props.onChange(widthVal + widthUnit, 'letterSpacing');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'letterSpacing');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'letterSpacing');
        }
      }
    }
  }));
}

class PGcssLetterSpacing extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssLetterSpacing);

/***/ }),

/***/ "./src/components/css-library/index.js":
/*!*********************************************!*\
  !*** ./src/components/css-library/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/styles.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/line-dotted.js");
/* harmony import */ var html2canvas__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! html2canvas */ "./node_modules/html2canvas/dist/html2canvas.js");
/* harmony import */ var html2canvas__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(html2canvas__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var html_to_image__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! html-to-image */ "./node_modules/html-to-image/es/index.js");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6__);

const {
  Component
} = wp.element;











function Html(props) {
  if (!props.warn) {
    return null;
  }

  const [queryCss, setQueryCss] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    keyword: '',
    page: 1,
    category: '',
    isReset: true
  });
  var [cssLibrary, setCssLibrary] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    items: []
  });
  var [cssLibraryCats, setCssLibraryCats] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]);
  var [isLoading, setIsLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
  var [debounce, setDebounce] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Using the hook.

  var [sudoPicker, setsudoPicker] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Using the hook.

  var [cssSubmission, setCssSubmission] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    enable: false,
    title: '',
    category: "",
    tags: "",
    thumb: '',
    email: '',
    status: '',
    // idle => ready to submit, busy => submission process, falied => submission falied, success=> Successfully submitted!
    successMessage: 'Successfully submitted!',
    failedMessage: 'Submission was failed!',
    idleMessage: 'Submit to CSS Library',
    message: '',
    timeout: 2
  });
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    fetchCss();
  }, [queryCss]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_6___default()({
      path: '/post-grid/v2/get_site_details',
      method: 'POST',
      data: {}
    }).then(res => {
      //
      //setEmailSubscribe({ ...userDetails, email: res.email, status: res.subscribe_status });
      setCssSubmission({ ...cssSubmission,
        email: res.email
      });
    });
  }, []);

  function fetchCss() {
    setIsLoading(true);
    var postData = {
      keyword: queryCss.keyword,
      page: queryCss.page,
      category: queryCss.category
    };
    postData = JSON.stringify(postData);
    fetch("https://getpostgrid.com/wp-json/post-grid/v2/get_post_css", {
      method: "POST",
      headers: {
        "Content-Type": "application/json;charset=utf-8"
      },
      body: postData
    }).then(response => {
      if (response.ok && response.status < 400) {
        response.json().then(res => {
          var isReset = queryCss.isReset;

          if (isReset) {
            var items = res.posts;
          } else {
            res.posts.map(item => {
              console.log(item);
              cssLibrary.items.push(item);
            });
            var items = cssLibrary.items;
          } //console.log(items);


          setCssLibrary({
            items: items
          });
          setCssLibraryCats(res.terms);
          setIsLoading(false);
        });
      }
    }).catch(_error => {//this.saveAsStatus = 'error';
      // handle the error
    });
  }

  const htmlToImageCapt = () => {
    const eleementToCapture = document.querySelector('.' + props.blockId);
    console.log(eleementToCapture);
    html_to_image__WEBPACK_IMPORTED_MODULE_5__.toPng(eleementToCapture).then(function (dataUrl) {
      console.log(dataUrl);
      setCssSubmission({ ...cssSubmission,
        thumb: dataUrl
      }); //download(dataUrl, 'my-node.png');
    });
  };

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: " mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tabs__WEBPACK_IMPORTED_MODULE_2__["default"], {
    activeTab: "cssItems",
    orientation: "horizontal",
    activeClass: "active-tab",
    onSelect: tabName => {},
    tabs: [{
      name: 'cssItems',
      title: 'Library',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"],
      className: 'tab-cssItems'
    }, {
      name: 'submit',
      title: 'Submission',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"],
      className: 'tab-submit'
    }]
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_3__["default"], {
    name: "cssItems"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: queryCss.keyword,
    type: "text",
    placeholder: "Search Styles...",
    onChange: newVal => {
      clearTimeout(debounce);
      debounce = setTimeout(() => {
        setQueryCss({
          keyword: newVal,
          page: 1,
          category: queryCss.category,
          isReset: true
        });
      }, 1000); //fetchLayouts();
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
    className: "w-full",
    style: {
      margin: 0
    },
    label: "",
    value: queryCss.category,
    options: cssLibraryCats,
    onChange: newVal => {
      setQueryCss({
        keyword: queryCss.keyword,
        page: 1,
        category: newVal,
        isReset: true
      }); //fetchLayouts();
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "items"
  }, cssLibrary.items.map(x => {
    var objCss = JSON.parse(x.post_content); //console.log(objCss);

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: " border py-2 my-3 "
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
      src: x.thumb_url,
      alt: "",
      onClick: ev => {
        //console.log(objCss);
        // var objCss = {
        //   styles: { "backgroundColor": { "Desktop": "#9DD6DF" }, "textAlign": { "Desktop": "center" }, "border": { "Desktop": "5px dashed #000000" } }, hover: { "border": { "Desktop": "2px dashed #A084CF" } }
        // }
        props.onChange(objCss);
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-2 mt-3 flex justify-between align-middle"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
      className: "",
      target: "_blank",
      href: x.url
    }, x.post_title), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "hover:bg-slate-300 p-2 cursor-pointer relative",
      onClick: ev => {
        setsudoPicker(sudoPicker => {
          return sudoPicker == null ? x.ID : null;
        });
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__["default"]
    })), sudoPicker == x.ID && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
      position: "bottom left"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32 p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-2 cursor-pointer hover:bg-slate-300",
      onClick: ev => {
        props.onChange(objCss);
      }
    }, "Apply All"), Object.entries(objCss).map(item => {
      var sudoIndex = item[0];
      var sudoArgs = item[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "p-2 cursor-pointer hover:bg-slate-300",
        onClick: ev => {
          var css = {};
          css[sudoIndex] = objCss[sudoIndex];
          console.log(css);
          props.onChange(css);
        }
      }, sudoIndex);
    })))));
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "w-full rounded-sm  py-2 bg-blue-500 text-[14px] font-bold text-white cursor-pointer my-3 text-center",
    onClick: _ev => {
      var page = queryCss.page + 1;
      setQueryCss({
        keyword: queryCss.keyword,
        page: page,
        category: queryCss.category,
        isReset: false
      });
    }
  }, isLoading == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "text-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Spinner, null)), "Load More")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_tab__WEBPACK_IMPORTED_MODULE_3__["default"], {
    name: "submit"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Item Title"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    className: "w-full",
    value: cssSubmission.title,
    type: "text",
    placeholder: "Ex: Blue Button",
    onChange: newVal => {
      setCssSubmission({ ...cssSubmission,
        title: newVal
      });
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Choose category"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
    className: "w-full",
    style: {
      margin: 0
    },
    label: "",
    value: cssSubmission.category,
    options: cssLibraryCats,
    onChange: newVal => {
      setCssSubmission({ ...cssSubmission,
        category: newVal
      });
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Add Some Tags"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    className: "w-full",
    value: cssSubmission.tags,
    type: "text",
    placeholder: "button, blue button",
    onChange: newVal => {
      setCssSubmission({ ...cssSubmission,
        tags: newVal
      });
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    onClick: htmlToImageCapt,
    className: "bg-green-700 text-white p-3 px-5 cursor-pointer"
  }, "Take Screenshot"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Preview Thumbnail"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
    src: cssSubmission.thumb
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Your Email"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    className: "w-full",
    value: cssSubmission.email,
    type: "text",
    placeholder: "",
    onChange: newVal => {
      setCssSubmission({ ...cssSubmission,
        email: newVal
      });
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "bg-blue-500 my-5 px-10 py-3 text-white cursor-pointer text-center rounded-sm mb-5",
    onClick: ev => {
      setIsLoading(true);
      setCssSubmission({ ...cssSubmission,
        status: 'busy'
      });
      var objX = Object.assign({}, props.obj);

      if (objX.options != undefined) {
        delete objX.options;
      }

      var postData = {
        title: cssSubmission.title,
        content: objX,
        thumb: cssSubmission.thumb,
        category: cssSubmission.category,
        tags: cssSubmission.tags
      };
      postData = JSON.stringify(postData);
      fetch("https://getpostgrid.com/wp-json/post-grid/v2/submit_css", {
        method: "POST",
        headers: {
          "Content-Type": "application/json;charset=utf-8"
        },
        body: postData
      }).then(response => {
        if (response.ok && response.status < 400) {
          response.json().then(res => {
            if (res.status == 'success') {
              setCssSubmission({ ...cssSubmission,
                status: 'success',
                message: res.message
              });
              setTimeout(() => {
                setCssSubmission({ ...cssSubmission,
                  status: 'idle',
                  message: res.message
                });
              }, 3000);
            } else {
              setCssSubmission({ ...cssSubmission,
                status: 'falied',
                message: res.message
              });
              setTimeout(() => {
                setCssSubmission({ ...cssSubmission,
                  status: 'idle',
                  message: res.message
                });
              }, 3000);
            }
          });
        }
      }).catch(_error => {//this.saveAsStatus = 'error';
        // handle the error
      });
    }
  }, "Submit to CSS Library", cssSubmission.status == 'busy' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "text-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Spinner, null))), cssSubmission.status == 'success' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: " font-bold text-green-700"
  }, cssSubmission.successMessage), cssSubmission.status == 'falied' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: " font-bold text-red-500"
  }, cssSubmission.failedMessage), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", null, cssSubmission.message)))));
}

class PGCssLibrary extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      blockId,
      obj,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      blockId: blockId,
      obj: obj,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGCssLibrary);

/***/ }),

/***/ "./src/components/css-line-height/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-line-height/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g) == null ? 0 : valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'lineHeight');
        } else {
          props.onChange(widthUnit, 'lineHeight');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'lineHeight');
        } else {
          props.onChange(newVal + widthUnit, 'lineHeight');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'lineHeight');
            } else {
              props.onChange(x.value, 'lineHeight');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'lineHeight');
            } else {
              props.onChange(widthVal + x.value, 'lineHeight');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'lineHeight');
        } else {
          props.onChange(widthVal + widthUnit, 'lineHeight');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'lineHeight');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'lineHeight');
        }
      }
    }
  }));
}

class PGcssLineHeight extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssLineHeight);

/***/ }),

/***/ "./src/components/css-list-style/index.js":
/*!************************************************!*\
  !*** ./src/components/css-list-style/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__);
const {
  Component,
  RawHTML
} = wp.element;







function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val != undefined ? props.val.split(" ") : ['square', 'inside', 'url("sqpurple.gif")'];
  var type = valParts[0] != undefined ? valParts[0] : 'square';
  var position = valParts[1] != undefined ? valParts[1] : 'inside';
  var image = valParts[2] != undefined ? valParts[2] : 'url("sqpurple.gif")';
  var imageVal = image.replace('url("', '');
  imageVal = imageVal.replace('")', '');
  var typeArgs = [{
    label: 'Select..',
    value: ''
  }, {
    label: 'disc',
    value: 'disc'
  }, {
    label: 'armenian',
    value: 'armenian'
  }, {
    label: 'circle',
    value: 'circle'
  }, {
    label: 'cjk-ideographic',
    value: 'cjk-ideographic'
  }, {
    label: 'decimal',
    value: 'decimal'
  }, {
    label: 'decimal-leading-zero',
    value: 'decimal-leading-zero'
  }, {
    label: 'georgian',
    value: 'georgian'
  }, {
    label: 'hebrew',
    value: 'hebrew'
  }, {
    label: 'hiragana',
    value: 'hiragana'
  }, {
    label: 'hiragana-iroha',
    value: 'hiragana-iroha'
  }, {
    label: 'katakana',
    value: 'katakana'
  }, {
    label: 'katakana-iroha',
    value: 'katakana-iroha'
  }, {
    label: 'lower-alpha',
    value: 'lower-alpha'
  }, {
    label: 'lower-greek',
    value: 'lower-greek'
  }, {
    label: 'lower-latin',
    value: 'lower-latin'
  }, {
    label: 'lower-roman',
    value: 'lower-roman'
  }, {
    label: 'square',
    value: 'square'
  }, {
    label: 'upper-alpha',
    value: 'upper-alpha'
  }, {
    label: 'upper-greek',
    value: 'upper-greek'
  }, {
    label: 'upper-latin',
    value: 'upper-latin'
  }, {
    label: 'upper-roman',
    value: 'upper-roman'
  }, {
    label: 'none',
    value: 'none'
  }];
  const ALLOWED_MEDIA_TYPES = ['image'];
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "Type"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_3__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: typeArgs,
    buttonTitle: type,
    onChange: (option, index) => {
      props.onChange(option.value + ' ' + position + ' ' + image, 'listStyle');
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_3__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: [{
      label: 'inside',
      value: 'inside'
    }, {
      label: 'outside',
      value: 'outside'
    }],
    buttonTitle: position,
    onChange: (option, index) => {
      props.onChange(type + ' ' + option.value + ' ' + image, 'listStyle');
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "my-3"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("img", {
    src: imageVal,
    alt: ""
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.MediaUploadCheck, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__.MediaUpload, {
    class: "bg-blue-500",
    onSelect: media => {
      // media.id
      props.onChange(type + ' ' + position + ' url("' + media.url + '")', 'listStyle');
    },
    onClose: () => {},
    allowedTypes: ALLOWED_MEDIA_TYPES,
    render: _ref => {
      let {
        open
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
        className: "my-3 bg-blue-500 text-white border border-solid border-gray-300 text-center w-full",
        onClick: open
      }, "Open Media Library");
    }
  })));
}

class PGcssListStyle extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssListStyle);

/***/ }),

/***/ "./src/components/css-margin-bottom/index.js":
/*!***************************************************!*\
  !*** ./src/components/css-margin-bottom/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'marginBottom');
        } else {
          props.onChange(widthUnit, 'marginBottom');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'marginBottom');
        } else {
          props.onChange(newVal + widthUnit, 'marginBottom');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'marginBottom');
            } else {
              props.onChange(x.value, 'marginBottom');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'marginBottom');
            } else {
              props.onChange(widthVal + x.value, 'marginBottom');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'marginBottom');
        } else {
          props.onChange(widthVal + widthUnit, 'marginBottom');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'marginBottom');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'marginBottom');
        }
      }
    }
  }));
}

class PGcssMarginBottom extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMarginBottom);

/***/ }),

/***/ "./src/components/css-margin-left/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-margin-left/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'marginLeft');
        } else {
          props.onChange(widthUnit, 'marginLeft');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'marginLeft');
        } else {
          props.onChange(newVal + widthUnit, 'marginLeft');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'marginLeft');
            } else {
              props.onChange(x.value, 'marginLeft');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'marginLeft');
            } else {
              props.onChange(widthVal + x.value, 'marginLeft');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'marginLeft');
        } else {
          props.onChange(widthVal + widthUnit, 'marginLeft');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'marginLeft');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'marginLeft');
        }
      }
    }
  }));
}

class PGcssMarginLeft extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMarginLeft);

/***/ }),

/***/ "./src/components/css-margin-right/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-margin-right/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'marginRight');
        } else {
          props.onChange(widthUnit, 'marginRight');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'marginRight');
        } else {
          props.onChange(newVal + widthUnit, 'marginRight');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'marginRight');
            } else {
              props.onChange(x.value, 'marginRight');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'marginRight');
            } else {
              props.onChange(widthVal + x.value, 'marginRight');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'marginRight');
        } else {
          props.onChange(widthVal + widthUnit, 'marginRight');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'marginRight');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'marginRight');
        }
      }
    }
  }));
}

class PGcssMarginRight extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMarginRight);

/***/ }),

/***/ "./src/components/css-margin-top/index.js":
/*!************************************************!*\
  !*** ./src/components/css-margin-top/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'marginTop');
        } else {
          props.onChange(widthUnit, 'marginTop');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'marginTop');
        } else {
          props.onChange(newVal + widthUnit, 'marginTop');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'marginTop');
            } else {
              props.onChange(x.value, 'marginTop');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'marginTop');
            } else {
              props.onChange(widthVal + x.value, 'marginTop');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'marginTop');
        } else {
          props.onChange(widthVal + widthUnit, 'marginTop');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'marginTop');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'marginTop');
        }
      }
    }
  }));
}

class PGcssMarginTop extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMarginTop);

/***/ }),

/***/ "./src/components/css-margin/index.js":
/*!********************************************!*\
  !*** ./src/components/css-margin/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
const {
  Component,
  RawHTML
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }

  var important = '';

  if (typeof props.val == 'object') {
    var topX = props.val.top;
    var rightX = props.val.right;
    var bottomX = props.val.bottom;
    var leftX = props.val.left;
    var important = '';
  } else {
    var valParts = props.val != undefined ? props.val.split(" ") : ['5px', '5px', '5px', '5px', ''];
    var topX = valParts[0];
    var rightX = valParts[1];
    var bottomX = valParts[2];
    var leftX = valParts[3];
    var important = valParts[4];
  }

  const [valX, setvalX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
    top: topX,
    right: rightX,
    bottom: bottomX,
    left: leftX
  });
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(valParts.includes("!important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalBoxControl, {
    label: "",
    values: valX,
    onChange: nextValues => {
      // setvalX({ top: nextValues.top, right: nextValues.right, bottom: nextValues.bottom, left: nextValues.left })
      // props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left, 'margin');
      setvalX({
        top: nextValues.top,
        right: nextValues.right,
        bottom: nextValues.bottom,
        left: nextValues.left
      });

      if (isImportant) {
        props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left + ' !important', 'margin');
      } else {
        props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left, 'margin');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(valX.top + ' ' + valX.right + ' ' + valX.bottom + ' ' + valX.left, 'margin');
      } else {
        props.onChange(valX.top + ' ' + valX.right + ' ' + valX.bottom + ' ' + valX.left + ' !important', 'margin');
      }
    }
  }));
}

class PGcssMargin extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMargin);

/***/ }),

/***/ "./src/components/css-max-height/index.js":
/*!************************************************!*\
  !*** ./src/components/css-max-height/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'maxHeight');
        } else {
          props.onChange(widthUnit, 'maxHeight');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'maxHeight');
        } else {
          props.onChange(newVal + widthUnit, 'maxHeight');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'maxHeight');
            } else {
              props.onChange(x.value, 'maxHeight');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'maxHeight');
            } else {
              props.onChange(widthVal + x.value, 'maxHeight');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'maxHeight');
        } else {
          props.onChange(widthVal + widthUnit, 'maxHeight');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'maxHeight');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'maxHeight');
        }
      }
    }
  }));
}

class PGcssMaxHeight extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMaxHeight);

/***/ }),

/***/ "./src/components/css-max-width/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-max-width/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };

  if (typeof props.val == 'object') {
    var valZ = props.val.val + props.val.unit;
  } else {
    var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  }

  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  var widthValX = valArgs[0] == undefined || valArgs[0].match(/-?\d+/g) == null ? 0 : valArgs[0].match(/-?\d+/g)[0];
  var widthUnitX = valArgs[0] == undefined || valArgs[0].match(/[a-zA-Z%]+/g) == null ? 'px' : valArgs[0].match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'maxWidth');
        } else {
          props.onChange(widthUnit, 'maxWidth');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'maxWidth');
        } else {
          props.onChange(newVal + widthUnit, 'maxWidth');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'maxWidth');
            } else {
              props.onChange(x.value, 'maxWidth');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'maxWidth');
            } else {
              props.onChange(widthVal + x.value, 'maxWidth');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'maxWidth');
        } else {
          props.onChange(widthVal + widthUnit, 'maxWidth');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'maxWidth');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'maxWidth');
        }
      }
    }
  }));
}

class PGcssMaxWidth extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMaxWidth);

/***/ }),

/***/ "./src/components/css-min-height/index.js":
/*!************************************************!*\
  !*** ./src/components/css-min-height/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'minHeight');
        } else {
          props.onChange(widthUnit, 'minHeight');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'minHeight');
        } else {
          props.onChange(newVal + widthUnit, 'minHeight');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'minHeight');
            } else {
              props.onChange(x.value, 'minHeight');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'minHeight');
            } else {
              props.onChange(widthVal + x.value, 'minHeight');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'minHeight');
        } else {
          props.onChange(widthVal + widthUnit, 'minHeight');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'minHeight');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'minHeight');
        }
      }
    }
  }));
}

class PGcssMinHeight extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMinHeight);

/***/ }),

/***/ "./src/components/css-min-width/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-min-width/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };

  if (typeof props.val == 'object') {
    var valZ = props.val.val + props.val.unit;
  } else {
    var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  }

  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  var widthValX = valArgs[0] == undefined || valArgs[0].match(/-?\d+/g) == null ? 0 : valArgs[0].match(/-?\d+/g)[0];
  var widthUnitX = valArgs[0] == undefined || valArgs[0].match(/[a-zA-Z%]+/g) == null ? 'px' : valArgs[0].match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'minWidth');
        } else {
          props.onChange(widthUnit, 'minWidth');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'minWidth');
        } else {
          props.onChange(newVal + widthUnit, 'minWidth');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'minWidth');
            } else {
              props.onChange(x.value, 'minWidth');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'minWidth');
            } else {
              props.onChange(widthVal + x.value, 'minWidth');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'minWidth');
        } else {
          props.onChange(widthVal + widthUnit, 'minWidth');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'minWidth');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'minWidth');
        }
      }
    }
  }));
}

class PGcssMinWidth extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMinWidth);

/***/ }),

/***/ "./src/components/css-object-fit/index.js":
/*!************************************************!*\
  !*** ./src/components/css-object-fit/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    fill: {
      "label": "fill",
      "value": "fill"
    },
    contain: {
      "label": "contain",
      "value": "contain"
    },
    cover: {
      "label": "cover",
      "value": "cover"
    },
    'scale-down': {
      "label": "scale-down",
      "value": "scale-down"
    },
    none: {
      "label": "none",
      "value": "none"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'objectFit');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'objectFit');
          } else {
            props.onChange(x.value, 'objectFit');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'objectFit');
      } else {
        props.onChange(align + ' !important', 'objectFit');
      }
    }
  }));
}

class PGcssObjectFit extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssObjectFit);

/***/ }),

/***/ "./src/components/css-opacity/index.js":
/*!*********************************************!*\
  !*** ./src/components/css-opacity/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: " mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.RangeControl, {
    value: props.val,
    min: "0",
    max: "1",
    step: "0.01",
    onChange: newVal => {
      props.onChange(newVal, 'opacity');
    }
  }));
}

class PGcssOpacity extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOpacity);

/***/ }),

/***/ "./src/components/css-order/index.js":
/*!*******************************************!*\
  !*** ./src/components/css-order/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0' : props.val;
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);

      if (isImportant) {
        props.onChange(newVal + ' !important', 'order');
      } else {
        props.onChange(newVal, 'order');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthVal, 'order');
      } else {
        props.onChange(widthVal + ' !important', 'order');
      }
    }
  }));
}

class PGcssOrder extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOrder);

/***/ }),

/***/ "./src/components/css-outline-offset/index.js":
/*!****************************************************!*\
  !*** ./src/components/css-outline-offset/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);
      props.onChange(newVal + widthUnit, 'outlineOffset');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, props.val ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);
          props.onChange(widthVal + x.value, 'outlineOffset');
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })));
}

class PGcssOutlineOffset extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOutlineOffset);

/***/ }),

/***/ "./src/components/css-outline/index.js":
/*!*********************************************!*\
  !*** ./src/components/css-outline/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");

const {
  Component,
  RawHTML
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '10px solid #50547d4f' : props.val;
  var blur = valZ != undefined ? parseInt(valZ.split(" ")[0].match(/-?\d+/g)[0]) : 2;
  var style = valZ != undefined ? valZ.split(" ")[1] : 'solid';
  var color = valZ != undefined ? valZ.split(" ")[2] : '#dddddd';
  var styleArgs = {
    none: {
      "label": "None",
      "value": "none"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    dotted: {
      "label": "Dotted",
      "value": "dotted"
    },
    dashed: {
      "label": "Dashed",
      "value": "dashed"
    },
    solid: {
      "label": "Solid",
      "value": "solid"
    },
    double: {
      "label": "Double",
      "value": "double"
    },
    groove: {
      "label": "Groove",
      "value": "groove"
    },
    ridge: {
      "label": "Ridge",
      "value": "ridge"
    },
    inset: {
      "label": "Inset",
      "value": "inset"
    },
    outset: {
      "label": "Outset",
      "value": "outset"
    }
  };
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Width")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.RangeControl, {
    min: "0",
    max: "100",
    step: "1",
    value: blur,
    onChange: newVal => {
      props.onChange(+newVal + 'px ' + style + ' ' + color, 'outline');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Style"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: styleArgs,
    buttonTitle: styleArgs[style] == undefined ? 'Choose' : styleArgs[style].label,
    onChange: (option, index) => {
      props.onChange(blur + 'px ' + option.value + ' ' + color, 'outline');
    },
    values: ""
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    for: ""
  }, "Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
    value: color,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_1__["default"],
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(blur + 'px ' + style + ' ' + newVal, 'outline');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(blur + 'px' + ' ' + style + ' ' + color, 'outline');
      } else {
        props.onChange(blur + 'px' + ' ' + style + ' ' + color + ' !important', 'outline');
      }
    }
  }));
}

class PGcssoutline extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssoutline);

/***/ }),

/***/ "./src/components/css-overflow-x/index.js":
/*!************************************************!*\
  !*** ./src/components/css-overflow-x/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    scroll: {
      "label": "Scroll",
      "value": "scroll"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    auto: {
      "label": "Auto",
      "value": "auto"
    },
    visible: {
      "label": "Visible",
      "value": "visible"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'overflowX');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'overflowX');
          } else {
            props.onChange(x.value, 'overflowX');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'overflowX');
      } else {
        props.onChange(align + ' !important', 'overflowX');
      }
    }
  }));
}

class PGcssOverflowX extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOverflowX);

/***/ }),

/***/ "./src/components/css-overflow-y/index.js":
/*!************************************************!*\
  !*** ./src/components/css-overflow-y/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    scroll: {
      "label": "Scroll",
      "value": "scroll"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    auto: {
      "label": "Auto",
      "value": "auto"
    },
    visible: {
      "label": "Visible",
      "value": "visible"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'overflowY');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'overflowY');
          } else {
            props.onChange(x.value, 'overflowY');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'overflowY');
      } else {
        props.onChange(align + ' !important', 'overflowY');
      }
    }
  }));
}

class PGcssOverflowY extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOverflowY);

/***/ }),

/***/ "./src/components/css-overflow/index.js":
/*!**********************************************!*\
  !*** ./src/components/css-overflow/index.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    scroll: {
      "label": "Scroll",
      "value": "scroll"
    },
    hidden: {
      "label": "Hidden",
      "value": "hidden"
    },
    auto: {
      "label": "Auto",
      "value": "auto"
    },
    clip: {
      "label": "Clip",
      "value": "clip"
    },
    visible: {
      "label": "Visible",
      "value": "visible"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'overflow');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'overflow');
          } else {
            props.onChange(x.value, 'overflow');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'overflow');
      } else {
        props.onChange(align + ' !important', 'overflow');
      }
    }
  }));
}

class PGcssOverflow extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOverflow);

/***/ }),

/***/ "./src/components/css-padding-bottom/index.js":
/*!****************************************************!*\
  !*** ./src/components/css-padding-bottom/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'paddingBottom');
        } else {
          props.onChange(widthUnit, 'paddingBottom');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'paddingBottom');
        } else {
          props.onChange(newVal + widthUnit, 'paddingBottom');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'paddingBottom');
            } else {
              props.onChange(x.value, 'paddingBottom');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'paddingBottom');
            } else {
              props.onChange(widthVal + x.value, 'paddingBottom');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'paddingBottom');
        } else {
          props.onChange(widthVal + widthUnit, 'paddingBottom');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'paddingBottom');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'paddingBottom');
        }
      }
    }
  }));
}

class PGcssPaddingBottom extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPaddingBottom);

/***/ }),

/***/ "./src/components/css-padding-left/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-padding-left/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'paddingLeft');
        } else {
          props.onChange(widthUnit, 'paddingLeft');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'paddingLeft');
        } else {
          props.onChange(newVal + widthUnit, 'paddingLeft');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'paddingLeft');
            } else {
              props.onChange(x.value, 'paddingLeft');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'paddingLeft');
            } else {
              props.onChange(widthVal + x.value, 'paddingLeft');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'paddingLeft');
        } else {
          props.onChange(widthVal + widthUnit, 'paddingLeft');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'paddingLeft');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'paddingLeft');
        }
      }
    }
  }));
}

class PGcssPaddingLeft extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPaddingLeft);

/***/ }),

/***/ "./src/components/css-padding-right/index.js":
/*!***************************************************!*\
  !*** ./src/components/css-padding-right/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'paddingRight');
        } else {
          props.onChange(widthUnit, 'paddingRight');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'paddingRight');
        } else {
          props.onChange(newVal + widthUnit, 'paddingRight');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'paddingRight');
            } else {
              props.onChange(x.value, 'paddingRight');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'paddingRight');
            } else {
              props.onChange(widthVal + x.value, 'paddingRight');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'paddingRight');
        } else {
          props.onChange(widthVal + widthUnit, 'paddingRight');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'paddingRight');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'paddingRight');
        }
      }
    }
  }));
}

class PGcssPaddingRight extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPaddingRight);

/***/ }),

/***/ "./src/components/css-padding-top/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-padding-top/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  console.log(props.val);
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'paddingTop');
        } else {
          props.onChange(widthUnit, 'paddingTop');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'paddingTop');
        } else {
          props.onChange(newVal + widthUnit, 'paddingTop');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'paddingTop');
            } else {
              props.onChange(x.value, 'paddingTop');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'paddingTop');
            } else {
              props.onChange(widthVal + x.value, 'paddingTop');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'paddingTop');
        } else {
          props.onChange(widthVal + widthUnit, 'paddingTop');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'paddingTop');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'paddingTop');
        }
      }
    }
  }));
}

class PGcssPaddingTop extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPaddingTop);

/***/ }),

/***/ "./src/components/css-padding/index.js":
/*!*********************************************!*\
  !*** ./src/components/css-padding/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
const {
  Component,
  RawHTML
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }

  var important = '';

  if (typeof props.val == 'object') {
    var topX = props.val.top;
    var rightX = props.val.right;
    var bottomX = props.val.bottom;
    var leftX = props.val.left;
    var important = '';
  } else {
    var valParts = props.val != undefined ? props.val.split(" ") : ['5px', '5px', '5px', '5px', ''];
    var topX = valParts[0];
    var rightX = valParts[1];
    var bottomX = valParts[2];
    var leftX = valParts[3];
    var important = valParts[4];
  }

  const [valX, setvalX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
    top: topX,
    right: rightX,
    bottom: bottomX,
    left: leftX
  });
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(valParts.includes("!important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalBoxControl, {
    label: "",
    values: valX,
    onChange: nextValues => {
      // setvalX({ top: nextValues.top, right: nextValues.right, bottom: nextValues.bottom, left: nextValues.left })
      // props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left, 'padding');
      setvalX({
        top: nextValues.top,
        right: nextValues.right,
        bottom: nextValues.bottom,
        left: nextValues.left
      });

      if (isImportant) {
        props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left + ' !important', 'padding');
      } else {
        props.onChange(nextValues.top + ' ' + nextValues.right + ' ' + nextValues.bottom + ' ' + nextValues.left, 'padding');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(valX.top + ' ' + valX.right + ' ' + valX.bottom + ' ' + valX.left, 'padding');
      } else {
        props.onChange(valX.top + ' ' + valX.right + ' ' + valX.bottom + ' ' + valX.left + ' !important', 'padding');
      }
    }
  }));
}

class PGcssPadding extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPadding);

/***/ }),

/***/ "./src/components/css-perspective/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-perspective/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'perspective');
        } else {
          props.onChange(widthUnit, 'perspective');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'perspective');
        } else {
          props.onChange(newVal + widthUnit, 'perspective');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, props.val ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'perspective');
            } else {
              props.onChange(x.value, 'perspective');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'perspective');
            } else {
              props.onChange(widthVal + x.value, 'perspective');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'perspective');
        } else {
          props.onChange(widthVal + widthUnit, 'perspective');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'perspective');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'perspective');
        }
      }
    }
  }));
}

class PGcssPerspective extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPerspective);

/***/ }),

/***/ "./src/components/css-position/index.js":
/*!**********************************************!*\
  !*** ./src/components/css-position/index.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    static: {
      "label": "static",
      "value": "static"
    },
    absolute: {
      "label": "absolute",
      "value": "absolute"
    },
    fixed: {
      "label": "fixed",
      "value": "fixed"
    },
    relative: {
      "label": "relative",
      "value": "relative"
    },
    sticky: {
      "label": "sticky",
      "value": "sticky"
    }
  };
  var valX = props.val == undefined || props.val == null || props.val.length == 0 ? 'relative' : props.val;
  console.log('props.val', props.val);
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valX.split(" "));
  const [value, setValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  console.log('value', value);
  console.log('isImportant', isImportant);
  console.log('args[value]', args[value]);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[value] == undefined ? 'Select...' : args[value].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setValue(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'position');
          } else {
            props.onChange(x.value, 'position');
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    label: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(value, 'position');
      } else {
        props.onChange(value + ' !important', 'position');
      }
    }
  }));
}

class PGcssPosition extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPosition);

/***/ }),

/***/ "./src/components/css-right/index.js":
/*!*******************************************!*\
  !*** ./src/components/css-right/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'right');
        } else {
          props.onChange(widthUnit, 'right');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'right');
        } else {
          props.onChange(newVal + widthUnit, 'right');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'right');
            } else {
              props.onChange(x.value, 'right');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'right');
            } else {
              props.onChange(widthVal + x.value, 'right');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'right');
        } else {
          props.onChange(widthVal + widthUnit, 'right');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'right');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'right');
        }
      }
    }
  }));
}

class PGcssRight extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssRight);

/***/ }),

/***/ "./src/components/css-row-gap/index.js":
/*!*********************************************!*\
  !*** ./src/components/css-row-gap/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'rowGap');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'rowGap');
        } else {
          props.onChange(widthUnit, 'rowGap');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'rowGap');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'rowGap');
        } else {
          props.onChange(newVal + widthUnit, 'rowGap');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'rowGap');
            } else {
              props.onChange(x.value, 'rowGap');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'rowGap');
            } else {
              props.onChange(widthVal + x.value, 'rowGap');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'rowGap');
        } else {
          props.onChange(widthVal + widthUnit, 'rowGap');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'rowGap');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'rowGap');
        }
      }
    }
  }));
}

class PGcssRowGap extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssRowGap);

/***/ }),

/***/ "./src/components/css-table-layout/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-table-layout/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;


function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    auto: {
      "label": "auto",
      "value": "auto"
    },
    fixed: {
      "label": "fixed",
      "value": "fixed"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    }
  };
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, props.val ? args[props.val].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          onChange(x.value, 'tableLayout');
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }));
}

class PGcssTableLayout extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTableLayout);

/***/ }),

/***/ "./src/components/css-text-align-last/index.js":
/*!*****************************************************!*\
  !*** ./src/components/css-text-align-last/index.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;


function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    auto: {
      "label": "auto",
      "value": "auto"
    },
    left: {
      "label": "left",
      "value": "left"
    },
    right: {
      "label": "right",
      "value": "right"
    },
    center: {
      "label": "center",
      "value": "center"
    },
    justify: {
      "label": "justify",
      "value": "justify"
    },
    start: {
      "label": "start",
      "value": "start"
    },
    end: {
      "label": "end",
      "value": "end"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    }
  };
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, props.val ? args[props.val].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          onChange(x.value, 'textAlignLast');
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }));
}

class PGcssTextAlignLast extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextAlignLast);

/***/ }),

/***/ "./src/components/css-text-align/index.js":
/*!************************************************!*\
  !*** ./src/components/css-text-align/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
const {
  Component,
  RawHTML
} = wp.element;






class PGcssTextAlign extends Component {
  render() {
    var {
      val,
      onChange
    } = this.props;

    function Html() {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: [val == 'left' ? 'bg-blue-600 text-white inline-block px-2 py-1 border cursor-pointer' : 'inline-block px-2 py-1 border cursor-pointer'],
        onClick: ev => {
          onChange('left', 'textAlign');
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "24",
        height: "24",
        xmlns: "http://www.w3.org/2000/svg",
        viewBox: "0 0 24 24",
        "aria-hidden": "true",
        focusable: "false"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M4 19.8h8.9v-1.5H4v1.5zm8.9-15.6H4v1.5h8.9V4.2zm-8.9 7v1.5h16v-1.5H4z"
      }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: [val == 'center' ? 'bg-blue-600 text-white inline-block px-2 py-1 border cursor-pointer' : 'inline-block px-2 py-1 border cursor-pointer'],
        onClick: ev => {
          onChange('center', 'textAlign');
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "24",
        height: "24",
        xmlns: "http://www.w3.org/2000/svg",
        viewBox: "0 0 24 24",
        "aria-hidden": "true",
        focusable: "false"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M16.4 4.2H7.6v1.5h8.9V4.2zM4 11.2v1.5h16v-1.5H4zm3.6 8.6h8.9v-1.5H7.6v1.5z"
      }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: [val == 'right' ? 'bg-blue-600 text-white inline-block px-2 py-1 border cursor-pointer' : 'inline-block px-2 py-1 border cursor-pointer'],
        onClick: ev => {
          onChange('right', 'textAlign');
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "24",
        height: "24",
        xmlns: "http://www.w3.org/2000/svg",
        viewBox: "0 0 24 24",
        "aria-hidden": "true",
        focusable: "false"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("path", {
        d: "M11.1 19.8H20v-1.5h-8.9v1.5zm0-15.6v1.5H20V4.2h-8.9zM4 12.8h16v-1.5H4v1.5z"
      }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: [val == 'justify' ? 'bg-blue-600 text-white inline-block px-2 py-1 border cursor-pointer' : 'inline-block px-2 py-1 border cursor-pointer'],
        onClick: ev => {
          onChange('justify', 'textAlign');
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("svg", {
        width: "20",
        height: "20",
        viewBox: "0 0 24 24",
        "aria-hidden": "true",
        xmlns: "http://www.w3.org/2000/svg"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
        width: "20",
        height: "2.35838",
        fill: "black"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
        y: "10.8208",
        width: "20",
        height: "2.35838",
        fill: "black"
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("rect", {
        y: "21.6416",
        width: "20",
        height: "2.35838",
        fill: "black"
      }))));
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, null);
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextAlign);

/***/ }),

/***/ "./src/components/css-text-decoration/index.js":
/*!*****************************************************!*\
  !*** ./src/components/css-text-decoration/index.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");

const {
  Component,
  RawHTML
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? 'underline #000000 wavy 1px !important' : props.val;
  var valParts = valZ != undefined || valZ != null ? valZ.split(" ") : ['underline', '#000000', 'wavy', '1px', '!important'];

  if (valParts.length == 5) {
    var lineVal = [valParts[0]];
    var colorVal = valParts[1];
    var styleVal = valParts[2];
    var thicknessVal = valParts[3];
  }

  if (valParts.length == 6) {
    var lineVal = [valParts[0], valParts[1]];
    var colorVal = valParts[2];
    var styleVal = valParts[3];
    var thicknessVal = valParts[4];
  }

  if (valParts.length == 7) {
    var lineVal = [valParts[0], valParts[1], valParts[2]];
    var colorVal = valParts[3];
    var styleVal = valParts[4];
    var thicknessVal = valParts[5];
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var thicknessValX = thicknessVal != undefined ? thicknessVal.match(/-?\d+/g)[0] : 1;
  var thicknessUnitX = thicknessVal != undefined ? thicknessVal.match(/[a-zA-Z%]+/g)[0] : 'px';
  var [thicknessValY, setthicknessVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(thicknessValX);
  var [thicknessUnitY, setthicknessUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(thicknessUnitX);
  var [outlinelineVal, setoutlinelineVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(lineVal);
  var [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(colorVal);
  var [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(styleVal);
  var [outlineThicknessVal, setoutlineThicknessVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(thicknessValY + thicknessUnitY);
  var [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  var [textDecoration, setTextDecoration] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    "line": ['underline'],
    "style": 'double',
    "color": "#000000",
    "thicknessVal": "1",
    "thicknessUnit": "px"
  });
  var lineArgs = {
    none: {
      "label": "None",
      "value": "none"
    },
    overline: {
      "label": "Overline",
      "value": "overline"
    },
    underline: {
      "label": "Underline",
      "value": "underline"
    },
    'line-through': {
      "label": "Line Through",
      "value": "line-through"
    }
  };
  var styleArgs = {
    none: {
      "label": "None",
      "value": "none"
    },
    solid: {
      "label": "Solid",
      "value": "solid"
    },
    double: {
      "label": "Double",
      "value": "double"
    },
    wavy: {
      "label": "wavy",
      "value": "wavy"
    },
    dotted: {
      "label": "Dotted",
      "value": "dotted"
    },
    dashed: {
      "label": "Dashed",
      "value": "dashed"
    },
    groove: {
      "label": "Groove",
      "value": "groove"
    },
    ridge: {
      "label": "Ridge",
      "value": "ridge"
    },
    inset: {
      "label": "Inset",
      "value": "inset"
    },
    outset: {
      "label": "Outset",
      "value": "outset"
    }
  };
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {}, [textDecoration]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    //
    var valParts = props.val != undefined ? props.val.split(" ") : ['underline', '#000000', 'wavy', '1px'];
  }, [props.val]);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Line"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-3"
  }, Object.entries(lineArgs).map(arg => {
    var i = arg[0];
    var x = arg[1];
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: outlinelineVal != undefined && outlinelineVal.indexOf(x.value) !== -1 ? '!bg-blue-500 text-white px-2 inline-block m-1 py-1 cursor-pointer' : 'px-2 inline-block m-1 py-1 bg-gray-300 cursor-pointer',
      onClick: ev => {
        if (outlinelineVal.indexOf(x.value) < 0) {
          if (x.value == 'none') {
            outlinelineVal = ['none'];
          } else {
            outlinelineVal.push(x.value);
          }

          setoutlinelineVal(outlinelineVal);
          setTextDecoration({ ...textDecoration,
            line: outlinelineVal
          });

          if (isImportant) {
            props.onChange(outlinelineVal.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + outlineThicknessVal + ' ' + '!important', 'textDecoration');
          } else {
            props.onChange(outlinelineVal.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + outlineThicknessVal, 'textDecoration');
          }
        } else {
          var arr = outlinelineVal.filter(item => item !== x.value);
          setTextDecoration({ ...textDecoration,
            line: arr
          });
          setoutlinelineVal(arr);

          if (isImportant) {
            props.onChange(arr.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + outlineThicknessVal + ' ' + '!important', 'textDecoration');
          } else {
            props.onChange(arr.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + outlineThicknessVal, 'textDecoration');
          }
        }
      }
    }, x.label);
  }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Color"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ColorPalette, {
    value: outlineColorVal,
    colors: _colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"],
    enableAlpha: true,
    onChange: newVal => {
      setoutlineColorVal(newVal);
      setTextDecoration({ ...textDecoration,
        color: newVal
      });

      if (isImportant) {
        props.onChange(textDecoration.line.join(' ') + ' ' + newVal + ' ' + outlineStyleVal + ' ' + outlineThicknessVal + ' ' + '!important', 'textDecoration');
      } else {
        props.onChange(textDecoration.line.join(' ') + ' ' + newVal + ' ' + outlineStyleVal + ' ' + outlineThicknessVal, 'textDecoration');
      }
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2 flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Style"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, outlineStyleVal ? styleArgs[outlineStyleVal].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(styleArgs).map(arg => {
      var index = arg[0];
      var x = arg[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setoutlineStyleVal(x.value);
          setTextDecoration({ ...textDecoration,
            style: x.value
          });

          if (isImportant) {
            props.onChange(textDecoration.line.join(' ') + ' ' + outlineColorVal + ' ' + x.value + ' ' + outlineThicknessVal + ' ' + '!important', 'textDecoration');
          } else {
            props.onChange(textDecoration.line.join(' ') + ' ' + outlineColorVal + ' ' + x.value + ' ' + outlineThicknessVal, 'textDecoration');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Thickness"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: thicknessValY,
    type: "number",
    onChange: newVal => {
      setthicknessVal(newVal);
      setoutlineThicknessVal(newVal + thicknessUnitY);
      setTextDecoration({ ...textDecoration,
        thicknessVal: newVal
      });

      if (isImportant) {
        props.onChange(textDecoration.line.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + newVal + thicknessUnitY + ' ' + '!important', 'textDecoration');
      } else {
        props.onChange(textDecoration.line.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + newVal + thicknessUnitY, 'textDecoration');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom right",
    renderToggle: _ref2 => {
      let {
        isOpen,
        onToggle
      } = _ref2;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, thicknessUnitY != undefined ? unitArgs[thicknessUnitY].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setthicknessUnit(x.value);
          setoutlineThicknessVal(thicknessValY + x.value);

          if (isImportant) {
            props.onChange(textDecoration.line.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + thicknessValY + x.value + ' ' + '!important', 'textDecoration');
          } else {
            props.onChange(textDecoration.line.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + thicknessValY + x.value, 'textDecoration');
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(textDecoration.line.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + outlineThicknessVal, 'textDecoration');
      } else {
        props.onChange(textDecoration.line.join(' ') + ' ' + outlineColorVal + ' ' + outlineStyleVal + ' ' + outlineThicknessVal + ' ' + '!important', 'textDecoration');
      }
    }
  }));
}

class PGcssTextDecoration extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextDecoration);

/***/ }),

/***/ "./src/components/css-text-indent/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-text-indent/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g) == null ? 0 : valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'textIndent');
        } else {
          props.onChange(widthUnit, 'textIndent');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'textIndent');
        } else {
          props.onChange(newVal + widthUnit, 'textIndent');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Text Indent",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, props.val ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'textIndent');
            } else {
              props.onChange(x.value, 'textIndent');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'textIndent');
            } else {
              props.onChange(widthVal + x.value, 'textIndent');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'textIndent');
        } else {
          props.onChange(widthVal + widthUnit, 'textIndent');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'textIndent');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'textIndent');
        }
      }
    }
  }));
}

class PGcssTextIndent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextIndent);

/***/ }),

/***/ "./src/components/css-text-justify/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-text-justify/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    none: {
      "label": "none",
      "value": "none"
    },
    auto: {
      "label": "auto",
      "value": "auto"
    },
    'inter-word': {
      "label": "inter-word",
      "value": "inter-word"
    },
    'inter-character': {
      "label": "inter-character",
      "value": "inter-character"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'textJustify');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'textJustify');
          } else {
            props.onChange(x.value, 'textJustify');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'textJustify');
      } else {
        props.onChange(align + ' !important', 'textJustify');
      }
    }
  }));
}

class PGcssTextJustify extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextJustify);

/***/ }),

/***/ "./src/components/css-text-overflow/index.js":
/*!***************************************************!*\
  !*** ./src/components/css-text-overflow/index.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    clip: {
      "label": "Clip",
      "value": "clip"
    },
    ellipsis: {
      "label": "Ellipsis",
      "value": "ellipsis"
    },
    string: {
      "label": "String",
      "value": "string"
    },
    initial: {
      "label": "initial",
      "value": "initial"
    },
    inherit: {
      "label": "inherit",
      "value": "inherit"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'textOverflow');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'textOverflow');
          } else {
            props.onChange(x.value, 'textOverflow');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'textOverflow');
      } else {
        props.onChange(align + ' !important', 'textOverflow');
      }
    }
  }));
}

class PGcssTextOverflow extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextOverflow);

/***/ }),

/***/ "./src/components/css-text-shadow/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-text-shadow/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
const {
  Component,
  RawHTML
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px 0px 0px #000' : props.val;
  var h = valZ != undefined ? valZ.split(" ")[0].match(/-?\d+/g)[0] : 0;
  var v = valZ != undefined ? valZ.split(" ")[1].match(/-?\d+/g)[0] : 0;
  var blur = valZ != undefined ? valZ.split(" ")[2].match(/-?\d+/g)[0] : 0;
  var color = valZ != undefined ? valZ.split(" ")[3] : '#dddddd';
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, JSON.stringify(valZ), JSON.stringify(h), JSON.stringify(v), JSON.stringify(blur), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "H-Offset")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.RangeControl, {
    min: "-100",
    max: "100",
    step: "1",
    value: parseInt(h),
    onChange: newVal => {
      props.onChange(newVal + 'px ' + v + 'px ' + blur + 'px ' + color, 'textShadow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "V-Offset")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.RangeControl, {
    min: "-100",
    max: "100",
    step: "1",
    value: parseInt(v),
    onChange: newVal => {
      props.onChange(h + 'px ' + newVal + 'px ' + blur + 'px ' + color, 'textShadow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "Blur")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.RangeControl, {
    min: "0",
    max: "100",
    step: "1",
    value: parseInt(blur),
    onChange: newVal => {
      props.onChange(h + 'px ' + v + 'px ' + newVal + 'px ' + color, 'textShadow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("label", {
    for: ""
  }, "Color")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_5__["default"], {
    value: color,
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(h + 'px ' + h + 'px ' + blur + 'px ' + newVal, 'textShadow');
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(h + 'px' + ' ' + v + 'px' + ' ' + blur + 'px' + ' ' + color, 'textShadow');
      } else {
        props.onChange(h + 'px' + ' ' + v + 'px' + ' ' + blur + 'px' + ' ' + color + ' !important', 'textShadow');
      }
    }
  }));
}

class PGcssTextShadow extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextShadow);

/***/ }),

/***/ "./src/components/css-text-transform/index.js":
/*!****************************************************!*\
  !*** ./src/components/css-text-transform/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    none: {
      "label": "None",
      "value": "none"
    },
    capitalize: {
      "label": "Capitalize",
      "value": "capitalize"
    },
    uppercase: {
      "label": "Uppercase",
      "value": "uppercase"
    },
    lowercase: {
      "label": "Lowercase",
      "value": "lowercase"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'textTransform');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'textTransform');
          } else {
            props.onChange(x.value, 'textTransform');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'textTransform');
      } else {
        props.onChange(align + ' !important', 'textTransform');
      }
    }
  }));
}

class PGcssTextTransform extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextTransform);

/***/ }),

/***/ "./src/components/css-top/index.js":
/*!*****************************************!*\
  !*** ./src/components/css-top/index.js ***!
  \*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };

  if (typeof props.val == 'object') {
    var valZ = props.val.val + props.val.unit;
  } else {
    var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  } // var valZ = (props.val == null || props.val == undefined || props.val.length == 0) ? '0px' : props.val;


  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal); // if (widthUnit == 'auto') {
      //   props.onChange(widthUnit, 'top');
      // } else {
      //   props.onChange(newVal + widthUnit, 'top');
      // }

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'top');
        } else {
          props.onChange(widthUnit, 'top');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'top');
        } else {
          props.onChange(newVal + widthUnit, 'top');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            // props.onChange(x.value, 'top');
            if (isImportant) {
              props.onChange(x.value + ' !important', 'top');
            } else {
              props.onChange(x.value, 'top');
            }
          } else {
            // props.onChange(widthVal + x.value, 'top');
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'top');
            } else {
              props.onChange(widthVal + x.value, 'top');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'top');
        } else {
          props.onChange(widthVal + widthUnit, 'top');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'top');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'top');
        }
      }
    }
  }));
}

class PGcssTop extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTop);

/***/ }),

/***/ "./src/components/css-transform/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-transform/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");

const {
  Component
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val != undefined ? props.val.split(") ") : [];
  const [valArgs, setvalArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]);
  var propertyArgs = {
    translateX: {
      label: 'TranslateX',
      id: 'translateX',
      val: '0px'
    },
    translateY: {
      label: 'TranslateY',
      id: 'translateY',
      val: '0px'
    },
    translateZ: {
      label: 'TranslateZ',
      id: 'translateZ',
      val: '0px'
    },
    translate: {
      label: 'Translate',
      id: 'translate',
      val: '5px,6px'
    },
    translate3d: {
      label: 'Translate3d',
      id: 'translate3d',
      val: '0px,0px,0px'
    },
    scale: {
      label: 'Scale',
      id: 'scale',
      val: '2,3'
    },
    scale3d: {
      label: 'Scale3d',
      id: 'scale3d',
      val: '1,1,1'
    },
    scaleX: {
      label: 'ScaleX',
      id: 'scaleX',
      val: '1'
    },
    scaleY: {
      label: 'ScaleY',
      id: 'scaleY',
      val: '1'
    },
    scaleZ: {
      label: 'ScaleZ',
      id: 'scaleZ',
      val: '1'
    },
    rotate: {
      label: 'Rotate',
      id: 'rotate',
      val: '0deg'
    },
    rotate3d: {
      label: 'Rotate3d',
      id: 'rotate3d',
      val: '1,1,1,0deg'
    },
    rotateX: {
      label: 'RotateX',
      id: 'rotateX',
      val: '0deg'
    },
    rotateY: {
      label: 'RotateY',
      id: 'rotateY',
      val: '0deg'
    },
    rotateZ: {
      label: 'RotateZ',
      id: 'rotateZ',
      val: '0deg'
    },
    skew: {
      label: 'Skew',
      id: 'skew',
      val: '2deg,3deg'
    },
    skewX: {
      label: 'SkewX',
      id: 'skewX',
      val: '0deg'
    },
    skewY: {
      label: 'SkewY',
      id: 'skewY',
      val: '0deg'
    },
    perspective: {
      label: 'Perspective',
      id: 'perspective',
      val: '0px'
    },
    matrix: {
      label: 'Matrix',
      id: 'matrix',
      val: '1,1,1,1,1,1'
    },
    matrix3d: {
      label: 'Matrix3d',
      id: 'matrix3d',
      val: '1,1'
    }
  };
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    var filtered = valParts.filter(Boolean);
    var res = filtered.map(x => {
      if (x.length != 0) {
        var proptyParts = x != undefined ? x.split("(") : [];
        var proptyId = proptyParts[0];
        var proptyVal = proptyParts[1];
        var obj = {
          id: proptyId,
          val: proptyVal
        };
        return obj;
      }
    });
    setvalArgs(res);
  }, [props.val]);

  function RemoveProty(_ref) {
    let {
      title,
      index
    } = _ref;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex  items-center "
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "hover:bg-red-500 hover:text-white mr-1 inline-block p-1 cursor-pointer",
      onClick: ev => {
        var hellox = valArgs.splice(index, 1);
        setvalArgs(valArgs);
        var str = '';
        valArgs.map(x => {
          str += x.id + '(' + x.val + ') ';
        });
        props.onChange(str, 'transform');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, title));
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mb-3"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_2__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: propertyArgs,
    buttonTitle: "Choose",
    onChange: (option, index) => {
      valArgs.push(option);
      var str = '';
      valArgs.map((x, i) => {
        str += x.id + '(' + x.val + ') ';
      });
      props.onChange(str, 'transform');
    }
  })), valArgs != undefined && valArgs.map((arg, i) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
      title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveProty, {
        title: arg.id != null && propertyArgs[arg.id] != undefined ? propertyArgs[arg.id].label : 'property',
        index: i
      }),
      initialOpen: false
    }, (arg.id == 'translateX' || arg.id == 'translateY' || arg.id == 'translateZ' || arg.id == 'scaleX' || arg.id == 'scaleY' || arg.id == 'scaleZ' || arg.id == 'rotate' || arg.id == 'rotateX' || arg.id == 'rotateY' || arg.id == 'rotateZ' || arg.id == 'skewX' || arg.id == 'skewY' || arg.id == 'perspective') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.val.match(/-?\d+/g) == null ? 0 : arg.val.match(/-?\d+/g)[0],
      type: "number",
      onChange: newVal => {
        //var argVal = arg.val != undefined ? arg.val.match(/-?\d+/g)[0] : 1;
        if (parseInt(newVal) == NaN) {
          return;
        }

        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'scaleX' || arg.id == 'scaleY' || arg.id == 'scaleZ') {
              str += x.id + '(' + newVal + ') ';
            }

            if (arg.id == 'translateX' || arg.id == 'translateY' || arg.id == 'translateZ' || arg.id == 'perspective') {
              var argUnit = arg.val != undefined ? arg.val.match(/[%a-zA-Z]+/g)[0] : '';
              str += x.id + '(' + newVal + argUnit + ') ';
            }

            if (arg.id == 'rotate' || arg.id == 'rotateX' || arg.id == 'rotateY' || arg.id == 'rotateZ' || arg.id == 'skewX' || arg.id == 'skewY') {
              str += x.id + '(' + newVal + 'deg) ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, (arg.id == 'translateX' || arg.id == 'translateY' || arg.id == 'translateZ' || arg.id == 'perspective') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: arg.val.match(/[%a-zA-Z]+/g)[0],
      options: [{
        "label": "PX",
        "value": "px"
      }, {
        "label": "EM",
        "value": "em"
      }, {
        "label": "REM",
        "value": "rem"
      }, {
        "label": "%",
        "value": "%"
      }],
      onChange: newVal => {
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'translateX' || arg.id == 'translateY' || arg.id == 'translateZ' || arg.id == 'perspective') {
              var argVal = arg.val != undefined ? arg.val.match(/-?\d+/g)[0] : 1;
              str += x.id + '(' + argVal + newVal + ') ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    }), (arg.id == 'rotateX' || arg.id == 'rotate' || arg.id == 'rotateY' || arg.id == 'rotateZ' || arg.id == 'skewX' || arg.id == 'skewY') && "deg"))), (arg.id == 'translate' || arg.id == 'scale' || arg.id == 'skew') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "X Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.val.split(",")[0].match(/-?\d+/g) == undefined ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0],
      type: "number",
      onChange: newVal => {
        //var argVal = arg.val != undefined ? arg.val.match(/-?\d+/g)[0] : 1;
        if (parseInt(newVal) == NaN) {
          return;
        }

        var valPartsX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0];
        var valPartsXUnit = arg.val.split(",")[0].match(/[%a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[%a-zA-Z]+/g)[0];
        var valPartsY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0];
        var valPartsYUnit = arg.val.split(",")[1].match(/[%a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[%a-zA-Z]+/g)[0];
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'scale') {
              str += x.id + '(' + newVal + ',' + valPartsY + ') ';
            }

            if (arg.id == 'translate') {
              str += x.id + '(' + newVal + valPartsXUnit + ',' + valPartsY + valPartsYUnit + ') ';
            }

            if (arg.id == 'skew') {
              str += x.id + '(' + newVal + 'deg,' + valPartsY + 'deg) ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, arg.id == 'translate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: arg.val.split(",")[0].match(/[%a-zA-Z]+/g)[0],
      options: [{
        "label": "PX",
        "value": "px"
      }, {
        "label": "EM",
        "value": "em"
      }, {
        "label": "REM",
        "value": "rem"
      }, {
        "label": "%",
        "value": "%"
      }],
      onChange: newVal => {
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'translate') {
              var argValX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 1 : arg.val.split(",")[0].match(/-?\d+/g)[0];
              var argValXUnit = arg.val.split(",")[0].match(/[%a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[%a-zA-Z]+/g)[0];
              var argValY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 1 : arg.val.split(",")[1].match(/-?\d+/g)[0];
              var argValYUnit = arg.val.split(",")[1].match(/[%a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[%a-zA-Z]+/g)[0];
              str += x.id + '(' + argValX + newVal + ',' + argValY + argValYUnit + ') '; //str += x.id + '(' + argVal + newVal + ') ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    })), arg.id == 'skew' && "deg")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Y Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0],
      type: "number",
      onChange: newVal => {
        if (parseInt(newVal) == NaN) {
          return;
        }

        var valPartsX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0];
        var valPartsXUnit = arg.val.split(",")[0].match(/[%a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[%a-zA-Z]+/g)[0];
        var valPartsY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0];
        var argValYUnit = arg.val.split(",")[1].match(/[%a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[%a-zA-Z]+/g)[0];
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'scale') {
              str += x.id + '(' + valPartsX + ',' + newVal + ') ';
            }

            if (arg.id == 'translate') {
              str += x.id + '(' + valPartsX + valPartsXUnit + ',' + newVal + argValYUnit + ') ';
            }

            if (arg.id == 'skew') {
              str += x.id + '(' + valPartsX + 'deg,' + newVal + 'deg) ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, arg.id == 'translate' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: arg.val.split(",")[1].match(/[%a-zA-Z]+/g) == null ? 0 : arg.val.split(",")[1].match(/[%a-zA-Z]+/g)[0],
      options: [{
        "label": "PX",
        "value": "px"
      }, {
        "label": "EM",
        "value": "em"
      }, {
        "label": "REM",
        "value": "rem"
      }, {
        "label": "%",
        "value": "%"
      }],
      onChange: newVal => {
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'translate') {
              var argValX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 1 : arg.val.split(",")[0].match(/-?\d+/g)[0];
              var argValXUnit = arg.val.split(",")[0].match(/[%a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[%a-zA-Z]+/g)[0];
              var argValY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 1 : arg.val.split(",")[1].match(/-?\d+/g)[0];
              var argValYUnit = arg.val.split(",")[1].match(/[%a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[%a-zA-Z]+/g)[0];
              str += x.id + '(' + argValX + argValXUnit + ',' + argValY + newVal + ') '; //str += x.id + '(' + argVal + newVal + ') ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    })), arg.id == 'skew' && "deg"))), (arg.id == 'translate3d' || arg.id == 'scale3d' || arg.id == 'rotate3d') && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "X Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0],
      type: "number",
      onChange: newVal => {
        //var argVal = arg.val != undefined ? arg.val.match(/-?\d+/g)[0] : 1;
        //var argUnit = arg.val != undefined ? arg.val.match(/[a-zA-Z]+/g)[0] : '';
        if (parseInt(newVal) == NaN) {
          return;
        } // var valPartsX = arg.val.split(",")[0].match(/-?\d+/g)[0];
        // var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
        // var valPartsY = arg.val.split(",")[1].match(/-?\d+/g)[0];
        // var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
        // var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g)[0];
        // var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0];


        var valPartsX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0];
        var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
        var valPartsY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0];
        var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
        var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[2].match(/-?\d+/g)[0];
        var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0];
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'scale3d') {
              str += x.id + '(' + newVal + ',' + valPartsY + ',' + valPartsZ + ') ';
            }

            if (arg.id == 'translate3d') {
              str += x.id + '(' + newVal + valPartsXUnit + ',' + valPartsY + valPartsYUnit + ',' + valPartsZ + valPartsZUnit + ') ';
            }

            if (arg.id == 'rotate3d') {
              var valPartsA = arg.val.split(",")[2].match(/-?\d+/g)[0];
              str += x.id + '(' + newVal + ',' + valPartsY + ',' + valPartsZ + ',' + valPartsA + 'deg) ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, arg.id == 'translate3d' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: arg.val.split(",")[0].match(/[%a-zA-Z]+/g)[0],
      options: [{
        "label": "PX",
        "value": "px"
      }, {
        "label": "EM",
        "value": "em"
      }, {
        "label": "REM",
        "value": "rem"
      }, {
        "label": "%",
        "value": "%"
      }],
      onChange: newVal => {
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'translate3d') {
              // var valPartsX = arg.val.split(",")[0].match(/-?\d+/g)[0];
              // var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
              // var valPartsY = arg.val.split(",")[1].match(/-?\d+/g)[0];
              // var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
              // var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g)[0];
              // var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0];
              var valPartsX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0];
              var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
              var valPartsY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0];
              var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
              var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[2].match(/-?\d+/g)[0];
              var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0];
              str += x.id + '(' + valPartsX + newVal + ',' + valPartsY + valPartsYUnit + ',' + valPartsZ + valPartsZUnit + ') ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Y Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0],
      type: "number",
      onChange: newVal => {
        if (parseInt(newVal) == NaN) {
          return;
        }

        var valPartsX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0];
        var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
        var valPartsY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0];
        var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
        var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[2].match(/-?\d+/g)[0];
        var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0];
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'scale3d') {
              str += x.id + '(' + valPartsX + ',' + newVal + ',' + valPartsZ + ') ';
            }

            if (arg.id == 'translate3d') {
              str += x.id + '(' + valPartsX + valPartsXUnit + ',' + newVal + valPartsYUnit + ',' + valPartsZ + valPartsZUnit + ') ';
            }

            if (arg.id == 'rotate3d') {
              var valPartsA = arg.val.split(",")[3].match(/-?\d+/g)[0];
              str += x.id + '(' + valPartsX + ',' + newVal + ',' + valPartsZ + ',' + valPartsA + 'deg) ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, arg.id == 'translate3d' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: arg.val.split(",")[1].match(/[%a-zA-Z]+/g)[0],
      options: [{
        "label": "PX",
        "value": "px"
      }, {
        "label": "EM",
        "value": "em"
      }, {
        "label": "REM",
        "value": "rem"
      }, {
        "label": "%",
        "value": "%"
      }],
      onChange: newVal => {
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'translate3d') {
              var valPartsX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0];
              var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
              var valPartsY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0];
              var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
              var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[2].match(/-?\d+/g)[0];
              var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0];
              str += x.id + '(' + valPartsX + valPartsXUnit + ',' + valPartsY + newVal + ',' + valPartsZ + valPartsZUnit + ') ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    })), arg.id == 'skew' && "deg")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Z Value"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.val.split(",")[2].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[2].match(/-?\d+/g)[0],
      type: "number",
      onChange: newVal => {
        if (parseInt(newVal) == NaN) {
          return;
        } // var valPartsX = arg.val.split(",")[0].match(/-?\d+/g)[0];
        // var valPartsY = arg.val.split(",")[1].match(/-?\d+/g)[0];
        // var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g)[0];


        var valPartsX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0];
        var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
        var valPartsY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0];
        var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
        var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[2].match(/-?\d+/g)[0];
        var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0]; // var valPartsX = arg.val.split(",")[0].match(/-?\d+/g)[0];
        // var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
        // var valPartsY = arg.val.split(",")[1].match(/-?\d+/g)[0];
        // var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
        // var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g)[0];
        // var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0];

        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'scale3d') {
              str += x.id + '(' + valPartsX + ',' + valPartsY + ',' + newVal + ') ';
            }

            if (arg.id == 'translate3d') {
              str += x.id + '(' + valPartsX + valPartsXUnit + ',' + valPartsY + valPartsYUnit + ',' + newVal + valPartsZUnit + ') ';
            }

            if (arg.id == 'rotate3d') {
              var valPartsA = arg.val.split(",")[3].match(/-?\d+/g)[0];
              str += x.id + '(' + valPartsX + ',' + valPartsY + ',' + newVal + ',' + valPartsA + 'deg) ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, arg.id == 'translate3d' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: arg.val.split(",")[2].match(/[%a-zA-Z]+/g)[0],
      options: [{
        "label": "PX",
        "value": "px"
      }, {
        "label": "EM",
        "value": "em"
      }, {
        "label": "REM",
        "value": "rem"
      }, {
        "label": "%",
        "value": "%"
      }],
      onChange: newVal => {
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'translate3d') {
              var valPartsX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0];
              var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
              var valPartsY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0];
              var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
              var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[2].match(/-?\d+/g)[0];
              var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g) == null ? 'px' : arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0]; // var valPartsX = arg.val.split(",")[0].match(/-?\d+/g)[0];
              // var valPartsXUnit = arg.val.split(",")[0].match(/[a-zA-Z]+/g)[0];
              // var valPartsY = arg.val.split(",")[1].match(/-?\d+/g)[0];
              // var valPartsYUnit = arg.val.split(",")[1].match(/[a-zA-Z]+/g)[0];
              // var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g)[0];
              // var valPartsZUnit = arg.val.split(",")[2].match(/[a-zA-Z]+/g)[0];

              str += x.id + '(' + valPartsX + valPartsXUnit + ',' + valPartsY + valPartsYUnit + ',' + valPartsZ + newVal + ') ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    })), arg.id == 'skew' && "deg")), arg.id == 'rotate3d' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Angle"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.val.split(",")[3].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[3].match(/-?\d+/g)[0],
      type: "number",
      onChange: newVal => {
        if (parseInt(newVal) == NaN) {
          return;
        }

        var valPartsX = arg.val.split(",")[0].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[0].match(/-?\d+/g)[0];
        var valPartsY = arg.val.split(",")[1].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[1].match(/-?\d+/g)[0];
        var valPartsZ = arg.val.split(",")[2].match(/-?\d+/g) == null ? 0 : arg.val.split(",")[2].match(/-?\d+/g)[0];
        var str = '';
        valArgs.map((x, j) => {
          if (arg.id == x.id) {
            if (arg.id == 'scale3d') {
              str += x.id + '(' + valPartsX + ',' + valPartsY + ',' + valPartsZ + ') ';
            }

            if (arg.id == 'translate3d') {
              str += x.id + '(' + valPartsX + 'px,' + valPartsY + 'px,' + valPartsZ + 'px) ';
            }

            if (arg.id == 'rotate3d') {
              str += x.id + '(' + valPartsX + ',' + valPartsY + ',' + valPartsZ + ',' + newVal + 'deg) ';
            }
          } else {
            str += x.id + '(' + x.val + ') ';
          }
        });
        props.onChange(str, 'transform');
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, arg.id == 'rotate3d' && "deg"))));
  }));
}

class PGcssTransition extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTransition);

/***/ }),

/***/ "./src/components/css-transition/index.js":
/*!************************************************!*\
  !*** ./src/components/css-transition/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_3__);

const {
  Component
} = wp.element;







function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valParts = props.val != undefined ? props.val.split(",") : [];
  const [valArgs, setvalArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]);
  var timingFunctionargs = [{
    label: 'ease',
    value: 'ease'
  }, {
    label: 'linear',
    value: 'linear'
  }, {
    label: 'ease-in',
    value: 'ease-in'
  }, {
    label: 'ease-out',
    value: 'ease-out'
  }, {
    label: 'ease-in-out',
    value: 'ease-in-out'
  }, {
    label: 'step-start',
    value: 'step-start'
  }, {
    label: 'step-end',
    value: 'step-end'
  }];
  var transitionPropertiesBasic = {
    all: {
      value: 'all ',
      label: 'All '
    },
    'background-color': {
      value: 'background-color',
      label: 'Background Color'
    },
    color: {
      value: 'color',
      label: 'Color'
    },
    'box-shadow': {
      value: 'box-shadow',
      label: 'Box Shadow'
    },
    'font-size': {
      value: 'font-size',
      label: 'Font Size'
    },
    right: {
      value: 'right',
      label: 'Right'
    },
    top: {
      value: 'top',
      label: 'Top'
    },
    width: {
      value: 'width',
      label: 'Width'
    },
    height: {
      value: 'height',
      label: 'Height'
    },
    'font-weight': {
      value: 'font-weight',
      label: 'Font Weight'
    },
    left: {
      value: 'left',
      label: 'Left'
    },
    'z-index': {
      value: 'z-index',
      label: 'Z-Index'
    },
    margin: {
      value: 'margin',
      label: 'Margin'
    },
    padding: {
      value: 'padding',
      label: 'Padding'
    },
    'max-height': {
      value: 'max-height',
      label: 'Max Height'
    },
    'max-width': {
      value: 'max-width',
      label: 'Max Width'
    },
    'min-height': {
      value: 'min-height',
      label: 'Min Height'
    },
    'min-width': {
      value: 'min-width',
      label: 'Min Width'
    },
    opacity: {
      value: 'opacity',
      label: 'Opacity'
    },
    'align-content': {
      value: 'align-content',
      label: 'Align Content'
    },
    'align-items': {
      value: 'align-items',
      label: 'Align Items'
    },
    'align-self': {
      value: 'align-self',
      label: 'Align Self'
    },
    'backface-visibility': {
      value: 'backface-visibility',
      label: 'Backface Visibility'
    },
    //background: { value: 'background', label: 'Background' },
    'background-attachment': {
      value: 'background-attachment',
      label: 'Background Attachment',
      isPro: true
    },
    'background-blendMode': {
      value: 'background-blendMode',
      label: 'Background Blend Mode',
      isPro: true
    },
    'background-clip': {
      value: 'background-clip',
      label: 'Background Clip',
      isPro: true
    },
    'background-image': {
      value: 'background-image',
      label: 'Background Image'
    },
    'background-origin': {
      value: 'background-origin',
      label: 'Background Origin'
    },
    'background-repeat': {
      value: 'background-repeat',
      label: 'Background Repeat'
    },
    'background-position': {
      value: 'background-position',
      label: 'Background Position'
    },
    'background-size': {
      value: 'background-size',
      label: 'Background Size'
    },
    border: {
      value: 'border',
      label: 'Border'
    },
    'border-collapse': {
      value: 'border-collapse',
      label: 'Border Collapse',
      isPro: true
    },
    'border-image': {
      value: 'border-image',
      label: 'Border Image',
      isPro: true
    },
    'border-radius': {
      value: 'border-radius',
      label: 'Border Radius'
    },
    'border-spacing': {
      value: 'border-spacing',
      label: 'Border Spacing',
      isPro: true
    },
    'backdrop-filter': {
      value: 'backdrop-filter',
      label: 'Backdrop Filter'
    },
    bottom: {
      value: 'bottom',
      label: 'Bottom'
    },
    'box-sizing': {
      value: 'box-sizing',
      label: 'Box Sizing',
      isPro: true
    },
    clear: {
      value: 'clear',
      label: 'Clear'
    },
    clip: {
      value: 'clip',
      label: 'Clip',
      isPro: true
    },
    'clip-path': {
      value: 'clip-path',
      label: 'Clip Path',
      isPro: true
    },
    'column-count': {
      value: 'column-count',
      label: 'Column Count',
      isPro: true
    },
    content: {
      value: 'content',
      label: 'Content',
      isPro: true
    },
    cursor: {
      value: 'cursor',
      label: 'Cursor',
      isPro: true
    },
    display: {
      value: 'display',
      label: 'Display'
    },
    direction: {
      value: 'direction',
      label: 'Direction'
    },
    float: {
      value: 'float',
      label: 'Float'
    },
    filter: {
      value: 'filter',
      label: 'Filter',
      isPro: true
    },
    'font-family': {
      value: 'font-family',
      label: 'Font Family'
    },
    'font-stretch': {
      value: 'font-stretch',
      label: 'Font Stretch',
      isPro: true
    },
    'font-style': {
      value: 'font-style',
      label: 'Font Style'
    },
    'font-variant-caps': {
      value: 'font-variant-caps',
      label: 'Font VariantCaps',
      isPro: true
    },
    'letter-spacing': {
      value: 'letter-spacing',
      label: 'Letter Spacing',
      isPro: true
    },
    'line-height': {
      value: 'line-height',
      label: 'Line Height'
    },
    'list-style': {
      value: 'list-style',
      label: 'ListStyle'
    },
    outline: {
      value: 'outline',
      label: 'Outline',
      isPro: true
    },
    overflow: {
      value: 'overflow',
      label: 'Overflow'
    },
    'overflow-x': {
      value: 'overflow-x',
      label: 'OverflowX',
      isPro: true
    },
    'overflow-y': {
      value: 'overflow-y',
      label: 'OverflowY',
      isPro: true
    },
    perspective: {
      value: 'perspective',
      label: 'Perspective',
      isPro: true
    },
    position: {
      value: 'position',
      label: 'Position'
    },
    'text-align': {
      value: 'text-align',
      label: 'Text Align'
    },
    transform: {
      value: 'transform',
      label: 'Transform',
      isPro: true
    },
    transition: {
      value: 'transition',
      label: 'Transition',
      isPro: true
    },
    'vertical-align': {
      value: 'vertical-align',
      label: 'Vertical Align'
    },
    visibility: {
      value: 'visibility',
      label: 'Visibility'
    },
    'text-decoration': {
      value: 'text-decoration',
      label: 'Text Decoration',
      isPro: true
    },
    'text-indent': {
      value: 'text-indent',
      label: 'Text Indent',
      isPro: true
    },
    'text-justify': {
      value: 'text-justify',
      label: 'Text Justify',
      isPro: true
    },
    'text-overflow': {
      value: 'text-overflow',
      label: 'Text Overflow'
    },
    'text-shadow': {
      value: 'text-shadow',
      label: 'Text Shadow',
      isPro: true
    },
    'text-transform': {
      value: 'text-transform',
      label: 'Text Transform',
      isPro: true
    },
    'word-break': {
      value: 'word-break',
      label: 'Word Break',
      isPro: true
    },
    'word-spacing': {
      value: 'word-spacing',
      label: 'Word Spacing',
      isPro: true
    },
    'word-wrap': {
      value: 'word-wrap',
      label: 'Word Wrap',
      isPro: true
    },
    'writing-mode': {
      value: 'writing-mode',
      label: 'Writing Mode',
      isPro: true
    }
  };
  let transitionProperties = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_3__.applyFilters)('transitionProperties', transitionPropertiesBasic);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    var filtered = valParts.filter(Boolean);
    var res = filtered.map(x => {
      if (x.length != 0) {
        var items = x.split(" ");
        var property = items[0];
        var duration = items[1];
        var timingFunction = items[2];
        var delay = items[3];
        return {
          property: property,
          duration: duration,
          timingFunction: timingFunction,
          delay: delay
        };
      }
    });
    setvalArgs(res);
  }, [props.val]);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mb-3"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_2__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: transitionProperties,
    buttonTitle: "Choose",
    onChange: (option, index) => {
      valArgs.push({
        property: option.value,
        duration: '1s',
        timingFunction: 'ease',
        delay: '0s'
      });
      var str = '';
      valArgs.map((x, i) => {
        str += x.property + ' ' + x.duration + ' ' + x.timingFunction + ' ' + x.delay;
        str += ',';
      });
      var strX = str.slice(0, -1);
      props.onChange(strX, 'transition');
    }
  })), valArgs != undefined && valArgs.map((arg, i) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
      title: arg.property != null && transitionProperties[arg.property] != undefined ? transitionProperties[arg.property].label : 'property',
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Duration"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.duration.slice(0, -1),
      type: "number",
      autocomplete: "off",
      onChange: newVal => {
        valArgs[i].duration = newVal;
        var str = '';
        valArgs.map((x, j) => {
          if (i == j) {
            str += x.property + ' ' + newVal + 's ' + x.timingFunction + ' ' + x.delay;
            str += ',';
          } else {
            str += x.property + ' ' + x.duration + ' ' + x.timingFunction + ' ' + x.delay;
            str += ',';
          }
        });
        var strX = str.slice(0, -1);
        props.onChange(strX, 'transition');
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Timing Function"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_2__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: timingFunctionargs,
      buttonTitle: arg.timingFunction != null ? arg.timingFunction : 'Choose',
      onChange: (option, index) => {
        valArgs[i].timingFunction = option.value;
        var str = '';
        valArgs.map((x, j) => {
          if (i == j) {
            str += x.property + ' ' + x.duration + ' ' + option.value + ' ' + x.delay;
            str += ',';
          } else {
            str += x.property + ' ' + x.duration + ' ' + x.timingFunction + ' ' + x.delay;
            str += ',';
          }
        });
        var strX = str.slice(0, -1);
        props.onChange(strX, 'transition');
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Delay"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: arg.delay.slice(0, -1),
      type: "number",
      autocomplete: "off",
      onChange: newVal => {
        valArgs[i].delay = newVal;
        var str = '';
        valArgs.map((x, j) => {
          if (i == j) {
            str += x.property + ' ' + x.duration + ' ' + x.timingFunction + ' ' + newVal + 's';
            str += ',';
          } else {
            str += x.property + ' ' + x.duration + ' ' + x.timingFunction + ' ' + x.delay;
            str += ',';
          }
        });
        var strX = str.slice(0, -1);
        props.onChange(strX, 'transition');
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "hover:bg-red-500 bg-red-400 text-white ml-1 inline-block p-1 cursor-pointer",
      onClick: ev => {
        var hellox = valArgs.splice(i, 1);
        setvalArgs(valArgs);
        var str = '';
        valArgs.map((x, j) => {
          str += x.property + ' ' + x.duration + ' ' + x.timingFunction + ' ' + x.delay;
          str += ',';
        });
        var strX = str.slice(0, -1);
        props.onChange(strX, 'transition');
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "dashicons dashicons-no-alt"
    }))));
  }));
}

class PGcssTransition extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTransition);

/***/ }),

/***/ "./src/components/css-vertical-align/index.js":
/*!****************************************************!*\
  !*** ./src/components/css-vertical-align/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    baseline: {
      "label": "Baseline",
      "value": "baseline"
    },
    'text-top': {
      "label": "Text Top",
      "value": "text-top"
    },
    'text-bottom': {
      "label": "Text Bottom",
      "value": "text-bottom"
    },
    sub: {
      "label": "Sub",
      "value": "sub"
    },
    super: {
      "label": "Super",
      "value": "super"
    },
    top: {
      "label": "Top",
      "value": "top"
    },
    middle: {
      "label": "Middle",
      "value": "middle"
    },
    bottom: {
      "label": "Bottom",
      "value": "bottom"
    },
    initial: {
      "label": "Initial",
      "value": "initial"
    },
    inherit: {
      "label": "Inherit",
      "value": "inherit"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'verticalAlign');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'verticalAlign');
          } else {
            props.onChange(x.value, 'verticalAlign');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'verticalAlign');
      } else {
        props.onChange(align + ' !important', 'verticalAlign');
      }
    }
  }));
}

class PGcssVerticalAlign extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssVerticalAlign);

/***/ }),

/***/ "./src/components/css-visibility/index.js":
/*!************************************************!*\
  !*** ./src/components/css-visibility/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    visible: {
      "label": "visible",
      "value": "visible"
    },
    hidden: {
      "label": "hidden",
      "value": "hidden"
    },
    collapse: {
      "label": "collapse",
      "value": "collapse"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'visibility');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'visibility');
          } else {
            props.onChange(x.value, 'visibility');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'visibility');
      } else {
        props.onChange(align + ' !important', 'visibility');
      }
    }
  }));
}

class PGcssVisibility extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssVisibility);

/***/ }),

/***/ "./src/components/css-white-space/index.js":
/*!*************************************************!*\
  !*** ./src/components/css-white-space/index.js ***!
  \*************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;


function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    normal: {
      "label": "normal",
      "value": "normal"
    },
    nowrap: {
      "label": "nowrap",
      "value": "nowrap"
    },
    pre: {
      "label": "pre",
      "value": "pre"
    },
    'pre-line': {
      "label": "pre-line",
      "value": "pre-line"
    },
    'pre-wrap': {
      "label": "pre-wrap",
      "value": "pre-wrap"
    },
    'initial': {
      "label": "initial",
      "value": "initial"
    },
    'inherit': {
      "label": "inherit",
      "value": "inherit"
    }
  };
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, props.val ? args[props.val].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          onChange(x.value, 'whiteSpace');
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }));
}

class PGcssWhiteSpace extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWhiteSpace);

/***/ }),

/***/ "./src/components/css-width/index.js":
/*!*******************************************!*\
  !*** ./src/components/css-width/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };

  if (typeof props.val == 'object') {
    var valZ = props.val.val + props.val.unit;
  } else {
    var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  }

  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  var widthValX = valArgs[0] == undefined || valArgs[0].match(/-?\d+/g) == null ? 0 : valArgs[0].match(/-?\d+/g)[0];
  var widthUnitX = valArgs[0] == undefined || valArgs[0].match(/[a-zA-Z%]+/g) == null ? 'px' : valArgs[0].match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, widthUnit != 'auto' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    disabled: widthUnit == 'auto' ? true : false,
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'width');
        } else {
          props.onChange(widthUnit, 'width');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'width');
        } else {
          props.onChange(newVal + widthUnit, 'width');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom left",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, valZ ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'width');
            } else {
              props.onChange(x.value, 'width');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'width');
            } else {
              props.onChange(widthVal + x.value, 'width');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'width');
        } else {
          props.onChange(widthVal + widthUnit, 'width');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'width');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'width');
        }
      }
    }
  }));
}

class PGcssWidth extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWidth);

/***/ }),

/***/ "./src/components/css-word-break/index.js":
/*!************************************************!*\
  !*** ./src/components/css-word-break/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    normal: {
      "label": "normal",
      "value": "normal"
    },
    'break-all': {
      "label": "break-all",
      "value": "break-all"
    },
    'keep-all': {
      "label": "keep-all",
      "value": "keep-all"
    },
    'break-word': {
      "label": "break-word",
      "value": "break-word"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'wordBreak');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'wordBreak');
          } else {
            props.onChange(x.value, 'wordBreak');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'wordBreak');
      } else {
        props.onChange(align + ' !important', 'wordBreak');
      }
    }
  }));
}

class PGcssWordBreak extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWordBreak);

/***/ }),

/***/ "./src/components/css-word-spacing/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-word-spacing/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g) == null ? 0 : valZ.match(/[+-]?([0-9]*[.])?[0-9]+/g)[0];
  var widthUnitX = valZ == undefined || valZ.match(/[a-zA-Z%]+/g) == null ? 'px' : valZ.match(/[a-zA-Z%]+/g)[0];
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthVal,
    type: "number",
    onChange: newVal => {
      setwidthVal(newVal);

      if (widthUnit == 'auto') {
        // props.onChange(widthUnit, 'width');
        if (isImportant) {
          props.onChange(widthUnit + ' !important', 'wordSpacing');
        } else {
          props.onChange(widthUnit, 'wordSpacing');
        }
      } else {
        //props.onChange(newVal + widthUnit, 'width');
        if (isImportant) {
          props.onChange(newVal + widthUnit + ' !important', 'wordSpacing');
        } else {
          props.onChange(newVal + widthUnit, 'wordSpacing');
        }
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, props.val ? unitArgs[widthUnit].label : 'Select...'));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(unitArgs).map(y => {
      var index = y[0];
      var x = y[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          setwidthUnit(x.value);

          if (x.value == 'auto') {
            if (isImportant) {
              props.onChange(x.value + ' !important', 'wordSpacing');
            } else {
              props.onChange(x.value, 'wordSpacing');
            }
          } else {
            if (isImportant) {
              props.onChange(widthVal + x.value + ' !important', 'wordSpacing');
            } else {
              props.onChange(widthVal + x.value, 'wordSpacing');
            }
          }
        }
      }, x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit, 'wordSpacing');
        } else {
          props.onChange(widthVal + widthUnit, 'wordSpacing');
        }
      } else {
        if (widthUnit == 'auto') {
          props.onChange(widthUnit + ' !important', 'wordSpacing');
        } else {
          props.onChange(widthVal + widthUnit + ' !important', 'wordSpacing');
        }
      }
    }
  }));
}

class PGcssWordSpacing extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWordSpacing);

/***/ }),

/***/ "./src/components/css-word-wrap/index.js":
/*!***********************************************!*\
  !*** ./src/components/css-word-wrap/index.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    'normal': {
      "label": "Normal",
      "value": "normal"
    },
    'break-word': {
      "label": "Break word",
      "value": "break-word"
    },
    'initial': {
      "label": "Initial",
      "value": "initial"
    },
    'inherit': {
      "label": "Inherit",
      "value": "inherit"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'wordWrap');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'wordWrap');
          } else {
            props.onChange(x.value, 'wordWrap');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'wordWrap');
      } else {
        props.onChange(align + ' !important', 'wordWrap');
      }
    }
  }));
}

class PGcssWordWrap extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWordWrap);

/***/ }),

/***/ "./src/components/css-writing-mode/index.js":
/*!**************************************************!*\
  !*** ./src/components/css-writing-mode/index.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var args = {
    'horizontal-tb': {
      "label": "horizontal-tb",
      "value": "horizontal-tb"
    },
    'vertical-rl': {
      "label": "vertical-rl",
      "value": "vertical-rl"
    },
    'vertical-lr': {
      "label": "vertical-lr",
      "value": "vertical-lr"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valArgs[1] == undefined ? false : true);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
    position: "bottom",
    renderToggle: _ref => {
      let {
        isOpen,
        onToggle
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Clear",
        onClick: onToggle,
        "aria-expanded": isOpen
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: " "
      }, args[align] == undefined ? 'Select...' : args[align].label));
    },
    renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "w-32"
    }, Object.entries(args).map(args => {
      var index = args[0];
      var x = args[1];
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
        onClick: ev => {
          // onChange(x.value, 'writingMode');
          setalign(x.value);

          if (isImportant) {
            props.onChange(x.value + ' !important', 'writingMode');
          } else {
            props.onChange(x.value, 'writingMode');
          }
        }
      }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Reset"), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, x.label));
    }))
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important (Enabled)' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(align, 'writingMode');
      } else {
        props.onChange(align + ' !important', 'writingMode');
      }
    }
  }));
}

class PGcssWritingMode extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWritingMode);

/***/ }),

/***/ "./src/components/css-z-index/index.js":
/*!*********************************************!*\
  !*** ./src/components/css-z-index/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? '0px' : props.val;
  var widthValX = valZ == undefined || valZ.match(/-?\d+/g) == null ? 0 : valZ.match(/-?\d+/g)[0];
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(valZ.includes(" !important") ? true : false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mt-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
    value: widthValX,
    type: "number",
    onChange: newVal => {
      if (isImportant) {
        props.onChange(newVal + ' !important', 'zIndex');
      } else {
        props.onChange(newVal, 'zIndex');
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
    help: isImportant ? 'Important Enabled' : 'Important?',
    checked: isImportant,
    onChange: arg => {
      //console.log(arg);
      setImportant(isImportant => !isImportant);

      if (isImportant) {
        props.onChange(widthValX, 'zIndex');
      } else {
        props.onChange(widthValX + ' !important', 'zIndex');
      }
    }
  }));
}

class PGcssZIndex extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssZIndex);

/***/ }),

/***/ "./src/components/divider/index.js":
/*!*****************************************!*\
  !*** ./src/components/divider/index.js ***!
  \*****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  const [isResizing, setisResizing] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
  const [lastDownX, setlastDownX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(0);

  const onMouseClickDrag = e => {
    console.log('onMouseClickDrag');
  };

  const onMouseDownDrag = e => {
    console.log('onMouseDownDrag');
    setisResizing(true);
    setlastDownX(e.clientY);
  };

  const onMouseUpDrag = e => {
    console.log('onMouseUpDrag');
    setisResizing(false);
  };

  document.addEventListener("mousemove", e => {
    // console.log('####mousemove#####');
    console.log(isResizing);
    if (!isResizing) return;
    const container = document.getElementById("container");
    const top = document.getElementById("top-panel");
    const bottom = document.getElementById("bottom-panel");
    const handle = document.getElementById("drag");
    var offsetRight = container.offsetHeight - (e.clientY - container.offsetTop);
    top.style.bottom = offsetRight;
    bottom.style.height = offsetRight;
  });
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    id: "container"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    id: "top-panel",
    className: "bg-amber-200  cursor-row-resize"
  }, " This is the top side's content! "), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    id: "bottom-panel",
    className: "bg-amber-100  cursor-row-resize"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    id: "drag",
    onMouseDown: onMouseDownDrag,
    onMouseUp: onMouseUpDrag
  }, "Bottom content!")));
}

class PGDivider extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      val,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGDivider);

/***/ }),

/***/ "./src/components/dropdown-sudo-selector/index.js":
/*!********************************************************!*\
  !*** ./src/components/dropdown-sudo-selector/index.js ***!
  \********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__);





class PGDropdownSudoSelector extends _wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Component {
  render() {
    const {
      position,
      variant,
      options,
      buttonTitle,
      onChange,
      values,
      value,
      sudoScourceUpdate
    } = this.props;

    function Html() {
      //var sudoScourceArgsLocal = localStorage.getItem('sudoScourceArgs');
      //sudoScourceArgsLocal = (sudoScourceArgsLocal != null) ? JSON.parse(sudoScourceArgsLocal) : {};
      const [pickerOpen, setPickerOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
      const [keyword, setKeyword] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
      const [filteredOptions, setfilteredOptions] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]);
      const [optionsX, setoptionsX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(options);
      (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
        sudoScourceUpdate(optionsX);
      }, [optionsX]);
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "relative"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "",
        onClick: ev => {
          setPickerOpen(prev => !prev);
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
        variant: variant
      }, optionsX[value] != undefined ? optionsX[value].label : buttonTitle)), pickerOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Popover, {
        position: position
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "p-2 w-60\t"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        autocomplete: "off",
        className: "p-3 w-full",
        placeholder: "Search Options",
        value: keyword,
        onChange: newVal => {
          if (newVal.length > 0) {
            setKeyword(newVal);
          }

          if (typeof optionsX == 'object') {
            setfilteredOptions({});
            var newOptions = {};
            Object.entries(optionsX).map(args => {
              var index = args[0];
              var x = args[1];
              let position = x.label.toLowerCase().search(newVal.toLowerCase());

              if (position < 0) {
                x.exclude = true;
              } else {
                x.exclude = false;
              }

              newOptions[index] = x;
            });
            setfilteredOptions(newOptions);
          } else {
            setfilteredOptions([]);
            var newOptions = [];
            optionsX.map((x, index) => {
              let position = x.label.toLowerCase().search(newVal.toLowerCase());

              if (position < 0) {
                x.exclude = true;
              } else {
                x.exclude = false;
              } //newOptions.push(x);

            });
            setfilteredOptions(newOptions);
          }
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, keyword.length == 0 && typeof optionsX == 'object' && Object.entries(optionsX).map(args => {
        var index = args[0];
        var x = args[1];
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "border-b cursor-pointer hover:bg-slate-200 p-2 block"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: [x.isPro ? 'flex justify-between' : '']
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: [x.isPro ? 'text-gray-400' : '']
        }, x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          className: ""
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, null, x.icon)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "",
          onClick: ev => {
            if (x.isPro == true) {
              alert('Sorry this feature only avilbale in pro');
            } else {
              // var sudoScourceArgsLocal = localStorage.getItem('sudoScourceArgs');
              //sudoScourceArgsLocal = (sudoScourceArgsLocal != null) ? JSON.parse(sudoScourceArgsLocal) : {};
              var sudoId = x.value.replace('(n)', '(' + x.arg + ')'); //sudoScourceArgsLocal[sudoId] = { label: sudoId, value: sudoId, }
              //localStorage.setItem('sudoScourceArgs', JSON.stringify(sudoScourceArgsLocal));
              // var sudoScourceArgsLocalX = localStorage.getItem('sudoScourceArgs');
              //console.log(JSON.parse(sudoScourceArgsLocalX));
              //localStorage.clear();
              //options = JSON.parse(sudoScourceArgsLocalX);
              //setoptionsX(JSON.parse(sudoScourceArgsLocalX));

              onChange(x, index);
              optionsX[sudoId] = {
                label: x.label,
                value: sudoId
              };
              setoptionsX(optionsX); //sudoScourceUpdate();
            }
          }
        }, x.label, " ")), x.arg != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "w-16"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
          className: "mr-2",
          value: x.arg,
          onChange: newVal => {
            x.arg = newVal;
          }
        })), x.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          className: "bg-amber-400 rounded-sm px-3  text-white hover:text-white"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
          target: "_blank",
          href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
        }, "Pro"))), x.description != undefined && x.description.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "text-xs text-slate-400"
        }, x.description));
      }), keyword.length == 0 && typeof optionsX == 'array' && optionsX.map((x, index) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: " border-b cursor-pointer hover:bg-slate-200 p-2 block",
          onClick: ev => {
            //onChange(x, index)
            if (x.isPro == true) {
              alert('Sorry this feature only avilbale in pro');
            } else {
              onChange(x, index);
            }
          }
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "flex justify-between"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          className: ""
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, null, x.icon)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          className: ""
        }, x.label, " ")), x.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
          className: "bg-amber-400 rounded-sm px-3  text-white hover:text-white"
        }, "Pro")), x.description != undefined && x.description.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
          className: "text-xs text-slate-400"
        }, x.description));
      }), keyword.length > 0 && typeof filteredOptions == 'object' && Object.entries(filteredOptions).map(args => {
        var index = args[0];
        var x = args[1];

        if (x.exclude == false) {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "  cursor-pointer hover:bg-slate-400 p-2 block",
            onClick: ev => {
              //onChange(x, index)
              if (x.isPro == true) {
                alert('Sorry this feature only avilbale in pro');
              } else {
                onChange(x, index);
              }
            }
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "flex justify-between"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
            className: ""
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, null, x.icon)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
            className: ""
          }, x.label, " ")), x.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
            className: "bg-amber-400 rounded-sm px-3  text-white hover:text-white"
          }, "Pro")), x.description != undefined && x.description.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "text-xs text-slate-400"
          }, x.description));
        }
      }), keyword.length > 0 && typeof filteredOptions == 'array' && filteredOptions.map((x, index) => {
        if (x.exclude == false) {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "  cursor-pointer hover:bg-slate-400 p-2 block",
            onClick: ev => {
              //onChange(x, index)
              if (x.isPro == true) {
                alert('Sorry this feature only avilbale in pro');
              } else {
                onChange(x, index);
              }
            }
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "flex justify-between"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
            className: ""
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, null, x.icon)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
            className: ""
          }, x.label, " ")), x.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
            className: "bg-amber-400 rounded-sm px-3  text-white hover:text-white"
          }, "Pro")), x.description != undefined && x.description.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
            className: "text-xs text-slate-400"
          }, x.description));
        }
      }), keyword.length > 0 && typeof filteredOptions == 'object' && Object.entries(filteredOptions).length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "text-center p-2 text-red-500 "
      }, "No options found."), keyword.length > 0 && filteredOptions.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "text-center p-2 text-red-500 "
      }, "No options found.")))));
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, null));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGDropdownSudoSelector);

/***/ }),

/***/ "./src/components/dropdown/index.js":
/*!******************************************!*\
  !*** ./src/components/dropdown/index.js ***!
  \******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);




function Html(props) {
  if (!props.warn) {
    return null;
  }

  const [pickerOpen, setPickerOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
  const [keyword, setKeyword] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)('');
  const [filteredOptions, setfilteredOptions] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]);
  var position = props.position;
  var variant = props.variant;
  var btnClass = props.btnClass;
  var options = props.options;
  var buttonTitle = props.buttonTitle;
  var value = props.value == undefined ? '' : props.value;
  var onChange = props.onChange;

  function isNumeric(n) {
    return !isNaN(parseFloat(n)) && isFinite(n);
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "relative"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "",
    onClick: ev => {
      setPickerOpen(prev => !prev);
    }
  }, typeof value == 'string' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
    className: btnClass,
    variant: variant
  }, options[value] != undefined ? options[value].label : buttonTitle), typeof value != 'string' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
    className: btnClass,
    variant: variant
  }, buttonTitle)), pickerOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Popover, {
    position: position
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "p-2 w-60\t"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
    autocomplete: "off",
    className: "p-3 w-full",
    placeholder: "Search CSS Attributes",
    value: keyword,
    onChange: newVal => {
      var newValX = newVal.replace(/[^a-zA-Z ]/g, "");

      if (newValX.length > 0) {
        setKeyword(newValX);
      }

      if (typeof options == 'object') {
        setfilteredOptions({});
        var newOptions = {};
        Object.entries(options).map(args => {
          var index = args[0];
          var x = args[1];
          let position = x.label.toLowerCase().search(newValX.toLowerCase());

          if (position < 0) {
            x.exclude = true;
          } else {
            x.exclude = false;
          }

          newOptions[index] = x;
        });
        setfilteredOptions(newOptions);
      } else {
        setfilteredOptions([]);
        var newOptions = [];
        options.map((x, index) => {
          let position = x.label.toLowerCase().search(newValX.toLowerCase());

          if (position < 0) {
            x.exclude = true;
          } else {
            x.exclude = false;
          } //newOptions.push(x);

        });
        setfilteredOptions(newOptions);
      }
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, keyword.length == 0 && typeof options == 'object' && Object.entries(options).map(args => {
    var index = args[0];
    var x = args[1];
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: [typeof value == 'object' && value.includes(isNumeric(index) ? parseInt(index) : index) ? 'border-b cursor-pointer bg-slate-200 p-2 block' : 'border-b cursor-pointer hover:bg-slate-200 p-2 block'],
      onClick: ev => {
        if (x.isPro == true) {
          alert('Sorry this feature only avilbale in pro');
        } else {
          onChange(x, index);
        }
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "flex justify-between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: [x.isPro ? 'text-gray-400' : '']
    }, x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, null, x.icon)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: ""
    }, x.label)), x.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "bg-amber-400 rounded-sm px-3  text-white hover:text-white"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("a", {
      target: "_blank",
      href: 'https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=' + x.label
    }, "Pro"))), x.description != undefined && x.description.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-xs text-slate-400"
    }, x.description));
  }), keyword.length == 0 && typeof options == 'array' && options.map((x, index) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: [typeof value == 'object' && value.includes(IsNumeric(index) ? parseInt(index) : index) ? 'border-b cursor-pointer bg-slate-200 p-2 block' : 'border-b cursor-pointer hover:bg-slate-200 p-2 block'],
      onClick: ev => {
        //onChange(x, index)
        if (x.isPro == true) {
          alert('Sorry this feature only avilbale in pro');
        } else {
          onChange(x, index);
        }
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "flex justify-between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: ""
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, null, x.icon)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: ""
    }, x.label, " ")), x.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: "bg-amber-400 rounded-sm px-3  text-white hover:text-white"
    }, "Pro")), x.description != undefined && x.description.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      className: "text-xs text-slate-400"
    }, x.description));
  }), keyword.length > 0 && typeof filteredOptions == 'object' && Object.entries(filteredOptions).map(args => {
    var index = args[0];
    var x = args[1];

    if (x.exclude == false) {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "  cursor-pointer hover:bg-slate-400 p-2 block",
        onClick: ev => {
          //onChange(x, index)
          if (x.isPro == true) {
            alert('Sorry this feature only avilbale in pro');
          } else {
            onChange(x, index);
          }
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "flex justify-between"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: ""
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, null, x.icon)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: ""
      }, x.label, " ")), x.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "bg-amber-400 rounded-sm px-3  text-white hover:text-white"
      }, "Pro")), x.description != undefined && x.description.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "text-xs text-slate-400"
      }, x.description));
    }
  }), keyword.length > 0 && typeof filteredOptions == 'array' && filteredOptions.map((x, index) => {
    if (x.exclude == false) {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "  cursor-pointer hover:bg-slate-400 p-2 block",
        onClick: ev => {
          //onChange(x, index)
          if (x.isPro == true) {
            alert('Sorry this feature only avilbale in pro');
          } else {
            onChange(x, index);
          }
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "flex justify-between"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, x.icon != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: ""
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, null, x.icon)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: ""
      }, x.label, " ")), x.isPro && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
        className: "bg-amber-400 rounded-sm px-3  text-white hover:text-white"
      }, "Pro")), x.description != undefined && x.description.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
        className: "text-xs text-slate-400"
      }, x.description));
    }
  }), keyword.length > 0 && typeof filteredOptions == 'object' && Object.entries(filteredOptions).length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "text-center p-2 text-red-500 "
  }, "No options found."), keyword.length > 0 && filteredOptions.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "text-center p-2 text-red-500 "
  }, "No options found.")))));
}

class PGDropdown extends _wordpress_element__WEBPACK_IMPORTED_MODULE_1__.Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      position,
      variant,
      btnClass,
      options,
      //[{"label":"Select..","icon":"","value":""}]
      buttonTitle,
      onChange,
      values,
      value
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, {
      value: value,
      position: position,
      btnClass: btnClass,
      variant: variant,
      options: options,
      buttonTitle: buttonTitle,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGDropdown);

/***/ }),

/***/ "./src/components/icon-picker/bootstrap-icons.js":
/*!*******************************************************!*\
  !*** ./src/components/icon-picker/bootstrap-icons.js ***!
  \*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
const bootstrapIcons = ['bi-123', 'bi-alarm-fill', 'bi-alarm', 'bi-align-bottom', 'bi-align-center', 'bi-align-end', 'bi-align-middle', 'bi-align-start', 'bi-align-top', 'bi-alt', 'bi-app-indicator', 'bi-app', 'bi-archive-fill', 'bi-archive', 'bi-arrow-90deg-down', 'bi-arrow-90deg-left', 'bi-arrow-90deg-right', 'bi-arrow-90deg-up', 'bi-arrow-bar-down', 'bi-arrow-bar-left', 'bi-arrow-bar-right', 'bi-arrow-bar-up', 'bi-arrow-clockwise', 'bi-arrow-counterclockwise', 'bi-arrow-down-circle-fill', 'bi-arrow-down-circle', 'bi-arrow-down-left-circle-fill', 'bi-arrow-down-left-circle', 'bi-arrow-down-left-square-fill', 'bi-arrow-down-left-square', 'bi-arrow-down-left', 'bi-arrow-down-right-circle-fill', 'bi-arrow-down-right-circle', 'bi-arrow-down-right-square-fill', 'bi-arrow-down-right-square', 'bi-arrow-down-right', 'bi-arrow-down-short', 'bi-arrow-down-square-fill', 'bi-arrow-down-square', 'bi-arrow-down-up', 'bi-arrow-down', 'bi-arrow-left-circle-fill', 'bi-arrow-left-circle', 'bi-arrow-left-right', 'bi-arrow-left-short', 'bi-arrow-left-square-fill', 'bi-arrow-left-square', 'bi-arrow-left', 'bi-arrow-repeat', 'bi-arrow-return-left', 'bi-arrow-return-right', 'bi-arrow-right-circle-fill', 'bi-arrow-right-circle', 'bi-arrow-right-short', 'bi-arrow-right-square-fill', 'bi-arrow-right-square', 'bi-arrow-right', 'bi-arrow-up-circle-fill', 'bi-arrow-up-circle', 'bi-arrow-up-left-circle-fill', 'bi-arrow-up-left-circle', 'bi-arrow-up-left-square-fill', 'bi-arrow-up-left-square', 'bi-arrow-up-left', 'bi-arrow-up-right-circle-fill', 'bi-arrow-up-right-circle', 'bi-arrow-up-right-square-fill', 'bi-arrow-up-right-square', 'bi-arrow-up-right', 'bi-arrow-up-short', 'bi-arrow-up-square-fill', 'bi-arrow-up-square', 'bi-arrow-up', 'bi-arrows-angle-contract', 'bi-arrows-angle-expand', 'bi-arrows-collapse', 'bi-arrows-expand', 'bi-arrows-fullscreen', 'bi-arrows-move', 'bi-aspect-ratio-fill', 'bi-aspect-ratio', 'bi-asterisk', 'bi-at', 'bi-award-fill', 'bi-award', 'bi-back', 'bi-backspace-fill', 'bi-backspace-reverse-fill', 'bi-backspace-reverse', 'bi-backspace', 'bi-badge-3d-fill', 'bi-badge-3d', 'bi-badge-4k-fill', 'bi-badge-4k', 'bi-badge-8k-fill', 'bi-badge-8k', 'bi-badge-ad-fill', 'bi-badge-ad', 'bi-badge-ar-fill', 'bi-badge-ar', 'bi-badge-cc-fill', 'bi-badge-cc', 'bi-badge-hd-fill', 'bi-badge-hd', 'bi-badge-tm-fill', 'bi-badge-tm', 'bi-badge-vo-fill', 'bi-badge-vo', 'bi-badge-vr-fill', 'bi-badge-vr', 'bi-badge-wc-fill', 'bi-badge-wc', 'bi-bag-check-fill', 'bi-bag-check', 'bi-bag-dash-fill', 'bi-bag-dash', 'bi-bag-fill', 'bi-bag-plus-fill', 'bi-bag-plus', 'bi-bag-x-fill', 'bi-bag-x', 'bi-bag', 'bi-bar-chart-fill', 'bi-bar-chart-line-fill', 'bi-bar-chart-line', 'bi-bar-chart-steps', 'bi-bar-chart', 'bi-basket-fill', 'bi-basket', 'bi-basket2-fill', 'bi-basket2', 'bi-basket3-fill', 'bi-basket3', 'bi-battery-charging', 'bi-battery-full', 'bi-battery-half', 'bi-battery', 'bi-bell-fill', 'bi-bell', 'bi-bezier', 'bi-bezier2', 'bi-bicycle', 'bi-binoculars-fill', 'bi-binoculars', 'bi-blockquote-left', 'bi-blockquote-right', 'bi-book-fill', 'bi-book-half', 'bi-book', 'bi-bookmark-check-fill', 'bi-bookmark-check', 'bi-bookmark-dash-fill', 'bi-bookmark-dash', 'bi-bookmark-fill', 'bi-bookmark-heart-fill', 'bi-bookmark-heart', 'bi-bookmark-plus-fill', 'bi-bookmark-plus', 'bi-bookmark-star-fill', 'bi-bookmark-star', 'bi-bookmark-x-fill', 'bi-bookmark-x', 'bi-bookmark', 'bi-bookmarks-fill', 'bi-bookmarks', 'bi-bookshelf', 'bi-bootstrap-fill', 'bi-bootstrap-reboot', 'bi-bootstrap', 'bi-border-all', 'bi-border-bottom', 'bi-border-center', 'bi-border-inner', 'bi-border-left', 'bi-border-middle', 'bi-border-outer', 'bi-border-right', 'bi-border-style', 'bi-border-top', 'bi-border-width', 'bi-border', 'bi-bounding-box-circles', 'bi-bounding-box', 'bi-box-arrow-down-left', 'bi-box-arrow-down-right', 'bi-box-arrow-down', 'bi-box-arrow-in-down-left', 'bi-box-arrow-in-down-right', 'bi-box-arrow-in-down', 'bi-box-arrow-in-left', 'bi-box-arrow-in-right', 'bi-box-arrow-in-up-left', 'bi-box-arrow-in-up-right', 'bi-box-arrow-in-up', 'bi-box-arrow-left', 'bi-box-arrow-right', 'bi-box-arrow-up-left', 'bi-box-arrow-up-right', 'bi-box-arrow-up', 'bi-box-seam', 'bi-box', 'bi-braces', 'bi-bricks', 'bi-briefcase-fill', 'bi-briefcase', 'bi-brightness-alt-high-fill', 'bi-brightness-alt-high', 'bi-brightness-alt-low-fill', 'bi-brightness-alt-low', 'bi-brightness-high-fill', 'bi-brightness-high', 'bi-brightness-low-fill', 'bi-brightness-low', 'bi-broadcast-pin', 'bi-broadcast', 'bi-brush-fill', 'bi-brush', 'bi-bucket-fill', 'bi-bucket', 'bi-bug-fill', 'bi-bug', 'bi-building', 'bi-bullseye', 'bi-calculator-fill', 'bi-calculator', 'bi-calendar-check-fill', 'bi-calendar-check', 'bi-calendar-date-fill', 'bi-calendar-date', 'bi-calendar-day-fill', 'bi-calendar-day', 'bi-calendar-event-fill', 'bi-calendar-event', 'bi-calendar-fill', 'bi-calendar-minus-fill', 'bi-calendar-minus', 'bi-calendar-month-fill', 'bi-calendar-month', 'bi-calendar-plus-fill', 'bi-calendar-plus', 'bi-calendar-range-fill', 'bi-calendar-range', 'bi-calendar-week-fill', 'bi-calendar-week', 'bi-calendar-x-fill', 'bi-calendar-x', 'bi-calendar', 'bi-calendar2-check-fill', 'bi-calendar2-check', 'bi-calendar2-date-fill', 'bi-calendar2-date', 'bi-calendar2-day-fill', 'bi-calendar2-day', 'bi-calendar2-event-fill', 'bi-calendar2-event', 'bi-calendar2-fill', 'bi-calendar2-minus-fill', 'bi-calendar2-minus', 'bi-calendar2-month-fill', 'bi-calendar2-month', 'bi-calendar2-plus-fill', 'bi-calendar2-plus', 'bi-calendar2-range-fill', 'bi-calendar2-range', 'bi-calendar2-week-fill', 'bi-calendar2-week', 'bi-calendar2-x-fill', 'bi-calendar2-x', 'bi-calendar2', 'bi-calendar3-event-fill', 'bi-calendar3-event', 'bi-calendar3-fill', 'bi-calendar3-range-fill', 'bi-calendar3-range', 'bi-calendar3-week-fill', 'bi-calendar3-week', 'bi-calendar3', 'bi-calendar4-event', 'bi-calendar4-range', 'bi-calendar4-week', 'bi-calendar4', 'bi-camera-fill', 'bi-camera-reels-fill', 'bi-camera-reels', 'bi-camera-video-fill', 'bi-camera-video-off-fill', 'bi-camera-video-off', 'bi-camera-video', 'bi-camera', 'bi-camera2', 'bi-capslock-fill', 'bi-capslock', 'bi-card-checklist', 'bi-card-heading', 'bi-card-image', 'bi-card-list', 'bi-card-text', 'bi-caret-down-fill', 'bi-caret-down-square-fill', 'bi-caret-down-square', 'bi-caret-down', 'bi-caret-left-fill', 'bi-caret-left-square-fill', 'bi-caret-left-square', 'bi-caret-left', 'bi-caret-right-fill', 'bi-caret-right-square-fill', 'bi-caret-right-square', 'bi-caret-right', 'bi-caret-up-fill', 'bi-caret-up-square-fill', 'bi-caret-up-square', 'bi-caret-up', 'bi-cart-check-fill', 'bi-cart-check', 'bi-cart-dash-fill', 'bi-cart-dash', 'bi-cart-fill', 'bi-cart-plus-fill', 'bi-cart-plus', 'bi-cart-x-fill', 'bi-cart-x', 'bi-cart', 'bi-cart2', 'bi-cart3', 'bi-cart4', 'bi-cash-stack', 'bi-cash', 'bi-cast', 'bi-chat-dots-fill', 'bi-chat-dots', 'bi-chat-fill', 'bi-chat-left-dots-fill', 'bi-chat-left-dots', 'bi-chat-left-fill', 'bi-chat-left-quote-fill', 'bi-chat-left-quote', 'bi-chat-left-text-fill', 'bi-chat-left-text', 'bi-chat-left', 'bi-chat-quote-fill', 'bi-chat-quote', 'bi-chat-right-dots-fill', 'bi-chat-right-dots', 'bi-chat-right-fill', 'bi-chat-right-quote-fill', 'bi-chat-right-quote', 'bi-chat-right-text-fill', 'bi-chat-right-text', 'bi-chat-right', 'bi-chat-square-dots-fill', 'bi-chat-square-dots', 'bi-chat-square-fill', 'bi-chat-square-quote-fill', 'bi-chat-square-quote', 'bi-chat-square-text-fill', 'bi-chat-square-text', 'bi-chat-square', 'bi-chat-text-fill', 'bi-chat-text', 'bi-chat', 'bi-check-all', 'bi-check-circle-fill', 'bi-check-circle', 'bi-check-square-fill', 'bi-check-square', 'bi-check', 'bi-check2-all', 'bi-check2-circle', 'bi-check2-square', 'bi-check2', 'bi-chevron-bar-contract', 'bi-chevron-bar-down', 'bi-chevron-bar-expand', 'bi-chevron-bar-left', 'bi-chevron-bar-right', 'bi-chevron-bar-up', 'bi-chevron-compact-down', 'bi-chevron-compact-left', 'bi-chevron-compact-right', 'bi-chevron-compact-up', 'bi-chevron-contract', 'bi-chevron-double-down', 'bi-chevron-double-left', 'bi-chevron-double-right', 'bi-chevron-double-up', 'bi-chevron-down', 'bi-chevron-expand', 'bi-chevron-left', 'bi-chevron-right', 'bi-chevron-up', 'bi-circle-fill', 'bi-circle-half', 'bi-circle-square', 'bi-circle', 'bi-clipboard-check', 'bi-clipboard-data', 'bi-clipboard-minus', 'bi-clipboard-plus', 'bi-clipboard-x', 'bi-clipboard', 'bi-clock-fill', 'bi-clock-history', 'bi-clock', 'bi-cloud-arrow-down-fill', 'bi-cloud-arrow-down', 'bi-cloud-arrow-up-fill', 'bi-cloud-arrow-up', 'bi-cloud-check-fill', 'bi-cloud-check', 'bi-cloud-download-fill', 'bi-cloud-download', 'bi-cloud-drizzle-fill', 'bi-cloud-drizzle', 'bi-cloud-fill', 'bi-cloud-fog-fill', 'bi-cloud-fog', 'bi-cloud-fog2-fill', 'bi-cloud-fog2', 'bi-cloud-hail-fill', 'bi-cloud-hail', 'bi-cloud-haze-1', 'bi-cloud-haze-fill', 'bi-cloud-haze', 'bi-cloud-haze2-fill', 'bi-cloud-lightning-fill', 'bi-cloud-lightning-rain-fill', 'bi-cloud-lightning-rain', 'bi-cloud-lightning', 'bi-cloud-minus-fill', 'bi-cloud-minus', 'bi-cloud-moon-fill', 'bi-cloud-moon', 'bi-cloud-plus-fill', 'bi-cloud-plus', 'bi-cloud-rain-fill', 'bi-cloud-rain-heavy-fill', 'bi-cloud-rain-heavy', 'bi-cloud-rain', 'bi-cloud-slash-fill', 'bi-cloud-slash', 'bi-cloud-sleet-fill', 'bi-cloud-sleet', 'bi-cloud-snow-fill', 'bi-cloud-snow', 'bi-cloud-sun-fill', 'bi-cloud-sun', 'bi-cloud-upload-fill', 'bi-cloud-upload', 'bi-cloud', 'bi-clouds-fill', 'bi-clouds', 'bi-cloudy-fill', 'bi-cloudy', 'bi-code-slash', 'bi-code-square', 'bi-code', 'bi-collection-fill', 'bi-collection-play-fill', 'bi-collection-play', 'bi-collection', 'bi-columns-gap', 'bi-columns', 'bi-command', 'bi-compass-fill', 'bi-compass', 'bi-cone-striped', 'bi-cone', 'bi-controller', 'bi-cpu-fill', 'bi-cpu', 'bi-credit-card-2-back-fill', 'bi-credit-card-2-back', 'bi-credit-card-2-front-fill', 'bi-credit-card-2-front', 'bi-credit-card-fill', 'bi-credit-card', 'bi-crop', 'bi-cup-fill', 'bi-cup-straw', 'bi-cup', 'bi-cursor-fill', 'bi-cursor-text', 'bi-cursor', 'bi-dash-circle-dotted', 'bi-dash-circle-fill', 'bi-dash-circle', 'bi-dash-square-dotted', 'bi-dash-square-fill', 'bi-dash-square', 'bi-dash', 'bi-diagram-2-fill', 'bi-diagram-2', 'bi-diagram-3-fill', 'bi-diagram-3', 'bi-diamond-fill', 'bi-diamond-half', 'bi-diamond', 'bi-dice-1-fill', 'bi-dice-1', 'bi-dice-2-fill', 'bi-dice-2', 'bi-dice-3-fill', 'bi-dice-3', 'bi-dice-4-fill', 'bi-dice-4', 'bi-dice-5-fill', 'bi-dice-5', 'bi-dice-6-fill', 'bi-dice-6', 'bi-disc-fill', 'bi-disc', 'bi-discord', 'bi-display-fill', 'bi-display', 'bi-distribute-horizontal', 'bi-distribute-vertical', 'bi-door-closed-fill', 'bi-door-closed', 'bi-door-open-fill', 'bi-door-open', 'bi-dot', 'bi-download', 'bi-droplet-fill', 'bi-droplet-half', 'bi-droplet', 'bi-earbuds', 'bi-easel-fill', 'bi-easel', 'bi-egg-fill', 'bi-egg-fried', 'bi-egg', 'bi-eject-fill', 'bi-eject', 'bi-emoji-angry-fill', 'bi-emoji-angry', 'bi-emoji-dizzy-fill', 'bi-emoji-dizzy', 'bi-emoji-expressionless-fill', 'bi-emoji-expressionless', 'bi-emoji-frown-fill', 'bi-emoji-frown', 'bi-emoji-heart-eyes-fill', 'bi-emoji-heart-eyes', 'bi-emoji-laughing-fill', 'bi-emoji-laughing', 'bi-emoji-neutral-fill', 'bi-emoji-neutral', 'bi-emoji-smile-fill', 'bi-emoji-smile-upside-down-fill', 'bi-emoji-smile-upside-down', 'bi-emoji-smile', 'bi-emoji-sunglasses-fill', 'bi-emoji-sunglasses', 'bi-emoji-wink-fill', 'bi-emoji-wink', 'bi-envelope-fill', 'bi-envelope-open-fill', 'bi-envelope-open', 'bi-envelope', 'bi-eraser-fill', 'bi-eraser', 'bi-exclamation-circle-fill', 'bi-exclamation-circle', 'bi-exclamation-diamond-fill', 'bi-exclamation-diamond', 'bi-exclamation-octagon-fill', 'bi-exclamation-octagon', 'bi-exclamation-square-fill', 'bi-exclamation-square', 'bi-exclamation-triangle-fill', 'bi-exclamation-triangle', 'bi-exclamation', 'bi-exclude', 'bi-eye-fill', 'bi-eye-slash-fill', 'bi-eye-slash', 'bi-eye', 'bi-eyedropper', 'bi-eyeglasses', 'bi-facebook', 'bi-file-arrow-down-fill', 'bi-file-arrow-down', 'bi-file-arrow-up-fill', 'bi-file-arrow-up', 'bi-file-bar-graph-fill', 'bi-file-bar-graph', 'bi-file-binary-fill', 'bi-file-binary', 'bi-file-break-fill', 'bi-file-break', 'bi-file-check-fill', 'bi-file-check', 'bi-file-code-fill', 'bi-file-code', 'bi-file-diff-fill', 'bi-file-diff', 'bi-file-earmark-arrow-down-fill', 'bi-file-earmark-arrow-down', 'bi-file-earmark-arrow-up-fill', 'bi-file-earmark-arrow-up', 'bi-file-earmark-bar-graph-fill', 'bi-file-earmark-bar-graph', 'bi-file-earmark-binary-fill', 'bi-file-earmark-binary', 'bi-file-earmark-break-fill', 'bi-file-earmark-break', 'bi-file-earmark-check-fill', 'bi-file-earmark-check', 'bi-file-earmark-code-fill', 'bi-file-earmark-code', 'bi-file-earmark-diff-fill', 'bi-file-earmark-diff', 'bi-file-earmark-easel-fill', 'bi-file-earmark-easel', 'bi-file-earmark-excel-fill', 'bi-file-earmark-excel', 'bi-file-earmark-fill', 'bi-file-earmark-font-fill', 'bi-file-earmark-font', 'bi-file-earmark-image-fill', 'bi-file-earmark-image', 'bi-file-earmark-lock-fill', 'bi-file-earmark-lock', 'bi-file-earmark-lock2-fill', 'bi-file-earmark-lock2', 'bi-file-earmark-medical-fill', 'bi-file-earmark-medical', 'bi-file-earmark-minus-fill', 'bi-file-earmark-minus', 'bi-file-earmark-music-fill', 'bi-file-earmark-music', 'bi-file-earmark-person-fill', 'bi-file-earmark-person', 'bi-file-earmark-play-fill', 'bi-file-earmark-play', 'bi-file-earmark-plus-fill', 'bi-file-earmark-plus', 'bi-file-earmark-post-fill', 'bi-file-earmark-post', 'bi-file-earmark-ppt-fill', 'bi-file-earmark-ppt', 'bi-file-earmark-richtext-fill', 'bi-file-earmark-richtext', 'bi-file-earmark-ruled-fill', 'bi-file-earmark-ruled', 'bi-file-earmark-slides-fill', 'bi-file-earmark-slides', 'bi-file-earmark-spreadsheet-fill', 'bi-file-earmark-spreadsheet', 'bi-file-earmark-text-fill', 'bi-file-earmark-text', 'bi-file-earmark-word-fill', 'bi-file-earmark-word', 'bi-file-earmark-x-fill', 'bi-file-earmark-x', 'bi-file-earmark-zip-fill', 'bi-file-earmark-zip', 'bi-file-earmark', 'bi-file-easel-fill', 'bi-file-easel', 'bi-file-excel-fill', 'bi-file-excel', 'bi-file-fill', 'bi-file-font-fill', 'bi-file-font', 'bi-file-image-fill', 'bi-file-image', 'bi-file-lock-fill', 'bi-file-lock', 'bi-file-lock2-fill', 'bi-file-lock2', 'bi-file-medical-fill', 'bi-file-medical', 'bi-file-minus-fill', 'bi-file-minus', 'bi-file-music-fill', 'bi-file-music', 'bi-file-person-fill', 'bi-file-person', 'bi-file-play-fill', 'bi-file-play', 'bi-file-plus-fill', 'bi-file-plus', 'bi-file-post-fill', 'bi-file-post', 'bi-file-ppt-fill', 'bi-file-ppt', 'bi-file-richtext-fill', 'bi-file-richtext', 'bi-file-ruled-fill', 'bi-file-ruled', 'bi-file-slides-fill', 'bi-file-slides', 'bi-file-spreadsheet-fill', 'bi-file-spreadsheet', 'bi-file-text-fill', 'bi-file-text', 'bi-file-word-fill', 'bi-file-word', 'bi-file-x-fill', 'bi-file-x', 'bi-file-zip-fill', 'bi-file-zip', 'bi-file', 'bi-files-alt', 'bi-files', 'bi-film', 'bi-filter-circle-fill', 'bi-filter-circle', 'bi-filter-left', 'bi-filter-right', 'bi-filter-square-fill', 'bi-filter-square', 'bi-filter', 'bi-flag-fill', 'bi-flag', 'bi-flower1', 'bi-flower2', 'bi-flower3', 'bi-folder-check', 'bi-folder-fill', 'bi-folder-minus', 'bi-folder-plus', 'bi-folder-symlink-fill', 'bi-folder-symlink', 'bi-folder-x', 'bi-folder', 'bi-folder2-open', 'bi-folder2', 'bi-fonts', 'bi-forward-fill', 'bi-forward', 'bi-front', 'bi-fullscreen-exit', 'bi-fullscreen', 'bi-funnel-fill', 'bi-funnel', 'bi-gear-fill', 'bi-gear-wide-connected', 'bi-gear-wide', 'bi-gear', 'bi-gem', 'bi-geo-alt-fill', 'bi-geo-alt', 'bi-geo-fill', 'bi-geo', 'bi-gift-fill', 'bi-gift', 'bi-github', 'bi-globe', 'bi-globe2', 'bi-google', 'bi-graph-down', 'bi-graph-up', 'bi-grid-1x2-fill', 'bi-grid-1x2', 'bi-grid-3x2-gap-fill', 'bi-grid-3x2-gap', 'bi-grid-3x2', 'bi-grid-3x3-gap-fill', 'bi-grid-3x3-gap', 'bi-grid-3x3', 'bi-grid-fill', 'bi-grid', 'bi-grip-horizontal', 'bi-grip-vertical', 'bi-hammer', 'bi-hand-index-fill', 'bi-hand-index-thumb-fill', 'bi-hand-index-thumb', 'bi-hand-index', 'bi-hand-thumbs-down-fill', 'bi-hand-thumbs-down', 'bi-hand-thumbs-up-fill', 'bi-hand-thumbs-up', 'bi-handbag-fill', 'bi-handbag', 'bi-hash', 'bi-hdd-fill', 'bi-hdd-network-fill', 'bi-hdd-network', 'bi-hdd-rack-fill', 'bi-hdd-rack', 'bi-hdd-stack-fill', 'bi-hdd-stack', 'bi-hdd', 'bi-headphones', 'bi-headset', 'bi-heart-fill', 'bi-heart-half', 'bi-heart', 'bi-heptagon-fill', 'bi-heptagon-half', 'bi-heptagon', 'bi-hexagon-fill', 'bi-hexagon-half', 'bi-hexagon', 'bi-hourglass-bottom', 'bi-hourglass-split', 'bi-hourglass-top', 'bi-hourglass', 'bi-house-door-fill', 'bi-house-door', 'bi-house-fill', 'bi-house', 'bi-hr', 'bi-hurricane', 'bi-image-alt', 'bi-image-fill', 'bi-image', 'bi-images', 'bi-inbox-fill', 'bi-inbox', 'bi-inboxes-fill', 'bi-inboxes', 'bi-info-circle-fill', 'bi-info-circle', 'bi-info-square-fill', 'bi-info-square', 'bi-info', 'bi-input-cursor-text', 'bi-input-cursor', 'bi-instagram', 'bi-intersect', 'bi-journal-album', 'bi-journal-arrow-down', 'bi-journal-arrow-up', 'bi-journal-bookmark-fill', 'bi-journal-bookmark', 'bi-journal-check', 'bi-journal-code', 'bi-journal-medical', 'bi-journal-minus', 'bi-journal-plus', 'bi-journal-richtext', 'bi-journal-text', 'bi-journal-x', 'bi-journal', 'bi-journals', 'bi-joystick', 'bi-justify-left', 'bi-justify-right', 'bi-justify', 'bi-kanban-fill', 'bi-kanban', 'bi-key-fill', 'bi-key', 'bi-keyboard-fill', 'bi-keyboard', 'bi-ladder', 'bi-lamp-fill', 'bi-lamp', 'bi-laptop-fill', 'bi-laptop', 'bi-layer-backward', 'bi-layer-forward', 'bi-layers-fill', 'bi-layers-half', 'bi-layers', 'bi-layout-sidebar-inset-reverse', 'bi-layout-sidebar-inset', 'bi-layout-sidebar-reverse', 'bi-layout-sidebar', 'bi-layout-split', 'bi-layout-text-sidebar-reverse', 'bi-layout-text-sidebar', 'bi-layout-text-window-reverse', 'bi-layout-text-window', 'bi-layout-three-columns', 'bi-layout-wtf', 'bi-life-preserver', 'bi-lightbulb-fill', 'bi-lightbulb-off-fill', 'bi-lightbulb-off', 'bi-lightbulb', 'bi-lightning-charge-fill', 'bi-lightning-charge', 'bi-lightning-fill', 'bi-lightning', 'bi-link-45deg', 'bi-link', 'bi-linkedin', 'bi-list-check', 'bi-list-nested', 'bi-list-ol', 'bi-list-stars', 'bi-list-task', 'bi-list-ul', 'bi-list', 'bi-lock-fill', 'bi-lock', 'bi-mailbox', 'bi-mailbox2', 'bi-map-fill', 'bi-map', 'bi-markdown-fill', 'bi-markdown', 'bi-mask', 'bi-megaphone-fill', 'bi-megaphone', 'bi-menu-app-fill', 'bi-menu-app', 'bi-menu-button-fill', 'bi-menu-button-wide-fill', 'bi-menu-button-wide', 'bi-menu-button', 'bi-menu-down', 'bi-menu-up', 'bi-mic-fill', 'bi-mic-mute-fill', 'bi-mic-mute', 'bi-mic', 'bi-minecart-loaded', 'bi-minecart', 'bi-moisture', 'bi-moon-fill', 'bi-moon-stars-fill', 'bi-moon-stars', 'bi-moon', 'bi-mouse-fill', 'bi-mouse', 'bi-mouse2-fill', 'bi-mouse2', 'bi-mouse3-fill', 'bi-mouse3', 'bi-music-note-beamed', 'bi-music-note-list', 'bi-music-note', 'bi-music-player-fill', 'bi-music-player', 'bi-newspaper', 'bi-node-minus-fill', 'bi-node-minus', 'bi-node-plus-fill', 'bi-node-plus', 'bi-nut-fill', 'bi-nut', 'bi-octagon-fill', 'bi-octagon-half', 'bi-octagon', 'bi-option', 'bi-outlet', 'bi-paint-bucket', 'bi-palette-fill', 'bi-palette', 'bi-palette2', 'bi-paperclip', 'bi-paragraph', 'bi-patch-check-fill', 'bi-patch-check', 'bi-patch-exclamation-fill', 'bi-patch-exclamation', 'bi-patch-minus-fill', 'bi-patch-minus', 'bi-patch-plus-fill', 'bi-patch-plus', 'bi-patch-question-fill', 'bi-patch-question', 'bi-pause-btn-fill', 'bi-pause-btn', 'bi-pause-circle-fill', 'bi-pause-circle', 'bi-pause-fill', 'bi-pause', 'bi-peace-fill', 'bi-peace', 'bi-pen-fill', 'bi-pen', 'bi-pencil-fill', 'bi-pencil-square', 'bi-pencil', 'bi-pentagon-fill', 'bi-pentagon-half', 'bi-pentagon', 'bi-people-fill', 'bi-people', 'bi-percent', 'bi-person-badge-fill', 'bi-person-badge', 'bi-person-bounding-box', 'bi-person-check-fill', 'bi-person-check', 'bi-person-circle', 'bi-person-dash-fill', 'bi-person-dash', 'bi-person-fill', 'bi-person-lines-fill', 'bi-person-plus-fill', 'bi-person-plus', 'bi-person-square', 'bi-person-x-fill', 'bi-person-x', 'bi-person', 'bi-phone-fill', 'bi-phone-landscape-fill', 'bi-phone-landscape', 'bi-phone-vibrate-fill', 'bi-phone-vibrate', 'bi-phone', 'bi-pie-chart-fill', 'bi-pie-chart', 'bi-pin-angle-fill', 'bi-pin-angle', 'bi-pin-fill', 'bi-pin', 'bi-pip-fill', 'bi-pip', 'bi-play-btn-fill', 'bi-play-btn', 'bi-play-circle-fill', 'bi-play-circle', 'bi-play-fill', 'bi-play', 'bi-plug-fill', 'bi-plug', 'bi-plus-circle-dotted', 'bi-plus-circle-fill', 'bi-plus-circle', 'bi-plus-square-dotted', 'bi-plus-square-fill', 'bi-plus-square', 'bi-plus', 'bi-power', 'bi-printer-fill', 'bi-printer', 'bi-puzzle-fill', 'bi-puzzle', 'bi-question-circle-fill', 'bi-question-circle', 'bi-question-diamond-fill', 'bi-question-diamond', 'bi-question-octagon-fill', 'bi-question-octagon', 'bi-question-square-fill', 'bi-question-square', 'bi-question', 'bi-rainbow', 'bi-receipt-cutoff', 'bi-receipt', 'bi-reception-0', 'bi-reception-1', 'bi-reception-2', 'bi-reception-3', 'bi-reception-4', 'bi-record-btn-fill', 'bi-record-btn', 'bi-record-circle-fill', 'bi-record-circle', 'bi-record-fill', 'bi-record', 'bi-record2-fill', 'bi-record2', 'bi-reply-all-fill', 'bi-reply-all', 'bi-reply-fill', 'bi-reply', 'bi-rss-fill', 'bi-rss', 'bi-rulers', 'bi-save-fill', 'bi-save', 'bi-save2-fill', 'bi-save2', 'bi-scissors', 'bi-screwdriver', 'bi-search', 'bi-segmented-nav', 'bi-server', 'bi-share-fill', 'bi-share', 'bi-shield-check', 'bi-shield-exclamation', 'bi-shield-fill-check', 'bi-shield-fill-exclamation', 'bi-shield-fill-minus', 'bi-shield-fill-plus', 'bi-shield-fill-x', 'bi-shield-fill', 'bi-shield-lock-fill', 'bi-shield-lock', 'bi-shield-minus', 'bi-shield-plus', 'bi-shield-shaded', 'bi-shield-slash-fill', 'bi-shield-slash', 'bi-shield-x', 'bi-shield', 'bi-shift-fill', 'bi-shift', 'bi-shop-window', 'bi-shop', 'bi-shuffle', 'bi-signpost-2-fill', 'bi-signpost-2', 'bi-signpost-fill', 'bi-signpost-split-fill', 'bi-signpost-split', 'bi-signpost', 'bi-sim-fill', 'bi-sim', 'bi-skip-backward-btn-fill', 'bi-skip-backward-btn', 'bi-skip-backward-circle-fill', 'bi-skip-backward-circle', 'bi-skip-backward-fill', 'bi-skip-backward', 'bi-skip-end-btn-fill', 'bi-skip-end-btn', 'bi-skip-end-circle-fill', 'bi-skip-end-circle', 'bi-skip-end-fill', 'bi-skip-end', 'bi-skip-forward-btn-fill', 'bi-skip-forward-btn', 'bi-skip-forward-circle-fill', 'bi-skip-forward-circle', 'bi-skip-forward-fill', 'bi-skip-forward', 'bi-skip-start-btn-fill', 'bi-skip-start-btn', 'bi-skip-start-circle-fill', 'bi-skip-start-circle', 'bi-skip-start-fill', 'bi-skip-start', 'bi-slack', 'bi-slash-circle-fill', 'bi-slash-circle', 'bi-slash-square-fill', 'bi-slash-square', 'bi-slash', 'bi-sliders', 'bi-smartwatch', 'bi-snow', 'bi-snow2', 'bi-snow3', 'bi-sort-alpha-down-alt', 'bi-sort-alpha-down', 'bi-sort-alpha-up-alt', 'bi-sort-alpha-up', 'bi-sort-down-alt', 'bi-sort-down', 'bi-sort-numeric-down-alt', 'bi-sort-numeric-down', 'bi-sort-numeric-up-alt', 'bi-sort-numeric-up', 'bi-sort-up-alt', 'bi-sort-up', 'bi-soundwave', 'bi-speaker-fill', 'bi-speaker', 'bi-speedometer', 'bi-speedometer2', 'bi-spellcheck', 'bi-square-fill', 'bi-square-half', 'bi-square', 'bi-stack', 'bi-star-fill', 'bi-star-half', 'bi-star', 'bi-stars', 'bi-stickies-fill', 'bi-stickies', 'bi-sticky-fill', 'bi-sticky', 'bi-stop-btn-fill', 'bi-stop-btn', 'bi-stop-circle-fill', 'bi-stop-circle', 'bi-stop-fill', 'bi-stop', 'bi-stoplights-fill', 'bi-stoplights', 'bi-stopwatch-fill', 'bi-stopwatch', 'bi-subtract', 'bi-suit-club-fill', 'bi-suit-club', 'bi-suit-diamond-fill', 'bi-suit-diamond', 'bi-suit-heart-fill', 'bi-suit-heart', 'bi-suit-spade-fill', 'bi-suit-spade', 'bi-sun-fill', 'bi-sun', 'bi-sunglasses', 'bi-sunrise-fill', 'bi-sunrise', 'bi-sunset-fill', 'bi-sunset', 'bi-symmetry-horizontal', 'bi-symmetry-vertical', 'bi-table', 'bi-tablet-fill', 'bi-tablet-landscape-fill', 'bi-tablet-landscape', 'bi-tablet', 'bi-tag-fill', 'bi-tag', 'bi-tags-fill', 'bi-tags', 'bi-telegram', 'bi-telephone-fill', 'bi-telephone-forward-fill', 'bi-telephone-forward', 'bi-telephone-inbound-fill', 'bi-telephone-inbound', 'bi-telephone-minus-fill', 'bi-telephone-minus', 'bi-telephone-outbound-fill', 'bi-telephone-outbound', 'bi-telephone-plus-fill', 'bi-telephone-plus', 'bi-telephone-x-fill', 'bi-telephone-x', 'bi-telephone', 'bi-terminal-fill', 'bi-terminal', 'bi-text-center', 'bi-text-indent-left', 'bi-text-indent-right', 'bi-text-left', 'bi-text-paragraph', 'bi-text-right', 'bi-textarea-resize', 'bi-textarea-t', 'bi-textarea', 'bi-thermometer-half', 'bi-thermometer-high', 'bi-thermometer-low', 'bi-thermometer-snow', 'bi-thermometer-sun', 'bi-thermometer', 'bi-three-dots-vertical', 'bi-three-dots', 'bi-toggle-off', 'bi-toggle-on', 'bi-toggle2-off', 'bi-toggle2-on', 'bi-toggles', 'bi-toggles2', 'bi-tools', 'bi-tornado', 'bi-trash-fill', 'bi-trash', 'bi-trash2-fill', 'bi-trash2', 'bi-tree-fill', 'bi-tree', 'bi-triangle-fill', 'bi-triangle-half', 'bi-triangle', 'bi-trophy-fill', 'bi-trophy', 'bi-tropical-storm', 'bi-truck-flatbed', 'bi-truck', 'bi-tsunami', 'bi-tv-fill', 'bi-tv', 'bi-twitch', 'bi-twitter', 'bi-type-bold', 'bi-type-h1', 'bi-type-h2', 'bi-type-h3', 'bi-type-italic', 'bi-type-strikethrough', 'bi-type-underline', 'bi-type', 'bi-ui-checks-grid', 'bi-ui-checks', 'bi-ui-radios-grid', 'bi-ui-radios', 'bi-umbrella-fill', 'bi-umbrella', 'bi-union', 'bi-unlock-fill', 'bi-unlock', 'bi-upc-scan', 'bi-upc', 'bi-upload', 'bi-vector-pen', 'bi-view-list', 'bi-view-stacked', 'bi-vinyl-fill', 'bi-vinyl', 'bi-voicemail', 'bi-volume-down-fill', 'bi-volume-down', 'bi-volume-mute-fill', 'bi-volume-mute', 'bi-volume-off-fill', 'bi-volume-off', 'bi-volume-up-fill', 'bi-volume-up', 'bi-vr', 'bi-wallet-fill', 'bi-wallet', 'bi-wallet2', 'bi-watch', 'bi-water', 'bi-whatsapp', 'bi-wifi-1', 'bi-wifi-2', 'bi-wifi-off', 'bi-wifi', 'bi-wind', 'bi-window-dock', 'bi-window-sidebar', 'bi-window', 'bi-wrench', 'bi-x-circle-fill', 'bi-x-circle', 'bi-x-diamond-fill', 'bi-x-diamond', 'bi-x-octagon-fill', 'bi-x-octagon', 'bi-x-square-fill', 'bi-x-square', 'bi-x', 'bi-youtube', 'bi-zoom-in', 'bi-zoom-out', 'bi-bank', 'bi-bank2', 'bi-bell-slash-fill', 'bi-bell-slash', 'bi-cash-coin', 'bi-check-lg', 'bi-coin', 'bi-currency-bitcoin', 'bi-currency-dollar', 'bi-currency-euro', 'bi-currency-exchange', 'bi-currency-pound', 'bi-currency-yen', 'bi-dash-lg', 'bi-exclamation-lg', 'bi-file-earmark-pdf-fill', 'bi-file-earmark-pdf', 'bi-file-pdf-fill', 'bi-file-pdf', 'bi-gender-ambiguous', 'bi-gender-female', 'bi-gender-male', 'bi-gender-trans', 'bi-headset-vr', 'bi-info-lg', 'bi-mastodon', 'bi-messenger', 'bi-piggy-bank-fill', 'bi-piggy-bank', 'bi-pin-map-fill', 'bi-pin-map', 'bi-plus-lg', 'bi-question-lg', 'bi-recycle', 'bi-reddit', 'bi-safe-fill', 'bi-safe2-fill', 'bi-safe2', 'bi-sd-card-fill', 'bi-sd-card', 'bi-skype', 'bi-slash-lg', 'bi-translate', 'bi-x-lg', 'bi-safe', 'bi-apple', 'bi-microsoft', 'bi-windows', 'bi-behance', 'bi-dribbble', 'bi-line', 'bi-medium', 'bi-paypal', 'bi-pinterest', 'bi-signal', 'bi-snapchat', 'bi-spotify', 'bi-stack-overflow', 'bi-strava', 'bi-wordpress', 'bi-vimeo', 'bi-activity', 'bi-easel2-fill', 'bi-easel2', 'bi-easel3-fill', 'bi-easel3', 'bi-fan', 'bi-fingerprint', 'bi-graph-down-arrow', 'bi-graph-up-arrow', 'bi-hypnotize', 'bi-magic', 'bi-person-rolodex', 'bi-person-video', 'bi-person-video2', 'bi-person-video3', 'bi-person-workspace', 'bi-radioactive', 'bi-webcam-fill', 'bi-webcam', 'bi-yin-yang', 'bi-bandaid-fill', 'bi-bandaid', 'bi-bluetooth', 'bi-body-text', 'bi-boombox', 'bi-boxes', 'bi-dpad-fill', 'bi-dpad', 'bi-ear-fill', 'bi-ear', 'bi-envelope-check-1', 'bi-envelope-check-fill', 'bi-envelope-check', 'bi-envelope-dash-1', 'bi-envelope-dash-fill', 'bi-envelope-dash', 'bi-envelope-exclamation-1', 'bi-envelope-exclamation-fill', 'bi-envelope-exclamation', 'bi-envelope-plus-fill', 'bi-envelope-plus', 'bi-envelope-slash-1', 'bi-envelope-slash-fill', 'bi-envelope-slash', 'bi-envelope-x-1', 'bi-envelope-x-fill', 'bi-envelope-x', 'bi-explicit-fill', 'bi-explicit', 'bi-git', 'bi-infinity', 'bi-list-columns-reverse', 'bi-list-columns', 'bi-meta', 'bi-mortorboard-fill', 'bi-mortorboard', 'bi-nintendo-switch', 'bi-pc-display-horizontal', 'bi-pc-display', 'bi-pc-horizontal', 'bi-pc', 'bi-playstation', 'bi-plus-slash-minus', 'bi-projector-fill', 'bi-projector', 'bi-qr-code-scan', 'bi-qr-code', 'bi-quora', 'bi-quote', 'bi-robot', 'bi-send-check-fill', 'bi-send-check', 'bi-send-dash-fill', 'bi-send-dash', 'bi-send-exclamation-1', 'bi-send-exclamation-fill', 'bi-send-exclamation', 'bi-send-fill', 'bi-send-plus-fill', 'bi-send-plus', 'bi-send-slash-fill', 'bi-send-slash', 'bi-send-x-fill', 'bi-send-x', 'bi-send', 'bi-steam', 'bi-terminal-dash-1', 'bi-terminal-dash', 'bi-terminal-plus', 'bi-terminal-split', 'bi-ticket-detailed-fill', 'bi-ticket-detailed', 'bi-ticket-fill', 'bi-ticket-perforated-fill', 'bi-ticket-perforated', 'bi-ticket', 'bi-tiktok', 'bi-window-dash', 'bi-window-desktop', 'bi-window-fullscreen', 'bi-window-plus', 'bi-window-split', 'bi-window-stack', 'bi-window-x', 'bi-xbox', 'bi-ethernet', 'bi-hdmi-fill', 'bi-hdmi', 'bi-usb-c-fill', 'bi-usb-c', 'bi-usb-fill', 'bi-usb-plug-fill', 'bi-usb-plug', 'bi-usb-symbol', 'bi-usb', 'bi-boombox-fill', 'bi-displayport-1', 'bi-displayport', 'bi-gpu-card', 'bi-memory', 'bi-modem-fill', 'bi-modem', 'bi-motherboard-fill', 'bi-motherboard', 'bi-optical-audio-fill', 'bi-optical-audio', 'bi-pci-card', 'bi-router-fill', 'bi-router', 'bi-ssd-fill', 'bi-ssd', 'bi-thunderbolt-fill', 'bi-thunderbolt', 'bi-usb-drive-fill', 'bi-usb-drive', 'bi-usb-micro-fill', 'bi-usb-micro', 'bi-usb-mini-fill', 'bi-usb-mini', 'bi-cloud-haze2', 'bi-device-hdd-fill', 'bi-device-hdd', 'bi-device-ssd-fill', 'bi-device-ssd', 'bi-displayport-fill', 'bi-mortarboard-fill', 'bi-mortarboard', 'bi-terminal-x', 'bi-arrow-through-heart-fill', 'bi-arrow-through-heart', 'bi-badge-sd-fill', 'bi-badge-sd', 'bi-bag-heart-fill', 'bi-bag-heart', 'bi-balloon-fill', 'bi-balloon-heart-fill', 'bi-balloon-heart', 'bi-balloon', 'bi-box2-fill', 'bi-box2-heart-fill', 'bi-box2-heart', 'bi-box2', 'bi-braces-asterisk', 'bi-calendar-heart-fill', 'bi-calendar-heart', 'bi-calendar2-heart-fill', 'bi-calendar2-heart', 'bi-chat-heart-fill', 'bi-chat-heart', 'bi-chat-left-heart-fill', 'bi-chat-left-heart', 'bi-chat-right-heart-fill', 'bi-chat-right-heart', 'bi-chat-square-heart-fill', 'bi-chat-square-heart', 'bi-clipboard-check-fill', 'bi-clipboard-data-fill', 'bi-clipboard-fill', 'bi-clipboard-heart-fill', 'bi-clipboard-heart', 'bi-clipboard-minus-fill', 'bi-clipboard-plus-fill', 'bi-clipboard-pulse', 'bi-clipboard-x-fill', 'bi-clipboard2-check-fill', 'bi-clipboard2-check', 'bi-clipboard2-data-fill', 'bi-clipboard2-data', 'bi-clipboard2-fill', 'bi-clipboard2-heart-fill', 'bi-clipboard2-heart', 'bi-clipboard2-minus-fill', 'bi-clipboard2-minus', 'bi-clipboard2-plus-fill', 'bi-clipboard2-plus', 'bi-clipboard2-pulse-fill', 'bi-clipboard2-pulse', 'bi-clipboard2-x-fill', 'bi-clipboard2-x', 'bi-clipboard2', 'bi-emoji-kiss-fill', 'bi-emoji-kiss', 'bi-envelope-heart-fill', 'bi-envelope-heart', 'bi-envelope-open-heart-fill', 'bi-envelope-open-heart', 'bi-envelope-paper-fill', 'bi-envelope-paper-heart-fill', 'bi-envelope-paper-heart', 'bi-envelope-paper', 'bi-filetype-aac', 'bi-filetype-ai', 'bi-filetype-bmp', 'bi-filetype-cs', 'bi-filetype-css', 'bi-filetype-csv', 'bi-filetype-doc', 'bi-filetype-docx', 'bi-filetype-exe', 'bi-filetype-gif', 'bi-filetype-heic', 'bi-filetype-html', 'bi-filetype-java', 'bi-filetype-jpg', 'bi-filetype-js', 'bi-filetype-jsx', 'bi-filetype-key', 'bi-filetype-m4p', 'bi-filetype-md', 'bi-filetype-mdx', 'bi-filetype-mov', 'bi-filetype-mp3', 'bi-filetype-mp4', 'bi-filetype-otf', 'bi-filetype-pdf', 'bi-filetype-php', 'bi-filetype-png', 'bi-filetype-ppt-1', 'bi-filetype-ppt', 'bi-filetype-psd', 'bi-filetype-py', 'bi-filetype-raw', 'bi-filetype-rb', 'bi-filetype-sass', 'bi-filetype-scss', 'bi-filetype-sh', 'bi-filetype-svg', 'bi-filetype-tiff', 'bi-filetype-tsx', 'bi-filetype-ttf', 'bi-filetype-txt', 'bi-filetype-wav', 'bi-filetype-woff', 'bi-filetype-xls-1', 'bi-filetype-xls', 'bi-filetype-xml', 'bi-filetype-yml', 'bi-heart-arrow', 'bi-heart-pulse-fill', 'bi-heart-pulse', 'bi-heartbreak-fill', 'bi-heartbreak', 'bi-hearts', 'bi-hospital-fill', 'bi-hospital', 'bi-house-heart-fill', 'bi-house-heart', 'bi-incognito', 'bi-magnet-fill', 'bi-magnet', 'bi-person-heart', 'bi-person-hearts', 'bi-phone-flip', 'bi-plugin', 'bi-postage-fill', 'bi-postage-heart-fill', 'bi-postage-heart', 'bi-postage', 'bi-postcard-fill', 'bi-postcard-heart-fill', 'bi-postcard-heart', 'bi-postcard', 'bi-search-heart-fill', 'bi-search-heart', 'bi-sliders2-vertical', 'bi-sliders2', 'bi-trash3-fill', 'bi-trash3', 'bi-valentine', 'bi-valentine2', 'bi-wrench-adjustable-circle-fill', 'bi-wrench-adjustable-circle', 'bi-wrench-adjustable', 'bi-filetype-json', 'bi-filetype-pptx', 'bi-filetype-xlsx', 'bi-1-circle-1', 'bi-1-circle-fill-1', 'bi-1-circle-fill', 'bi-1-circle', 'bi-1-square-fill', 'bi-1-square', 'bi-2-circle-1', 'bi-2-circle-fill-1', 'bi-2-circle-fill', 'bi-2-circle', 'bi-2-square-fill', 'bi-2-square', 'bi-3-circle-1', 'bi-3-circle-fill-1', 'bi-3-circle-fill', 'bi-3-circle', 'bi-3-square-fill', 'bi-3-square', 'bi-4-circle-1', 'bi-4-circle-fill-1', 'bi-4-circle-fill', 'bi-4-circle', 'bi-4-square-fill', 'bi-4-square', 'bi-5-circle-1', 'bi-5-circle-fill-1', 'bi-5-circle-fill', 'bi-5-circle', 'bi-5-square-fill', 'bi-5-square', 'bi-6-circle-1', 'bi-6-circle-fill-1', 'bi-6-circle-fill', 'bi-6-circle', 'bi-6-square-fill', 'bi-6-square', 'bi-7-circle-1', 'bi-7-circle-fill-1', 'bi-7-circle-fill', 'bi-7-circle', 'bi-7-square-fill', 'bi-7-square', 'bi-8-circle-1', 'bi-8-circle-fill-1', 'bi-8-circle-fill', 'bi-8-circle', 'bi-8-square-fill', 'bi-8-square', 'bi-9-circle-1', 'bi-9-circle-fill-1', 'bi-9-circle-fill', 'bi-9-circle', 'bi-9-square-fill', 'bi-9-square', 'bi-airplane-engines-fill', 'bi-airplane-engines', 'bi-airplane-fill', 'bi-airplane', 'bi-alexa', 'bi-alipay', 'bi-android', 'bi-android2', 'bi-box-fill', 'bi-box-seam-fill', 'bi-browser-chrome', 'bi-browser-edge', 'bi-browser-firefox', 'bi-browser-safari', 'bi-c-circle-1', 'bi-c-circle-fill-1', 'bi-c-circle-fill', 'bi-c-circle', 'bi-c-square-fill', 'bi-c-square', 'bi-capsule-pill', 'bi-capsule', 'bi-car-front-fill', 'bi-car-front', 'bi-cassette-fill', 'bi-cassette', 'bi-cc-circle-1', 'bi-cc-circle-fill-1', 'bi-cc-circle-fill', 'bi-cc-circle', 'bi-cc-square-fill', 'bi-cc-square', 'bi-cup-hot-fill', 'bi-cup-hot', 'bi-currency-rupee', 'bi-dropbox', 'bi-escape', 'bi-fast-forward-btn-fill', 'bi-fast-forward-btn', 'bi-fast-forward-circle-fill', 'bi-fast-forward-circle', 'bi-fast-forward-fill', 'bi-fast-forward', 'bi-filetype-sql', 'bi-fire', 'bi-google-play', 'bi-h-circle-1', 'bi-h-circle-fill-1', 'bi-h-circle-fill', 'bi-h-circle', 'bi-h-square-fill', 'bi-h-square', 'bi-indent', 'bi-lungs-fill', 'bi-lungs', 'bi-microsoft-teams', 'bi-p-circle-1', 'bi-p-circle-fill-1', 'bi-p-circle-fill', 'bi-p-circle', 'bi-p-square-fill', 'bi-p-square', 'bi-pass-fill', 'bi-pass', 'bi-prescription', 'bi-prescription2', 'bi-r-circle-1', 'bi-r-circle-fill-1', 'bi-r-circle-fill', 'bi-r-circle', 'bi-r-square-fill', 'bi-r-square', 'bi-repeat-1', 'bi-repeat', 'bi-rewind-btn-fill', 'bi-rewind-btn', 'bi-rewind-circle-fill', 'bi-rewind-circle', 'bi-rewind-fill', 'bi-rewind', 'bi-train-freight-front-fill', 'bi-train-freight-front', 'bi-train-front-fill', 'bi-train-front', 'bi-train-lightrail-front-fill', 'bi-train-lightrail-front', 'bi-truck-front-fill', 'bi-truck-front', 'bi-ubuntu', 'bi-unindent', 'bi-unity', 'bi-universal-access-circle', 'bi-universal-access', 'bi-virus', 'bi-virus2', 'bi-wechat', 'bi-yelp', 'bi-sign-stop-fill', 'bi-sign-stop-lights-fill', 'bi-sign-stop-lights', 'bi-sign-stop', 'bi-sign-turn-left-fill', 'bi-sign-turn-left', 'bi-sign-turn-right-fill', 'bi-sign-turn-right', 'bi-sign-turn-slight-left-fill', 'bi-sign-turn-slight-left', 'bi-sign-turn-slight-right-fill', 'bi-sign-turn-slight-right', 'bi-sign-yield-fill', 'bi-sign-yield', 'bi-ev-station-fill', 'bi-ev-station', 'bi-fuel-pump-diesel-fill', 'bi-fuel-pump-diesel', 'bi-fuel-pump-fill', 'bi-fuel-pump'];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (bootstrapIcons);

/***/ }),

/***/ "./src/components/icon-picker/fontawesome-classes.js":
/*!***********************************************************!*\
  !*** ./src/components/icon-picker/fontawesome-classes.js ***!
  \***********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
const fontawesomeClasses = ["fas fa-address-book", "fas fa-address-card", "fas fa-adjust", "fas fa-align-center", "fas fa-align-justify", "fas fa-align-left", "fas fa-align-right", "fas fa-allergies", "fas fa-ambulance", "fas fa-american-sign-language-interpreting", "fas fa-anchor", "fas fa-angle-double-down", "fas fa-angle-double-left", "fas fa-angle-double-right", "fas fa-angle-double-up", "fas fa-angle-down", "fas fa-angle-left", "fas fa-angle-right", "fas fa-angle-up", "fas fa-archive", "fas fa-arrow-alt-circle-down", "fas fa-arrow-alt-circle-left", "fas fa-arrow-alt-circle-right", "fas fa-arrow-alt-circle-up", "fas fa-arrow-circle-down", "fas fa-arrow-circle-left", "fas fa-arrow-circle-right", "fas fa-arrow-circle-up", "fas fa-arrow-down", "fas fa-arrow-left", "fas fa-arrow-right", "fas fa-arrow-up", "fas fa-arrows-alt", "fas fa-arrows-alt-h", "fas fa-arrows-alt-v", "fas fa-assistive-listening-systems", "fas fa-asterisk", "fas fa-at", "fas fa-audio-description", "fas fa-backward", "fas fa-balance-scale", "fas fa-ban", "fas fa-band-aid", "fas fa-barcode", "fas fa-bars", "fas fa-baseball-ball", "fas fa-basketball-ball", "fas fa-bath", "fas fa-battery-empty", "fas fa-battery-full", "fas fa-battery-half", "fas fa-battery-quarter", "fas fa-battery-three-quarters", "fas fa-bed", "fas fa-beer", "fas fa-bell", "fas fa-bell-slash", "fas fa-bicycle", "fas fa-binoculars", "fas fa-birthday-cake", "fas fa-blind", "fas fa-bold", "fas fa-bolt", "fas fa-bomb", "fas fa-book", "fas fa-bookmark", "fas fa-bowling-ball", "fas fa-box", "fas fa-box-open", "fas fa-boxes", "fas fa-braille", "fas fa-briefcase", "fas fa-briefcase-medical", "fas fa-bug", "fas fa-building", "fas fa-bullhorn", "fas fa-bullseye", "fas fa-burn", "fas fa-bus", "fas fa-calculator", "fas fa-calendar", "fas fa-calendar-alt", "fas fa-calendar-check", "fas fa-calendar-minus", "fas fa-calendar-plus", "fas fa-calendar-times", "fas fa-camera", "fas fa-camera-retro", "fas fa-capsules", "fas fa-car", "fas fa-caret-down", "fas fa-caret-left", "fas fa-caret-right", "fas fa-caret-square-down", "fas fa-caret-square-left", "fas fa-caret-square-right", "fas fa-caret-square-up", "fas fa-caret-up", "fas fa-cart-arrow-down", "fas fa-cart-plus", "fas fa-certificate", "fas fa-chart-area", "fas fa-chart-bar", "fas fa-chart-line", "fas fa-chart-pie", "fas fa-check", "fas fa-check-circle", "fas fa-check-square", "fas fa-chess", "fas fa-chess-bishop", "fas fa-chess-board", "fas fa-chess-king", "fas fa-chess-knight", "fas fa-chess-pawn", "fas fa-chess-queen", "fas fa-chess-rook", "fas fa-chevron-circle-down", "fas fa-chevron-circle-left", "fas fa-chevron-circle-right", "fas fa-chevron-circle-up", "fas fa-chevron-down", "fas fa-chevron-left", "fas fa-chevron-right", "fas fa-chevron-up", "fas fa-child", "fas fa-circle", "fas fa-circle-notch", "fas fa-clipboard", "fas fa-clipboard-check", "fas fa-clipboard-list", "fas fa-clock", "fas fa-clone", "fas fa-closed-captioning", "fas fa-cloud", "fas fa-cloud-download-alt", "fas fa-cloud-upload-alt", "fas fa-code", "fas fa-code-branch", "fas fa-coffee", "fas fa-cog", "fas fa-cogs", "fas fa-columns", "fas fa-comment", "fas fa-comment-alt", "fas fa-comment-dots", "fas fa-comment-slash", "fas fa-comments", "fas fa-compass", "fas fa-compress", "fas fa-copy", "fas fa-copyright", "fas fa-couch", "fas fa-credit-card", "fas fa-crop", "fas fa-crosshairs", "fas fa-cube", "fas fa-cubes", "fas fa-cut", "fas fa-database", "fas fa-deaf", "fas fa-desktop", "fas fa-diagnoses", "fas fa-dna", "fas fa-dollar-sign", "fas fa-dolly", "fas fa-dolly-flatbed", "fas fa-donate", "fas fa-dot-circle", "fas fa-dove", "fas fa-download", "fas fa-edit", "fas fa-eject", "fas fa-ellipsis-h", "fas fa-ellipsis-v", "fas fa-envelope", "fas fa-envelope-open", "fas fa-envelope-square", "fas fa-eraser", "fas fa-euro-sign", "fas fa-exchange-alt", "fas fa-exclamation", "fas fa-exclamation-circle", "fas fa-exclamation-triangle", "fas fa-expand", "fas fa-expand-arrows-alt", "fas fa-external-link-alt", "fas fa-external-link-square-alt", "fas fa-eye", "fas fa-eye-dropper", "fas fa-eye-slash", "fas fa-fast-backward", "fas fa-fast-forward", "fas fa-fax", "fas fa-female", "fas fa-fighter-jet", "fas fa-file", "fas fa-file-alt", "fas fa-file-archive", "fas fa-file-audio", "fas fa-file-code", "fas fa-file-excel", "fas fa-file-image", "fas fa-file-medical", "fas fa-file-medical-alt", "fas fa-file-pdf", "fas fa-file-powerpoint", "fas fa-file-video", "fas fa-file-word", "fas fa-film", "fas fa-filter", "fas fa-fire", "fas fa-fire-extinguisher", "fas fa-first-aid", "fas fa-flag", "fas fa-flag-checkered", "fas fa-flask", "fas fa-folder", "fas fa-folder-open", "fas fa-font", "fas fa-football-ball", "fas fa-forward", "fas fa-frown", "fas fa-futbol", "fas fa-gamepad", "fas fa-gavel", "fas fa-gem", "fas fa-genderless", "fas fa-gift", "fas fa-glass-martini", "fas fa-globe", "fas fa-golf-ball", "fas fa-graduation-cap", "fas fa-h-square", "fas fa-hand-holding", "fas fa-hand-holding-heart", "fas fa-hand-holding-usd", "fas fa-hand-lizard", "fas fa-hand-paper", "fas fa-hand-peace", "fas fa-hand-point-down", "fas fa-hand-point-left", "fas fa-hand-point-right", "fas fa-hand-point-up", "fas fa-hand-pointer", "fas fa-hand-rock", "fas fa-hand-scissors", "fas fa-hand-spock", "fas fa-hands", "fas fa-hands-helping", "fas fa-handshake", "fas fa-hashtag", "fas fa-hdd", "fas fa-heading", "fas fa-headphones", "fas fa-heart", "fas fa-heartbeat", "fas fa-history", "fas fa-hockey-puck", "fas fa-home", "fas fa-hospital", "fas fa-hospital-alt", "fas fa-hospital-symbol", "fas fa-hourglass", "fas fa-hourglass-end", "fas fa-hourglass-half", "fas fa-hourglass-start", "fas fa-i-cursor", "fas fa-id-badge", "fas fa-id-card", "fas fa-id-card-alt", "fas fa-image", "fas fa-images", "fas fa-inbox", "fas fa-indent", "fas fa-industry", "fas fa-info", "fas fa-info-circle", "fas fa-italic", "fas fa-key", "fas fa-keyboard", "fas fa-language", "fas fa-laptop", "fas fa-leaf", "fas fa-lemon", "fas fa-level-down-alt", "fas fa-level-up-alt", "fas fa-life-ring", "fas fa-lightbulb", "fas fa-link", "fas fa-lira-sign", "fas fa-list", "fas fa-list-alt", "fas fa-list-ol", "fas fa-list-ul", "fas fa-location-arrow", "fas fa-lock", "fas fa-lock-open", "fas fa-long-arrow-alt-down", "fas fa-long-arrow-alt-left", "fas fa-long-arrow-alt-right", "fas fa-long-arrow-alt-up", "fas fa-low-vision", "fas fa-magic", "fas fa-magnet", "fas fa-male", "fas fa-map", "fas fa-map-marker", "fas fa-map-marker-alt", "fas fa-map-pin", "fas fa-map-signs", "fas fa-mars", "fas fa-mars-double", "fas fa-mars-stroke", "fas fa-mars-stroke-h", "fas fa-mars-stroke-v", "fas fa-medkit", "fas fa-meh", "fas fa-mercury", "fas fa-microchip", "fas fa-microphone", "fas fa-microphone-slash", "fas fa-minus", "fas fa-minus-circle", "fas fa-minus-square", "fas fa-mobile", "fas fa-mobile-alt", "fas fa-money-bill-alt", "fas fa-moon", "fas fa-motorcycle", "fas fa-mouse-pointer", "fas fa-music", "fas fa-neuter", "fas fa-newspaper", "fas fa-notes-medical", "fas fa-object-group", "fas fa-object-ungroup", "fas fa-outdent", "fas fa-paint-brush", "fas fa-pallet", "fas fa-paper-plane", "fas fa-paperclip", "fas fa-parachute-box", "fas fa-paragraph", "fas fa-paste", "fas fa-pause", "fas fa-pause-circle", "fas fa-paw", "fas fa-pen-square", "fas fa-pencil-alt", "fas fa-people-carry", "fas fa-percent", "fas fa-phone", "fas fa-phone-slash", "fas fa-phone-square", "fas fa-phone-volume", "fas fa-piggy-bank", "fas fa-pills", "fas fa-plane", "fas fa-play", "fas fa-play-circle", "fas fa-plug", "fas fa-plus", "fas fa-plus-circle", "fas fa-plus-square", "fas fa-podcast", "fas fa-poo", "fas fa-pound-sign", "fas fa-power-off", "fas fa-prescription-bottle", "fas fa-prescription-bottle-alt", "fas fa-print", "fas fa-procedures", "fas fa-puzzle-piece", "fas fa-qrcode", "fas fa-question", "fas fa-question-circle", "fas fa-quidditch", "fas fa-quote-left", "fas fa-quote-right", "fas fa-random", "fas fa-recycle", "fas fa-redo", "fas fa-redo-alt", "fas fa-registered", "fas fa-reply", "fas fa-reply-all", "fas fa-retweet", "fas fa-ribbon", "fas fa-road", "fas fa-rocket", "fas fa-rss", "fas fa-rss-square", "fas fa-ruble-sign", "fas fa-rupee-sign", "fas fa-save", "fas fa-search", "fas fa-search-minus", "fas fa-search-plus", "fas fa-seedling", "fas fa-server", "fas fa-share", "fas fa-share-alt", "fas fa-share-alt-square", "fas fa-share-square", "fas fa-shekel-sign", "fas fa-shield-alt", "fas fa-ship", "fas fa-shipping-fast", "fas fa-shopping-bag", "fas fa-shopping-basket", "fas fa-shopping-cart", "fas fa-shower", "fas fa-sign", "fas fa-sign-in-alt", "fas fa-sign-language", "fas fa-sign-out-alt", "fas fa-signal", "fas fa-sitemap", "fas fa-sliders-h", "fas fa-smile", "fas fa-smoking", "fas fa-snowflake", "fas fa-sort", "fas fa-sort-alpha-down", "fas fa-sort-alpha-up", "fas fa-sort-amount-down", "fas fa-sort-amount-up", "fas fa-sort-down", "fas fa-sort-numeric-down", "fas fa-sort-numeric-up", "fas fa-sort-up", "fas fa-space-shuttle", "fas fa-spinner", "fas fa-square", "fas fa-square-full", "fas fa-star", "fas fa-star-half", "fas fa-step-backward", "fas fa-step-forward", "fas fa-stethoscope", "fas fa-sticky-note", "fas fa-stop", "fas fa-stop-circle", "fas fa-stopwatch", "fas fa-street-view", "fas fa-strikethrough", "fas fa-subscript", "fas fa-subway", "fas fa-suitcase", "fas fa-sun", "fas fa-superscript", "fas fa-sync", "fas fa-sync-alt", "fas fa-syringe", "fas fa-table", "fas fa-table-tennis", "fas fa-tablet", "fas fa-tablet-alt", "fas fa-tablets", "fas fa-tachometer-alt", "fas fa-tag", "fas fa-tags", "fas fa-tape", "fas fa-tasks", "fas fa-taxi", "fas fa-terminal", "fas fa-text-height", "fas fa-text-width", "fas fa-th", "fas fa-th-large", "fas fa-th-list", "fas fa-thermometer", "fas fa-thermometer-empty", "fas fa-thermometer-full", "fas fa-thermometer-half", "fas fa-thermometer-quarter", "fas fa-thermometer-three-quarters", "fas fa-thumbs-down", "fas fa-thumbs-up", "fas fa-thumbtack", "fas fa-ticket-alt", "fas fa-times", "fas fa-times-circle", "fas fa-tint", "fas fa-toggle-off", "fas fa-toggle-on", "fas fa-trademark", "fas fa-train", "fas fa-transgender", "fas fa-transgender-alt", "fas fa-trash", "fas fa-trash-alt", "fas fa-tree", "fas fa-trophy", "fas fa-truck", "fas fa-truck-loading", "fas fa-truck-moving", "fas fa-tty", "fas fa-tv", "fas fa-umbrella", "fas fa-underline", "fas fa-undo", "fas fa-undo-alt", "fas fa-universal-access", "fas fa-university", "fas fa-unlink", "fas fa-unlock", "fas fa-unlock-alt", "fas fa-upload", "fas fa-user", "fas fa-user-circle", "fas fa-user-md", "fas fa-user-plus", "fas fa-user-secret", "fas fa-user-times", "fas fa-users", "fas fa-utensil-spoon", "fas fa-utensils", "fas fa-venus", "fas fa-venus-double", "fas fa-venus-mars", "fas fa-vial", "fas fa-vials", "fas fa-video", "fas fa-video-slash", "fas fa-volleyball-ball", "fas fa-volume-down", "fas fa-volume-off", "fas fa-volume-up", "fas fa-warehouse", "fas fa-weight", "fas fa-wheelchair", "fas fa-wifi", "fas fa-window-close", "fas fa-window-maximize", "fas fa-window-minimize", "fas fa-window-restore", "fas fa-wine-glass", "fas fa-won-sign", "fas fa-wrench", "fas fa-x-ray", "fas fa-yen-sign", "far fa-address-book", "far fa-address-card", "far fa-arrow-alt-circle-down", "far fa-arrow-alt-circle-left", "far fa-arrow-alt-circle-right", "far fa-arrow-alt-circle-up", "far fa-bell", "far fa-bell-slash", "far fa-bookmark", "far fa-building", "far fa-calendar", "far fa-calendar-alt", "far fa-calendar-check", "far fa-calendar-minus", "far fa-calendar-plus", "far fa-calendar-times", "far fa-caret-square-down", "far fa-caret-square-left", "far fa-caret-square-right", "far fa-caret-square-up", "far fa-chart-bar", "far fa-check-circle", "far fa-check-square", "far fa-circle", "far fa-clipboard", "far fa-clock", "far fa-clone", "far fa-closed-captioning", "far fa-comment", "far fa-comment-alt", "far fa-comments", "far fa-compass", "far fa-copy", "far fa-copyright", "far fa-credit-card", "far fa-dot-circle", "far fa-edit", "far fa-envelope", "far fa-envelope-open", "far fa-eye-slash", "far fa-file", "far fa-file-alt", "far fa-file-archive", "far fa-file-audio", "far fa-file-code", "far fa-file-excel", "far fa-file-image", "far fa-file-pdf", "far fa-file-powerpoint", "far fa-file-video", "far fa-file-word", "far fa-flag", "far fa-folder", "far fa-folder-open", "far fa-frown", "far fa-futbol", "far fa-gem", "far fa-hand-lizard", "far fa-hand-paper", "far fa-hand-peace", "far fa-hand-point-down", "far fa-hand-point-left", "far fa-hand-point-right", "far fa-hand-point-up", "far fa-hand-pointer", "far fa-hand-rock", "far fa-hand-scissors", "far fa-hand-spock", "far fa-handshake", "far fa-hdd", "far fa-heart", "far fa-hospital", "far fa-hourglass", "far fa-id-badge", "far fa-id-card", "far fa-image", "far fa-images", "far fa-keyboard", "far fa-lemon", "far fa-life-ring", "far fa-lightbulb", "far fa-list-alt", "far fa-map", "far fa-meh", "far fa-minus-square", "far fa-money-bill-alt", "far fa-moon", "far fa-newspaper", "far fa-object-group", "far fa-object-ungroup", "far fa-paper-plane", "far fa-pause-circle", "far fa-play-circle", "far fa-plus-square", "far fa-question-circle", "far fa-registered", "far fa-save", "far fa-share-square", "far fa-smile", "far fa-snowflake", "far fa-square", "far fa-star", "far fa-star-half", "far fa-sticky-note", "far fa-stop-circle", "far fa-sun", "far fa-thumbs-down", "far fa-thumbs-up", "far fa-times-circle", "far fa-trash-alt", "far fa-user", "far fa-user-circle", "far fa-window-close", "far fa-window-maximize", "far fa-window-minimize", "far fa-window-restore", "fab fa-500px", "fab fa-accessible-icon", "fab fa-accusoft", "fab fa-adn", "fab fa-adversal", "fab fa-affiliatetheme", "fab fa-algolia", "fab fa-amazon", "fab fa-amazon-pay", "fab fa-amilia", "fab fa-android", "fab fa-angellist", "fab fa-angrycreative", "fab fa-angular", "fab fa-app-store", "fab fa-app-store-ios", "fab fa-apper", "fab fa-apple", "fab fa-apple-pay", "fab fa-asymmetrik", "fab fa-audible", "fab fa-autoprefixer", "fab fa-avianex", "fab fa-aviato", "fab fa-aws", "fab fa-bandcamp", "fab fa-behance", "fab fa-behance-square", "fab fa-bimobject", "fab fa-bitbucket", "fab fa-bitcoin", "fab fa-bity", "fab fa-black-tie", "fab fa-blackberry", "fab fa-blogger", "fab fa-blogger-b", "fab fa-bluetooth", "fab fa-bluetooth-b", "fab fa-btc", "fab fa-buromobelexperte", "fab fa-buysellads", "fab fa-cc-amazon-pay", "fab fa-cc-amex", "fab fa-cc-apple-pay", "fab fa-cc-diners-club", "fab fa-cc-discover", "fab fa-cc-jcb", "fab fa-cc-mastercard", "fab fa-cc-paypal", "fab fa-cc-stripe", "fab fa-cc-visa", "fab fa-centercode", "fab fa-chrome", "fab fa-cloudscale", "fab fa-cloudsmith", "fab fa-cloudversify", "fab fa-codepen", "fab fa-codiepie", "fab fa-connectdevelop", "fab fa-contao", "fab fa-cpanel", "fab fa-creative-commons", "fab fa-css3", "fab fa-css3-alt", "fab fa-cuttlefish", "fab fa-d-and-d", "fab fa-dashcube", "fab fa-delicious", "fab fa-deploydog", "fab fa-deskpro", "fab fa-deviantart", "fab fa-digg", "fab fa-digital-ocean", "fab fa-discord", "fab fa-discourse", "fab fa-dochub", "fab fa-docker", "fab fa-draft2digital", "fab fa-dribbble", "fab fa-dribbble-square", "fab fa-dropbox", "fab fa-drupal", "fab fa-dyalog", "fab fa-earlybirds", "fab fa-edge", "fab fa-elementor", "fab fa-ember", "fab fa-empire", "fab fa-envira", "fab fa-erlang", "fab fa-ethereum", "fab fa-etsy", "fab fa-expeditedssl", "fab fa-facebook", "fab fa-facebook-f", "fab fa-facebook-messenger", "fab fa-facebook-square", "fab fa-firefox", "fab fa-first-order", "fab fa-firstdraft", "fab fa-flickr", "fab fa-flipboard", "fab fa-fly", "fab fa-font-awesome", "fab fa-font-awesome-alt", "fab fa-font-awesome-flag", "fab fa-fonticons", "fab fa-fonticons-fi", "fab fa-fort-awesome", "fab fa-fort-awesome-alt", "fab fa-forumbee", "fab fa-foursquare", "fab fa-free-code-camp", "fab fa-freebsd", "fab fa-get-pocket", "fab fa-gg", "fab fa-gg-circle", "fab fa-git", "fab fa-git-square", "fab fa-github", "fab fa-github-alt", "fab fa-github-square", "fab fa-gitkraken", "fab fa-gitlab", "fab fa-gitter", "fab fa-glide", "fab fa-glide-g", "fab fa-gofore", "fab fa-goodreads", "fab fa-goodreads-g", "fab fa-google", "fab fa-google-drive", "fab fa-google-play", "fab fa-google-plus", "fab fa-google-plus-g", "fab fa-google-plus-square", "fab fa-google-wallet", "fab fa-gratipay", "fab fa-grav", "fab fa-gripfire", "fab fa-grunt", "fab fa-gulp", "fab fa-hacker-news", "fab fa-hacker-news-square", "fab fa-hips", "fab fa-hire-a-helper", "fab fa-hooli", "fab fa-hotjar", "fab fa-houzz", "fab fa-html5", "fab fa-hubspot", "fab fa-imdb", "fab fa-instagram", "fab fa-internet-explorer", "fab fa-ioxhost", "fab fa-itunes", "fab fa-itunes-note", "fab fa-jenkins", "fab fa-joget", "fab fa-joomla", "fab fa-js", "fab fa-js-square", "fab fa-jsfiddle", "fab fa-keycdn", "fab fa-kickstarter", "fab fa-kickstarter-k", "fab fa-korvue", "fab fa-laravel", "fab fa-lastfm", "fab fa-lastfm-square", "fab fa-leanpub", "fab fa-less", "fab fa-line", "fab fa-linkedin", "fab fa-linkedin-in", "fab fa-linode", "fab fa-linux", "fab fa-lyft", "fab fa-magento", "fab fa-maxcdn", "fab fa-medapps", "fab fa-medium", "fab fa-medium-m", "fab fa-medrt", "fab fa-meetup", "fab fa-microsoft", "fab fa-mix", "fab fa-mixcloud", "fab fa-mizuni", "fab fa-modx", "fab fa-monero", "fab fa-napster", "fab fa-nintendo-switch", "fab fa-node", "fab fa-node-js", "fab fa-npm", "fab fa-ns8", "fab fa-nutritionix", "fab fa-odnoklassniki", "fab fa-odnoklassniki-square", "fab fa-opencart", "fab fa-openid", "fab fa-opera", "fab fa-optin-monster", "fab fa-osi", "fab fa-page4", "fab fa-pagelines", "fab fa-palfed", "fab fa-patreon", "fab fa-paypal", "fab fa-periscope", "fab fa-phabricator", "fab fa-phoenix-framework", "fab fa-php", "fab fa-pied-piper", "fab fa-pied-piper-alt", "fab fa-pied-piper-pp", "fab fa-pinterest", "fab fa-pinterest-p", "fab fa-pinterest-square", "fab fa-playstation", "fab fa-product-hunt", "fab fa-pushed", "fab fa-python", "fab fa-qq", "fab fa-quinscape", "fab fa-quora", "fab fa-ravelry", "fab fa-react", "fab fa-readme", "fab fa-rebel", "fab fa-red-river", "fab fa-reddit", "fab fa-reddit-alien", "fab fa-reddit-square", "fab fa-rendact", "fab fa-renren", "fab fa-replyd", "fab fa-resolving", "fab fa-rocketchat", "fab fa-rockrms", "fab fa-safari", "fab fa-sass", "fab fa-schlix", "fab fa-scribd", "fab fa-searchengin", "fab fa-sellcast", "fab fa-sellsy", "fab fa-servicestack", "fab fa-shirtsinbulk", "fab fa-simplybuilt", "fab fa-sistrix", "fab fa-skyatlas", "fab fa-skype", "fab fa-slack", "fab fa-slack-hash", "fab fa-slideshare", "fab fa-snapchat", "fab fa-snapchat-ghost", "fab fa-snapchat-square", "fab fa-soundcloud", "fab fa-speakap", "fab fa-spotify", "fab fa-stack-exchange", "fab fa-stack-overflow", "fab fa-staylinked", "fab fa-steam", "fab fa-steam-square", "fab fa-steam-symbol", "fab fa-sticker-mule", "fab fa-strava", "fab fa-stripe", "fab fa-stripe-s", "fab fa-studiovinari", "fab fa-stumbleupon", "fab fa-stumbleupon-circle", "fab fa-superpowers", "fab fa-supple", "fab fa-telegram", "fab fa-telegram-plane", "fab fa-tencent-weibo", "fab fa-themeisle", "fab fa-trello", "fab fa-tripadvisor", "fab fa-tumblr", "fab fa-tumblr-square", "fab fa-twitch", "fab fa-twitter", "fab fa-twitter-square", "fab fa-typo3", "fab fa-uber", "fab fa-uikit", "fab fa-uniregistry", "fab fa-untappd", "fab fa-usb", "fab fa-ussunnah", "fab fa-vaadin", "fab fa-viacoin", "fab fa-viadeo", "fab fa-viadeo-square", "fab fa-viber", "fab fa-vimeo", "fab fa-vimeo-square", "fab fa-vimeo-v", "fab fa-vine", "fab fa-vk", "fab fa-vnv", "fab fa-vuejs", "fab fa-weibo", "fab fa-weixin", "fab fa-whatsapp", "fab fa-whatsapp-square", "fab fa-whmcs", "fab fa-wikipedia-w", "fab fa-windows", "fab fa-wordpress", "fab fa-wordpress-simple", "fab fa-wpbeginner", "fab fa-wpexplorer", "fab fa-wpforms", "fab fa-xbox", "fab fa-xing", "fab fa-xing-square", "fab fa-y-combinator", "fab fa-yahoo", "fab fa-yandex", "fab fa-yandex-international", "fab fa-yelp", "fab fa-yoast", "fab fa-youtube", "fab fa-youtube-square"];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (fontawesomeClasses);

/***/ }),

/***/ "./src/components/icon-picker/iconfont-classes.js":
/*!********************************************************!*\
  !*** ./src/components/icon-picker/iconfont-classes.js ***!
  \********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
const iconfontClasses = ['icofont-angry-monster', 'icofont-bathtub ', 'icofont-bird-wings ', 'icofont-bow ', 'icofont-castle ', 'icofont-circuit ', 'icofont-crown-king ', 'icofont-crown-queen ', 'icofont-dart ', 'icofont-disability-race ', 'icofont-diving-goggle ', 'icofont-eye-open ', 'icofont-flora-flower ', 'icofont-flora ', 'icofont-gift-box ', 'icofont-halloween-pumpkin ', 'icofont-hand-power ', 'icofont-hand-thunder ', 'icofont-king-monster ', 'icofont-love ', 'icofont-magician-hat ', 'icofont-native-american ', 'icofont-owl-look ', 'icofont-phoenix ', 'icofont-robot-face ', 'icofont-sand-clock ', 'icofont-shield-alt ', 'icofont-ship-wheel ', 'icofont-skull-danger ', 'icofont-skull-face ', 'icofont-snowmobile ', 'icofont-space-shuttle ', 'icofont-star-shape ', 'icofont-swirl ', 'icofont-tattoo-wing ', 'icofont-throne ', 'icofont-tree-alt ', 'icofont-triangle ', 'icofont-unity-hand ', 'icofont-weed ', 'icofont-woman-bird ', 'icofont-bat ', 'icofont-bear-face ', 'icofont-bear-tracks ', 'icofont-bear ', 'icofont-bird-alt ', 'icofont-bird-flying ', 'icofont-bird ', 'icofont-birds ', 'icofont-bone ', 'icofont-bull ', 'icofont-butterfly-alt ', 'icofont-butterfly ', 'icofont-camel-alt ', 'icofont-camel-head ', 'icofont-camel ', 'icofont-cat-alt-1 ', 'icofont-cat-alt-2 ', 'icofont-cat-alt-3 ', 'icofont-cat-dog ', 'icofont-cat-face ', 'icofont-cat ', 'icofont-cow-head ', 'icofont-cow ', 'icofont-crab ', 'icofont-crocodile ', 'icofont-deer-head ', 'icofont-dog-alt ', 'icofont-dog-barking ', 'icofont-dog ', 'icofont-dolphin ', 'icofont-duck-tracks ', 'icofont-eagle-head ', 'icofont-eaten-fish ', 'icofont-elephant-alt ', 'icofont-elephant-head-alt ', 'icofont-elephant-head ', 'icofont-elephant ', 'icofont-elk ', 'icofont-fish-1 ', 'icofont-fish-2 ', 'icofont-fish-3 ', 'icofont-fish-4 ', 'icofont-fish-5 ', 'icofont-fish ', 'icofont-fox-alt ', 'icofont-fox ', 'icofont-frog-tracks ', 'icofont-frog ', 'icofont-froggy ', 'icofont-giraffe-head-1 ', 'icofont-giraffe-head-2 ', 'icofont-giraffe-head ', 'icofont-giraffe ', 'icofont-goat-head ', 'icofont-gorilla ', 'icofont-hen-tracks ', 'icofont-horse-head-1 ', 'icofont-horse-head-2 ', 'icofont-horse-head ', 'icofont-horse-tracks ', 'icofont-jellyfish ', 'icofont-kangaroo ', 'icofont-lemur ', 'icofont-lion-head-1 ', 'icofont-lion-head-2 ', 'icofont-lion-head ', 'icofont-lion ', 'icofont-monkey-2 ', 'icofont-monkey-3 ', 'icofont-monkey-face ', 'icofont-monkey ', 'icofont-octopus-alt ', 'icofont-octopus ', 'icofont-owl ', 'icofont-panda-face ', 'icofont-panda ', 'icofont-panther ', 'icofont-parrot-lip ', 'icofont-parrot ', 'icofont-paw ', 'icofont-pelican ', 'icofont-penguin ', 'icofont-pig-face ', 'icofont-pig ', 'icofont-pigeon-1 ', 'icofont-pigeon-2 ', 'icofont-pigeon ', 'icofont-rabbit ', 'icofont-rat ', 'icofont-rhino-head ', 'icofont-rhino ', 'icofont-rooster ', 'icofont-seahorse ', 'icofont-seal ', 'icofont-shrimp-alt ', 'icofont-shrimp ', 'icofont-snail-1 ', 'icofont-snail-2 ', 'icofont-snail-3 ', 'icofont-snail ', 'icofont-snake ', 'icofont-squid ', 'icofont-squirrel ', 'icofont-tiger-face ', 'icofont-tiger ', 'icofont-turtle ', 'icofont-whale ', 'icofont-woodpecker ', 'icofont-zebra ', 'icofont-brand-acer ', 'icofont-brand-adidas ', 'icofont-brand-adobe ', 'icofont-brand-air-new-zealand ', 'icofont-brand-airbnb ', 'icofont-brand-aircell ', 'icofont-brand-airtel ', 'icofont-brand-alcatel ', 'icofont-brand-alibaba ', 'icofont-brand-aliexpress ', 'icofont-brand-alipay ', 'icofont-brand-amazon ', 'icofont-brand-amd ', 'icofont-brand-american-airlines ', 'icofont-brand-android-robot ', 'icofont-brand-android ', 'icofont-brand-aol ', 'icofont-brand-apple ', 'icofont-brand-appstore ', 'icofont-brand-asus ', 'icofont-brand-ati ', 'icofont-brand-att ', 'icofont-brand-audi ', 'icofont-brand-axiata ', 'icofont-brand-bada ', 'icofont-brand-bbc ', 'icofont-brand-bing ', 'icofont-brand-blackberry ', 'icofont-brand-bmw ', 'icofont-brand-box ', 'icofont-brand-burger-king ', 'icofont-brand-business-insider ', 'icofont-brand-buzzfeed ', 'icofont-brand-cannon ', 'icofont-brand-casio ', 'icofont-brand-china-mobile ', 'icofont-brand-china-telecom ', 'icofont-brand-china-unicom ', 'icofont-brand-cisco ', 'icofont-brand-citibank ', 'icofont-brand-cnet ', 'icofont-brand-cnn ', 'icofont-brand-cocal-cola ', 'icofont-brand-compaq ', 'icofont-brand-debian ', 'icofont-brand-delicious ', 'icofont-brand-dell ', 'icofont-brand-designbump ', 'icofont-brand-designfloat ', 'icofont-brand-disney ', 'icofont-brand-dodge ', 'icofont-brand-dove ', 'icofont-brand-drupal ', 'icofont-brand-ebay ', 'icofont-brand-eleven ', 'icofont-brand-emirates ', 'icofont-brand-espn ', 'icofont-brand-etihad-airways ', 'icofont-brand-etisalat ', 'icofont-brand-etsy ', 'icofont-brand-fastrack ', 'icofont-brand-fedex ', 'icofont-brand-ferrari ', 'icofont-brand-fitbit ', 'icofont-brand-flikr ', 'icofont-brand-forbes ', 'icofont-brand-foursquare ', 'icofont-brand-foxconn ', 'icofont-brand-fujitsu ', 'icofont-brand-general-electric ', 'icofont-brand-gillette ', 'icofont-brand-gizmodo ', 'icofont-brand-gnome ', 'icofont-brand-google ', 'icofont-brand-gopro ', 'icofont-brand-gucci ', 'icofont-brand-hallmark ', 'icofont-brand-hi5 ', 'icofont-brand-honda ', 'icofont-brand-hp ', 'icofont-brand-hsbc ', 'icofont-brand-htc ', 'icofont-brand-huawei ', 'icofont-brand-hulu ', 'icofont-brand-hyundai ', 'icofont-brand-ibm ', 'icofont-brand-icofont ', 'icofont-brand-icq ', 'icofont-brand-ikea ', 'icofont-brand-imdb ', 'icofont-brand-indiegogo ', 'icofont-brand-intel ', 'icofont-brand-ipair ', 'icofont-brand-jaguar ', 'icofont-brand-java ', 'icofont-brand-joomla ', 'icofont-brand-kickstarter ', 'icofont-brand-kik ', 'icofont-brand-lastfm ', 'icofont-brand-lego ', 'icofont-brand-lenovo ', 'icofont-brand-levis ', 'icofont-brand-lexus ', 'icofont-brand-lg ', 'icofont-brand-life-hacker ', 'icofont-brand-linux-mint ', 'icofont-brand-linux ', 'icofont-brand-lionix ', 'icofont-brand-loreal ', 'icofont-brand-louis-vuitton ', 'icofont-brand-mac-os ', 'icofont-brand-marvel-app ', 'icofont-brand-mashable ', 'icofont-brand-mazda ', 'icofont-brand-mcdonals ', 'icofont-brand-mercedes ', 'icofont-brand-micromax ', 'icofont-brand-microsoft ', 'icofont-brand-mobileme ', 'icofont-brand-mobily ', 'icofont-brand-motorola ', 'icofont-brand-msi ', 'icofont-brand-mts ', 'icofont-brand-myspace ', 'icofont-brand-mytv ', 'icofont-brand-nasa ', 'icofont-brand-natgeo ', 'icofont-brand-nbc ', 'icofont-brand-nescafe ', 'icofont-brand-nestle ', 'icofont-brand-netflix ', 'icofont-brand-nexus ', 'icofont-brand-nike ', 'icofont-brand-nokia ', 'icofont-brand-nvidia ', 'icofont-brand-omega ', 'icofont-brand-opensuse ', 'icofont-brand-oracle ', 'icofont-brand-panasonic ', 'icofont-brand-paypal ', 'icofont-brand-pepsi ', 'icofont-brand-philips ', 'icofont-brand-pizza-hut ', 'icofont-brand-playstation ', 'icofont-brand-puma ', 'icofont-brand-qatar-air ', 'icofont-brand-qvc ', 'icofont-brand-readernaut ', 'icofont-brand-redbull ', 'icofont-brand-reebok ', 'icofont-brand-reuters ', 'icofont-brand-samsung ', 'icofont-brand-sap ', 'icofont-brand-saudia-airlines ', 'icofont-brand-scribd ', 'icofont-brand-shell ', 'icofont-brand-siemens ', 'icofont-brand-sk-telecom ', 'icofont-brand-slideshare ', 'icofont-brand-smashing-magazine ', 'icofont-brand-snapchat ', 'icofont-brand-sony-ericsson ', 'icofont-brand-sony ', 'icofont-brand-soundcloud ', 'icofont-brand-sprint ', 'icofont-brand-squidoo ', 'icofont-brand-starbucks ', 'icofont-brand-stc ', 'icofont-brand-steam ', 'icofont-brand-suzuki ', 'icofont-brand-symbian ', 'icofont-brand-t-mobile ', 'icofont-brand-tango ', 'icofont-brand-target ', 'icofont-brand-tata-indicom ', 'icofont-brand-techcrunch ', 'icofont-brand-telenor ', 'icofont-brand-teliasonera ', 'icofont-brand-tesla ', 'icofont-brand-the-verge ', 'icofont-brand-thenextweb ', 'icofont-brand-toshiba ', 'icofont-brand-toyota ', 'icofont-brand-tribenet ', 'icofont-brand-ubuntu ', 'icofont-brand-unilever ', 'icofont-brand-vaio ', 'icofont-brand-verizon ', 'icofont-brand-viber ', 'icofont-brand-vodafone ', 'icofont-brand-volkswagen ', 'icofont-brand-walmart ', 'icofont-brand-warnerbros ', 'icofont-brand-whatsapp ', 'icofont-brand-wikipedia ', 'icofont-brand-windows ', 'icofont-brand-wire ', 'icofont-brand-wordpress ', 'icofont-brand-xiaomi ', 'icofont-brand-yahoobuzz ', 'icofont-brand-yamaha ', 'icofont-brand-youtube ', 'icofont-brand-zain ', 'icofont-bank-alt ', 'icofont-bank ', 'icofont-barcode ', 'icofont-bill-alt ', 'icofont-billboard ', 'icofont-briefcase-1 ', 'icofont-briefcase-2 ', 'icofont-businessman ', 'icofont-businesswoman ', 'icofont-chair ', 'icofont-coins ', 'icofont-company ', 'icofont-contact-add ', 'icofont-files-stack ', 'icofont-handshake-deal ', 'icofont-id-card ', 'icofont-meeting-add ', 'icofont-money-bag ', 'icofont-pie-chart ', 'icofont-presentation-alt ', 'icofont-presentation ', 'icofont-stamp ', 'icofont-stock-mobile ', 'icofont-chart-arrows-axis ', 'icofont-chart-bar-graph ', 'icofont-chart-flow-1 ', 'icofont-chart-flow-2 ', 'icofont-chart-flow ', 'icofont-chart-growth ', 'icofont-chart-histogram-alt ', 'icofont-chart-histogram ', 'icofont-chart-line-alt ', 'icofont-chart-line ', 'icofont-chart-pie-alt ', 'icofont-chart-pie ', 'icofont-chart-radar-graph ', 'icofont-architecture-alt ', 'icofont-architecture ', 'icofont-barricade ', 'icofont-bolt ', 'icofont-bricks ', 'icofont-building-alt ', 'icofont-bull-dozer ', 'icofont-calculations ', 'icofont-cement-mix ', 'icofont-cement-mixer ', 'icofont-concrete-mixer ', 'icofont-danger-zone ', 'icofont-drill ', 'icofont-eco-energy ', 'icofont-eco-environmen ', 'icofont-energy-air ', 'icofont-energy-oil ', 'icofont-energy-savings ', 'icofont-energy-solar ', 'icofont-energy-water ', 'icofont-engineer ', 'icofont-fire-extinguisher-alt ', 'icofont-fire-extinguisher ', 'icofont-fix-tools ', 'icofont-fork-lift ', 'icofont-glue-oil ', 'icofont-hammer-alt ', 'icofont-hammer ', 'icofont-help-robot ', 'icofont-industries-1 ', 'icofont-industries-2 ', 'icofont-industries-3 ', 'icofont-industries-4 ', 'icofont-industries-5 ', 'icofont-industries ', 'icofont-labour ', 'icofont-mining ', 'icofont-paint-brush ', 'icofont-pollution ', 'icofont-power-zone ', 'icofont-radio-active ', 'icofont-recycle-alt ', 'icofont-recycling-man ', 'icofont-safety-hat-light ', 'icofont-safety-hat ', 'icofont-saw ', 'icofont-screw-driver ', 'icofont-tools-1 ', 'icofont-tools-bag ', 'icofont-tow-truck ', 'icofont-trolley ', 'icofont-trowel ', 'icofont-under-construction-alt ', 'icofont-under-construction ', 'icofont-vehicle-cement ', 'icofont-vehicle-crane ', 'icofont-vehicle-delivery-van ', 'icofont-vehicle-dozer ', 'icofont-vehicle-excavator ', 'icofont-vehicle-trucktor ', 'icofont-vehicle-wrecking ', 'icofont-worker ', 'icofont-workers-group ', 'icofont-wrench ', 'icofont-afghani-false ', 'icofont-afghani-minus ', 'icofont-afghani-plus ', 'icofont-afghani-true ', 'icofont-afghani ', 'icofont-baht-false ', 'icofont-baht-minus ', 'icofont-baht-plus ', 'icofont-baht-true ', 'icofont-baht ', 'icofont-bitcoin-false ', 'icofont-bitcoin-minus ', 'icofont-bitcoin-plus ', 'icofont-bitcoin-true ', 'icofont-bitcoin ', 'icofont-dollar-flase ', 'icofont-dollar-minus ', 'icofont-dollar-plus ', 'icofont-dollar-true ', 'icofont-dollar ', 'icofont-dong-false ', 'icofont-dong-minus ', 'icofont-dong-plus ', 'icofont-dong-true ', 'icofont-dong ', 'icofont-euro-false ', 'icofont-euro-minus ', 'icofont-euro-plus ', 'icofont-euro-true ', 'icofont-euro ', 'icofont-frank-false ', 'icofont-frank-minus ', 'icofont-frank-plus ', 'icofont-frank-true ', 'icofont-frank ', 'icofont-hryvnia-false ', 'icofont-hryvnia-minus ', 'icofont-hryvnia-plus ', 'icofont-hryvnia-true ', 'icofont-hryvnia ', 'icofont-lira-false ', 'icofont-lira-minus ', 'icofont-lira-plus ', 'icofont-lira-true ', 'icofont-lira ', 'icofont-peseta-false ', 'icofont-peseta-minus ', 'icofont-peseta-plus ', 'icofont-peseta-true ', 'icofont-peseta ', 'icofont-peso-false ', 'icofont-peso-minus ', 'icofont-peso-plus ', 'icofont-peso-true ', 'icofont-peso ', 'icofont-pound-false ', 'icofont-pound-minus ', 'icofont-pound-plus ', 'icofont-pound-true ', 'icofont-pound ', 'icofont-renminbi-false ', 'icofont-renminbi-minus ', 'icofont-renminbi-plus ', 'icofont-renminbi-true ', 'icofont-renminbi ', 'icofont-riyal-false ', 'icofont-riyal-minus ', 'icofont-riyal-plus ', 'icofont-riyal-true ', 'icofont-riyal ', 'icofont-rouble-false ', 'icofont-rouble-minus ', 'icofont-rouble-plus ', 'icofont-rouble-true ', 'icofont-rouble ', 'icofont-rupee-false ', 'icofont-rupee-minus ', 'icofont-rupee-plus ', 'icofont-rupee-true ', 'icofont-rupee ', 'icofont-taka-false ', 'icofont-taka-minus ', 'icofont-taka-plus ', 'icofont-taka-true ', 'icofont-taka ', 'icofont-turkish-lira-false ', 'icofont-turkish-lira-minus ', 'icofont-turkish-lira-plus ', 'icofont-turkish-lira-true ', 'icofont-turkish-lira ', 'icofont-won-false ', 'icofont-won-minus ', 'icofont-won-plus ', 'icofont-won-true ', 'icofont-won ', 'icofont-yen-false ', 'icofont-yen-minus ', 'icofont-yen-plus ', 'icofont-yen-true ', 'icofont-yen ', 'icofont-android-nexus ', 'icofont-android-tablet ', 'icofont-apple-watch ', 'icofont-drawing-tablet ', 'icofont-earphone ', 'icofont-flash-drive ', 'icofont-game-console ', 'icofont-game-controller ', 'icofont-game-pad ', 'icofont-game ', 'icofont-headphone-alt-1 ', 'icofont-headphone-alt-2 ', 'icofont-headphone-alt-3 ', 'icofont-headphone-alt ', 'icofont-headphone ', 'icofont-htc-one ', 'icofont-imac ', 'icofont-ipad ', 'icofont-iphone ', 'icofont-ipod-nano ', 'icofont-ipod-touch ', 'icofont-keyboard-alt ', 'icofont-keyboard-wireless ', 'icofont-keyboard ', 'icofont-laptop-alt ', 'icofont-laptop ', 'icofont-macbook ', 'icofont-magic-mouse ', 'icofont-micro-chip ', 'icofont-microphone-alt ', 'icofont-microphone ', 'icofont-monitor ', 'icofont-mouse ', 'icofont-mp3-player ', 'icofont-nintendo ', 'icofont-playstation-alt ', 'icofont-psvita ', 'icofont-radio-mic ', 'icofont-radio ', 'icofont-refrigerator ', 'icofont-samsung-galaxy ', 'icofont-surface-tablet ', 'icofont-ui-head-phone ', 'icofont-ui-keyboard ', 'icofont-washing-machine ', 'icofont-wifi-router ', 'icofont-wii-u ', 'icofont-windows-lumia ', 'icofont-wireless-mouse ', 'icofont-xbox-360 ', 'icofont-arrow-down ', 'icofont-arrow-left ', 'icofont-arrow-right ', 'icofont-arrow-up ', 'icofont-block-down ', 'icofont-block-left ', 'icofont-block-right ', 'icofont-block-up ', 'icofont-bubble-down ', 'icofont-bubble-left ', 'icofont-bubble-right ', 'icofont-bubble-up ', 'icofont-caret-down ', 'icofont-caret-left ', 'icofont-caret-right ', 'icofont-caret-up ', 'icofont-circled-down ', 'icofont-circled-left ', 'icofont-circled-right ', 'icofont-circled-up ', 'icofont-collapse ', 'icofont-cursor-drag ', 'icofont-curved-double-left ', 'icofont-curved-double-right ', 'icofont-curved-down ', 'icofont-curved-left ', 'icofont-curved-right ', 'icofont-curved-up ', 'icofont-dotted-down ', 'icofont-dotted-left ', 'icofont-dotted-right ', 'icofont-dotted-up ', 'icofont-double-left ', 'icofont-double-right ', 'icofont-expand-alt ', 'icofont-hand-down ', 'icofont-hand-drag ', 'icofont-hand-drag1 ', 'icofont-hand-drag2 ', 'icofont-hand-drawn-alt-down ', 'icofont-hand-drawn-alt-left ', 'icofont-hand-drawn-alt-right ', 'icofont-hand-drawn-alt-up ', 'icofont-hand-drawn-down ', 'icofont-hand-drawn-left ', 'icofont-hand-drawn-right ', 'icofont-hand-drawn-up ', 'icofont-hand-grippers ', 'icofont-hand-left ', 'icofont-hand-right ', 'icofont-hand-up ', 'icofont-line-block-down ', 'icofont-line-block-left ', 'icofont-line-block-right ', 'icofont-line-block-up ', 'icofont-long-arrow-down ', 'icofont-long-arrow-left ', 'icofont-long-arrow-right ', 'icofont-long-arrow-up ', 'icofont-rounded-collapse ', 'icofont-rounded-double-left ', 'icofont-rounded-double-right ', 'icofont-rounded-down ', 'icofont-rounded-expand ', 'icofont-rounded-left-down ', 'icofont-rounded-left-up ', 'icofont-rounded-left ', 'icofont-rounded-right-down ', 'icofont-rounded-right-up ', 'icofont-rounded-right ', 'icofont-rounded-up ', 'icofont-scroll-bubble-down ', 'icofont-scroll-bubble-left ', 'icofont-scroll-bubble-right ', 'icofont-scroll-bubble-up ', 'icofont-scroll-double-down ', 'icofont-scroll-double-left ', 'icofont-scroll-double-right ', 'icofont-scroll-double-up ', 'icofont-scroll-down ', 'icofont-scroll-left ', 'icofont-scroll-long-down ', 'icofont-scroll-long-left ', 'icofont-scroll-long-right ', 'icofont-scroll-long-up ', 'icofont-scroll-right ', 'icofont-scroll-up ', 'icofont-simple-down ', 'icofont-simple-left-down ', 'icofont-simple-left-up ', 'icofont-simple-left ', 'icofont-simple-right-down ', 'icofont-simple-right-up ', 'icofont-simple-right ', 'icofont-simple-up ', 'icofont-square-down ', 'icofont-square-left ', 'icofont-square-right ', 'icofont-square-up ', 'icofont-stylish-down ', 'icofont-stylish-left ', 'icofont-stylish-right ', 'icofont-stylish-up ', 'icofont-swoosh-down ', 'icofont-swoosh-left ', 'icofont-swoosh-right ', 'icofont-swoosh-up ', 'icofont-thin-double-left ', 'icofont-thin-double-right ', 'icofont-thin-down ', 'icofont-thin-left ', 'icofont-thin-right ', 'icofont-thin-up ', 'icofont-abc ', 'icofont-atom ', 'icofont-award ', 'icofont-bell-alt ', 'icofont-black-board ', 'icofont-book-alt ', 'icofont-book ', 'icofont-brainstorming ', 'icofont-certificate-alt-1 ', 'icofont-certificate-alt-2 ', 'icofont-certificate ', 'icofont-education ', 'icofont-electron ', 'icofont-fountain-pen ', 'icofont-globe-alt ', 'icofont-graduate-alt ', 'icofont-graduate ', 'icofont-group-students ', 'icofont-hat-alt ', 'icofont-hat ', 'icofont-instrument ', 'icofont-lamp-light ', 'icofont-medal ', 'icofont-microscope-alt ', 'icofont-microscope ', 'icofont-paper ', 'icofont-pen-alt-4 ', 'icofont-pen-nib ', 'icofont-pencil-alt-5 ', 'icofont-quill-pen ', 'icofont-read-book-alt ', 'icofont-read-book ', 'icofont-school-bag ', 'icofont-school-bus ', 'icofont-student-alt ', 'icofont-student ', 'icofont-teacher ', 'icofont-test-bulb ', 'icofont-test-tube-alt ', 'icofont-university ', 'icofont-angry ', 'icofont-astonished ', 'icofont-confounded ', 'icofont-confused ', 'icofont-crying ', 'icofont-dizzy ', 'icofont-expressionless ', 'icofont-heart-eyes ', 'icofont-laughing ', 'icofont-nerd-smile ', 'icofont-open-mouth ', 'icofont-rage ', 'icofont-rolling-eyes ', 'icofont-sad ', 'icofont-simple-smile ', 'icofont-slightly-smile ', 'icofont-smirk ', 'icofont-stuck-out-tongue ', 'icofont-wink-smile ', 'icofont-worried ', 'icofont-file-alt ', 'icofont-file-audio ', 'icofont-file-avi-mp4 ', 'icofont-file-bmp ', 'icofont-file-code ', 'icofont-file-css ', 'icofont-file-document ', 'icofont-file-eps ', 'icofont-file-excel ', 'icofont-file-exe ', 'icofont-file-file ', 'icofont-file-flv ', 'icofont-file-gif ', 'icofont-file-html5 ', 'icofont-file-image ', 'icofont-file-iso ', 'icofont-file-java ', 'icofont-file-javascript ', 'icofont-file-jpg ', 'icofont-file-midi ', 'icofont-file-mov ', 'icofont-file-mp3 ', 'icofont-file-pdf ', 'icofont-file-php ', 'icofont-file-png ', 'icofont-file-powerpoint ', 'icofont-file-presentation ', 'icofont-file-psb ', 'icofont-file-psd ', 'icofont-file-python ', 'icofont-file-ruby ', 'icofont-file-spreadsheet ', 'icofont-file-sql ', 'icofont-file-svg ', 'icofont-file-text ', 'icofont-file-tiff ', 'icofont-file-video ', 'icofont-file-wave ', 'icofont-file-wmv ', 'icofont-file-word ', 'icofont-file-zip ', 'icofont-cycling-alt ', 'icofont-cycling ', 'icofont-dumbbell ', 'icofont-dumbbells ', 'icofont-gym-alt-1 ', 'icofont-gym-alt-2 ', 'icofont-gym-alt-3 ', 'icofont-gym ', 'icofont-muscle-weight ', 'icofont-muscle ', 'icofont-apple ', 'icofont-arabian-coffee ', 'icofont-artichoke ', 'icofont-asparagus ', 'icofont-avocado ', 'icofont-baby-food ', 'icofont-banana ', 'icofont-bbq ', 'icofont-beans ', 'icofont-beer ', 'icofont-bell-pepper-capsicum ', 'icofont-birthday-cake ', 'icofont-bread ', 'icofont-broccoli ', 'icofont-burger ', 'icofont-cabbage ', 'icofont-carrot ', 'icofont-cauli-flower ', 'icofont-cheese ', 'icofont-chef ', 'icofont-cherry ', 'icofont-chicken-fry ', 'icofont-chicken ', 'icofont-cocktail ', 'icofont-coconut-water ', 'icofont-coconut ', 'icofont-coffee-alt ', 'icofont-coffee-cup ', 'icofont-coffee-mug ', 'icofont-coffee-pot ', 'icofont-cola ', 'icofont-corn ', 'icofont-croissant ', 'icofont-crop-plant ', 'icofont-cucumber ', 'icofont-culinary ', 'icofont-cup-cake ', 'icofont-dining-table ', 'icofont-donut ', 'icofont-egg-plant ', 'icofont-egg-poached ', 'icofont-farmer-alt ', 'icofont-farmer ', 'icofont-fast-food ', 'icofont-food-basket ', 'icofont-food-cart ', 'icofont-fork-and-knife ', 'icofont-french-fries ', 'icofont-fruits ', 'icofont-grapes ', 'icofont-honey ', 'icofont-hot-dog ', 'icofont-ice-cream-alt ', 'icofont-ice-cream ', 'icofont-juice ', 'icofont-ketchup ', 'icofont-kiwi ', 'icofont-layered-cake ', 'icofont-lemon-alt ', 'icofont-lemon ', 'icofont-lobster ', 'icofont-mango ', 'icofont-milk ', 'icofont-mushroom ', 'icofont-noodles ', 'icofont-onion ', 'icofont-orange ', 'icofont-pear ', 'icofont-peas ', 'icofont-pepper ', 'icofont-pie-alt ', 'icofont-pie ', 'icofont-pineapple ', 'icofont-pizza-slice ', 'icofont-pizza ', 'icofont-plant ', 'icofont-popcorn ', 'icofont-potato ', 'icofont-pumpkin ', 'icofont-raddish ', 'icofont-restaurant-menu ', 'icofont-restaurant ', 'icofont-salt-and-pepper ', 'icofont-sandwich ', 'icofont-sausage ', 'icofont-soft-drinks ', 'icofont-soup-bowl ', 'icofont-spoon-and-fork ', 'icofont-steak ', 'icofont-strawberry ', 'icofont-sub-sandwich ', 'icofont-sushi ', 'icofont-taco ', 'icofont-tea-pot ', 'icofont-tea ', 'icofont-tomato ', 'icofont-watermelon ', 'icofont-wheat ', 'icofont-baby-backpack ', 'icofont-baby-cloth ', 'icofont-baby-milk-bottle ', 'icofont-baby-trolley ', 'icofont-baby ', 'icofont-candy ', 'icofont-holding-hands ', 'icofont-infant-nipple ', 'icofont-kids-scooter ', 'icofont-safety-pin ', 'icofont-teddy-bear ', 'icofont-toy-ball ', 'icofont-toy-cat ', 'icofont-toy-duck ', 'icofont-toy-elephant ', 'icofont-toy-hand ', 'icofont-toy-horse ', 'icofont-toy-lattu ', 'icofont-toy-train ', 'icofont-burglar ', 'icofont-cannon-firing ', 'icofont-cc-camera ', 'icofont-cop-badge ', 'icofont-cop ', 'icofont-court-hammer ', 'icofont-court ', 'icofont-finger-print ', 'icofont-gavel ', 'icofont-handcuff-alt ', 'icofont-handcuff ', 'icofont-investigation ', 'icofont-investigator ', 'icofont-jail ', 'icofont-judge ', 'icofont-law-alt-1 ', 'icofont-law-alt-2 ', 'icofont-law-alt-3 ', 'icofont-law-book ', 'icofont-law-document ', 'icofont-law-order ', 'icofont-law-protect ', 'icofont-law-scales ', 'icofont-law ', 'icofont-lawyer-alt-1 ', 'icofont-lawyer-alt-2 ', 'icofont-lawyer ', 'icofont-legal ', 'icofont-pistol ', 'icofont-police-badge ', 'icofont-police-cap ', 'icofont-police-car-alt-1 ', 'icofont-police-car-alt-2 ', 'icofont-police-car ', 'icofont-police-hat ', 'icofont-police-van ', 'icofont-police ', 'icofont-thief-alt ', 'icofont-thief ', 'icofont-abacus-alt ', 'icofont-abacus ', 'icofont-angle-180 ', 'icofont-angle-45 ', 'icofont-angle-90 ', 'icofont-angle ', 'icofont-calculator-alt-1 ', 'icofont-calculator-alt-2 ', 'icofont-calculator ', 'icofont-circle-ruler-alt ', 'icofont-circle-ruler ', 'icofont-compass-alt-1 ', 'icofont-compass-alt-2 ', 'icofont-compass-alt-3 ', 'icofont-compass-alt-4 ', 'icofont-golden-ratio ', 'icofont-marker-alt-1 ', 'icofont-marker-alt-2 ', 'icofont-marker-alt-3 ', 'icofont-marker ', 'icofont-math ', 'icofont-mathematical-alt-1 ', 'icofont-mathematical-alt-2 ', 'icofont-mathematical ', 'icofont-pen-alt-1 ', 'icofont-pen-alt-2 ', 'icofont-pen-alt-3 ', 'icofont-pen-holder-alt-1 ', 'icofont-pen-holder ', 'icofont-pen ', 'icofont-pencil-alt-1 ', 'icofont-pencil-alt-2 ', 'icofont-pencil-alt-3 ', 'icofont-pencil-alt-4 ', 'icofont-pencil ', 'icofont-ruler-alt-1 ', 'icofont-ruler-alt-2 ', 'icofont-ruler-compass-alt ', 'icofont-ruler-compass ', 'icofont-ruler-pencil-alt-1 ', 'icofont-ruler-pencil-alt-2 ', 'icofont-ruler-pencil ', 'icofont-ruler ', 'icofont-rulers-alt ', 'icofont-rulers ', 'icofont-square-root ', 'icofont-ui-calculator ', 'icofont-aids ', 'icofont-ambulance-crescent ', 'icofont-ambulance-cross ', 'icofont-ambulance ', 'icofont-autism ', 'icofont-bandage ', 'icofont-blind ', 'icofont-blood-drop ', 'icofont-blood-test ', 'icofont-blood ', 'icofont-brain-alt ', 'icofont-brain ', 'icofont-capsule ', 'icofont-crutch ', 'icofont-disabled ', 'icofont-dna-alt-1 ', 'icofont-dna-alt-2 ', 'icofont-dna ', 'icofont-doctor-alt ', 'icofont-doctor ', 'icofont-drug-pack ', 'icofont-drug ', 'icofont-first-aid-alt ', 'icofont-first-aid ', 'icofont-heart-beat-alt ', 'icofont-heart-beat ', 'icofont-heartbeat ', 'icofont-herbal ', 'icofont-hospital ', 'icofont-icu ', 'icofont-injection-syringe ', 'icofont-laboratory ', 'icofont-medical-sign-alt ', 'icofont-medical-sign ', 'icofont-nurse-alt ', 'icofont-nurse ', 'icofont-nursing-home ', 'icofont-operation-theater ', 'icofont-paralysis-disability ', 'icofont-patient-bed ', 'icofont-patient-file ', 'icofont-pills ', 'icofont-prescription ', 'icofont-pulse ', 'icofont-stethoscope-alt ', 'icofont-stethoscope ', 'icofont-stretcher ', 'icofont-surgeon-alt ', 'icofont-surgeon ', 'icofont-tablets ', 'icofont-test-bottle ', 'icofont-test-tube ', 'icofont-thermometer-alt ', 'icofont-thermometer ', 'icofont-tooth ', 'icofont-xray ', 'icofont-ui-add ', 'icofont-ui-alarm ', 'icofont-ui-battery ', 'icofont-ui-block ', 'icofont-ui-bluetooth ', 'icofont-ui-brightness ', 'icofont-ui-browser ', 'icofont-ui-calendar ', 'icofont-ui-call ', 'icofont-ui-camera ', 'icofont-ui-cart ', 'icofont-ui-cell-phone ', 'icofont-ui-chat ', 'icofont-ui-check ', 'icofont-ui-clip-board ', 'icofont-ui-clip ', 'icofont-ui-clock ', 'icofont-ui-close ', 'icofont-ui-contact-list ', 'icofont-ui-copy ', 'icofont-ui-cut ', 'icofont-ui-delete ', 'icofont-ui-dial-phone ', 'icofont-ui-edit ', 'icofont-ui-email ', 'icofont-ui-file ', 'icofont-ui-fire-wall ', 'icofont-ui-flash-light ', 'icofont-ui-flight ', 'icofont-ui-folder ', 'icofont-ui-game ', 'icofont-ui-handicapped ', 'icofont-ui-home ', 'icofont-ui-image ', 'icofont-ui-laoding ', 'icofont-ui-lock ', 'icofont-ui-love-add ', 'icofont-ui-love-broken ', 'icofont-ui-love-remove ', 'icofont-ui-love ', 'icofont-ui-map ', 'icofont-ui-message ', 'icofont-ui-messaging ', 'icofont-ui-movie ', 'icofont-ui-music-player ', 'icofont-ui-music ', 'icofont-ui-mute ', 'icofont-ui-network ', 'icofont-ui-next ', 'icofont-ui-note ', 'icofont-ui-office ', 'icofont-ui-password ', 'icofont-ui-pause ', 'icofont-ui-play-stop ', 'icofont-ui-play ', 'icofont-ui-pointer ', 'icofont-ui-power ', 'icofont-ui-press ', 'icofont-ui-previous ', 'icofont-ui-rate-add ', 'icofont-ui-rate-blank ', 'icofont-ui-rate-remove ', 'icofont-ui-rating ', 'icofont-ui-record ', 'icofont-ui-remove ', 'icofont-ui-reply ', 'icofont-ui-rotation ', 'icofont-ui-rss ', 'icofont-ui-search ', 'icofont-ui-settings ', 'icofont-ui-social-link ', 'icofont-ui-tag ', 'icofont-ui-text-chat ', 'icofont-ui-text-loading ', 'icofont-ui-theme ', 'icofont-ui-timer ', 'icofont-ui-touch-phone ', 'icofont-ui-travel ', 'icofont-ui-unlock ', 'icofont-ui-user-group ', 'icofont-ui-user ', 'icofont-ui-v-card ', 'icofont-ui-video-chat ', 'icofont-ui-video-message ', 'icofont-ui-video-play ', 'icofont-ui-video ', 'icofont-ui-volume ', 'icofont-ui-weather ', 'icofont-ui-wifi ', 'icofont-ui-zoom-in ', 'icofont-ui-zoom-out ', 'icofont-cassette-player ', 'icofont-cassette ', 'icofont-forward ', 'icofont-guiter ', 'icofont-movie ', 'icofont-multimedia ', 'icofont-music-alt ', 'icofont-music-disk ', 'icofont-music-note ', 'icofont-music-notes ', 'icofont-music ', 'icofont-mute-volume ', 'icofont-pause ', 'icofont-play-alt-1 ', 'icofont-play-alt-2 ', 'icofont-play-alt-3 ', 'icofont-play-pause ', 'icofont-play ', 'icofont-record ', 'icofont-retro-music-disk ', 'icofont-rewind ', 'icofont-song-notes ', 'icofont-sound-wave-alt ', 'icofont-sound-wave ', 'icofont-stop ', 'icofont-video-alt ', 'icofont-video-cam ', 'icofont-video-clapper ', 'icofont-video ', 'icofont-volume-bar ', 'icofont-volume-down ', 'icofont-volume-mute ', 'icofont-volume-off ', 'icofont-volume-up ', 'icofont-youtube-play ', 'icofont-2checkout-alt ', 'icofont-2checkout ', 'icofont-amazon-alt ', 'icofont-amazon ', 'icofont-american-express-alt ', 'icofont-american-express ', 'icofont-apple-pay-alt ', 'icofont-apple-pay ', 'icofont-bank-transfer-alt ', 'icofont-bank-transfer ', 'icofont-braintree-alt ', 'icofont-braintree ', 'icofont-cash-on-delivery-alt ', 'icofont-cash-on-delivery ', 'icofont-diners-club-alt-1 ', 'icofont-diners-club-alt-2 ', 'icofont-diners-club-alt-3 ', 'icofont-diners-club ', 'icofont-discover-alt ', 'icofont-discover ', 'icofont-eway-alt ', 'icofont-eway ', 'icofont-google-wallet-alt-1 ', 'icofont-google-wallet-alt-2 ', 'icofont-google-wallet-alt-3 ', 'icofont-google-wallet ', 'icofont-jcb-alt ', 'icofont-jcb ', 'icofont-maestro-alt ', 'icofont-maestro ', 'icofont-mastercard-alt ', 'icofont-mastercard ', 'icofont-payoneer-alt ', 'icofont-payoneer ', 'icofont-paypal-alt ', 'icofont-paypal ', 'icofont-sage-alt ', 'icofont-sage ', 'icofont-skrill-alt ', 'icofont-skrill ', 'icofont-stripe-alt ', 'icofont-stripe ', 'icofont-visa-alt ', 'icofont-visa-electron ', 'icofont-visa ', 'icofont-western-union-alt ', 'icofont-western-union ', 'icofont-boy ', 'icofont-business-man-alt-1 ', 'icofont-business-man-alt-2 ', 'icofont-business-man-alt-3 ', 'icofont-business-man ', 'icofont-female ', 'icofont-funky-man ', 'icofont-girl-alt ', 'icofont-girl ', 'icofont-group ', 'icofont-hotel-boy-alt ', 'icofont-hotel-boy ', 'icofont-kid ', 'icofont-man-in-glasses ', 'icofont-people ', 'icofont-support ', 'icofont-user-alt-1 ', 'icofont-user-alt-2 ', 'icofont-user-alt-3 ', 'icofont-user-alt-4 ', 'icofont-user-alt-5 ', 'icofont-user-alt-6 ', 'icofont-user-alt-7 ', 'icofont-user-female ', 'icofont-user-male ', 'icofont-user-suited ', 'icofont-user ', 'icofont-users-alt-1 ', 'icofont-users-alt-2 ', 'icofont-users-alt-3 ', 'icofont-users-alt-4 ', 'icofont-users-alt-5 ', 'icofont-users-alt-6 ', 'icofont-users-social ', 'icofont-users ', 'icofont-waiter-alt ', 'icofont-waiter ', 'icofont-woman-in-glasses ', 'icofont-search-1 ', 'icofont-search-2 ', 'icofont-search-document ', 'icofont-search-folder ', 'icofont-search-job ', 'icofont-search-map ', 'icofont-search-property ', 'icofont-search-restaurant ', 'icofont-search-stock ', 'icofont-search-user ', 'icofont-search ', 'icofont-500px ', 'icofont-aim ', 'icofont-badoo ', 'icofont-baidu-tieba ', 'icofont-bbm-messenger ', 'icofont-bebo ', 'icofont-behance ', 'icofont-blogger ', 'icofont-bootstrap ', 'icofont-brightkite ', 'icofont-cloudapp ', 'icofont-concrete5 ', 'icofont-delicious ', 'icofont-designbump ', 'icofont-designfloat ', 'icofont-deviantart ', 'icofont-digg ', 'icofont-dotcms ', 'icofont-dribbble ', 'icofont-dribble ', 'icofont-dropbox ', 'icofont-ebuddy ', 'icofont-ello ', 'icofont-ember ', 'icofont-envato ', 'icofont-evernote ', 'icofont-facebook-messenger ', 'icofont-facebook ', 'icofont-feedburner ', 'icofont-flikr ', 'icofont-folkd ', 'icofont-foursquare ', 'icofont-friendfeed ', 'icofont-ghost ', 'icofont-github ', 'icofont-gnome ', 'icofont-google-buzz ', 'icofont-google-hangouts ', 'icofont-google-map ', 'icofont-google-plus ', 'icofont-google-talk ', 'icofont-hype-machine ', 'icofont-instagram ', 'icofont-kakaotalk ', 'icofont-kickstarter ', 'icofont-kik ', 'icofont-kiwibox ', 'icofont-line-messenger ', 'icofont-line ', 'icofont-linkedin ', 'icofont-linux-mint ', 'icofont-live-messenger ', 'icofont-livejournal ', 'icofont-magento ', 'icofont-meetme ', 'icofont-meetup ', 'icofont-mixx ', 'icofont-newsvine ', 'icofont-nimbuss ', 'icofont-odnoklassniki ', 'icofont-opencart ', 'icofont-oscommerce ', 'icofont-pandora ', 'icofont-photobucket ', 'icofont-picasa ', 'icofont-pinterest ', 'icofont-prestashop ', 'icofont-qik ', 'icofont-qq ', 'icofont-readernaut ', 'icofont-reddit ', 'icofont-renren ', 'icofont-rss ', 'icofont-shopify ', 'icofont-silverstripe ', 'icofont-skype ', 'icofont-slack ', 'icofont-slashdot ', 'icofont-slidshare ', 'icofont-smugmug ', 'icofont-snapchat ', 'icofont-soundcloud ', 'icofont-spotify ', 'icofont-stack-exchange ', 'icofont-stack-overflow ', 'icofont-steam ', 'icofont-stumbleupon ', 'icofont-tagged ', 'icofont-technorati ', 'icofont-telegram ', 'icofont-tinder ', 'icofont-trello ', 'icofont-tumblr ', 'icofont-twitch ', 'icofont-twitter ', 'icofont-typo3 ', 'icofont-ubercart ', 'icofont-viber ', 'icofont-viddler ', 'icofont-vimeo ', 'icofont-vine ', 'icofont-virb ', 'icofont-virtuemart ', 'icofont-vk ', 'icofont-wechat ', 'icofont-weibo ', 'icofont-whatsapp ', 'icofont-xing ', 'icofont-yahoo ', 'icofont-yelp ', 'icofont-youku ', 'icofont-youtube ', 'icofont-zencart ', 'icofont-badminton-birdie ', 'icofont-baseball ', 'icofont-baseballer ', 'icofont-basketball-hoop ', 'icofont-basketball ', 'icofont-billiard-ball ', 'icofont-boot-alt-1 ', 'icofont-boot-alt-2 ', 'icofont-boot ', 'icofont-bowling-alt ', 'icofont-bowling ', 'icofont-canoe ', 'icofont-cheer-leader ', 'icofont-climbing ', 'icofont-corner ', 'icofont-field-alt ', 'icofont-field ', 'icofont-football-alt ', 'icofont-football-american ', 'icofont-football ', 'icofont-foul ', 'icofont-goal-keeper ', 'icofont-goal ', 'icofont-golf-alt ', 'icofont-golf-bag ', 'icofont-golf-cart ', 'icofont-golf-field ', 'icofont-golf ', 'icofont-golfer ', 'icofont-helmet ', 'icofont-hockey-alt ', 'icofont-hockey ', 'icofont-ice-skate ', 'icofont-jersey-alt ', 'icofont-jersey ', 'icofont-jumping ', 'icofont-kick ', 'icofont-leg ', 'icofont-match-review ', 'icofont-medal-sport ', 'icofont-offside ', 'icofont-olympic-logo ', 'icofont-olympic ', 'icofont-padding ', 'icofont-penalty-card ', 'icofont-racer ', 'icofont-racing-car ', 'icofont-racing-flag-alt ', 'icofont-racing-flag ', 'icofont-racings-wheel ', 'icofont-referee ', 'icofont-refree-jersey ', 'icofont-result-sport ', 'icofont-rugby-ball ', 'icofont-rugby-player ', 'icofont-rugby ', 'icofont-runner-alt-1 ', 'icofont-runner-alt-2 ', 'icofont-runner ', 'icofont-score-board ', 'icofont-skiing-man ', 'icofont-skydiving-goggles ', 'icofont-snow-mobile ', 'icofont-steering ', 'icofont-stopwatch ', 'icofont-substitute ', 'icofont-swimmer ', 'icofont-table-tennis ', 'icofont-team-alt ', 'icofont-team ', 'icofont-tennis-player ', 'icofont-tennis ', 'icofont-tracking ', 'icofont-trophy-alt ', 'icofont-trophy ', 'icofont-volleyball-alt ', 'icofont-volleyball-fire ', 'icofont-volleyball ', 'icofont-water-bottle ', 'icofont-whistle-alt ', 'icofont-whistle ', 'icofont-win-trophy ', 'icofont-align-center ', 'icofont-align-left ', 'icofont-align-right ', 'icofont-all-caps ', 'icofont-bold ', 'icofont-brush ', 'icofont-clip-board ', 'icofont-code-alt ', 'icofont-color-bucket ', 'icofont-color-picker ', 'icofont-copy-invert ', 'icofont-copy ', 'icofont-cut ', 'icofont-delete-alt ', 'icofont-edit-alt ', 'icofont-eraser-alt ', 'icofont-font ', 'icofont-heading ', 'icofont-indent ', 'icofont-italic-alt ', 'icofont-italic ', 'icofont-justify-all ', 'icofont-justify-center ', 'icofont-justify-left ', 'icofont-justify-right ', 'icofont-link-broken ', 'icofont-outdent ', 'icofont-paper-clip ', 'icofont-paragraph ', 'icofont-pin ', 'icofont-printer ', 'icofont-redo ', 'icofont-rotation ', 'icofont-save ', 'icofont-small-cap ', 'icofont-strike-through ', 'icofont-sub-listing ', 'icofont-subscript ', 'icofont-superscript ', 'icofont-table ', 'icofont-text-height ', 'icofont-text-width ', 'icofont-trash ', 'icofont-underline ', 'icofont-undo ', 'icofont-air-balloon ', 'icofont-airplane-alt ', 'icofont-airplane ', 'icofont-articulated-truck ', 'icofont-auto-mobile ', 'icofont-auto-rickshaw ', 'icofont-bicycle-alt-1 ', 'icofont-bicycle-alt-2 ', 'icofont-bicycle ', 'icofont-bus-alt-1 ', 'icofont-bus-alt-2 ', 'icofont-bus-alt-3 ', 'icofont-bus ', 'icofont-cab ', 'icofont-cable-car ', 'icofont-car-alt-1 ', 'icofont-car-alt-2 ', 'icofont-car-alt-3 ', 'icofont-car-alt-4 ', 'icofont-car ', 'icofont-delivery-time ', 'icofont-fast-delivery ', 'icofont-fire-truck-alt ', 'icofont-fire-truck ', 'icofont-free-delivery ', 'icofont-helicopter ', 'icofont-motor-bike-alt ', 'icofont-motor-bike ', 'icofont-motor-biker ', 'icofont-oil-truck ', 'icofont-rickshaw ', 'icofont-rocket-alt-1 ', 'icofont-rocket-alt-2 ', 'icofont-rocket ', 'icofont-sail-boat-alt-1 ', 'icofont-sail-boat-alt-2 ', 'icofont-sail-boat ', 'icofont-scooter ', 'icofont-sea-plane ', 'icofont-ship-alt ', 'icofont-ship ', 'icofont-speed-boat ', 'icofont-taxi ', 'icofont-tractor ', 'icofont-train-line ', 'icofont-train-steam ', 'icofont-tram ', 'icofont-truck-alt ', 'icofont-truck-loaded ', 'icofont-truck ', 'icofont-van-alt ', 'icofont-van ', 'icofont-yacht ', 'icofont-5-star-hotel ', 'icofont-air-ticket ', 'icofont-beach-bed ', 'icofont-beach ', 'icofont-camping-vest ', 'icofont-direction-sign ', 'icofont-hill-side ', 'icofont-hill ', 'icofont-hotel ', 'icofont-island-alt ', 'icofont-island ', 'icofont-sandals-female ', 'icofont-sandals-male ', 'icofont-travelling ', 'icofont-breakdown ', 'icofont-celsius ', 'icofont-clouds ', 'icofont-cloudy ', 'icofont-dust ', 'icofont-eclipse ', 'icofont-fahrenheit ', 'icofont-forest-fire ', 'icofont-full-night ', 'icofont-full-sunny ', 'icofont-hail-night ', 'icofont-hail-rainy-night ', 'icofont-hail-rainy-sunny ', 'icofont-hail-rainy ', 'icofont-hail-sunny ', 'icofont-hail-thunder-night ', 'icofont-hail-thunder-sunny ', 'icofont-hail-thunder ', 'icofont-hail ', 'icofont-hill-night ', 'icofont-hill-sunny ', 'icofont-hurricane ', 'icofont-meteor ', 'icofont-night ', 'icofont-rainy-night ', 'icofont-rainy-sunny ', 'icofont-rainy-thunder ', 'icofont-rainy ', 'icofont-snow-alt ', 'icofont-snow-flake ', 'icofont-snow-temp ', 'icofont-snow ', 'icofont-snowy-hail ', 'icofont-snowy-night-hail ', 'icofont-snowy-night-rainy ', 'icofont-snowy-night ', 'icofont-snowy-rainy ', 'icofont-snowy-sunny-hail ', 'icofont-snowy-sunny-rainy ', 'icofont-snowy-sunny ', 'icofont-snowy-thunder-night ', 'icofont-snowy-thunder-sunny ', 'icofont-snowy-thunder ', 'icofont-snowy-windy-night ', 'icofont-snowy-windy-sunny ', 'icofont-snowy-windy ', 'icofont-snowy ', 'icofont-sun-alt ', 'icofont-sun-rise ', 'icofont-sun-set ', 'icofont-sun ', 'icofont-sunny-day-temp ', 'icofont-sunny ', 'icofont-thunder-light ', 'icofont-tornado ', 'icofont-umbrella-alt ', 'icofont-umbrella ', 'icofont-volcano ', 'icofont-wave ', 'icofont-wind-scale-0 ', 'icofont-wind-scale-1 ', 'icofont-wind-scale-10 ', 'icofont-wind-scale-11 ', 'icofont-wind-scale-12 ', 'icofont-wind-scale-2 ', 'icofont-wind-scale-3 ', 'icofont-wind-scale-4 ', 'icofont-wind-scale-5 ', 'icofont-wind-scale-6 ', 'icofont-wind-scale-7 ', 'icofont-wind-scale-8 ', 'icofont-wind-scale-9 ', 'icofont-wind-waves ', 'icofont-wind ', 'icofont-windy-hail ', 'icofont-windy-night ', 'icofont-windy-raining ', 'icofont-windy-sunny ', 'icofont-windy-thunder-raining ', 'icofont-windy-thunder ', 'icofont-windy ', 'icofont-addons ', 'icofont-address-book ', 'icofont-adjust ', 'icofont-alarm ', 'icofont-anchor ', 'icofont-archive ', 'icofont-at ', 'icofont-attachment ', 'icofont-audio ', 'icofont-automation ', 'icofont-badge ', 'icofont-bag-alt ', 'icofont-bag ', 'icofont-ban ', 'icofont-bar-code ', 'icofont-bars ', 'icofont-basket ', 'icofont-battery-empty ', 'icofont-battery-full ', 'icofont-battery-half ', 'icofont-battery-low ', 'icofont-beaker ', 'icofont-beard ', 'icofont-bed ', 'icofont-bell ', 'icofont-beverage ', 'icofont-bill ', 'icofont-bin ', 'icofont-binary ', 'icofont-binoculars ', 'icofont-bluetooth ', 'icofont-bomb ', 'icofont-book-mark ', 'icofont-box ', 'icofont-briefcase ', 'icofont-broken ', 'icofont-bucket ', 'icofont-bucket1 ', 'icofont-bucket2 ', 'icofont-bug ', 'icofont-building ', 'icofont-bulb-alt ', 'icofont-bullet ', 'icofont-bullhorn ', 'icofont-bullseye ', 'icofont-calendar ', 'icofont-camera-alt ', 'icofont-camera ', 'icofont-card ', 'icofont-cart-alt ', 'icofont-cart ', 'icofont-cc ', 'icofont-charging ', 'icofont-chat ', 'icofont-check-alt ', 'icofont-check-circled ', 'icofont-check ', 'icofont-checked ', 'icofont-children-care ', 'icofont-clip ', 'icofont-clock-time ', 'icofont-close-circled ', 'icofont-close-line-circled ', 'icofont-close-line-squared-alt ', 'icofont-close-line-squared ', 'icofont-close-line ', 'icofont-close-squared-alt ', 'icofont-close-squared ', 'icofont-close ', 'icofont-cloud-download ', 'icofont-cloud-refresh ', 'icofont-cloud-upload ', 'icofont-cloud ', 'icofont-code-not-allowed ', 'icofont-code ', 'icofont-comment ', 'icofont-compass-alt ', 'icofont-compass ', 'icofont-computer ', 'icofont-connection ', 'icofont-console ', 'icofont-contacts ', 'icofont-contrast ', 'icofont-copyright ', 'icofont-credit-card ', 'icofont-crop ', 'icofont-crown ', 'icofont-cube ', 'icofont-cubes ', 'icofont-dashboard-web ', 'icofont-dashboard ', 'icofont-data ', 'icofont-database-add ', 'icofont-database-locked ', 'icofont-database-remove ', 'icofont-database ', 'icofont-delete ', 'icofont-diamond ', 'icofont-dice-multiple ', 'icofont-dice ', 'icofont-disc ', 'icofont-diskette ', 'icofont-document-folder ', 'icofont-download-alt ', 'icofont-download ', 'icofont-downloaded ', 'icofont-drag ', 'icofont-drag1 ', 'icofont-drag2 ', 'icofont-drag3 ', 'icofont-earth ', 'icofont-ebook ', 'icofont-edit ', 'icofont-eject ', 'icofont-email ', 'icofont-envelope-open ', 'icofont-envelope ', 'icofont-eraser ', 'icofont-error ', 'icofont-excavator ', 'icofont-exchange ', 'icofont-exclamation-circle ', 'icofont-exclamation-square ', 'icofont-exclamation-tringle ', 'icofont-exclamation ', 'icofont-exit ', 'icofont-expand ', 'icofont-external-link ', 'icofont-external ', 'icofont-eye-alt ', 'icofont-eye-blocked ', 'icofont-eye-dropper ', 'icofont-eye ', 'icofont-favourite ', 'icofont-fax ', 'icofont-file-fill ', 'icofont-film ', 'icofont-filter ', 'icofont-fire-alt ', 'icofont-fire-burn ', 'icofont-fire ', 'icofont-flag-alt-1 ', 'icofont-flag-alt-2 ', 'icofont-flag ', 'icofont-flame-torch ', 'icofont-flash-light ', 'icofont-flash ', 'icofont-flask ', 'icofont-focus ', 'icofont-folder-open ', 'icofont-folder ', 'icofont-foot-print ', 'icofont-garbage ', 'icofont-gear-alt ', 'icofont-gear ', 'icofont-gears ', 'icofont-gift ', 'icofont-glass ', 'icofont-globe ', 'icofont-graffiti ', 'icofont-grocery ', 'icofont-hand ', 'icofont-hanger ', 'icofont-hard-disk ', 'icofont-heart-alt ', 'icofont-heart ', 'icofont-history ', 'icofont-home ', 'icofont-horn ', 'icofont-hour-glass ', 'icofont-id ', 'icofont-image ', 'icofont-inbox ', 'icofont-infinite ', 'icofont-info-circle ', 'icofont-info-square ', 'icofont-info ', 'icofont-institution ', 'icofont-interface ', 'icofont-invisible ', 'icofont-jacket ', 'icofont-jar ', 'icofont-jewlery ', 'icofont-karate ', 'icofont-key-hole ', 'icofont-key ', 'icofont-label ', 'icofont-lamp ', 'icofont-layers ', 'icofont-layout ', 'icofont-leaf ', 'icofont-leaflet ', 'icofont-learn ', 'icofont-lego ', 'icofont-lens ', 'icofont-letter ', 'icofont-letterbox ', 'icofont-library ', 'icofont-license ', 'icofont-life-bouy ', 'icofont-life-buoy ', 'icofont-life-jacket ', 'icofont-life-ring ', 'icofont-light-bulb ', 'icofont-lighter ', 'icofont-lightning-ray ', 'icofont-like ', 'icofont-line-height ', 'icofont-link-alt ', 'icofont-link ', 'icofont-list ', 'icofont-listening ', 'icofont-listine-dots ', 'icofont-listing-box ', 'icofont-listing-number ', 'icofont-live-support ', 'icofont-location-arrow ', 'icofont-location-pin ', 'icofont-lock ', 'icofont-login ', 'icofont-logout ', 'icofont-lollipop ', 'icofont-long-drive ', 'icofont-look ', 'icofont-loop ', 'icofont-luggage ', 'icofont-lunch ', 'icofont-lungs ', 'icofont-magic-alt ', 'icofont-magic ', 'icofont-magnet ', 'icofont-mail-box ', 'icofont-mail ', 'icofont-male ', 'icofont-map-pins ', 'icofont-map ', 'icofont-maximize ', 'icofont-measure ', 'icofont-medicine ', 'icofont-mega-phone ', 'icofont-megaphone-alt ', 'icofont-megaphone ', 'icofont-memorial ', 'icofont-memory-card ', 'icofont-mic-mute ', 'icofont-mic ', 'icofont-military ', 'icofont-mill ', 'icofont-minus-circle ', 'icofont-minus-square ', 'icofont-minus ', 'icofont-mobile-phone ', 'icofont-molecule ', 'icofont-money ', 'icofont-moon ', 'icofont-mop ', 'icofont-muffin ', 'icofont-mustache ', 'icofont-navigation-menu ', 'icofont-navigation ', 'icofont-network-tower ', 'icofont-network ', 'icofont-news ', 'icofont-newspaper ', 'icofont-no-smoking ', 'icofont-not-allowed ', 'icofont-notebook ', 'icofont-notepad ', 'icofont-notification ', 'icofont-numbered ', 'icofont-opposite ', 'icofont-optic ', 'icofont-options ', 'icofont-package ', 'icofont-page ', 'icofont-paint ', 'icofont-paper-plane ', 'icofont-paperclip ', 'icofont-papers ', 'icofont-pay ', 'icofont-penguin-linux ', 'icofont-pestle ', 'icofont-phone-circle ', 'icofont-phone ', 'icofont-picture ', 'icofont-pine ', 'icofont-pixels ', 'icofont-plugin ', 'icofont-plus-circle ', 'icofont-plus-square ', 'icofont-plus ', 'icofont-polygonal ', 'icofont-power ', 'icofont-price ', 'icofont-print ', 'icofont-puzzle ', 'icofont-qr-code ', 'icofont-queen ', 'icofont-question-circle ', 'icofont-question-square ', 'icofont-question ', 'icofont-quote-left ', 'icofont-quote-right ', 'icofont-random ', 'icofont-recycle ', 'icofont-refresh ', 'icofont-repair ', 'icofont-reply-all ', 'icofont-reply ', 'icofont-resize ', 'icofont-responsive ', 'icofont-retweet ', 'icofont-road ', 'icofont-robot ', 'icofont-royal ', 'icofont-rss-feed ', 'icofont-safety ', 'icofont-sale-discount ', 'icofont-satellite ', 'icofont-send-mail ', 'icofont-server ', 'icofont-settings-alt ', 'icofont-settings ', 'icofont-share-alt ', 'icofont-share-boxed ', 'icofont-share ', 'icofont-shield ', 'icofont-shopping-cart ', 'icofont-sign-in ', 'icofont-sign-out ', 'icofont-signal ', 'icofont-site-map ', 'icofont-smart-phone ', 'icofont-soccer ', 'icofont-sort-alt ', 'icofont-sort ', 'icofont-space ', 'icofont-spanner ', 'icofont-speech-comments ', 'icofont-speed-meter ', 'icofont-spinner-alt-1 ', 'icofont-spinner-alt-2 ', 'icofont-spinner-alt-3 ', 'icofont-spinner-alt-4 ', 'icofont-spinner-alt-5 ', 'icofont-spinner-alt-6 ', 'icofont-spinner ', 'icofont-spreadsheet ', 'icofont-square ', 'icofont-ssl-security ', 'icofont-star-alt-1 ', 'icofont-star-alt-2 ', 'icofont-star ', 'icofont-street-view ', 'icofont-support-faq ', 'icofont-tack-pin ', 'icofont-tag ', 'icofont-tags ', 'icofont-tasks-alt ', 'icofont-tasks ', 'icofont-telephone ', 'icofont-telescope ', 'icofont-terminal ', 'icofont-thumbs-down ', 'icofont-thumbs-up ', 'icofont-tick-boxed ', 'icofont-tick-mark ', 'icofont-ticket ', 'icofont-tie ', 'icofont-toggle-off ', 'icofont-toggle-on ', 'icofont-tools-alt-2 ', 'icofont-tools ', 'icofont-touch ', 'icofont-traffic-light ', 'icofont-transparent ', 'icofont-tree ', 'icofont-unique-idea ', 'icofont-unlock ', 'icofont-unlocked ', 'icofont-upload-alt ', 'icofont-upload ', 'icofont-usb-drive ', 'icofont-usb ', 'icofont-vector-path ', 'icofont-verification-check ', 'icofont-wall-clock ', 'icofont-wall ', 'icofont-wallet ', 'icofont-warning-alt ', 'icofont-warning ', 'icofont-water-drop ', 'icofont-web ', 'icofont-wheelchair ', 'icofont-wifi-alt ', 'icofont-wifi ', 'icofont-world ', 'icofont-zigzag ', 'icofont-zipped ', 'icofont-xs ', 'icofont-sm ', 'icofont-md ', 'icofont-lg ', 'icofont-1x ', 'icofont-2x ', 'icofont-3x ', 'icofont-4x ', 'icofont-5x ', 'icofont-6x ', 'icofont-7x ', 'icofont-8x ', 'icofont-9x ', 'icofont-10x ', 'icofont-fw ', 'icofont-ul ', 'icofont-border ', 'icofont-spin ', 'icofont-pulse'];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (iconfontClasses);

/***/ }),

/***/ "./src/components/icon-picker/index.js":
/*!*********************************************!*\
  !*** ./src/components/icon-picker/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.js");
/* harmony import */ var _fontawesome_classes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./fontawesome-classes */ "./src/components/icon-picker/fontawesome-classes.js");
/* harmony import */ var _iconfont_classes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./iconfont-classes */ "./src/components/icon-picker/iconfont-classes.js");
/* harmony import */ var _bootstrap_icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./bootstrap-icons */ "./src/components/icon-picker/bootstrap-icons.js");
const {
  Component,
  RawHTML
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }

  var library = props.library;
  var srcType = props.srcType;
  var iconSrc = props.iconSrc;
  const [iconsArr, setIconsArr] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(_fontawesome_classes__WEBPACK_IMPORTED_MODULE_2__["default"]);
  const [pickerOpen, setPickerOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
  const [iconData, setIconData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
    keyword: '',
    library: library,
    filtered: []
  });
  const [filteredIcons, setFilteredIcons] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)([]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
    if (iconData.library == 'fontAwesome') {
      setIconsArr(_fontawesome_classes__WEBPACK_IMPORTED_MODULE_2__["default"]);
    }

    if (iconData.library == 'iconFont') {
      setIconsArr(_iconfont_classes__WEBPACK_IMPORTED_MODULE_3__["default"]);
    }

    if (iconData.library == 'bootstrap') {
      setIconsArr(_bootstrap_icons__WEBPACK_IMPORTED_MODULE_4__["default"]);
    }
  }, [iconData]);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "relative"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "border border-gray-500",
    onClick: ev => {
      setPickerOpen(prev => !prev);
    }
  }, iconSrc.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
    icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"]
  }), iconSrc.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "w-8 h-8 text-lg border cursor-pointer hover:bg-gray-200 border-gray-500 text-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
    className: iconSrc
  }))), pickerOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Popover, {
    position: "bottom right"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "w-72 p-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.SelectControl, {
    label: "",
    value: iconData.library,
    options: [{
      label: 'Choose Library',
      value: ''
    }, {
      label: 'Font Awesome',
      value: 'fontAwesome'
    }, {
      label: 'IconFont',
      value: 'iconFont'
    }, {
      label: 'Bootstrap Icons',
      value: 'bootstrap'
    } // { label: 'Material', value: 'material' },
    ],
    onChange: newVal => {
      setIconData({ ...iconData,
        library: newVal
      });
      props.onChange({
        iconSrc: iconSrc,
        library: newVal,
        srcType: srcType
      });
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
    placeholder: "Search for icons",
    value: iconData.keyword,
    onChange: newVal => {
      setIconData({ ...iconData,
        keyword: newVal
      });
      setFilteredIcons([]);
      var icons = [];
      iconsArr.map(icon => {
        if (icon.indexOf(newVal) > 0) {
          icons.push(icon);
        }
      });
      setFilteredIcons(icons);
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, iconData.keyword.length == 0 && iconsArr.map(icon => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      onClick: ev => {
        props.onChange({
          iconSrc: icon,
          library: library,
          srcType: srcType
        });
      },
      className: "m-1 text-lg w-10 text-center cursor-pointer hover:bg-slate-400 p-2 inline-block"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon
    }));
  }), iconData.keyword.length > 0 && filteredIcons.map(icon => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
      onClick: ev => {
        props.onChange({
          iconSrc: icon,
          library: library,
          srcType: srcType
        });
      },
      className: "m-1 text-lg w-10 text-center cursor-pointer hover:bg-slate-400 p-2 inline-block"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("span", {
      className: icon
    }));
  }), filteredIcons.length == 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", {
    className: "text-center p-2 text-red-500 "
  }, "No icons found.")))));
}

class PGIconPicker extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      library,
      srcType,
      iconSrc,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.createElement)(Html, {
      library: library,
      srcType: srcType,
      iconSrc: iconSrc,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGIconPicker);

/***/ }),

/***/ "./src/components/icon-toggle/index.js":
/*!*********************************************!*\
  !*** ./src/components/icon-toggle/index.js ***!
  \*********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;


class IconToggle extends Component {
  render() {
    const {
      position,
      variant,
      iconList,
      //[{"label":"Select..","icon":"","value":""}]
      buttonTitle,
      onChange,
      activeIcon,
      value
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: position,
      renderToggle: _ref => {
        let {
          isOpen,
          onToggle
        } = _ref;
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: "border border-solid border-gray-400 p-1 px-2 cursor-pointer",
          title: buttonTitle,
          variant: variant,
          onClick: onToggle,
          "aria-expanded": isOpen
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RawHTML, {
          className: "text-sm "
        }, activeIcon));
      },
      renderContent: () => (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: ""
      }, iconList.map((x, index) => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
          className: ' text-lg px-2 font-bold border-b inline-block hover:bg-blue-400 hover:text-white cursor-pointer',
          onClick: ev => {
            onChange(x, index);
          }
        }, !x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
          class: "icon-close"
        })), x.value && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RawHTML, null, x.icon));
      }))
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (IconToggle);

/***/ }),

/***/ "./src/components/input-color-picker/index.js":
/*!****************************************************!*\
  !*** ./src/components/input-color-picker/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _components_breakpoint_switch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../components/breakpoint-switch */ "./src/components/breakpoint-switch/index.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _use_controlled_state__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./use-controlled-state */ "./src/components/input-color-picker/use-controlled-state.js");

const {
  Component
} = wp.element;






function WarningBanner(props) {
  if (!props.warn) {
    return null;
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
    position: "bottom right"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "p-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ColorPalette, {
    value: props.value,
    colors: props.colors,
    enableAlpha: true,
    onChange: newVal => {
      props.onChange(newVal);
    }
  }))));
}

class PGColorPicker extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      value,
      colors,
      enableAlpha,
      onChange,
      label,
      initialOpen
    } = this.props;
    var placeholderStyle = {
      backgroundImage: 'repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0),repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0)',
      backgroundPosition: '0 0,25px 25px',
      backgroundSize: '50px 50px',
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    var defaultbtnStyle = {
      backgroundImage: 'repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0),repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0)',
      backgroundPosition: '0 0,25px 25px',
      backgroundSize: '50px 50px',
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    var btnStyle = {
      backgroundColor: value,
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-4"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between items-center mb-3"
    }, label), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "relative h-10",
      style: placeholderStyle
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "absolute w-full  h-full top-0 left-0 text-center",
      style: btnStyle,
      onClick: this.handleToggleClick
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "w-full text-center left-0 top-1/2 -translate-y-1/2\t absolute"
    }, value == undefined ? 'Set Color' : value)))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(WarningBanner, {
      colors: colors,
      enableAlpha: enableAlpha,
      initialOpen: initialOpen,
      value: value,
      onChange: onChange,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGColorPicker);

/***/ }),

/***/ "./src/components/input-color-picker/use-controlled-state.js":
/*!*******************************************************************!*\
  !*** ./src/components/input-color-picker/use-controlled-state.js ***!
  \*******************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _values__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./values */ "./src/components/input-color-picker/values.js");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */


/**
 * @template T
 * @typedef Options
 * @property {T | undefined} initial  Initial value
 * @property {T | ""}        fallback Fallback value
 */

/** @type {Readonly<{ initial: undefined, fallback: '' }>} */

const defaultOptions = {
  initial: undefined,

  /**
   * Defaults to empty string, as that is preferred for usage with
   * <input />, <textarea />, and <select /> form elements.
   */
  fallback: ''
};
/**
 * Custom hooks for "controlled" components to track and consolidate internal
 * state and incoming values. This is useful for components that render
 * `input`, `textarea`, or `select` HTML elements.
 *
 * https://reactjs.org/docs/forms.html#controlled-components
 *
 * At first, a component using useControlledState receives an initial prop
 * value, which is used as initial internal state.
 *
 * This internal state can be maintained and updated without
 * relying on new incoming prop values.
 *
 * Unlike the basic useState hook, useControlledState's state can
 * be updated if a new incoming prop value is changed.
 *
 * @template T
 *
 * @param {T | undefined} currentState             The current value.
 * @param {Options<T>}    [options=defaultOptions] Additional options for the hook.
 *
 * @return {[T | "", (nextState: T) => void]} The controlled value and the value setter.
 */

function useControlledState(currentState) {
  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultOptions;
  const {
    initial,
    fallback
  } = { ...defaultOptions,
    ...options
  };
  const [internalState, setInternalState] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(currentState);
  const hasCurrentState = (0,_values__WEBPACK_IMPORTED_MODULE_1__.isValueDefined)(currentState);
  /*
   * Resets internal state if value every changes from uncontrolled <-> controlled.
   */

  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    if (hasCurrentState || internalState) {
      setInternalState(true);
    }
  }, [hasCurrentState, internalState]);
  const state = (0,_values__WEBPACK_IMPORTED_MODULE_1__.getDefinedValue)([currentState, internalState, initial], fallback);
  /* eslint-disable jsdoc/no-undefined-types */

  /** @type {(nextState: T) => void} */

  const setState = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useCallback)(nextState => {
    //if (!hasCurrentState) {
    setInternalState(nextState); //}
  }, [hasCurrentState]);
  /* eslint-enable jsdoc/no-undefined-types */

  return [state, setState];
}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useControlledState);

/***/ }),

/***/ "./src/components/input-color-picker/values.js":
/*!*****************************************************!*\
  !*** ./src/components/input-color-picker/values.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "ensureNumber": () => (/* binding */ ensureNumber),
/* harmony export */   "ensureString": () => (/* binding */ ensureString),
/* harmony export */   "getDefinedValue": () => (/* binding */ getDefinedValue),
/* harmony export */   "isValueDefined": () => (/* binding */ isValueDefined),
/* harmony export */   "isValueEmpty": () => (/* binding */ isValueEmpty),
/* harmony export */   "isValueNumeric": () => (/* binding */ isValueNumeric),
/* harmony export */   "numberToString": () => (/* binding */ numberToString),
/* harmony export */   "stringToNumber": () => (/* binding */ stringToNumber)
/* harmony export */ });
/* eslint-disable jsdoc/valid-types */

/**
 * Determines if a value is null or undefined.
 *
 * @template T
 *
 * @param {T} value The value to check.
 * @return {value is Exclude<T, null | undefined>} Whether value is not null or undefined.
 */
function isValueDefined(value) {
  return value !== undefined && value !== null;
}
/* eslint-enable jsdoc/valid-types */

/* eslint-disable jsdoc/valid-types */

/**
 * Determines if a value is empty, null, or undefined.
 *
 * @param {string | number | null | undefined} value The value to check.
 * @return {value is ("" | null | undefined)} Whether value is empty.
 */

function isValueEmpty(value) {
  const isEmptyString = value === '';
  return !isValueDefined(value) || isEmptyString;
}
/* eslint-enable jsdoc/valid-types */

/**
 * Get the first defined/non-null value from an array.
 *
 * @template T
 *
 * @param {Array<T | null | undefined>} values        Values to derive from.
 * @param {T}                           fallbackValue Fallback value if there are no defined values.
 * @return {T} A defined value or the fallback value.
 */

function getDefinedValue() {
  var _values$find;

  let values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
  let fallbackValue = arguments.length > 1 ? arguments[1] : undefined;
  return (_values$find = values.find(isValueDefined)) !== null && _values$find !== void 0 ? _values$find : fallbackValue;
}
/**
 * @param {string} [locale]
 * @return {[RegExp, RegExp]} The delimiter and decimal regexp
 */

const getDelimiterAndDecimalRegex = locale => {
  const formatted = Intl.NumberFormat(locale).format(1000.1);
  const delimiter = formatted[1];
  const decimal = formatted[formatted.length - 2];
  return [new RegExp(`\\${delimiter}`, 'g'), new RegExp(`\\${decimal}`, 'g')];
}; // https://en.wikipedia.org/wiki/Decimal_separator#Current_standards


const INTERNATIONAL_THOUSANDS_DELIMITER = / /g;
const ARABIC_NUMERAL_LOCALES = ['ar', 'fa', 'ur', 'ckb', 'ps'];
const EASTERN_ARABIC_NUMBERS = /([۰-۹]|[٠-٩])/g;
/**
 * Checks to see if a value is a numeric value (`number` or `string`).
 *
 * Intentionally ignores whether the thousands delimiters are only
 * in the thousands marks.
 *
 * @param {any}    value
 * @param {string} [locale]
 * @return {boolean} Whether value is numeric.
 */

function isValueNumeric(value) {
  let locale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : window.navigator.language;

  if (ARABIC_NUMERAL_LOCALES.some(l => locale.startsWith(l))) {
    locale = 'en-GB';

    if (EASTERN_ARABIC_NUMBERS.test(value)) {
      value = value.replace(/[٠-٩]/g, (
      /** @type {string} */
      d) => '٠١٢٣٤٥٦٧٨٩'.indexOf(d)).replace(/[۰-۹]/g, (
      /** @type {string} */
      d) => '۰۱۲۳۴۵۶۷۸۹'.indexOf(d)).replace(/٬/g, ',').replace(/٫/g, '.');
    }
  }

  const [delimiterRegexp, decimalRegexp] = getDelimiterAndDecimalRegex(locale);
  const valueToCheck = typeof value === 'string' ? value.replace(delimiterRegexp, '').replace(decimalRegexp, '.').replace(INTERNATIONAL_THOUSANDS_DELIMITER, '') : value;
  return !isNaN(parseFloat(valueToCheck)) && isFinite(valueToCheck);
}
/**
 * Converts a string to a number.
 *
 * @param {string} value
 * @return {number} String as a number.
 */

const stringToNumber = value => {
  return parseFloat(value);
};
/**
 * Converts a number to a string.
 *
 * @param {number} value
 * @return {string} Number as a string.
 */

const numberToString = value => {
  return `${value}`;
};
/**
 * Regardless of the input being a string or a number, returns a number.
 *
 * Returns `undefined` in case the string is `undefined` or not a valid numeric value.
 *
 * @param {string | number} value
 * @return {number} The parsed number.
 */

const ensureNumber = value => {
  return typeof value === 'string' ? stringToNumber(value) : value;
};
/**
 * Regardless of the input being a string or a number, returns a number.
 *
 * Returns `undefined` in case the string is `undefined` or not a valid numeric value.
 *
 * @param {string | number} value
 * @return {string} The converted string, or `undefined` in case the input is `undefined` or `NaN`.
 */

const ensureString = value => {
  return typeof value === 'string' ? value : numberToString(value);
};

/***/ }),

/***/ "./src/components/input-select/index.js":
/*!**********************************************!*\
  !*** ./src/components/input-select/index.js ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




class PGinputSelect extends Component {
  render() {
    var {
      val,
      options,
      multiple,
      onChange
    } = this.props;

    function Html() {
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "w-full"
      }, multiple == true && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("select", {
        className: "w-full",
        multiple: true,
        onChange: event => {
          var options = event.target.options;
          var selected = [];

          for (var i = 0, l = options.length; i < l; i++) {
            if (options[i].selected) {
              selected.push(options[i].value);
            }
          }

          onChange(selected);
        }
      }, options.map(x => {
        var isSelected = val.includes(x.value);
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("option", {
          value: x.value,
          selected: isSelected
        }, x.label);
      }))), multiple == false && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("select", {
        onChange: event => {
          var currentVal = options[event.target.options.selectedIndex].value;
          onChange(currentVal);
        }
      }, options.map(x => {
        var selected = val.includes(x.value);
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("option", {
          value: x.value,
          selected: selected
        }, x.label);
      }))));
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, null);
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGinputSelect);

/***/ }),

/***/ "./src/components/input-text/index.js":
/*!********************************************!*\
  !*** ./src/components/input-text/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", {
    className: props.className,
    id: props.id,
    value: props.value,
    type: "text",
    size: props.size,
    name: props.name,
    placeholder: props.placeholder,
    minlength: props.minlength,
    maxlength: props.maxlength,
    required: props.required,
    disabled: props.disabled,
    onChange: newVal => {
      props.onChange(newVal);
    }
  }));
}

class PGinputText extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      value,
      placeholder,
      className,
      id,
      name,
      size,
      minlength,
      maxlength,
      required,
      disabled,
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      val: value,
      name: name,
      id: id,
      size: size,
      placeholder: placeholder,
      className: className,
      minlength: minlength,
      maxlength: maxlength,
      required: required,
      disabled: disabled,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGinputText);

/***/ }),

/***/ "./src/components/mail-subscribe/index.js":
/*!************************************************!*\
  !*** ./src/components/mail-subscribe/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);

const {
  Component,
  RawHTML
} = wp.element;






class PGMailSubsctibe extends Component {
  render() {
    var {// library,
      // srcType,
    } = this.props;

    function SubscribeForm() {
      const [emailSubscribe, setEmailSubscribe] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
        email: '',
        status: null,
        loading: false
      });
      const [hasSubscribed, setHasSubscribed] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
      const [PostGridPluginData, setPostGridPluginData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(window.PostGridPluginData);
      (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
        _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
          path: '/post-grid/v2/get_site_details',
          method: 'POST',
          data: {}
        }).then(res => {
          //
          setEmailSubscribe({ ...emailSubscribe,
            email: res.email,
            status: res.subscribe_status
          });
          var hasSubscribed = res.subscribe_status == 'subscribed' ? true : false;
          setPostGridPluginData({ ...PostGridPluginData,
            hasSubscribed: hasSubscribed
          });
        });
      }, []);
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "grid grid-cols-2 gap-2 mb-5"
      }, hasSubscribed && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "col-span-2 bg-green-700 text-white py-2 px-2 my-2"
      }, "Thanks for subscribe!"), PostGridPluginData.hasSubscribed == false && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "col-span-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
        value: emailSubscribe.email,
        className: "!py-2 rounded-none",
        onChange: newVal => {//setEmailSubscribe({ ...emailSubscribe, email: newVal });
        }
      })), emailSubscribe.loading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Spinner, null), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "col-span-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "px-3 py-2 text-center bg-lime-700 text-white cursor-pointer",
        onClick: ev => {
          setEmailSubscribe({ ...emailSubscribe,
            loading: true
          });
          _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
            path: '/post-grid/v2/email_subscribe',
            method: 'POST',
            data: {
              email: emailSubscribe.email
            }
          }).then(res => {
            //
            setEmailSubscribe({ ...emailSubscribe,
              loading: false,
              status: res.subscribe_status
            });
            setHasSubscribed(true);
            setPostGridPluginData({ ...PostGridPluginData,
              hasSubscribed: true
            });
            setTimeout(() => {
              setHasSubscribed(false);
            }, 3000);
          });
        }
      }, "Subscribe to News")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "col-span-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "px-3 py-2 text-center bg-gray-700 text-white cursor-pointer",
        onClick: ev => {
          setEmailSubscribe({ ...emailSubscribe,
            loading: true
          });
          _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
            path: '/post-grid/v2/email_subscribe',
            method: 'POST',
            data: {
              interested: false
            }
          }).then(res => {
            //
            setEmailSubscribe({ ...emailSubscribe,
              loading: false,
              status: res.subscribe_status
            });
          });
        }
      }, "No Interested"))));
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(SubscribeForm, null);
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGMailSubsctibe);

/***/ }),

/***/ "./src/components/request-a-template/index.js":
/*!****************************************************!*\
  !*** ./src/components/request-a-template/index.js ***!
  \****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _components_input_text__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");

const {
  Component
} = wp.element;










function Html(props) {
  if (!props.warn) {
    return null;
  }

  const [searchPrams, setsearchPrams] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    title: "",
    content: '',
    files: [],
    budget: 50,
    email: '',
    name: "",
    status: 'idle'
  });
  var [isLoading, setIsLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
  const ALLOWED_MEDIA_TYPES = ['image'];
  let budgetArgs = {
    custom: {
      label: 'Custom',
      value: ''
    },
    '50-': {
      label: 'Less than 50$',
      value: '50-'
    },
    50: {
      label: '50$+',
      value: 50
    },
    100: {
      label: '100$+',
      value: 100
    },
    200: {
      label: '200$+',
      value: 200
    },
    300: {
      label: '300$+',
      value: 300
    },
    500: {
      label: '500$+',
      value: 500
    }
  };
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
      path: '/post-grid/v2/get_site_details',
      method: 'POST',
      data: {}
    }).then(res => {
      setsearchPrams({ ...searchPrams,
        email: res.email,
        name: res.name
      });
    });
  }, []);

  function senMail() {
    setIsLoading(true);
    var htmlBody = '';
    htmlBody += '<p style="font-weight:bold;font-size:18px">' + searchPrams.title + '</p>';
    htmlBody += '<p style="font-weight:bold">Budget: ' + searchPrams.budget + '$</p>';
    htmlBody += '<p style="font-weight:bold">Email: ' + searchPrams.email + '</p>';
    htmlBody += '<p></p>';
    htmlBody += searchPrams.content;
    htmlBody += '<p>Design Files:</p>';
    searchPrams.files.map(x => {
      htmlBody += '<p><a href="' + x + '"><img style="width:200px;height:auto" src="' + x + '"/></a></p>';
    });
    var postData = {
      subject: '#Post Grid Combo - Template Request',
      body: htmlBody,
      email_to: 'support@pickplugins.com',
      email_from: searchPrams.email,
      email_from_name: searchPrams.name,
      reply_to: searchPrams.email,
      reply_to_name: searchPrams.name,
      attachments: searchPrams.files
    };
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
      path: '/post-grid/v2/send_mail',
      method: 'POST',
      data: postData
    }).then(res => {
      var mail_sent = res.mail_sent;

      if (mail_sent) {
        setsearchPrams({ ...searchPrams,
          status: 'success'
        });
      } else {
        setsearchPrams({ ...searchPrams,
          status: 'fail'
        });
      }

      setTimeout(() => {
        setsearchPrams({ ...searchPrams,
          status: 'idle'
        });
      }, 4000);
      setIsLoading(false);
    });
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    id: "requestTemplate",
    class: ""
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "grid grid-cols-2 gap-5 items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: "",
    className: " mb-3 block text-white text-base"
  }, "Template Title"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_text__WEBPACK_IMPORTED_MODULE_5__["default"], {
    className: "w-full !py-1 !rounded-none ",
    type: "text",
    placeholder: "Write a short title",
    value: searchPrams.title,
    onChange: ev => {
      var newVal = ev.target.value;
      setsearchPrams({ ...searchPrams,
        title: newVal
      });
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: "",
    className: " mt-5 mb-3 block text-white text-base"
  }, "Template Details"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.RichText, {
    className: "w-full bg-white pb-5 p-2",
    tagName: 'div',
    value: searchPrams.content,
    allowedFormats: ['core/bold', 'core/italic', 'core/link'],
    onChange: content => {
      setsearchPrams({ ...searchPrams,
        content: content
      });
    },
    placeholder: 'Write details about your design...'
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelRow, {
    className: "mb-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: "",
    className: " mt-5 mb-3 block text-white text-base"
  }, "Design Files"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaUploadCheck, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaUpload, {
    class: "bg-blue-500",
    onSelect: media => {
      var filesX = searchPrams.files.push(media.url);
      console.log(searchPrams.files);
      setsearchPrams({ ...searchPrams,
        files: searchPrams.files
      });
    },
    onClose: () => {},
    allowedTypes: ALLOWED_MEDIA_TYPES,
    render: _ref => {
      let {
        open
      } = _ref;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Button, {
        className: " bg-blue-500 hover:bg-blue-600 text-white hover:text-white",
        onClick: open
      }, "Open Media Library");
    }
  }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex mb-5"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, searchPrams.files.map((x, index) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: " bg-white m-3 my-2 p-3 relative"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
      src: x,
      alt: "",
      className: "w-32"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "cursor-pointer absolute top-0 right-0  p-1 bg-red-500 hover:bg-red-600 inline-block",
      onClick: () => {
        var filesX = searchPrams.files.splice(index, 1);
        console.log(filesX);
        setsearchPrams({ ...searchPrams,
          files: searchPrams.files
        });
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"],
      className: "fill-white"
    })));
  }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center "
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: "",
    className: " text-white text-base mr-3"
  }, "Estimated Budget"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_6__["default"], {
    className: "text-white",
    position: "bottom right",
    variant: "secondary",
    options: budgetArgs,
    buttonTitle: 'Choose',
    btnClass: "!border-none !bg-blue-500 !text-white",
    onChange: (option, index) => {
      setsearchPrams({ ...searchPrams,
        budget: option.value
      });
    }
  })), budgetArgs[searchPrams.budget] == undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex items-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_text__WEBPACK_IMPORTED_MODULE_5__["default"], {
    className: " !py-1 my-3 !rounded-none inline-block",
    type: "text",
    placeholder: "",
    value: searchPrams.budget,
    onChange: ev => {
      var newVal = ev.target.value;
      setsearchPrams({ ...searchPrams,
        budget: newVal
      });
    }
  }), " ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "inline-block mx-2 text-white"
  }, "USD")), budgetArgs[searchPrams.budget] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "text-gray-800 text-[18px]"
  }, budgetArgs[searchPrams.budget] == undefined ? '' : budgetArgs[searchPrams.budget].label)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: "",
    className: " mb-3 mt-5 block text-white text-base"
  }, "You Email"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_text__WEBPACK_IMPORTED_MODULE_5__["default"], {
    className: "w-full !py-1  !rounded-none ",
    type: "text",
    placeholder: "",
    value: searchPrams.email,
    onChange: ev => {
      var newVal = ev.target.value;
      setsearchPrams({ ...searchPrams,
        email: newVal
      });
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: "",
    className: " my-3 block text-white text-base"
  }, "You Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_input_text__WEBPACK_IMPORTED_MODULE_5__["default"], {
    className: "w-full !py-1  !rounded-none ",
    type: "text",
    placeholder: "",
    value: searchPrams.name,
    onChange: ev => {
      var newVal = ev.target.value;
      setsearchPrams({ ...searchPrams,
        name: newVal
      });
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "py-5 px-10"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("p", {
    className: "text-base"
  }, "By sending mail, you are requested to follow these terms."), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("ul", {
    className: "my-3 text-base list-inside"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
    className: "list-disc"
  }, "We do not provide design made by 3rd party blocks. default blocks may use."), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("li", {
    className: "list-disc"
  }, "We do not provide immediate/emmargency delivery. But we try our best as soon as possible.")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex bg-blue-600 justify-center items-center rounded-md text-white font-bold text-base text-center cursor-pointer hover:bg-blue-500 px-10 py-3 my-5",
    onClick: ev => {
      senMail();
    }
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, "Send Mail"), isLoading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "text-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Spinner, {
    className: "!m-0 !mx-3"
  }))), searchPrams.status == 'success' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "bg-white text-green-800 font-bold text-base p-2 px-4"
  }, "Mial has sent. Our team will contact soon."), searchPrams.status == 'fail' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "bg-white text-red-500 font-bold text-base p-2 px-4"
  }, "Sorry, Unable to send mail."))));
}

class PGRequestTemplate extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGRequestTemplate);

/***/ }),

/***/ "./src/components/sidebars/index.js":
/*!******************************************!*\
  !*** ./src/components/sidebars/index.js ***!
  \******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/plus.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");

const {
  Component
} = wp.element;







function Html(props) {
  if (!props.warn) {
    return null;
  }

  var isLoaded = props.isLoaded;
  var optionDataDefault = {
    customFonts: [],
    googleFonts: [],
    container: {
      width: '1150px'
    },
    breakpoints: [],
    colors: [],
    editor: {
      width: '1150px'
    },
    blocks: {
      disabled: []
    },
    blockInserter: {
      postGridPositon: ''
    } // Category positon

  };
  var [optionData, setoptionData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(optionDataDefault); // Using the hook.

  var [dataLoaded, setdataLoaded] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Using the hook.

  var [isLoading, setisLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false); // Using the hook.

  var [debounce, setDebounce] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Using the hook.

  var [colorPopup, setcolorPopup] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Using the hook.

  var [blockCategories, setblockCategories] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Using the hook.

  var isLoaded = props.isLoaded;
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default()({
      path: '/post-grid/v2/get_options',
      method: 'POST',
      data: {
        option: 'post_grid_block_editor'
      }
    }).then(res => {
      setdataLoaded(true);

      if (res.length != 0) {
        setoptionData(res);
      }
    });
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default()({
      path: '/post-grid/v2/block_categories',
      method: 'POST',
      data: {}
    }).then(res => {
      console.log(res);
      var items = [];
      res.map(x => {
        items.push({
          label: x.title,
          value: x.slug
        });
      });
      setblockCategories(items);
    });
  }, [isLoaded]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    if (optionData != null) {
      clearTimeout(debounce);
      debounce = setTimeout(() => {
        updateOption();
      }, 1000);
    }
  }, [optionData]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    console.log(optionData.blocks.disabled);
    wp.domReady(function () {
      optionData.blocks.disabled.forEach(function (blockName) {
        if (blockName && wp.blocks.getBlockType(blockName) !== undefined) {
          wp.blocks.unregisterBlockType(blockName);
        }
      });
    });
  }, [optionData.blocks.disabled]);

  function updateOption() {
    setisLoading(true);
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default()({
      path: '/post-grid/v2/update_options',
      method: 'POST',
      data: {
        name: 'post_grid_block_editor',
        value: optionData
      }
    }).then(res => {
      console.log(res);
      setisLoading(false); //setoptionData(res)
    });
  }

  var unitArgs = {
    px: {
      "label": "PX",
      "value": "px"
    },
    em: {
      "label": "EM",
      "value": "em"
    },
    rem: {
      "label": "REM",
      "value": "rem"
    },
    auto: {
      "label": "AUTO",
      "value": "auto"
    },
    "%": {
      "label": "%",
      "value": "%"
    },
    cm: {
      "label": "CM",
      "value": "cm"
    },
    mm: {
      "label": "MM",
      "value": "mm"
    },
    in: {
      "label": "IN",
      "value": "in"
    },
    pt: {
      "label": "PT",
      "value": "pt"
    },
    pc: {
      "label": "PC",
      "value": "pc"
    },
    ex: {
      "label": "EX",
      "value": "ex"
    },
    ch: {
      "label": "CH",
      "value": "ch"
    },
    vw: {
      "label": "VW",
      "value": "vw"
    },
    vh: {
      "label": "VH",
      "value": "vh"
    },
    vmin: {
      "label": "VMIN",
      "value": "vmin"
    },
    vmax: {
      "label": "VMAX",
      "value": "vmax"
    }
  };
  var fontWeightArgs = {
    'normal': {
      "label": "normal",
      "value": "normal"
    },
    'bold': {
      "label": "bold",
      "value": "bold"
    },
    'bolder': {
      "label": "bolder",
      "value": "bolder"
    },
    'lighter': {
      "label": "lighter",
      "value": "lighter"
    },
    '100': {
      "label": "100",
      "value": "100"
    },
    '200': {
      "label": "200",
      "value": "200"
    },
    '300': {
      "label": "300",
      "value": "300"
    },
    '400': {
      "label": "400",
      "value": "400"
    },
    '500': {
      "label": "500",
      "value": "500"
    },
    '600': {
      "label": "600",
      "value": "600"
    },
    '700': {
      "label": "700",
      "value": "700"
    },
    '800': {
      "label": "800",
      "value": "800"
    },
    '900': {
      "label": "900",
      "value": "900"
    }
  };
  var fontStyleArgs = {
    normal: {
      "label": "normal",
      "value": "normal"
    },
    italic: {
      "label": "italic",
      "value": "italic"
    },
    oblique: {
      "label": "oblique",
      "value": "oblique"
    }
  };
  var fontStretchArgs = {
    'ultra-condensed': {
      "label": "ultra-condensed",
      "value": "ultra-condensed"
    },
    'extra-condensed': {
      "label": "extra-condensed",
      "value": "extra-condensed"
    },
    'condensed': {
      "label": "condensed",
      "value": "condensed"
    },
    'semi-condensed': {
      "label": "semi-condensed",
      "value": "semi-condensed"
    },
    'normal': {
      "label": "normal",
      "value": "normal"
    },
    'semi-expanded': {
      "label": "semi-expanded",
      "value": "semi-expanded"
    },
    'expanded': {
      "label": "expanded",
      "value": "expanded"
    },
    'extra-expanded': {
      "label": "extra-expanded",
      "value": "extra-expanded"
    },
    'ultra-expanded': {
      "label": "ultra-expanded",
      "value": "ultra-expanded"
    }
  };
  var pgBlocks = {
    "post-grid/post-grid": {
      label: "Post Grid",
      value: "post-grid/post-grid"
    },
    "post-grid/post-grid-filterable": {
      label: "Post Grid - Filterable",
      value: "post-grid/post-grid-filterable"
    },
    "post-grid/content-slider": {
      label: "Content Slider",
      value: "post-grid/content-slider"
    },
    "post-grid/content-slider-item": {
      label: "Content Slider Item",
      value: "post-grid/content-slider-item"
    },
    "post-grid/popup": {
      label: "Popup",
      value: "post-grid/popup"
    },
    "post-grid/post-title": {
      label: "Post title",
      value: "post-grid/post-title"
    },
    "post-grid/post-excerpt": {
      label: "Post Excerpt",
      value: "post-grid/post-excerpt"
    },
    "post-grid/post-featured-image": {
      label: "Post Featured Image",
      value: "post-grid/post-featured-image"
    },
    "post-grid/image": {
      label: "Image",
      value: "post-grid/image"
    },
    "post-grid/post-author": {
      label: "Post Author",
      value: "post-grid/post-author"
    },
    "post-grid/post-author-fields": {
      label: "Post Author Fields",
      value: "post-grid/post-author-fields"
    },
    "post-grid/post-categories": {
      label: "Post Categories",
      value: "post-grid/post-categories"
    },
    "post-grid/post-tags": {
      label: "Post Tags",
      value: "post-grid/post-tags"
    },
    "post-grid/post-taxonomies": {
      label: "Post Taxonomies",
      value: "post-grid/post-taxonomies"
    },
    "post-grid/post-date": {
      label: "Post Date",
      value: "post-grid/post-date"
    },
    "post-grid/post-meta": {
      label: "Post Meta",
      value: "post-grid/post-meta"
    },
    "post-grid/read-more": {
      label: "Read More",
      value: "post-grid/read-more"
    },
    "post-grid/post-comment-count": {
      label: "Post Comment Count",
      value: "post-grid/post-comment-count"
    },
    "post-grid/progress-bar": {
      label: "Progress Bar",
      value: "post-grid/progress-bar"
    },
    "post-grid/form-wrap": {
      label: "Form Wrap",
      value: "post-grid/form-wrap"
    },
    "post-grid/form-field-input": {
      label: "Form Field Input",
      value: "post-grid/form-field-input"
    },
    "post-grid/form-field-select": {
      label: "Form Field Select",
      value: "post-grid/form-field-select"
    },
    "post-grid/form-field-checkbox": {
      label: "Form Field Checkbox",
      value: "post-grid/form-field-checkbox"
    },
    "post-grid/form-field-radio": {
      label: "Form Field Radio",
      value: "post-grid/form-field-radio"
    },
    "post-grid/form-field-textarea": {
      label: "Form Field Textarea",
      value: "post-grid/form-field-textarea"
    },
    "post-grid/form-field-submit": {
      label: "Form Field Submit",
      value: "post-grid/form-field-submit"
    },
    "post-grid/form-field-file-multi": {
      label: "Form Field File Multi",
      value: "post-grid/form-field-file-multi"
    },
    "post-grid/form-field-file": {
      label: "Form Field File",
      value: "post-grid/form-field-file"
    },
    "post-grid/list": {
      label: "List",
      value: "post-grid/list"
    },
    "post-grid/number-counter": {
      label: "Number Counter",
      value: "post-grid/number-counter"
    },
    "post-grid/icon": {
      label: "Icon",
      value: "post-grid/icon"
    },
    "post-grid/text": {
      label: "Text",
      value: "post-grid/text"
    },
    "post-grid/star-rate": {
      label: "Star Rate",
      value: "post-grid/star-rate"
    },
    "post-grid/breadcrumb": {
      label: "Breadcrumb",
      value: "post-grid/breadcrumb"
    },
    "post-grid/shortcode": {
      label: "Shortcode",
      value: "post-grid/shortcode"
    },
    "post-grid/social-share": {
      label: "Social Share",
      value: "post-grid/social-share"
    },
    "post-grid/terms-list": {
      label: "Terms List",
      value: "post-grid/terms-list"
    },
    "post-grid/layers": {
      label: "Layers",
      value: "post-grid/layers"
    },
    "post-grid/layer": {
      label: "Layer",
      value: "post-grid/layer"
    },
    "post-grid/flex-wrap": {
      label: "Flex Wrap",
      value: "post-grid/flex-wrap"
    },
    "post-grid/flex-wrap-item": {
      label: "Flex Wrap Item",
      value: "post-grid/flex-wrap-item"
    },
    "post-grid/grid-wrap": {
      label: "Grid Wrap",
      value: "post-grid/grid-wrap"
    },
    "post-grid/grid-wrap-item": {
      label: "Grid Wrap Item",
      value: "post-grid/grid-wrap-item"
    },
    "post-grid/image-gallery": {
      label: "Image Gallery",
      value: "post-grid/image-gallery"
    },
    "post-grid/image-gallery-item": {
      label: "image Gallery Item",
      value: "post-grid/image-gallery-item"
    },
    "post-grid/accordion-nested": {
      label: "Accordion Nested",
      value: "post-grid/accordion-nested"
    },
    "post-grid/accordion-nested-item": {
      label: "Accordion Nested Item",
      value: "post-grid/accordion-nested-item"
    },
    "post-grid/tabs-nested": {
      label: "Tabs Nested",
      value: "post-grid/tabs-nested"
    },
    "post-grid/tabs-nested-item": {
      label: "Tabs Nested Item",
      value: "post-grid/tabs-nested-item"
    },
    "post-grid/post": {
      label: "Post",
      value: "post-grid/post"
    },
    "post-grid/accordion": {
      label: "Accordion",
      value: "post-grid/accordion"
    },
    "post-grid/tabs": {
      label: "Tabs",
      value: "post-grid/tabs"
    }
  };
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "relative"
  }, (!dataLoaded || isLoading) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "absolute w-full text-center p-3 top-0 left-0"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Spinner, null)), dataLoaded && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: ""
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "p-3"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Container Width"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
    placeholder: "",
    type: "number",
    value: optionData.container.width == undefined ? '' : optionData.container.width.match(/-?\d+/g)[0],
    onChange: newVal => {
      var container = { ...optionData.container
      };
      var widthValX = container.width == undefined || container.width.match(/-?\d+/g) == null ? 0 : container.width.match(/-?\d+/g)[0];
      var widthUnitX = container.width == undefined || container.width.match(/[a-zA-Z%]+/g) == null ? 'px' : container.width.match(/[a-zA-Z%]+/g)[0];
      var containerX = { ...optionData.container,
        width: newVal + widthUnitX
      };
      setoptionData({ ...optionData,
        container: containerX
      });
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: unitArgs,
    buttonTitle: optionData.container.width.match(/[a-zA-Z%]+/g) == null ? "Choose" : optionData.container.width.match(/[a-zA-Z%]+/g)[0],
    onChange: (option, index) => {
      var container = { ...optionData.container
      };
      var widthValX = container.width == undefined || container.width.match(/-?\d+/g) == null ? 0 : container.width.match(/-?\d+/g)[0];
      var widthUnitX = container.width == undefined || container.width.match(/[a-zA-Z%]+/g) == null ? 'px' : container.width.match(/[a-zA-Z%]+/g)[0];
      var containerX = { ...optionData.container,
        width: widthValX + option.value
      };
      setoptionData({ ...optionData,
        container: containerX
      });
    },
    values: ''
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Editor Width"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
    placeholder: "",
    type: "number",
    value: optionData.editor.width.match(/-?\d+/g)[0],
    onChange: newVal => {
      var editor = { ...optionData.editor
      };
      var widthValX = editor.width == undefined || editor.width.match(/-?\d+/g) == null ? 0 : editor.width.match(/-?\d+/g)[0];
      var widthUnitX = editor.width == undefined || editor.width.match(/[a-zA-Z%]+/g) == null ? 'px' : editor.width.match(/[a-zA-Z%]+/g)[0];
      var editorX = { ...optionData.editor,
        width: newVal + widthUnitX
      };
      setoptionData({ ...optionData,
        editor: editorX
      });
    }
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: unitArgs,
    buttonTitle: optionData.editor.width.match(/[a-zA-Z%]+/g) == null ? "Choose" : optionData.editor.width.match(/[a-zA-Z%]+/g)[0],
    onChange: (option, index) => {
      var editor = { ...optionData.editor
      };
      var widthValX = editor.width == undefined || editor.width.match(/-?\d+/g) == null ? 0 : editor.width.match(/-?\d+/g)[0];
      var widthUnitX = editor.width == undefined || editor.width.match(/[a-zA-Z%]+/g) == null ? 'px' : editor.width.match(/[a-zA-Z%]+/g)[0];
      var editorX = { ...optionData.editor,
        width: widthValX + option.value
      };
      setoptionData({ ...optionData,
        editor: editorX
      });
    },
    values: ''
  }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelBody, {
    title: "Custom Fonts",
    initialOpen: false
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-3"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "inline-block px-4 py-1 my-3 bg-gray-400 text-white rounded-sm cursor-pointer",
    onClick: ev => {
      var customFonts = optionData.customFonts;
      customFonts.push({
        family: 'Font Family',
        weight: '',
        style: '',
        stretch: '',
        src: []
      });
      setoptionData({ ...optionData,
        customFonts: customFonts
      });
    }
  }, "Add"), optionData.customFonts.map((x, i) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelBody, {
      title: x.family,
      initialOpen: false
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "my-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-red-500 p-1 cursor-pointer",
      onClick: ev => {
        var customFonts = optionData.customFonts;
        customFonts.splice(i, 1);
        setoptionData({ ...optionData,
          customFonts: customFonts
        });
        console.log(newVal);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
      fill: '#fff',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"]
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Family Name"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
      placeholder: "",
      value: x.family,
      onChange: newVal => {
        var customFonts = optionData.customFonts;
        customFonts[i].family = newVal;
        clearTimeout(debounce);
        debounce = setTimeout(() => {
          setoptionData({ ...optionData,
            customFonts: customFonts
          });
        }, 1000);
      }
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Font URL's"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "inline-block px-4 my-3 py-1 bg-gray-400 text-white rounded-sm cursor-pointer",
      onClick: ev => {
        var customFonts = optionData.customFonts;
        customFonts[i].src.push({
          url: '',
          format: ''
        });
        console.log(customFonts);
        setoptionData({ ...optionData,
          customFonts: customFonts
        });
      }
    }, "Add")), x.src.map((srcArg, j) => {
      var url = srcArg.url;
      var format = srcArg.format;
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex my-2 items-center"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
        placeholder: "",
        value: url,
        onChange: newVal => {
          var customFonts = optionData.customFonts;
          customFonts[i].src[j].url = newVal;
          clearTimeout(debounce);
          debounce = setTimeout(() => {
            setoptionData({ ...optionData,
              customFonts: customFonts
            });
          }, 1000);
        }
      }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "bg-red-500 p-1 cursor-pointer",
        onClick: ev => {
          var customFonts = optionData.customFonts;
          customFonts[i].src.splice(1, j);
          setoptionData({ ...optionData,
            customFonts: customFonts
          });
        }
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
        fill: '#fff',
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"]
      })));
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Font Wieght"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: fontWeightArgs,
      buttonTitle: fontWeightArgs[x.weight] == undefined ? "Choose" : x.weight,
      onChange: (option, index) => {
        var customFonts = optionData.customFonts;
        customFonts[i].weight = option.value;
        setoptionData({ ...optionData,
          customFonts: customFonts
        });
      },
      values: ''
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Font Style"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: fontStyleArgs,
      buttonTitle: fontStyleArgs[x.style] == undefined ? "Choose" : x.style,
      onChange: (option, index) => {
        var customFonts = optionData.customFonts;
        customFonts[i].style = option.value;
        setoptionData({ ...optionData,
          customFonts: customFonts
        });
      },
      values: ''
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", null, "Font Stretch"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
      position: "bottom right",
      variant: "secondary",
      options: fontStretchArgs,
      buttonTitle: fontStretchArgs[x.stretch] == undefined ? "Choose" : x.stretch,
      onChange: (option, index) => {
        var customFonts = optionData.customFonts;
        customFonts[i].stretch = option.value;
        setoptionData({ ...optionData,
          customFonts: customFonts
        });
      },
      values: ''
    })))));
  }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelBody, {
    title: "Disable Blocks",
    initialOpen: false
  }, Object.entries(pgBlocks).map(x => {
    var index = x[0];
    var item = x[1];
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: [optionData.blocks.disabled.includes(item.value) ? 'px-3 my-3 cursor-pointer py-3 bg-red-500 text-white flex' : 'px-3 my-3 cursor-pointer py-3 bg-gray-500 text-white flex'],
      onClick: ev => {
        if (optionData.blocks.disabled.includes(item.value)) {
          var arr = optionData.blocks.disabled.filter(val => val !== item.value);
          var blocks = { ...optionData.blocks,
            disabled: arr
          };
          setoptionData({ ...optionData,
            blocks: blocks
          });
        } else {
          optionData.blocks.disabled.push(item.value);
          setoptionData({ ...optionData,
            blocks: optionData.blocks
          });
        }
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, optionData.blocks.disabled.includes(item.value) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"]
    }), !optionData.blocks.disabled.includes(item.value) && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "mx-3"
    }, item.label));
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelBody, {
    title: "Block Inserter",
    initialOpen: false
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
    for: ""
  }, "Post Grid Combo Position"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, {
    label: "",
    value: optionData.blockInserter == undefined ? '' : optionData.blockInserter.postGridPositon,
    options: blockCategories,
    onChange: newVal => {
      var blockInserterX = { ...optionData.blockInserter,
        postGridPositon: newVal
      };
      setoptionData({ ...optionData,
        blockInserter: blockInserterX
      });
    }
  }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelBody, {
    title: "Colors",
    initialOpen: false
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-3"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "inline-block px-4 py-1 bg-gray-400 text-white rounded-sm cursor-pointer",
    onClick: ev => {
      var colors = optionData.colors;
      colors.push('#ffffff');
      setoptionData({ ...optionData,
        colors: colors
      });
    }
  }, "Add"), optionData.colors.map((x, i) => {
    var placeholderStyle = {
      backgroundImage: 'repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0),repeating-linear-gradient(45deg,#e0e0e0 25%,transparent 0,transparent 75%,#e0e0e0 0,#e0e0e0)',
      backgroundPosition: '0 0,10px 10px',
      backgroundSize: '20px 20px',
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    var btnStyle = {
      backgroundColor: x,
      boxShadow: 'inset 0 0 0 1px rgb(0 0 0 / 20%)',
      cursor: 'pointer'
    };
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between items-center border my-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "bg-red-500 p-1 cursor-pointer",
      onClick: ev => {
        var colors = optionData.colors;
        colors.splice(i, 1);
        setoptionData({ ...optionData,
          colors: colors
        });
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
      fill: '#fff',
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "px-3 py-1 bg-gray-400 text-white rounded-sm"
    }, x)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      style: placeholderStyle
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "w-20 h-9 inline-block border",
      style: btnStyle,
      onClick: ev => {
        ev.preventDefault();
        ev.stopPropagation();
        setcolorPopup(colorPopup == null ? i : null);
      }
    }), colorPopup != null && colorPopup == i && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Popover, {
      position: "bottom right"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "p-2"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ColorPalette, {
      value: x,
      enableAlpha: true,
      onChange: newVal => {
        var colors = optionData.colors;
        colors[i] = newVal;
        setoptionData({ ...optionData,
          colors: colors
        });
        console.log(newVal);
      }
    })))));
  }))))));
}

class PGsidebars extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true,
      isLoaded: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  componentDidMount() {
    setTimeout(() => {
      this.setState(state => ({
        isLoaded: !state.isLoaded
      }));
    }, 1000);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      onChange
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      onChange: onChange,
      warn: this.state.showWarning,
      isLoaded: this.state.isLoaded
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGsidebars);

/***/ }),

/***/ "./src/components/styles/index.js":
/*!****************************************!*\
  !*** ./src/components/styles/index.js ***!
  \****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_121__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_122__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_123__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/arrow-right.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_breakpoint_toggle__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/breakpoint-toggle */ "./src/components/breakpoint-toggle/index.js");
/* harmony import */ var _components_dropdown_sudo_selector__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/dropdown-sudo-selector */ "./src/components/dropdown-sudo-selector/index.js");
/* harmony import */ var _components_css_align_content__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/css-align-content */ "./src/components/css-align-content/index.js");
/* harmony import */ var _components_css_align_items__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../components/css-align-items */ "./src/components/css-align-items/index.js");
/* harmony import */ var _components_css_align_self__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../components/css-align-self */ "./src/components/css-align-self/index.js");
/* harmony import */ var _components_css_aspect_ratio__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../components/css-aspect-ratio */ "./src/components/css-aspect-ratio/index.js");
/* harmony import */ var _components_css_backface_visibility__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../components/css-backface-visibility */ "./src/components/css-backface-visibility/index.js");
/* harmony import */ var _components_css_background_attachment__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../components/css-background-attachment */ "./src/components/css-background-attachment/index.js");
/* harmony import */ var _components_css_background_blend_mode__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../components/css-background-blend-mode */ "./src/components/css-background-blend-mode/index.js");
/* harmony import */ var _components_css_background_clip__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../components/css-background-clip */ "./src/components/css-background-clip/index.js");
/* harmony import */ var _components_css_background_color__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../components/css-background-color */ "./src/components/css-background-color/index.js");
/* harmony import */ var _components_css_bg_color__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../components/css-bg-color */ "./src/components/css-bg-color/index.js");
/* harmony import */ var _components_css_background_image__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../components/css-background-image */ "./src/components/css-background-image/index.js");
/* harmony import */ var _components_css_background_origin__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../../components/css-background-origin */ "./src/components/css-background-origin/index.js");
/* harmony import */ var _components_css_background_position__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../../components/css-background-position */ "./src/components/css-background-position/index.js");
/* harmony import */ var _components_css_background_repeat__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../../components/css-background-repeat */ "./src/components/css-background-repeat/index.js");
/* harmony import */ var _components_css_background_size__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../components/css-background-size */ "./src/components/css-background-size/index.js");
/* harmony import */ var _components_css_border__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/css-border */ "./src/components/css-border/index.js");
/* harmony import */ var _components_css_border_top__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ../../components/css-border-top */ "./src/components/css-border-top/index.js");
/* harmony import */ var _components_css_border_right__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ../../components/css-border-right */ "./src/components/css-border-right/index.js");
/* harmony import */ var _components_css_border_bottom__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../../components/css-border-bottom */ "./src/components/css-border-bottom/index.js");
/* harmony import */ var _components_css_border_left__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../../components/css-border-left */ "./src/components/css-border-left/index.js");
/* harmony import */ var _components_css_border_radius__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../../components/css-border-radius */ "./src/components/css-border-radius/index.js");
/* harmony import */ var _components_css_border_image__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ../../components/css-border-image */ "./src/components/css-border-image/index.js");
/* harmony import */ var _components_css_bottom__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ../../components/css-bottom */ "./src/components/css-bottom/index.js");
/* harmony import */ var _components_css_border_collapse__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ../../components/css-border-collapse */ "./src/components/css-border-collapse/index.js");
/* harmony import */ var _components_css_border_spacing__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ../../components/css-border-spacing */ "./src/components/css-border-spacing/index.js");
/* harmony import */ var _components_css_backdrop_filter__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ../../components/css-backdrop-filter */ "./src/components/css-backdrop-filter/index.js");
/* harmony import */ var _components_css_box_shadow__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ../../components/css-box-shadow */ "./src/components/css-box-shadow/index.js");
/* harmony import */ var _components_css_box_sizing__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ../../components/css-box-sizing */ "./src/components/css-box-sizing/index.js");
/* harmony import */ var _components_css_clear__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! ../../components/css-clear */ "./src/components/css-clear/index.js");
/* harmony import */ var _components_css_color__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! ../../components/css-color */ "./src/components/css-color/index.js");
/* harmony import */ var _components_css_cursor__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! ../../components/css-cursor */ "./src/components/css-cursor/index.js");
/* harmony import */ var _components_css_content__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! ../../components/css-content */ "./src/components/css-content/index.js");
/* harmony import */ var _components_css_column_count__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! ../../components/css-column-count */ "./src/components/css-column-count/index.js");
/* harmony import */ var _components_css_column_rule__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! ../../components/css-column-rule */ "./src/components/css-column-rule/index.js");
/* harmony import */ var _components_css_clip__WEBPACK_IMPORTED_MODULE_41__ = __webpack_require__(/*! ../../components/css-clip */ "./src/components/css-clip/index.js");
/* harmony import */ var _components_css_display__WEBPACK_IMPORTED_MODULE_42__ = __webpack_require__(/*! ../../components/css-display */ "./src/components/css-display/index.js");
/* harmony import */ var _components_css_direction__WEBPACK_IMPORTED_MODULE_43__ = __webpack_require__(/*! ../../components/css-direction */ "./src/components/css-direction/index.js");
/* harmony import */ var _components_css_filter__WEBPACK_IMPORTED_MODULE_44__ = __webpack_require__(/*! ../../components/css-filter */ "./src/components/css-filter/index.js");
/* harmony import */ var _components_css_float__WEBPACK_IMPORTED_MODULE_45__ = __webpack_require__(/*! ../../components/css-float */ "./src/components/css-float/index.js");
/* harmony import */ var _components_css_font_family__WEBPACK_IMPORTED_MODULE_46__ = __webpack_require__(/*! ../../components/css-font-family */ "./src/components/css-font-family/index.js");
/* harmony import */ var _components_css_font_size__WEBPACK_IMPORTED_MODULE_47__ = __webpack_require__(/*! ../../components/css-font-size */ "./src/components/css-font-size/index.js");
/* harmony import */ var _components_css_font_stretch__WEBPACK_IMPORTED_MODULE_48__ = __webpack_require__(/*! ../../components/css-font-stretch */ "./src/components/css-font-stretch/index.js");
/* harmony import */ var _components_css_font_style__WEBPACK_IMPORTED_MODULE_49__ = __webpack_require__(/*! ../../components/css-font-style */ "./src/components/css-font-style/index.js");
/* harmony import */ var _components_css_font_weight__WEBPACK_IMPORTED_MODULE_50__ = __webpack_require__(/*! ../../components/css-font-weight */ "./src/components/css-font-weight/index.js");
/* harmony import */ var _components_css_font_variant_caps__WEBPACK_IMPORTED_MODULE_51__ = __webpack_require__(/*! ../../components/css-font-variant-caps */ "./src/components/css-font-variant-caps/index.js");
/* harmony import */ var _components_css_flex_wrap__WEBPACK_IMPORTED_MODULE_52__ = __webpack_require__(/*! ../../components/css-flex-wrap */ "./src/components/css-flex-wrap/index.js");
/* harmony import */ var _components_css_flex_direction__WEBPACK_IMPORTED_MODULE_53__ = __webpack_require__(/*! ../../components/css-flex-direction */ "./src/components/css-flex-direction/index.js");
/* harmony import */ var _components_css_flex_shrink__WEBPACK_IMPORTED_MODULE_54__ = __webpack_require__(/*! ../../components/css-flex-shrink */ "./src/components/css-flex-shrink/index.js");
/* harmony import */ var _components_css_flex_basis__WEBPACK_IMPORTED_MODULE_55__ = __webpack_require__(/*! ../../components/css-flex-basis */ "./src/components/css-flex-basis/index.js");
/* harmony import */ var _components_css_flex_grow__WEBPACK_IMPORTED_MODULE_56__ = __webpack_require__(/*! ../../components/css-flex-grow */ "./src/components/css-flex-grow/index.js");
/* harmony import */ var _components_css_flex_flow__WEBPACK_IMPORTED_MODULE_57__ = __webpack_require__(/*! ../../components/css-flex-flow */ "./src/components/css-flex-flow/index.js");
/* harmony import */ var _components_css_grid_column_end__WEBPACK_IMPORTED_MODULE_58__ = __webpack_require__(/*! ../../components/css-grid-column-end */ "./src/components/css-grid-column-end/index.js");
/* harmony import */ var _components_css_grid_column_start__WEBPACK_IMPORTED_MODULE_59__ = __webpack_require__(/*! ../../components/css-grid-column-start */ "./src/components/css-grid-column-start/index.js");
/* harmony import */ var _components_css_grid_row_end__WEBPACK_IMPORTED_MODULE_60__ = __webpack_require__(/*! ../../components/css-grid-row-end */ "./src/components/css-grid-row-end/index.js");
/* harmony import */ var _components_css_grid_row_start__WEBPACK_IMPORTED_MODULE_61__ = __webpack_require__(/*! ../../components/css-grid-row-start */ "./src/components/css-grid-row-start/index.js");
/* harmony import */ var _components_css_grid_template_columns__WEBPACK_IMPORTED_MODULE_62__ = __webpack_require__(/*! ../../components/css-grid-template-columns */ "./src/components/css-grid-template-columns/index.js");
/* harmony import */ var _components_css_grid_template_rows__WEBPACK_IMPORTED_MODULE_63__ = __webpack_require__(/*! ../../components/css-grid-template-rows */ "./src/components/css-grid-template-rows/index.js");
/* harmony import */ var _components_css_height__WEBPACK_IMPORTED_MODULE_64__ = __webpack_require__(/*! ../../components/css-height */ "./src/components/css-height/index.js");
/* harmony import */ var _components_css_justify_content__WEBPACK_IMPORTED_MODULE_65__ = __webpack_require__(/*! ../../components/css-justify-content */ "./src/components/css-justify-content/index.js");
/* harmony import */ var _components_css_left__WEBPACK_IMPORTED_MODULE_66__ = __webpack_require__(/*! ../../components/css-left */ "./src/components/css-left/index.js");
/* harmony import */ var _components_css_letter_spacing__WEBPACK_IMPORTED_MODULE_67__ = __webpack_require__(/*! ../../components/css-letter-spacing */ "./src/components/css-letter-spacing/index.js");
/* harmony import */ var _components_css_line_height__WEBPACK_IMPORTED_MODULE_68__ = __webpack_require__(/*! ../../components/css-line-height */ "./src/components/css-line-height/index.js");
/* harmony import */ var _components_css_list_style__WEBPACK_IMPORTED_MODULE_69__ = __webpack_require__(/*! ../../components/css-list-style */ "./src/components/css-list-style/index.js");
/* harmony import */ var _components_css_margin__WEBPACK_IMPORTED_MODULE_70__ = __webpack_require__(/*! ../../components/css-margin */ "./src/components/css-margin/index.js");
/* harmony import */ var _components_css_margin_top__WEBPACK_IMPORTED_MODULE_71__ = __webpack_require__(/*! ../../components/css-margin-top */ "./src/components/css-margin-top/index.js");
/* harmony import */ var _components_css_margin_right__WEBPACK_IMPORTED_MODULE_72__ = __webpack_require__(/*! ../../components/css-margin-right */ "./src/components/css-margin-right/index.js");
/* harmony import */ var _components_css_margin_bottom__WEBPACK_IMPORTED_MODULE_73__ = __webpack_require__(/*! ../../components/css-margin-bottom */ "./src/components/css-margin-bottom/index.js");
/* harmony import */ var _components_css_margin_left__WEBPACK_IMPORTED_MODULE_74__ = __webpack_require__(/*! ../../components/css-margin-left */ "./src/components/css-margin-left/index.js");
/* harmony import */ var _components_css_max_height__WEBPACK_IMPORTED_MODULE_75__ = __webpack_require__(/*! ../../components/css-max-height */ "./src/components/css-max-height/index.js");
/* harmony import */ var _components_css_max_width__WEBPACK_IMPORTED_MODULE_76__ = __webpack_require__(/*! ../../components/css-max-width */ "./src/components/css-max-width/index.js");
/* harmony import */ var _components_css_min_height__WEBPACK_IMPORTED_MODULE_77__ = __webpack_require__(/*! ../../components/css-min-height */ "./src/components/css-min-height/index.js");
/* harmony import */ var _components_css_min_width__WEBPACK_IMPORTED_MODULE_78__ = __webpack_require__(/*! ../../components/css-min-width */ "./src/components/css-min-width/index.js");
/* harmony import */ var _components_css_perspective__WEBPACK_IMPORTED_MODULE_79__ = __webpack_require__(/*! ../../components/css-perspective */ "./src/components/css-perspective/index.js");
/* harmony import */ var _components_css_object_fit__WEBPACK_IMPORTED_MODULE_80__ = __webpack_require__(/*! ../../components/css-object-fit */ "./src/components/css-object-fit/index.js");
/* harmony import */ var _components_css_opacity__WEBPACK_IMPORTED_MODULE_81__ = __webpack_require__(/*! ../../components/css-opacity */ "./src/components/css-opacity/index.js");
/* harmony import */ var _components_css_outline__WEBPACK_IMPORTED_MODULE_82__ = __webpack_require__(/*! ../../components/css-outline */ "./src/components/css-outline/index.js");
/* harmony import */ var _components_css_outline_offset__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ../../components/css-outline-offset */ "./src/components/css-outline-offset/index.js");
/* harmony import */ var _components_css_order__WEBPACK_IMPORTED_MODULE_84__ = __webpack_require__(/*! ../../components/css-order */ "./src/components/css-order/index.js");
/* harmony import */ var _components_css_overflow__WEBPACK_IMPORTED_MODULE_85__ = __webpack_require__(/*! ../../components/css-overflow */ "./src/components/css-overflow/index.js");
/* harmony import */ var _components_css_overflow_x__WEBPACK_IMPORTED_MODULE_86__ = __webpack_require__(/*! ../../components/css-overflow-x */ "./src/components/css-overflow-x/index.js");
/* harmony import */ var _components_css_overflow_y__WEBPACK_IMPORTED_MODULE_87__ = __webpack_require__(/*! ../../components/css-overflow-y */ "./src/components/css-overflow-y/index.js");
/* harmony import */ var _components_css_padding__WEBPACK_IMPORTED_MODULE_88__ = __webpack_require__(/*! ../../components/css-padding */ "./src/components/css-padding/index.js");
/* harmony import */ var _components_css_padding_top__WEBPACK_IMPORTED_MODULE_89__ = __webpack_require__(/*! ../../components/css-padding-top */ "./src/components/css-padding-top/index.js");
/* harmony import */ var _components_css_padding_right__WEBPACK_IMPORTED_MODULE_90__ = __webpack_require__(/*! ../../components/css-padding-right */ "./src/components/css-padding-right/index.js");
/* harmony import */ var _components_css_padding_bottom__WEBPACK_IMPORTED_MODULE_91__ = __webpack_require__(/*! ../../components/css-padding-bottom */ "./src/components/css-padding-bottom/index.js");
/* harmony import */ var _components_css_padding_left__WEBPACK_IMPORTED_MODULE_92__ = __webpack_require__(/*! ../../components/css-padding-left */ "./src/components/css-padding-left/index.js");
/* harmony import */ var _components_css_position__WEBPACK_IMPORTED_MODULE_93__ = __webpack_require__(/*! ../../components/css-position */ "./src/components/css-position/index.js");
/* harmony import */ var _components_css_right__WEBPACK_IMPORTED_MODULE_94__ = __webpack_require__(/*! ../../components/css-right */ "./src/components/css-right/index.js");
/* harmony import */ var _components_css_gap__WEBPACK_IMPORTED_MODULE_95__ = __webpack_require__(/*! ../../components/css-gap */ "./src/components/css-gap/index.js");
/* harmony import */ var _components_css_column_gap__WEBPACK_IMPORTED_MODULE_96__ = __webpack_require__(/*! ../../components/css-column-gap */ "./src/components/css-column-gap/index.js");
/* harmony import */ var _components_css_row_gap__WEBPACK_IMPORTED_MODULE_97__ = __webpack_require__(/*! ../../components/css-row-gap */ "./src/components/css-row-gap/index.js");
/* harmony import */ var _components_css_text_align__WEBPACK_IMPORTED_MODULE_98__ = __webpack_require__(/*! ../../components/css-text-align */ "./src/components/css-text-align/index.js");
/* harmony import */ var _components_css_text_decoration__WEBPACK_IMPORTED_MODULE_99__ = __webpack_require__(/*! ../../components/css-text-decoration */ "./src/components/css-text-decoration/index.js");
/* harmony import */ var _components_css_text_indent__WEBPACK_IMPORTED_MODULE_100__ = __webpack_require__(/*! ../../components/css-text-indent */ "./src/components/css-text-indent/index.js");
/* harmony import */ var _components_css_text_justify__WEBPACK_IMPORTED_MODULE_101__ = __webpack_require__(/*! ../../components/css-text-justify */ "./src/components/css-text-justify/index.js");
/* harmony import */ var _components_css_text_overflow__WEBPACK_IMPORTED_MODULE_102__ = __webpack_require__(/*! ../../components/css-text-overflow */ "./src/components/css-text-overflow/index.js");
/* harmony import */ var _components_css_text_shadow__WEBPACK_IMPORTED_MODULE_103__ = __webpack_require__(/*! ../../components/css-text-shadow */ "./src/components/css-text-shadow/index.js");
/* harmony import */ var _components_css_text_transform__WEBPACK_IMPORTED_MODULE_104__ = __webpack_require__(/*! ../../components/css-text-transform */ "./src/components/css-text-transform/index.js");
/* harmony import */ var _components_css_top__WEBPACK_IMPORTED_MODULE_105__ = __webpack_require__(/*! ../../components/css-top */ "./src/components/css-top/index.js");
/* harmony import */ var _components_css_text_align_last__WEBPACK_IMPORTED_MODULE_106__ = __webpack_require__(/*! ../../components/css-text-align-last */ "./src/components/css-text-align-last/index.js");
/* harmony import */ var _components_css_table_layout__WEBPACK_IMPORTED_MODULE_107__ = __webpack_require__(/*! ../../components/css-table-layout */ "./src/components/css-table-layout/index.js");
/* harmony import */ var _components_css_transform__WEBPACK_IMPORTED_MODULE_108__ = __webpack_require__(/*! ../../components/css-transform */ "./src/components/css-transform/index.js");
/* harmony import */ var _components_css_transition__WEBPACK_IMPORTED_MODULE_109__ = __webpack_require__(/*! ../../components/css-transition */ "./src/components/css-transition/index.js");
/* harmony import */ var _components_css_vertical_align__WEBPACK_IMPORTED_MODULE_110__ = __webpack_require__(/*! ../../components/css-vertical-align */ "./src/components/css-vertical-align/index.js");
/* harmony import */ var _components_css_visibility__WEBPACK_IMPORTED_MODULE_111__ = __webpack_require__(/*! ../../components/css-visibility */ "./src/components/css-visibility/index.js");
/* harmony import */ var _components_css_width__WEBPACK_IMPORTED_MODULE_112__ = __webpack_require__(/*! ../../components/css-width */ "./src/components/css-width/index.js");
/* harmony import */ var _components_css_white_space__WEBPACK_IMPORTED_MODULE_113__ = __webpack_require__(/*! ../../components/css-white-space */ "./src/components/css-white-space/index.js");
/* harmony import */ var _components_css_word_break__WEBPACK_IMPORTED_MODULE_114__ = __webpack_require__(/*! ../../components/css-word-break */ "./src/components/css-word-break/index.js");
/* harmony import */ var _components_css_word_spacing__WEBPACK_IMPORTED_MODULE_115__ = __webpack_require__(/*! ../../components/css-word-spacing */ "./src/components/css-word-spacing/index.js");
/* harmony import */ var _components_css_writing_mode__WEBPACK_IMPORTED_MODULE_116__ = __webpack_require__(/*! ../../components/css-writing-mode */ "./src/components/css-writing-mode/index.js");
/* harmony import */ var _components_css_word_wrap__WEBPACK_IMPORTED_MODULE_117__ = __webpack_require__(/*! ../../components/css-word-wrap */ "./src/components/css-word-wrap/index.js");
/* harmony import */ var _components_css_z_index__WEBPACK_IMPORTED_MODULE_118__ = __webpack_require__(/*! ../../components/css-z-index */ "./src/components/css-z-index/index.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_119__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_120__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");

const {
  Component,
  RawHTML
} = wp.element;






































 // import PGcssClip from '../../components/css-clip'
// import PGcssClipPath from '../../components/css-clip-path'




















































































var myStore = wp.data.select('postgrid-shop');



function Html(props) {
  if (!props.warn) {
    return null;
  }

  var sudoScourceArgsBasic = {
    styles: {
      label: 'Idle',
      value: 'styles'
    },
    hover: {
      label: 'Hover',
      value: 'hover'
    },
    after: {
      label: 'After',
      value: 'after',
      isPro: true
    },
    before: {
      label: 'Before',
      value: 'before',
      isPro: true
    },
    active: {
      label: 'Active',
      value: 'active',
      isPro: true
    },
    focus: {
      label: 'Focus',
      value: 'focus',
      isPro: true
    },
    'focus-within': {
      label: 'Focus-within',
      value: 'focus-within',
      isPro: true
    },
    target: {
      label: 'target',
      value: 'target',
      isPro: true
    },
    visited: {
      label: 'Visited',
      value: 'visited',
      isPro: true
    },
    selection: {
      label: 'Selection',
      value: 'selection',
      isPro: true
    },
    'first-child': {
      label: 'First-child',
      value: 'first-child',
      isPro: true
    },
    'last-child': {
      label: 'Last-child',
      value: 'last-child',
      isPro: true
    },
    'first-letter': {
      label: 'First-letter',
      value: 'first-letter',
      isPro: true
    },
    'first-line': {
      label: 'First-line',
      value: 'first-line',
      isPro: true
    } //custom: { label: 'Custom', value: '', isPro: true },

  };
  let sudoScourceArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('sudoScourceArgs', sudoScourceArgsBasic);
  const [sudoScources, setSudoScources] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(sudoScourceArgs);
  const [sudoScource, setSudoScource] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('styles');
  const [styles, setStyles] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({});
  const [cssAtts, setcssAtts] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({}); //const [breakPointX, setBreakPointX] = useState(myStore.getBreakPoint());

  var breakPointX = myStore.getBreakPoint();
  const [extraOpt, setextraOpt] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
  const [copyArgs, setCopyArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    isCopied: false,
    isPasted: false,
    pasteError: false,
    copyError: false,
    errorMessage: ''
  });
  const [resetArgs, setResetArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    isReset: false,
    resetError: false,
    errorMessage: ''
  });
  var cssPropsBasic = {
    alignContent: {
      id: 'alignContent',
      label: 'Align Content'
    },
    alignItems: {
      id: 'alignItems',
      label: 'Align Items'
    },
    alignSelf: {
      id: 'alignSelf',
      label: 'Align Self'
    },
    aspectRatio: {
      id: 'aspectRatio',
      label: 'Aspect Ratio'
    },
    backfaceVisibility: {
      id: 'backfaceVisibility',
      label: 'Backface Visibility'
    },
    //background: { id: 'background', label: 'Background' },
    backgroundAttachment: {
      id: 'backgroundAttachment',
      label: 'Background Attachment',
      isPro: true
    },
    backgroundBlendMode: {
      id: 'backgroundBlendMode',
      label: 'Background Blend Mode',
      isPro: true
    },
    backgroundClip: {
      id: 'backgroundClip',
      label: 'Background Clip',
      isPro: true
    },
    backgroundColor: {
      id: 'backgroundColor',
      label: 'Background Color'
    },
    backgroundImage: {
      id: 'backgroundImage',
      label: 'Background Image'
    },
    backgroundOrigin: {
      id: 'backgroundOrigin',
      label: 'Background Origin'
    },
    backgroundRepeat: {
      id: 'backgroundRepeat',
      label: 'Background Repeat'
    },
    backgroundPosition: {
      id: 'backgroundPosition',
      label: 'Background Position'
    },
    backgroundSize: {
      id: 'backgroundSize',
      label: 'Background Size'
    },
    border: {
      id: 'border',
      label: 'Border'
    },
    borderTop: {
      id: 'borderTop',
      label: 'Border Top'
    },
    borderRight: {
      id: 'borderRight',
      label: 'Border Right'
    },
    borderBottom: {
      id: 'borderBottom',
      label: 'Border Bottom'
    },
    borderLeft: {
      id: 'borderLeft',
      label: 'Border Left'
    },
    borderCollapse: {
      id: 'borderCollapse',
      label: 'Border Collapse',
      isPro: true
    },
    borderImage: {
      id: 'borderImage',
      label: 'Border Image',
      isPro: true
    },
    borderRadius: {
      id: 'borderRadius',
      label: 'Border Radius'
    },
    borderSpacing: {
      id: 'borderSpacing',
      label: 'Border Spacing',
      isPro: true
    },
    backdropFilter: {
      id: 'backdropFilter',
      label: 'Backdrop Filter'
    },
    bottom: {
      id: 'bottom',
      label: 'Bottom'
    },
    boxShadow: {
      id: 'boxShadow',
      label: 'Box Shadow'
    },
    boxSizing: {
      id: 'boxSizing',
      label: 'Box Sizing',
      isPro: true
    },
    clear: {
      id: 'clear',
      label: 'Clear'
    },
    clip: {
      id: 'clip',
      label: 'Clip',
      isPro: true
    },
    // clipPath: { id: 'clipPath', label: 'Clip Path', isPro: true },
    color: {
      id: 'color',
      label: 'Color'
    },
    columnCount: {
      id: 'columnCount',
      label: 'Column Count',
      isPro: true
    },
    columnRule: {
      id: 'columnRule',
      label: 'Column Rule',
      isPro: true
    },
    content: {
      id: 'content',
      label: 'Content',
      isPro: true
    },
    cursor: {
      id: 'cursor',
      label: 'Cursor',
      isPro: true
    },
    display: {
      id: 'display',
      label: 'Display'
    },
    direction: {
      id: 'direction',
      label: 'Direction'
    },
    flexBasis: {
      id: 'flexBasis',
      label: 'Flex Basis'
    },
    flexFlow: {
      id: 'flexFlow',
      label: 'Flex Basis'
    },
    flexDirection: {
      id: 'flexDirection',
      label: 'Flex Direction'
    },
    flexDirection: {
      id: 'flexDirection',
      label: 'Flex Direction'
    },
    flexFlow: {
      id: 'flexFlow',
      label: 'Flex Flow'
    },
    flexGrow: {
      id: 'flexGrow',
      label: 'Flex Grow'
    },
    flexShrink: {
      id: 'flexShrink',
      label: 'Flex Shrink'
    },
    flexWrap: {
      id: 'flexWrap',
      label: 'Flex Wrap'
    },
    float: {
      id: 'float',
      label: 'Float'
    },
    filter: {
      id: 'filter',
      label: 'Filter',
      isPro: true
    },
    fontSize: {
      id: 'fontSize',
      label: 'Font Size'
    },
    fontFamily: {
      id: 'fontFamily',
      label: 'Font Family'
    },
    fontStretch: {
      id: 'fontStretch',
      label: 'Font Stretch',
      isPro: true
    },
    fontStyle: {
      id: 'fontStyle',
      label: 'Font Style'
    },
    fontVariantCaps: {
      id: 'fontVariantCaps',
      label: 'Font VariantCaps',
      isPro: true
    },
    fontWeight: {
      id: 'fontWeight',
      label: 'Font Weight'
    },
    gridColumnEnd: {
      id: 'gridColumnEnd',
      label: 'Grid Column End'
    },
    gridColumnStart: {
      id: 'gridColumnStart',
      label: 'Grid Column Start'
    },
    gridRowEnd: {
      id: 'gridRowEnd',
      label: 'Grid Row End'
    },
    gridRowStart: {
      id: 'gridRowStart',
      label: 'Grid Row Start'
    },
    gridTemplateColumns: {
      id: 'gridTemplateColumns',
      label: 'Grid Template Columns'
    },
    gridTemplateRows: {
      id: 'gridTemplateRows',
      label: 'Grid Template Rows'
    },
    height: {
      id: 'height',
      label: 'Height'
    },
    left: {
      id: 'left',
      label: 'Left'
    },
    letterSpacing: {
      id: 'letterSpacing',
      label: 'Letter Spacing',
      isPro: true
    },
    lineHeight: {
      id: 'lineHeight',
      label: 'Line Height'
    },
    listStyle: {
      id: 'listStyle',
      label: 'List Style'
    },
    margin: {
      id: 'margin',
      label: 'Margin'
    },
    marginTop: {
      id: 'marginTop',
      label: 'Margin Top'
    },
    marginRight: {
      id: 'marginRight',
      label: 'Margin Right'
    },
    marginBottom: {
      id: 'marginBottom',
      label: 'Margin Bottom'
    },
    marginLeft: {
      id: 'marginLeft',
      label: 'Margin Left'
    },
    maxHeight: {
      id: 'maxHeight',
      label: 'Max Height'
    },
    maxWidth: {
      id: 'maxWidth',
      label: 'Max Width'
    },
    minHeight: {
      id: 'minHeight',
      label: 'Min Height'
    },
    minWidth: {
      id: 'minWidth',
      label: 'Min Width'
    },
    justifyContent: {
      id: 'justifyContent',
      label: 'Justify Content'
    },
    opacity: {
      id: 'opacity',
      label: 'Opacity'
    },
    objectFit: {
      id: 'objectFit',
      label: 'Object Fit'
    },
    outline: {
      id: 'outline',
      label: 'Outline',
      isPro: true
    },
    overflow: {
      id: 'overflow',
      label: 'Overflow'
    },
    overflowX: {
      id: 'overflowX',
      label: 'OverflowX',
      isPro: true
    },
    overflowY: {
      id: 'overflowY',
      label: 'OverflowY',
      isPro: true
    },
    order: {
      id: 'order',
      label: 'Order'
    },
    padding: {
      id: 'padding',
      label: 'Padding'
    },
    paddingTop: {
      id: 'paddingTop',
      label: 'Padding Top'
    },
    paddingRight: {
      id: 'paddingRight',
      label: 'Padding Right'
    },
    paddingBottom: {
      id: 'paddingBottom',
      label: 'Padding Bottom'
    },
    paddingLeft: {
      id: 'paddingLeft',
      label: 'Padding Left'
    },
    perspective: {
      id: 'perspective',
      label: 'Perspective',
      isPro: true
    },
    position: {
      id: 'position',
      label: 'Position'
    },
    right: {
      id: 'right',
      label: 'Right'
    },
    gap: {
      id: 'gap',
      label: 'Gap'
    },
    columnGap: {
      id: 'columnGap',
      label: 'Column gap'
    },
    rowGap: {
      id: 'rowGap',
      label: 'Row Gap'
    },
    textAlign: {
      id: 'textAlign',
      label: 'Text Align'
    },
    top: {
      id: 'top',
      label: 'Top'
    },
    transform: {
      id: 'transform',
      label: 'Transform',
      isPro: true
    },
    transition: {
      id: 'transition',
      label: 'Transition',
      isPro: true
    },
    verticalAlign: {
      id: 'verticalAlign',
      label: 'Vertical Align'
    },
    visibility: {
      id: 'visibility',
      label: 'Visibility'
    },
    width: {
      id: 'width',
      label: 'Width'
    },
    zIndex: {
      id: 'zIndex',
      label: 'Z-Index'
    },
    textDecoration: {
      id: 'textDecoration',
      label: 'Text Decoration',
      isPro: true
    },
    textIndent: {
      id: 'textIndent',
      label: 'Text Indent',
      isPro: true
    },
    textJustify: {
      id: 'textJustify',
      label: 'Text Justify',
      isPro: true
    },
    textOverflow: {
      id: 'textOverflow',
      label: 'Text Overflow'
    },
    textShadow: {
      id: 'textShadow',
      label: 'Text Shadow',
      isPro: true
    },
    textTransform: {
      id: 'textTransform',
      label: 'Text Transform',
      isPro: true
    },
    wordBreak: {
      id: 'wordBreak',
      label: 'Word Break',
      isPro: true
    },
    wordSpacing: {
      id: 'wordSpacing',
      label: 'Word Spacing',
      isPro: true
    },
    wordWrap: {
      id: 'wordWrap',
      label: 'Word Wrap',
      isPro: true
    },
    writingMode: {
      id: 'writingMode',
      label: 'Writing Mode',
      isPro: true
    }
  };
  let cssProps = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('cssProps', cssPropsBasic);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {}, [props.obj]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    if (props.obj[sudoScource] == undefined) {
      props.obj[sudoScource] = {};
    }
  }, [sudoScource]);

  function sudoScourceUpdate(args) {
    setSudoScources(args);
  }

  var RemoveQueryPram = function (_ref) {
    let {
      title,
      sudoScource,
      keyX
    } = _ref;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
      onClick: ev => {
        props.onRemove(sudoScource, keyX);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_121__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_122__["default"]
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "mx-2"
    }, title));
  };

  function setCssAttr(option, index) {
    //console.log(breakPointX);
    if (props.obj[sudoScource][option.id] == undefined) {
      props.obj[sudoScource][option.id] = {};
    }

    props.onAdd(sudoScource, option.id);
  }

  function onChangeCssVal(newVal, attr) {
    props.onChange(sudoScource, newVal, attr);
  }

  var breakPointList = [];

  for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_119__["default"]) {
    var item = _breakpoints__WEBPACK_IMPORTED_MODULE_119__["default"][x];
    breakPointList.push({
      label: item.name,
      icon: item.icon,
      value: item.id
    });
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
    className: "bg-gray-200 p-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown_sudo_selector__WEBPACK_IMPORTED_MODULE_6__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: sudoScources,
    sudoScourceUpdate: sudoScourceUpdate,
    buttonTitle: sudoScources[sudoScource] != undefined ? sudoScources[sudoScource].label : 'Choose',
    onChange: (option, index) => {
      setSudoScource(option.value);
    },
    values: ""
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_121__["default"], {
    icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_123__["default"]
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: cssProps,
    buttonTitle: "Add Style",
    onChange: setCssAttr,
    values: ""
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "relative"
  }, props.onBulkAdd && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: extraOpt ? 'bg-gray-400 hover:bg-gray-400 cursor-pointer p-2 ' : 'cursor-pointer p-2 ',
    onClick: ev => {
      setextraOpt(!extraOpt);
    }
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
    "aria-hidden": "true",
    focusable: "false",
    role: "img",
    class: "octicon octicon-ellipsis",
    viewBox: "0 0 16 16",
    width: "16",
    height: "16",
    fill: "currentColor"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
    d: "M0 5.75C0 4.784.784 4 1.75 4h12.5c.966 0 1.75.784 1.75 1.75v4.5A1.75 1.75 0 0 1 14.25 12H1.75A1.75 1.75 0 0 1 0 10.25ZM12 7a1 1 0 1 0 0 2 1 1 0 0 0 0-2ZM7 8a1 1 0 1 0 2 0 1 1 0 0 0-2 0ZM4 7a1 1 0 1 0 0 2 1 1 0 0 0 0-2Z"
  }))), extraOpt && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
    position: "bottom left"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "p-3 w-80"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: ""
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "px-4 inline-block m-2 py-2 bg-sky-600 text-white cursor-pointer",
    onClick: ev => {
      var styleStr = JSON.stringify(props.obj[sudoScource]); //var asdsdsd = wp.data.dispatch('postgrid-shop').setStylesClipboard(styleStr)

      if (props.onReset) {
        props.onReset(sudoScources);
      } // asdsdsd.then((res) => {
      // });


      setResetArgs({ ...resetArgs,
        isReset: true
      });
      setTimeout(() => {
        setResetArgs({ ...resetArgs,
          isReset: false
        });
      }, 2000);
    }
  }, resetArgs.isReset && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, "Reset Done!"), !resetArgs.isReset && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, " Reset Styles!")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "px-4 inline-block m-2 py-2 bg-sky-600 text-white cursor-pointer",
    onClick: ev => {
      var styleStr = JSON.stringify(props.obj[sudoScource]);
      var asdsdsd = wp.data.dispatch('postgrid-shop').setStylesClipboard(styleStr);
      asdsdsd.then(res => {});
      setCopyArgs({ ...copyArgs,
        isCopied: true
      });
      setTimeout(() => {
        setCopyArgs({ ...copyArgs,
          isCopied: false
        });
      }, 2000);
    }
  }, copyArgs.isCopied && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, "Copied!"), !copyArgs.isCopied && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, " Copy Styles!")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "px-4 inline-block m-2 py-2 bg-sky-600  text-white cursor-pointer",
    onClick: ev => {
      var stylesClipboard = myStore.getStylesClipboard();
      console.log(stylesClipboard);

      if (stylesClipboard == null) {
        setCopyArgs({ ...copyArgs,
          pasteError: true,
          errorMessage: 'Paste is empty'
        });
        setTimeout(() => {
          setCopyArgs({ ...copyArgs,
            pasteError: false,
            errorMessage: ''
          });
        }, 2000);
        return;
      }

      var styleObj = JSON.parse(stylesClipboard); //props.obj[sudoScource] = styleObj;

      console.log(props.onBulkAdd);

      if (props.onBulkAdd) {
        props.onBulkAdd(sudoScource, styleObj);
      } // Object.entries(styleObj).map(args => {
      //   var attr = args[0];
      //   var values = args[1];
      //   console.log(values);
      //   var newVal = (values[sudoScource] == undefined) ? '' : values[sudoScource];
      //   console.log(newVal);
      //   props.onChange(sudoScource, newVal, attr);
      // })


      setCopyArgs({ ...copyArgs,
        isPasted: true
      });
      setTimeout(() => {
        setCopyArgs({ ...copyArgs,
          isPasted: false
        });
      }, 2000);
    }
  }, copyArgs.isPasted && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, "Paste Done"), !copyArgs.isPasted && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, "Paste Copied Styles"))), copyArgs.pasteError && copyArgs.errorMessage && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "text-red-800 my-3"
  }, copyArgs.errorMessage)))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "inline-block"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_120__["default"], {
    position: "bottom",
    variant: "secondary",
    iconList: breakPointList,
    buttonTitle: "Break Point Switch",
    onChange: (x, index) => {
      console.log(x);
      var asdsdsd = wp.data.dispatch('postgrid-shop').setBreakPoint(x.value);
      asdsdsd.then(res => {//setBreakPointX(res.breakpoint);
      });
    },
    activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_119__["default"][breakPointX].icon,
    value: breakPointX
  })))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-5"
  }, //Object.entries(cssAtts).map(([key, value]) => (
  props.obj[sudoScource] != undefined && Object.entries(props.obj[sudoScource]).reverse().map(_ref2 => {
    let [key, value] = _ref2;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, value[breakPointX] != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
      title: (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(RemoveQueryPram, {
        title: cssProps[key] != undefined ? cssProps[key].label : key,
        sudoScource: sudoScource,
        keyX: key
      }),
      initialOpen: false,
      key: key
    }, key == 'alignContent' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_align_content__WEBPACK_IMPORTED_MODULE_7__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'alignItems' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_align_items__WEBPACK_IMPORTED_MODULE_8__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'alignSelf' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_align_self__WEBPACK_IMPORTED_MODULE_9__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'aspectRatio' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_aspect_ratio__WEBPACK_IMPORTED_MODULE_10__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backfaceVisibility' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_backface_visibility__WEBPACK_IMPORTED_MODULE_11__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backgroundAttachment' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_attachment__WEBPACK_IMPORTED_MODULE_12__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backgroundBlendMode' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_blend_mode__WEBPACK_IMPORTED_MODULE_13__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backgroundImage' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_image__WEBPACK_IMPORTED_MODULE_17__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backgroundClip' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_clip__WEBPACK_IMPORTED_MODULE_14__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'bgColor' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_color__WEBPACK_IMPORTED_MODULE_15__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backgroundColor' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_color__WEBPACK_IMPORTED_MODULE_15__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backgroundOrigin' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_origin__WEBPACK_IMPORTED_MODULE_18__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backgroundRepeat' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_repeat__WEBPACK_IMPORTED_MODULE_20__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backgroundSize' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_size__WEBPACK_IMPORTED_MODULE_21__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backgroundPosition' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_background_position__WEBPACK_IMPORTED_MODULE_19__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'boxShadow' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_box_shadow__WEBPACK_IMPORTED_MODULE_33__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'border' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_border__WEBPACK_IMPORTED_MODULE_22__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'borderTop' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_border_top__WEBPACK_IMPORTED_MODULE_23__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'borderRight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_border_right__WEBPACK_IMPORTED_MODULE_24__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'borderBottom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_border_bottom__WEBPACK_IMPORTED_MODULE_25__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'borderLeft' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_border_left__WEBPACK_IMPORTED_MODULE_26__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'borderRadius' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_border_radius__WEBPACK_IMPORTED_MODULE_27__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'borderCollapse' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_border_collapse__WEBPACK_IMPORTED_MODULE_30__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'borderSpacing' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_border_spacing__WEBPACK_IMPORTED_MODULE_31__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'borderImage' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_border_image__WEBPACK_IMPORTED_MODULE_28__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'backdropFilter' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_backdrop_filter__WEBPACK_IMPORTED_MODULE_32__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'bottom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_bottom__WEBPACK_IMPORTED_MODULE_29__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'cursor' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_cursor__WEBPACK_IMPORTED_MODULE_37__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'content' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_content__WEBPACK_IMPORTED_MODULE_38__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'columnCount' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_column_count__WEBPACK_IMPORTED_MODULE_39__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'columnRule' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_column_rule__WEBPACK_IMPORTED_MODULE_40__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'clip' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_clip__WEBPACK_IMPORTED_MODULE_41__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'top' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_top__WEBPACK_IMPORTED_MODULE_105__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'left' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_left__WEBPACK_IMPORTED_MODULE_66__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'right' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_right__WEBPACK_IMPORTED_MODULE_94__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'boxSizing' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_box_sizing__WEBPACK_IMPORTED_MODULE_34__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'clear' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_clear__WEBPACK_IMPORTED_MODULE_35__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'direction' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_direction__WEBPACK_IMPORTED_MODULE_43__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'color' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_color__WEBPACK_IMPORTED_MODULE_36__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'filter' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_filter__WEBPACK_IMPORTED_MODULE_44__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'float' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_float__WEBPACK_IMPORTED_MODULE_45__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'fontFamily' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_font_family__WEBPACK_IMPORTED_MODULE_46__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'fontSize' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_font_size__WEBPACK_IMPORTED_MODULE_47__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'fontStyle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_font_style__WEBPACK_IMPORTED_MODULE_49__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'fontStretch' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_font_stretch__WEBPACK_IMPORTED_MODULE_48__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'fontWeight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_font_weight__WEBPACK_IMPORTED_MODULE_50__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'fontVariantCaps' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_font_variant_caps__WEBPACK_IMPORTED_MODULE_51__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'flexWrap' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_flex_wrap__WEBPACK_IMPORTED_MODULE_52__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'flexDirection' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_flex_direction__WEBPACK_IMPORTED_MODULE_53__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'flexShrink' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_flex_shrink__WEBPACK_IMPORTED_MODULE_54__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'flexBasis' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_flex_basis__WEBPACK_IMPORTED_MODULE_55__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'flexFlow' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_flex_flow__WEBPACK_IMPORTED_MODULE_57__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'flexGrow' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_flex_grow__WEBPACK_IMPORTED_MODULE_56__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'gridColumnEnd' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_grid_column_end__WEBPACK_IMPORTED_MODULE_58__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'gridColumnStart' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_grid_column_start__WEBPACK_IMPORTED_MODULE_59__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'gridRowEnd' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_grid_row_end__WEBPACK_IMPORTED_MODULE_60__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'gridRowStart' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_grid_row_start__WEBPACK_IMPORTED_MODULE_61__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'gridTemplateColumns' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_grid_template_columns__WEBPACK_IMPORTED_MODULE_62__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'gridTemplateRows' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_grid_template_rows__WEBPACK_IMPORTED_MODULE_63__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'letterSpacing' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_letter_spacing__WEBPACK_IMPORTED_MODULE_67__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'lineHeight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_line_height__WEBPACK_IMPORTED_MODULE_68__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'listStyle' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_list_style__WEBPACK_IMPORTED_MODULE_69__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'justifyContent' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_justify_content__WEBPACK_IMPORTED_MODULE_65__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'objectFit' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_object_fit__WEBPACK_IMPORTED_MODULE_80__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'opacity' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_opacity__WEBPACK_IMPORTED_MODULE_81__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'outline' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_outline__WEBPACK_IMPORTED_MODULE_82__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'outlineOffset' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_outline_offset__WEBPACK_IMPORTED_MODULE_83__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'position' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_position__WEBPACK_IMPORTED_MODULE_93__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'tableLayout' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_table_layout__WEBPACK_IMPORTED_MODULE_107__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'gap' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_gap__WEBPACK_IMPORTED_MODULE_95__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'columnGap' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_column_gap__WEBPACK_IMPORTED_MODULE_96__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'rowGap' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_row_gap__WEBPACK_IMPORTED_MODULE_97__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'transition' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_transition__WEBPACK_IMPORTED_MODULE_109__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'transform' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_transform__WEBPACK_IMPORTED_MODULE_108__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'textIndent' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_text_indent__WEBPACK_IMPORTED_MODULE_100__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'textJustify' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_text_justify__WEBPACK_IMPORTED_MODULE_101__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'textOverflow' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_text_overflow__WEBPACK_IMPORTED_MODULE_102__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'textTransform' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_text_transform__WEBPACK_IMPORTED_MODULE_104__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'textDecoration' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_text_decoration__WEBPACK_IMPORTED_MODULE_99__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'textShadow' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_text_shadow__WEBPACK_IMPORTED_MODULE_103__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'textAlign' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_text_align__WEBPACK_IMPORTED_MODULE_98__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'textAlignLast' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_text_align_last__WEBPACK_IMPORTED_MODULE_106__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'visibility' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_visibility__WEBPACK_IMPORTED_MODULE_111__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'wordBreak' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_word_break__WEBPACK_IMPORTED_MODULE_114__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'wordSpacing' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_word_spacing__WEBPACK_IMPORTED_MODULE_115__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'zIndex' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_z_index__WEBPACK_IMPORTED_MODULE_118__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'padding' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_padding__WEBPACK_IMPORTED_MODULE_88__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'paddingTop' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_padding_top__WEBPACK_IMPORTED_MODULE_89__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'paddingRight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_padding_right__WEBPACK_IMPORTED_MODULE_90__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'paddingBottom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_padding_bottom__WEBPACK_IMPORTED_MODULE_91__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'paddingLeft' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_padding_left__WEBPACK_IMPORTED_MODULE_92__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'marginTop' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_margin_top__WEBPACK_IMPORTED_MODULE_71__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'marginRight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_margin_right__WEBPACK_IMPORTED_MODULE_72__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'marginBottom' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_margin_bottom__WEBPACK_IMPORTED_MODULE_73__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'marginLeft' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_margin_left__WEBPACK_IMPORTED_MODULE_74__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'margin' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_margin__WEBPACK_IMPORTED_MODULE_70__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'maxHeight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_max_height__WEBPACK_IMPORTED_MODULE_75__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'maxWidth' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_max_width__WEBPACK_IMPORTED_MODULE_76__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'minHeight' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_min_height__WEBPACK_IMPORTED_MODULE_77__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'minWidth' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_min_width__WEBPACK_IMPORTED_MODULE_78__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'display' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_display__WEBPACK_IMPORTED_MODULE_42__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'width' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_width__WEBPACK_IMPORTED_MODULE_112__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'height' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_height__WEBPACK_IMPORTED_MODULE_64__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'verticalAlign' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_vertical_align__WEBPACK_IMPORTED_MODULE_110__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'overflow' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_overflow__WEBPACK_IMPORTED_MODULE_85__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'order' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_order__WEBPACK_IMPORTED_MODULE_84__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'overflowX' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_overflow_x__WEBPACK_IMPORTED_MODULE_86__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'overflowY' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_overflow_y__WEBPACK_IMPORTED_MODULE_87__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'writingMode' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_writing_mode__WEBPACK_IMPORTED_MODULE_116__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'wordWrap' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_word_wrap__WEBPACK_IMPORTED_MODULE_117__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'perspective' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_perspective__WEBPACK_IMPORTED_MODULE_79__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    }), key == 'whiteSpace' && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_css_white_space__WEBPACK_IMPORTED_MODULE_113__["default"], {
      val: value[breakPointX],
      onChange: onChangeCssVal
    })));
  })));
}

class PGStyles extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  componentDidMount(props) {}

  render() {
    var {
      blockId,
      obj,
      onChange,
      onAdd,
      onRemove,
      onBulkAdd,
      onReset
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, onBulkAdd == null && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      blockId: blockId,
      obj: obj,
      onAdd: onAdd,
      onRemove: onRemove,
      onChange: onChange,
      warn: this.state.showWarning,
      onReset: onReset
    }), onBulkAdd != null && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      blockId: blockId,
      obj: obj,
      onAdd: onAdd,
      onRemove: onRemove,
      onChange: onChange,
      onBulkAdd: onBulkAdd,
      onReset: onReset,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGStyles);

/***/ }),

/***/ "./src/components/tab/index.js":
/*!*************************************!*\
  !*** ./src/components/tab/index.js ***!
  \*************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML,
  useState
} = wp.element;



class PGtab extends Component {
  render() {
    const {
      children
    } = this.props;

    function MyFunction() {
      //const [selected, setSelected] = useState(activeTab);
      // useEffect(() => {
      // }, [keyword]);
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "tabContent py-3"
      }, children);
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(MyFunction, null));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGtab);

/***/ }),

/***/ "./src/components/tabs/index.js":
/*!**************************************!*\
  !*** ./src/components/tabs/index.js ***!
  \**************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");

const {
  Component,
  RawHTML,
  useState
} = wp.element;



function MyFunction(props) {
  if (!props.warn) {
    return null;
  }

  const [selected, setSelected] = useState(props.activeTab);
  var content; // useEffect(() => {
  // }, [keyword]);

  props.children.map(child => {
    if (selected == child.props.name) {
      content = child.props.children;
    }
  });
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "tabsWrapper"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex  overflow-x-auto \t"
  }, props.tabs.map(tab => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: tab.name == selected ? 'flex flex-none bg-gray-400  grow border-right border-solid border-gray-600 p-2 cursor-pointer' : 'flex flex-none grow bg-gray-200  border-right border-solid border-gray-600 p-2 cursor-pointer',
      onClick: ev => {
        props.onSelect(tab);
        setSelected(tab.name);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"], {
      fill: "#404040",
      icon: tab.icon,
      className: "mr-2 w-[20px] text-green-500"
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "font-medium"
    }, tab.title));
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "tabContent py-3"
  }, content));
}

class PGtabs extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    const {
      activeTab,
      orientation,
      activeClass,
      onSelect,
      tabs,
      children
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(MyFunction, {
      children: children,
      tabs: tabs,
      onSelect: onSelect,
      activeTab: activeTab,
      warn: this.state.showWarning
    }));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGtabs);

/***/ }),

/***/ "./src/components/templates/index.js":
/*!*******************************************!*\
  !*** ./src/components/templates/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/arrow-right.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/download.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_input_text__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _components_request_a_template__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/request-a-template */ "./src/components/request-a-template/index.js");
/* harmony import */ var masonry_layout__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! masonry-layout */ "./node_modules/masonry-layout/masonry.js");
/* harmony import */ var masonry_layout__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(masonry_layout__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var imagesLoaded__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! imagesLoaded */ "./node_modules/imagesLoaded/imagesloaded.js");
/* harmony import */ var imagesLoaded__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(imagesLoaded__WEBPACK_IMPORTED_MODULE_8__);

const {
  Component
} = wp.element;











function Html(props) {
  if (!props.warn) {
    return null;
  }

  const [searchPrams, setsearchPrams] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    keyword: "",
    categories: [],
    page: 1,
    myTemplates: false
  });
  var [templateLibrary, settemplateLibrary] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)({
    items: []
  });
  var [templateLibraryCats, settemplateLibraryCats] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]);
  var [templateType, settemplateType] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('section'); // section, fullpage, bundle, archive

  var [debounce, setDebounce] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // Using the hook.

  var [isLoading, setIsLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
  var [customTemplate, setcustomTemplate] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
  var templateTypes = {
    section: {
      label: 'Sections',
      value: 'section'
    },
    fullpage: {
      label: 'Full pages',
      value: 'fullpage'
    },
    bundle: {
      label: 'Bundles',
      value: 'bundle'
    }
  };
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    fetchCss();
  }, [searchPrams]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    settemplateLibrary({
      items: []
    });
    fetchCss();
  }, [templateType]);

  function loadMasonry() {
    var elem = document.querySelector('#itemsWrap');

    if (elem != null) {
      imagesLoaded__WEBPACK_IMPORTED_MODULE_8___default()(elem, function () {
        var msnry = new (masonry_layout__WEBPACK_IMPORTED_MODULE_7___default())(elem, {
          // options
          itemSelector: '.item',
          gutter: 15,
          horizontalOrder: true,
          percentPosition: true,
          fitWidth: true
        });
      });
    }
  }

  function fetchCss() {
    setIsLoading(true);
    var postData = {
      keyword: searchPrams.keyword,
      page: searchPrams.page,
      categories: searchPrams.categories
    };
    postData = JSON.stringify(postData);

    if (templateType == 'section') {
      fetch("https://getpostgrid.com/wp-json/post-grid/v2/get_post_section", {
        method: "POST",
        headers: {
          "Content-Type": "application/json;charset=utf-8"
        },
        body: postData
      }).then(response => {
        if (response.ok && response.status < 400) {
          response.json().then(res => {
            var items = templateLibrary.items;

            if (res.posts.length > 0) {
              res.posts.map(x => {
                return items.push(x);
              });
              settemplateLibrary({
                items: items
              });
            }

            var cats = res.terms.map(x => {
              return {
                label: x.count == undefined ? x.label : x.label + ' (' + x.count + ')',
                value: x.value
              };
            });
            settemplateLibraryCats(cats);
            setIsLoading(false);
            setTimeout(() => {
              loadMasonry();
            }, 500);
          });
        }
      }).catch(_error => {//this.saveAsStatus = 'error';
        // handle the error
      });
    }

    if (templateType == 'fullpage') {
      fetch("https://getpostgrid.com/wp-json/post-grid/v2/get_post_fullpage", {
        method: "POST",
        headers: {
          "Content-Type": "application/json;charset=utf-8"
        },
        body: postData
      }).then(response => {
        if (response.ok && response.status < 400) {
          response.json().then(res => {
            var items = templateLibrary.items;

            if (res.posts.length > 0) {
              res.posts.map(x => {
                return items.push(x);
              });
              settemplateLibrary({
                items: items
              });
            }

            var cats = res.terms.map(x => {
              return {
                label: x.count == undefined ? x.label : x.label + ' (' + x.count + ')',
                value: x.value
              };
            });
            settemplateLibraryCats(cats);
            setIsLoading(false);
            setTimeout(() => {
              loadMasonry();
            }, 500);
          });
        }
      }).catch(_error => {//this.saveAsStatus = 'error';
        // handle the error
      });
    }
  }

  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    id: "pgTemplates-items",
    class: "pgTemplates-items pl-[160px] pr-[320px] mt-[70px] fixed z-[999] top-6 left-0 w-full h-full overflow-y-scroll pb-[200px]"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "bg-gray-400 "
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex justify-between items-center p-3 bg-white "
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex  items-center "
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "px-4"
  }, isLoading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "text-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Spinner, null), " ", templateType), !isLoading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "text-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: templateTypes,
    buttonTitle: templateTypes[templateType] == undefined ? "Categories" : templateTypes[templateType].label,
    onChange: (option, index) => {
      settemplateType(option.value);
    },
    values: []
  }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"], {
    icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__["default"]
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.__experimentalInputControl, {
    className: "w-60 !px-3 !py-2 !rounded-none !text-lg",
    type: "text",
    placeholder: "Search...",
    value: searchPrams.keyword,
    onChange: newVal => {
      clearTimeout(debounce);
      debounce = setTimeout(() => {
        //var newVal = ev.target.value;
        settemplateLibrary({
          items: []
        });
        setsearchPrams({ ...searchPrams,
          keyword: newVal
        });
      }, 1000);
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "px-2"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
    position: "bottom right",
    variant: "secondary",
    options: templateLibraryCats,
    buttonTitle: "Categories",
    onChange: (option, index) => {
      if (searchPrams.categories.includes(option.value)) {
        var categoriesX = searchPrams.categories.splice(option.value, 1);
      } else {
        var categoriesX = searchPrams.categories.concat(option.value);
      }

      setsearchPrams({ ...searchPrams,
        categories: categoriesX
      });
      settemplateLibrary({
        items: []
      });
    },
    values: []
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "px-4 flex items-center"
  }, searchPrams.categories.length > 0 && searchPrams.categories.map((x, index) => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex items-center mx-1 text-sm  bg-slate-500 text-white"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "cursor-pointer p-1 bg-red-500 inline-block",
      onClick: () => {
        settemplateLibrary({
          items: []
        });
        var categoriesX = searchPrams.categories.splice(index, 1);
        setsearchPrams({ ...searchPrams,
          categories: searchPrams.categories
        });
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_11__["default"]
    })), " ", (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "px-2 inline-block"
    }, templateLibraryCats[templateLibraryCats.findIndex(p => p.value == x)].label));
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.ToggleControl, {
    className: "!mb-0 hidden",
    label: searchPrams.myTemplates ? 'Loaded Your Teplates?' : 'My Teplates?',
    checked: searchPrams.myTemplates ? true : false,
    onChange: e => {
      setsearchPrams({ ...searchPrams,
        myTemplates: !searchPrams.myTemplates
      });
    }
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "flex"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "bg-blue-600 flex items-center cursor-pointer hover:bg-blue-500 text-lg text-white px-4 py-1 rounded-sm hover:text-white",
    onClick: () => {
      setcustomTemplate(!customTemplate);
      setTimeout(() => {
        loadMasonry();
      }, 500);
    }
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    class: "dashicons dashicons-slides mr-2"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, "Request a Template")), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "px-4"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "cursor-pointer rounded-sm p-1 bg-red-500 hover:bg-red-600 inline-block",
    onClick: () => {
      props.setEnable(false);
    }
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"], {
    icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_11__["default"],
    className: "fill-white"
  }))))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "p-5 "
  }, customTemplate && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_request_a_template__WEBPACK_IMPORTED_MODULE_6__["default"], null), !customTemplate && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    id: "itemsWrap",
    className: "m-auto"
  }, templateLibrary.items.map(x => {
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-white inline-block relative pb-16 item mb-3 w-[24%]"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("img", {
      className: "!shadow-none p-3",
      src: x.thumb_url,
      alt: ""
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex items-center absolute bottom-0 left-0 w-full p-2 bg-slate-600 bg-opacity-80"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "bg-lime-500 text-white p-1 px-3 cursor-pointer rounded-sm flex items-center hover:bg-lime-600",
      onClick: ev => {
        var content = x.post_content;
        var wp_editor = wp.data.dispatch("core/editor");
        var wp_insertBlocks = wp_editor.insertBlocks;
        wp_insertBlocks(wp.blocks.parse(content));
        props.setEnable(false);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      className: "inline-block"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"], {
      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_12__["default"],
      className: "fill-white\t"
    }))), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
      className: "inline-block mx-2 text-white text-lg",
      target: "_blank",
      href: x.url
    }, x.post_title)));
  })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "my-5 p-5  text-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    className: "inline-block bg-lime-500 p-3 px-5 cursor-pointer hover:bg-lime-600 text-white font-bold",
    onClick: ev => {
      var pageX = parseInt(searchPrams.page) + 1;
      setsearchPrams({ ...searchPrams,
        page: pageX
      });
    }
  }, isLoading && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "text-center"
  }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Spinner, null)), "Load More"))))));
}

class PGTemplates extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }

  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }

  render() {
    var {
      onChange,
      setEnable
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, {
      setEnable: setEnable,
      warn: this.state.showWarning
    });
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGTemplates);

/***/ }),

/***/ "./src/components/toggle/index.js":
/*!****************************************!*\
  !*** ./src/components/toggle/index.js ***!
  \****************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/chevron-down.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/chevron-up.js");

const {
  Component,
  RawHTML,
  useState
} = wp.element;



class PGtoggle extends Component {
  render() {
    const {
      title,
      initialOpen,
      befroeTitle,
      children
    } = this.props;

    function MyFunction() {
      const [isOpen, setIsOpen] = useState(initialOpen);
      var icon = ''; // useEffect(() => {
      // }, [keyword]);

      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "toggleWrapper"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "toggleHeader border-b border-solid hover:bg-gray-200 px-2 py-3 flex justify-between"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "flex"
      }, befroeTitle, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
        className: "cursor-pointer px-2",
        onClick: ev => {
          setIsOpen(!isOpen);
        }
      }, title)), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, isOpen ? (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"]
      }) : (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"]
      }))), isOpen && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "toggleContent py-3"
      }, children));
    }

    var args = [{
      "label": "Select..",
      "value": ""
    }, {
      "label": "None",
      "value": "none"
    }, {
      "label": "Inline",
      "value": "inline"
    }, {
      "label": "Inline Block",
      "value": "inline-block"
    }];
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(MyFunction, null));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGtoggle);

/***/ }),

/***/ "./src/components/tutorials/index.js":
/*!*******************************************!*\
  !*** ./src/components/tutorials/index.js ***!
  \*******************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;





class PGTutorials extends Component {
  render() {
    var {
      links
    } = this.props;

    function Html(props) {
      const [filteredLinks, setfilteredLinks] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)([]);
      const [keyword, setKeyword] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)('');
      return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "my-2"
      }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
        type: "text",
        className: "w-full rounded-none px-3 py-2",
        placeholder: "Search Tutorials",
        value: keyword,
        onChange: newVal => {
          setKeyword(newVal);
          setfilteredLinks([]);
          var newLinks = [];
          var xLink = links.map((x, index) => {
            var linkObj = {};
            let position = x.label.toLowerCase().search(newVal.toLowerCase());

            if (position < 0) {
              linkObj.exclude = true;
            } else {
              linkObj.exclude = false;
            }

            if (newVal.length > 0) {
              let label = x.label.replace(newVal, "<span class='bg-amber-500'>" + newVal + "</span>");
              linkObj.label = label;
            } else {
              linkObj.label = x.label;
            }

            linkObj = { ...x,
              exclude: linkObj.exclude,
              label: linkObj.label
            };
            return linkObj; //newLinks.push(x);
          });
          setfilteredLinks(xLink);
        }
      })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
        className: "my-5"
      }, keyword.length == 0 && links.map(link => {
        return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, link.url.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
          className: "block my-1 text-[14px] hover:underline",
          href: link.url,
          target: "_blank"
        }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
          class: "dashicons dashicons-editor-help"
        }), " ", link.label));
      }), keyword.length > 0 && filteredLinks.map(link => {
        if (link.exclude === false) {
          return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, link.url.length > 0 && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("a", {
            className: "block my-1 text-[14px] hover:underline",
            href: link.url,
            target: "_blank"
          }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
            class: "dashicons dashicons-editor-help"
          }), " ", link.label));
        }
      })));
    }

    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(Html, null));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGTutorials);

/***/ }),

/***/ "./src/components/typography/index.js":
/*!********************************************!*\
  !*** ./src/components/typography/index.js ***!
  \********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__);

const {
  Component,
  RawHTML
} = wp.element;



class Typography extends Component {
  render() {
    var {
      typo,
      breakPointX,
      onChange,
      setAttributes,
      obj
    } = this.props;
    return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", null, typo.fontFamily != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Font Family"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: typo.fontFamily[breakPointX] != undefined ? typo.fontFamily[breakPointX] : '',
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(obj.styles.fontFamily).length == 0) {
          newValuesObj[breakPointX] = newVal;
        } else {
          newValuesObj = obj.styles.fontFamily;
          newValuesObj[breakPointX] = newVal;
        }

        var typoX = { ...obj.styles,
          fontFamily: newValuesObj
        };
        onChange(typoX);
      }
    }))), typo.fontSize != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Font Size"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      type: "number",
      value: typo.fontSize[breakPointX] != undefined ? typo.fontSize[breakPointX].val : '',
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(obj.styles.fontSize).length == 0) {
          newValuesObj[breakPointX] = { ...obj.styles.fontSize[breakPointX],
            val: newVal
          };
        } else {
          newValuesObj = obj.styles.fontSize;
          newValuesObj[breakPointX] = { ...obj.styles.fontSize[breakPointX],
            val: newVal
          };
        }

        var typoX = { ...obj.styles,
          fontSize: newValuesObj
        };
        onChange(typoX);
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: typo.fontSize[breakPointX] != undefined ? typo.fontSize[breakPointX].unit : '',
      options: [{
        label: 'Select Unit',
        value: ''
      }, {
        label: 'px',
        value: 'px'
      }, {
        label: '%',
        value: '%'
      }, {
        label: 'em',
        value: 'em'
      }, {
        label: 'ex',
        value: 'ex'
      }, {
        label: 'rem',
        value: 'rem'
      }, {
        label: 'vh',
        value: 'vh'
      }, {
        label: 'vw',
        value: 'vw'
      }, {
        label: 'pt',
        value: 'pt'
      }, {
        label: 'pc',
        value: 'pc'
      }, {
        label: 'ch',
        value: 'ch'
      }],
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(obj.styles.fontSize).length == 0) {
          newValuesObj[breakPointX] = { ...obj.styles.fontSize[breakPointX],
            unit: newVal
          };
        } else {
          newValuesObj = obj.styles.fontSize;
          newValuesObj[breakPointX] = { ...obj.styles.fontSize[breakPointX],
            unit: newVal
          };
        }

        var typoX = { ...obj.styles,
          fontSize: newValuesObj
        };
        onChange(typoX);
      }
    })))), typo.lineHeight != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Line Height"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      type: "number",
      value: typo.lineHeight[breakPointX] != undefined ? typo.lineHeight[breakPointX].val : '',
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(obj.styles.lineHeight).length == 0) {
          newValuesObj[breakPointX] = { ...obj.styles.lineHeight[breakPointX],
            val: newVal
          };
        } else {
          newValuesObj = obj.styles.lineHeight;
          newValuesObj[breakPointX] = { ...obj.styles.lineHeight[breakPointX],
            val: newVal
          };
        }

        var typoX = { ...obj.styles,
          lineHeight: newValuesObj
        };
        onChange(typoX);
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: typo.lineHeight[breakPointX] != undefined ? typo.lineHeight[breakPointX].unit : '',
      options: [{
        label: 'Select Unit',
        value: ''
      }, {
        label: 'px',
        value: 'px'
      }, {
        label: '%',
        value: '%'
      }, {
        label: 'em',
        value: 'em'
      }, {
        label: 'ex',
        value: 'ex'
      }, {
        label: 'rem',
        value: 'rem'
      }, {
        label: 'vh',
        value: 'vh'
      }, {
        label: 'vw',
        value: 'vw'
      }, {
        label: 'pt',
        value: 'pt'
      }, {
        label: 'pc',
        value: 'pc'
      }, {
        label: 'ch',
        value: 'ch'
      }],
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(obj.styles.lineHeight).length == 0) {
          newValuesObj[breakPointX] = { ...obj.styles.lineHeight[breakPointX],
            unit: newVal
          };
        } else {
          newValuesObj = obj.styles.lineHeight;
          newValuesObj[breakPointX] = { ...obj.styles.lineHeight[breakPointX],
            unit: newVal
          };
        }

        var typoX = { ...obj.styles,
          lineHeight: newValuesObj
        };
        onChange(typoX);
      }
    })))), typo.letterSpacing != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Letter Spacing"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      type: "number",
      value: typo.letterSpacing[breakPointX] != undefined ? typo.letterSpacing[breakPointX].val : '',
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(obj.styles.letterSpacing).length == 0) {
          newValuesObj[breakPointX] = { ...obj.styles.letterSpacing[breakPointX],
            val: newVal
          };
        } else {
          newValuesObj = obj.styles.letterSpacing;
          newValuesObj[breakPointX] = { ...obj.styles.letterSpacing[breakPointX],
            val: newVal
          };
        }

        var typoX = { ...obj.styles,
          letterSpacing: newValuesObj
        };
        onChange(typoX);
      }
    }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: typo.letterSpacing[breakPointX] != undefined ? typo.letterSpacing[breakPointX].unit : '',
      options: [{
        label: 'Select Unit',
        value: ''
      }, {
        label: 'px',
        value: 'px'
      }, {
        label: '%',
        value: '%'
      }, {
        label: 'em',
        value: 'em'
      }, {
        label: 'ex',
        value: 'ex'
      }, {
        label: 'rem',
        value: 'rem'
      }, {
        label: 'vh',
        value: 'vh'
      }, {
        label: 'vw',
        value: 'vw'
      }, {
        label: 'pt',
        value: 'pt'
      }, {
        label: 'pc',
        value: 'pc'
      }, {
        label: 'ch',
        value: 'ch'
      }],
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(obj.styles.letterSpacing).length == 0) {
          newValuesObj[breakPointX] = { ...obj.styles.letterSpacing[breakPointX],
            unit: newVal
          };
        } else {
          newValuesObj = obj.styles.letterSpacing;
          newValuesObj[breakPointX] = { ...obj.styles.letterSpacing[breakPointX],
            unit: newVal
          };
        }

        var typoX = { ...obj.styles,
          letterSpacing: newValuesObj
        };
        onChange(typoX);
      }
    })))), typo.fontWeight != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Font Weight"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: typo.fontWeight[breakPointX] != undefined ? typo.fontWeight[breakPointX] : '',
      options: [{
        label: 'Select...',
        value: ''
      }, {
        label: 'bold',
        value: 'bold'
      }, {
        label: 'bolder',
        value: 'bolder'
      }, {
        label: 'lighter',
        value: 'lighter'
      }, {
        label: '100',
        value: '100'
      }, {
        label: '200',
        value: '200'
      }, {
        label: '300',
        value: '300'
      }, {
        label: '400',
        value: '400'
      }, {
        label: '500',
        value: '500'
      }, {
        label: '600',
        value: '600'
      }, {
        label: '700',
        value: '700'
      }, {
        label: '800',
        value: '800'
      }, {
        label: '900',
        value: '900'
      }],
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(obj.styles.fontWeight).length == 0) {
          newValuesObj[breakPointX] = newVal;
        } else {
          newValuesObj = obj.styles.fontWeight;
          newValuesObj[breakPointX] = newVal;
        }

        var typoX = { ...obj.styles,
          fontWeight: newValuesObj
        };
        onChange(typoX);
      }
    }))), typo.textTransform != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Text Transform"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
      label: "",
      value: typo.textTransform[breakPointX] != undefined ? typo.textTransform[breakPointX] : '',
      options: [{
        label: 'Select...',
        value: ''
      }, {
        label: 'Uppercase',
        value: 'uppercase'
      }, {
        label: 'Lowercase',
        value: 'lowercase'
      }, {
        label: 'Capitalize',
        value: 'capitalize'
      }],
      onChange: newVal => {
        var newValuesObj = {};

        if (Object.keys(obj.styles.textTransform).length == 0) {
          newValuesObj[breakPointX] = newVal;
        } else {
          newValuesObj = obj.styles.textTransform;
          newValuesObj[breakPointX] = newVal;
        }

        var typoX = { ...obj.styles,
          textTransform: newValuesObj
        };
        onChange(typoX);
      }
    }))), typo.textDecoration != undefined && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("label", {
      for: ""
    }, "Text Decoration"), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
      className: "flex justify-between"
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
      className: obj.styles.textDecoration[breakPointX] != undefined && obj.styles.textDecoration[breakPointX].indexOf('underline') !== -1 ? '!bg-blue-300 ' : '',
      variant: "secondary",
      onClick: ev => {
        var newVal = 'underline';
        var newValuesObj = {};

        if (Object.keys(obj.styles.textDecoration).length == 0) {
          newValuesObj[breakPointX] = [newVal];
        } else {
          newValuesObj = obj.styles.textDecoration;

          if (newValuesObj[breakPointX].indexOf(newVal) !== -1) {
            var arr = newValuesObj[breakPointX].filter(item => item !== newVal);
            newValuesObj[breakPointX] = arr;
          } else {
            newValuesObj[breakPointX].push(newVal);
          }
        }

        var typoX = { ...obj.styles,
          textDecoration: newValuesObj
        };
        onChange(typoX);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "icon-underline"
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
      className: obj.styles.textDecoration[breakPointX] != undefined && obj.styles.textDecoration[breakPointX].indexOf('line-through') !== -1 ? '!bg-blue-300 ' : '',
      variant: "secondary",
      onClick: ev => {
        var newVal = 'line-through';
        var newValuesObj = {};

        if (Object.keys(obj.styles.textDecoration).length == 0) {
          newValuesObj[breakPointX] = [newVal];
        } else {
          newValuesObj = obj.styles.textDecoration;

          if (newValuesObj[breakPointX].indexOf(newVal) !== -1) {
            var arr = newValuesObj[breakPointX].filter(item => item !== newVal);
            newValuesObj[breakPointX] = arr;
          } else {
            newValuesObj[breakPointX].push(newVal);
          }
        }

        var typoX = { ...obj.styles,
          textDecoration: newValuesObj
        };
        onChange(typoX);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "icon-strikethrough"
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
      className: obj.styles.textDecoration[breakPointX] != undefined && obj.styles.textDecoration[breakPointX].indexOf('overline') !== -1 ? '!bg-blue-300 ' : '',
      variant: "secondary",
      onClick: ev => {
        var newVal = 'overline';
        var newValuesObj = {};

        if (Object.keys(obj.styles.textDecoration).length == 0) {
          newValuesObj[breakPointX] = [newVal];
        } else {
          newValuesObj = obj.styles.textDecoration;

          if (newValuesObj[breakPointX].indexOf(newVal) !== -1) {
            var arr = newValuesObj[breakPointX].filter(item => item !== newVal);
            newValuesObj[breakPointX] = arr;
          } else {
            newValuesObj[breakPointX].push(newVal);
          }
        }

        var typoX = { ...obj.styles,
          textDecoration: newValuesObj
        };
        onChange(typoX);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "icon-overline"
    })), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
      className: obj.styles.textDecoration[breakPointX] != undefined && obj.styles.textDecoration[breakPointX].indexOf('none') !== -1 ? '!bg-blue-300 ' : '',
      variant: "secondary",
      onClick: ev => {
        var newVal = 'none';
        var newValuesObj = {};

        if (Object.keys(obj.styles.textDecoration).length == 0) {
          newValuesObj[breakPointX] = [newVal];
        } else {
          newValuesObj = obj.styles.textDecoration;

          if (newValuesObj[breakPointX].indexOf(newVal) !== -1) {
            var arr = newValuesObj[breakPointX].filter(item => item !== newVal);
            newValuesObj[breakPointX] = arr;
          } else {
            newValuesObj[breakPointX] = [newVal];
          }
        }

        var typoX = { ...obj.styles,
          textDecoration: newValuesObj
        };
        onChange(typoX);
      }
    }, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
      class: "icon-close"
    }))))));
  }

}

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Typography);

/***/ }),

/***/ "./src/sidebars.js":
/*!*************************!*\
  !*** ./src/sidebars.js ***!
  \*************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_plugins__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/plugins */ "@wordpress/plugins");
/* harmony import */ var _wordpress_plugins__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_plugins__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/edit-post */ "@wordpress/edit-post");
/* harmony import */ var _wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _components_sidebars__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/sidebars */ "./src/components/sidebars/index.js");





var iconPostGrid = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("svg", {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 36 36"
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
  fill: "#1d4ed8",
  d: "M15.41,15.41H0V0H15.41ZM3,12.41h9.41V3H3Z"
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
  fill: "#1d4ed8",
  d: "M15.41,36H0V20.59H15.41ZM3,33h9.41V23.59H3Z"
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("path", {
  fill: "#1d4ed8",
  d: "M36,36H20.59V20.59H36ZM23.59,33H33V23.59H23.59Z"
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
  fill: "#1d4ed8",
  x: "25.15",
  y: "3.87",
  width: "10.85",
  height: "2.35"
}), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("rect", {
  fill: "#1d4ed8",
  x: "25.15",
  y: "9.19",
  width: "10.85",
  height: "2.35"
}));

const PostGridSidebar = () => // hello
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_edit_post__WEBPACK_IMPORTED_MODULE_2__.PluginSidebar, {
  name: "post-grid-sidebar",
  title: "Post Grid Combo",
  icon: iconPostGrid
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_sidebars__WEBPACK_IMPORTED_MODULE_3__["default"], null));

(0,_wordpress_plugins__WEBPACK_IMPORTED_MODULE_1__.registerPlugin)('post-grid-sidebar', {
  render: PostGridSidebar
});

/***/ }),

/***/ "./src/store.js":
/*!**********************!*\
  !*** ./src/store.js ***!
  \**********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "store": () => (/* binding */ store)
/* harmony export */ });
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__WEBPACK_IMPORTED_MODULE_1__);


const {
  __experimentalSetPreviewDeviceType: setPreviewDeviceType
} = wp.data.dispatch('core/edit-post'); // if (wp.data.dispatch('core/edit-post') != null) {
//   const {
//     __experimentalSetPreviewDeviceType: setPreviewDeviceType,
//   } = wp.data.dispatch('core/edit-post')
// } else {
//   const {
//     __experimentalSetPreviewDeviceType: setPreviewDeviceType,
//   } = wp.data.dispatch('core/edit-widgets')
// }

const DEFAULT_STATE = {
  breakPoint: 'Desktop',
  clientdata: {},
  license: {
    license_status: '',
    license_key: ''
  },
  blockCss: '',
  stylesClipboard: null
};
var selectors = {
  getBreakPoint(state) {
    const {
      breakPoint
    } = state;
    return breakPoint;
  },

  getclientdata(state) {
    const {
      clientdata
    } = state;
    return clientdata;
  },

  getLicense(state) {
    const {
      license
    } = state;
    return license;
  },

  getStylesClipboard(state) {
    const {
      stylesClipboard
    } = state;
    return stylesClipboard;
  },

  cssAttrParse(state, key) {
    var cssProp = '';

    if (key == 'alignContent') {
      cssProp = 'align-content';
    } else if (key == 'alignItems') {
      cssProp = 'align-items';
    } else if (key == 'alignSelf') {
      cssProp = 'align-self';
    } else if (key == 'aspectRatio') {
      cssProp = 'aspect-ratio';
    } else if (key == 'backfaceVisibility') {
      cssProp = 'backface-visibility';
    } else if (key == 'backgroundAttachment') {
      cssProp = 'background-attachment';
    } else if (key == 'backgroundBlendMode') {
      cssProp = 'background-blend-mode';
    } else if (key == 'backgroundClip') {
      cssProp = 'background-clip';
    } else if (key == 'bgColor') {
      cssProp = 'background-color';
    } else if (key == 'backgroundColor') {
      cssProp = 'background-color';
    } else if (key == 'backgroundOrigin') {
      cssProp = 'background-origin';
    } else if (key == 'backgroundRepeat') {
      cssProp = 'background-repeat';
    } else if (key == 'backgroundSize') {
      cssProp = 'background-size';
    } else if (key == 'backgroundPosition') {
      cssProp = 'background-position';
    } else if (key == 'backgroundImage') {
      cssProp = 'background-image';
    } else if (key == 'border') {
      cssProp = 'border';
    } else if (key == 'borderTop') {
      cssProp = 'border-top';
    } else if (key == 'borderRight') {
      cssProp = 'border-right';
    } else if (key == 'borderBottom') {
      cssProp = 'border-bottom';
    } else if (key == 'borderLeft') {
      cssProp = 'border-left';
    } else if (key == 'borderRadius') {
      cssProp = 'border-radius';
    } else if (key == 'borderCollapse') {
      cssProp = 'border-collapse';
    } else if (key == 'borderSpacing') {
      cssProp = 'border-spacing';
    } else if (key == 'borderImage') {
      cssProp = 'border-image';
    } else if (key == 'boxShadow') {
      cssProp = 'box-shadow';
    } else if (key == 'backdropFilter') {
      cssProp = 'backdrop-filter';
    } else if (key == 'bottom' || key == 'top' || key == 'left' || key == 'right' || key == 'clear' || key == 'color' || key == 'filter' || key == 'float') {
      cssProp = key;
    } else if (key == 'boxSizing') {
      cssProp = 'box-sizing';
    } else if (key == 'cursor') {
      cssProp = 'cursor';
    } else if (key == 'content') {
      cssProp = 'content';
    } else if (key == 'columnCount') {
      cssProp = 'column-count';
    } else if (key == 'columnRule') {
      cssProp = 'column-rule';
    } else if (key == 'direction') {
      cssProp = 'direction';
    } else if (key == 'fontFamily') {
      cssProp = 'font-family';
    } else if (key == 'fontSize') {
      cssProp = 'font-size';
    } else if (key == 'fontStyle') {
      cssProp = 'font-style';
    } else if (key == 'fontStretch') {
      cssProp = 'font-stretch';
    } else if (key == 'fontWeight') {
      cssProp = 'font-weight';
    } else if (key == 'fontVariantCaps') {
      cssProp = 'font-variant-caps';
    } else if (key == 'flexWrap') {
      cssProp = 'flex-wrap';
    } else if (key == 'flexDirection') {
      cssProp = 'flex-direction';
    } else if (key == 'flexGrow') {
      cssProp = 'flex-grow';
    } else if (key == 'flexShrink') {
      cssProp = 'flex-shrink';
    } else if (key == 'flexBasis') {
      cssProp = 'flex-basis';
    } else if (key == 'flexFlow') {
      cssProp = 'flex-flow';
    } else if (key == 'letterSpacing') {
      cssProp = 'letter-spacing';
    } else if (key == 'gridColumnEnd') {
      cssProp = 'grid-column-end';
    } else if (key == 'gridColumnStart') {
      cssProp = 'grid-column-start';
    } else if (key == 'gridRowEnd') {
      cssProp = 'grid-row-end';
    } else if (key == 'gridRowStart') {
      cssProp = 'grid-row-start';
    } else if (key == 'gridTemplateColumns') {
      cssProp = 'grid-template-columns';
    } else if (key == 'gridTemplateRows') {
      cssProp = 'grid-template-rows';
    } else if (key == 'listStyle') {
      cssProp = 'list-style';
    } else if (key == 'lineHeight') {
      cssProp = 'line-height';
    } else if (key == 'justifyContent') {
      cssProp = 'justify-content';
    } else if (key == 'objectFit') {
      cssProp = 'object-fit';
    } else if (key == 'opacity') {
      cssProp = 'opacity';
    } else if (key == 'outline') {
      cssProp = 'outline';
    } else if (key == 'order') {
      cssProp = 'order';
    } else if (key == 'outlineOffset') {
      cssProp = 'outline-offset';
    } else if (key == 'position') {
      cssProp = 'position';
    } else if (key == 'textIndent') {
      cssProp = 'text-indent';
    } else if (key == 'textJustify') {
      cssProp = 'text-justify';
    } else if (key == 'textTransform') {
      cssProp = 'text-transform';
    } else if (key == 'textDecoration') {
      cssProp = 'text-decoration';
    } else if (key == 'textOverflow') {
      cssProp = 'text-overflow';
    } else if (key == 'textShadow') {
      cssProp = 'text-shadow';
    } else if (key == 'textAlign') {
      cssProp = 'text-align';
    } else if (key == 'visibility') {
      cssProp = 'visibility';
    } else if (key == 'wordBreak') {
      cssProp = 'word-break';
    } else if (key == 'wordSpacing') {
      cssProp = 'word-spacing';
    } else if (key == 'zIndex') {
      cssProp = 'z-index';
    } else if (key == 'padding') {
      cssProp = 'padding';
    } else if (key == 'paddingTop') {
      cssProp = 'padding-top';
    } else if (key == 'paddingRight') {
      cssProp = 'padding-right';
    } else if (key == 'paddingBottom') {
      cssProp = 'padding-bottom';
    } else if (key == 'paddingLeft') {
      cssProp = 'padding-left';
    } else if (key == 'margin') {
      cssProp = 'margin';
    } else if (key == 'marginTop') {
      cssProp = 'margin-top';
    } else if (key == 'marginRight') {
      cssProp = 'margin-right';
    } else if (key == 'marginBottom') {
      cssProp = 'margin-bottom';
    } else if (key == 'marginLeft') {
      cssProp = 'margin-left';
    } else if (key == 'display') {
      cssProp = 'display';
    } else if (key == 'width') {
      cssProp = 'width';
    } else if (key == 'height') {
      cssProp = 'height';
    } else if (key == 'verticalAlign') {
      cssProp = 'vertical-align';
    } else if (key == 'overflow') {
      cssProp = 'overflow';
    } else if (key == 'overflowX') {
      cssProp = 'overflow-x';
    } else if (key == 'overflowY') {
      cssProp = 'overflow-y';
    } else if (key == 'writingMode') {
      cssProp = 'writing-mode';
    } else if (key == 'wordWrap') {
      cssProp = 'word-wrap';
    } else if (key == 'perspective') {
      cssProp = 'perspective';
    } else if (key == 'minWidth') {
      cssProp = 'min-width';
    } else if (key == 'minHeight') {
      cssProp = 'min-height';
    } else if (key == 'maxHeight') {
      cssProp = 'max-height';
    } else if (key == 'maxWidth') {
      cssProp = 'max-width';
    } else if (key == 'transition') {
      cssProp = 'transition';
    } else if (key == 'transform') {
      cssProp = 'transform';
    } else if (key == 'gap') {
      cssProp = 'gap';
    } else if (key == 'rowGap') {
      cssProp = 'row-gap';
    } else if (key == 'columnGap') {
      cssProp = 'column-gap';
    }

    return cssProp;
  },

  addPropertyDeep(state, obj, path, value) {
    const [head, ...rest] = path;
    return { ...obj,
      [head]: rest.length ? selectors.addPropertyDeep(state, obj[head], rest, value) : value
    };
  },

  updatePropertyDeep(state, obj, path, value) {
    const [head, ...rest] = path;
    return { ...obj,
      [head]: rest.length ? selectors.updatePropertyDeep(state, obj[head], rest, value) : value
    };
  },

  setPropertyDeep(state, obj, path, value) {
    const [head, ...rest] = path.split('.');
    return { ...obj,
      [head]: rest.length ? selectors.setPropertyDeep(state, obj[head], rest.join('.'), value) : value
    };
  },

  deletePropertyDeep(state, object, path) {
    var last = path.pop();
    delete path.reduce((o, k) => o[k] || {}, object)[last];
    return object;
  },

  getElementSelector(state, sudoScource, mainSelector) {
    var elementSelector = mainSelector;

    if (sudoScource == 'styles') {
      elementSelector = mainSelector;
    } else if (sudoScource == 'hover') {
      elementSelector = mainSelector + ':hover';
    } else if (sudoScource == 'after') {
      elementSelector = mainSelector + '::after';
    } else if (sudoScource == 'before') {
      elementSelector = mainSelector + '::before';
    } else if (sudoScource == 'first-child') {
      elementSelector = mainSelector + ':first-child';
    } else if (sudoScource == 'last-child') {
      elementSelector = mainSelector + ':last-child';
    } else if (sudoScource == 'visited') {
      elementSelector = mainSelector + ':visited';
    } else if (sudoScource == 'selection') {
      elementSelector = mainSelector + '::selection';
    } else if (sudoScource == 'first-letter') {
      elementSelector = mainSelector + '::first-letter';
    } else if (sudoScource == 'first-line') {
      elementSelector = mainSelector + '::first-line';
    } else {
      elementSelector = mainSelector + ':' + sudoScource;
    }

    return elementSelector;
  },

  generateElementCss(state, obj, elementSelector) {
    var cssObj = {};
    Object.entries(obj).map(args => {
      var sudoSrc = args[0];
      var sudoArgs = args[1];

      if (sudoSrc != 'options' && sudoArgs != null) {
        var selector = selectors.getElementSelector(state, sudoSrc, elementSelector);
        Object.entries(args[1]).map(x => {
          var attr = x[0];
          var cssPropty = selectors.cssAttrParse(state, attr);

          if (cssObj[selector] == undefined) {
            cssObj[selector] = {};
          }

          if (cssObj[selector][cssPropty] == undefined) {
            cssObj[selector][cssPropty] = {};
          }

          cssObj[selector][cssPropty] = x[1];
        });
      }
    });
    return cssObj; // var cssItems = { ...blockCssY.items };
    // var cssItemsX = { ...cssItems, ...cssObj }
    // //console.log(cssItemsX);
    // setAttributes({ blockCssY: { items: cssItemsX } });
  },

  getBlockCssRules(state, blockCssObj) {
    var blockCssRules = {};
    Object.entries(blockCssObj).map(args => {
      var elementSelector = args[0];
      var elementObj = args[1];
      var elementCss = selectors.generateElementCss(state, elementObj, elementSelector);

      if (elementCss[elementSelector] == undefined) {} else {
        blockCssRules[elementSelector] = elementCss[elementSelector];
      }
    });
    return blockCssRules;
  },

  generateBlockCss(state, items, blockId, customCss) {
    const {
      blockCss
    } = state;
    var reponsiveCssGroups = {};

    for (var selector in items) {
      var attrs = items[selector];

      for (var attr in attrs) {
        var breakpoints = attrs[attr];

        for (var device in breakpoints) {
          var attrValue = breakpoints[device];

          if (reponsiveCssGroups[device] == undefined) {
            reponsiveCssGroups[device] = [];
          }

          if (reponsiveCssGroups[device] == undefined) {
            reponsiveCssGroups[device] = [];
          }

          if (reponsiveCssGroups[device][selector] == undefined) {
            reponsiveCssGroups[device][selector] = [];
          }

          reponsiveCssGroups[device][selector].push({
            'attr': attr,
            'val': attrValue
          });
        }
      }
    }

    var reponsiveCssDesktop = '';

    if (reponsiveCssGroups['Desktop'] != undefined) {
      for (var selector in reponsiveCssGroups['Desktop']) {
        var attrs = reponsiveCssGroups['Desktop'][selector];
        reponsiveCssDesktop += selector + '{';

        for (var index in attrs) {
          var attr = attrs[index];
          var attrName = attr.attr;
          var attrValue = attr.val;
          reponsiveCssDesktop += attrName + ':' + attrValue + ';';
        }

        reponsiveCssDesktop += '}';
      }
    }

    var reponsiveCssTablet = '';

    if (reponsiveCssGroups['Tablet'] != undefined) {
      reponsiveCssTablet += '@media(max-width: 991px){';

      for (var selector in reponsiveCssGroups['Tablet']) {
        var attrs = reponsiveCssGroups['Tablet'][selector];
        reponsiveCssTablet += selector + '{';

        for (var index in attrs) {
          var attr = attrs[index];
          var attrName = attr.attr;
          var attrValue = attr.val;
          reponsiveCssTablet += attrName + ':' + attrValue + ';';
        }

        reponsiveCssTablet += '}';
      }

      reponsiveCssTablet += '}';
    }

    var reponsiveCssMobile = '';

    if (reponsiveCssGroups['Mobile'] != undefined) {
      reponsiveCssMobile += '@media(max-width:767px){';

      for (var selector in reponsiveCssGroups['Mobile']) {
        var attrs = reponsiveCssGroups['Mobile'][selector];
        reponsiveCssMobile += selector + '{';

        for (var index in attrs) {
          var attr = attrs[index];
          var attrName = attr.attr;
          var attrValue = attr.val;
          reponsiveCssMobile += attrName + ':' + attrValue + ';';
        }

        reponsiveCssMobile += '}';
      }

      reponsiveCssMobile += '}';
    }

    var reponsiveCss = reponsiveCssDesktop + reponsiveCssTablet + reponsiveCssMobile;
    var iframe = document.querySelectorAll('[name="editor-canvas"]')[0];

    if (iframe) {
      setTimeout(() => {
        var iframeDocument = iframe.contentDocument;
        var body = iframeDocument.body;
        var divWrap = iframeDocument.getElementById("css-block-" + blockId);

        if (divWrap != undefined) {
          iframeDocument.getElementById("css-block-" + blockId).outerHTML = "";
        }

        var divWrap = '<div id="css-block-' + blockId + '"></div>';
        body.insertAdjacentHTML('beforeend', divWrap);
        var csswrappg = iframeDocument.getElementById('css-block-' + blockId);
        var str = '<style>' + reponsiveCss + customCss + '</style>';
        csswrappg.insertAdjacentHTML('beforeend', str);
      }, 200);
    } else {
      var wpfooter = document.getElementById('wpfooter');
      var divWrap = document.getElementById("css-block-" + blockId);

      if (divWrap != undefined) {
        document.getElementById("css-block-" + blockId).outerHTML = "";
      }

      var divWrap = '<div id="css-block-' + blockId + '"></div>';
      wpfooter.insertAdjacentHTML('beforeend', divWrap);
      var csswrappg = document.getElementById('css-block-' + blockId);
      var str = '<style>' + reponsiveCss + customCss + '</style>';
      csswrappg.insertAdjacentHTML('beforeend', str);
    }

    return blockCss;
  }

};
var resolvers = {
  *getLicense() {
    const path = '/post-grid/v2/get_license';
    const res = yield actions.fetchLicense(path);
    return actions.setLicense(res);
  },

  *getclientdata() {
    const path = '/post-grid/v2/get_site_details';
    const res = yield actions.fetchclientdata(path);
    return actions.setclientdata(res);
  }

};
const actions = {
  setBreakPoint(breakpoint) {
    setPreviewDeviceType(breakpoint);
    console.log('setBreakPoint: ', breakpoint);
    return {
      type: 'SET_BREAKPOINT',
      breakpoint
    };
  },

  setclientdata(clientdata) {
    return {
      type: 'SET_CLIENTDATA',
      clientdata
    };
  },

  setLicense(license) {
    return {
      type: 'SET_LICENSE',
      license
    };
  },

  setStylesClipboard(stylesClipboard) {
    return {
      type: 'SET_CLIPBOARD',
      stylesClipboard
    };
  },

  fetchLicense(path) {
    return {
      type: 'FETCH_LICENSE_FROM_API',
      path
    };
  },

  fetchclientdata(path) {
    return {
      type: 'FETCH_CLIENTDATA_FROM_API',
      path
    };
  }

};
var controls = {
  FETCH_LICENSE_FROM_API(action) {
    return _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: action.path,
      method: 'POST',
      data: {}
    });
  },

  FETCH_CLIENTDATA_FROM_API(action) {
    return _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: action.path,
      method: 'POST',
      data: {}
    });
  },

  FETCH_PRO_INFO_FROM_API(action) {
    return _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: action.path,
      method: 'POST',
      data: {}
    });
  }

};
const store = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_1__.createReduxStore)('postgrid-shop', {
  reducer() {
    let state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : DEFAULT_STATE;
    let action = arguments.length > 1 ? arguments[1] : undefined;

    switch (action.type) {
      case 'SET_BREAKPOINT':
        return { ...state,
          breakPoint: action.breakpoint
        };

      case 'SET_CLIENTDATA':
        return { ...state,
          clientdata: action.clientdata
        };

      case 'SET_LICENSE':
        return { ...state,
          license: action.license
        };

      case 'SET_CLIPBOARD':
        return { ...state,
          stylesClipboard: action.stylesClipboard
        };
    }

    return state;
  },

  actions,
  selectors,
  controls,
  resolvers
});
(0,_wordpress_data__WEBPACK_IMPORTED_MODULE_1__.register)(store);
(0,_wordpress_data__WEBPACK_IMPORTED_MODULE_1__.subscribe)(() => {});


/***/ }),

/***/ "./src/templates.js":
/*!**************************!*\
  !*** ./src/templates.js ***!
  \**************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _components_templates__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/templates */ "./src/components/templates/index.js");




function TemplatesBtn(props) {
  // if (!props.warn) {
  //     return null;
  // }
  const [enable, setEnable] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
    id: "pgTemplatesEnable",
    class: "bg-blue-700 px-5 py-2 cursor-pointer rounded-sm text-white font-bold hover:text-white",
    onClick: ev => {
      setEnable(!enable);
    }
  }, enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    class: "dashicons dashicons-no-alt"
  }), !enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    class: "dashicons dashicons-buddicons-groups"
  }), (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", {
    className: "inline-block mx-2"
  }, "Templates")), enable && (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_components_templates__WEBPACK_IMPORTED_MODULE_1__["default"], {
    setEnable: setEnable
  }));
}

document.addEventListener("DOMContentLoaded", DOMContentLoadedImport);

function DOMContentLoadedImport() {
  setTimeout(() => {
    var headerSettings = document.querySelector('.edit-post-header__settings');
    var wpcontent = document.querySelector('#wpcontent');
    var wpfooter = document.querySelector('#wpfooter');
    var wpbody = document.querySelector('#wpbody');
    var templatesWrap = document.querySelector('#editor .interface-interface-skeleton__content');
    var importEl = document.createElement('div');
    var html = '<div class="pgTemplates" id="pgTemplatesBtn"></div>';
    importEl.innerHTML = html; //headerSettings.appendChild(importEl);

    if (headerSettings != null) {
      headerSettings.prepend(importEl);
    }

    var pgTemplatesBtn = document.querySelector('#pgTemplatesBtn');

    if (pgTemplatesBtn != null) {
      wp.element.render((0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(TemplatesBtn, null), pgTemplatesBtn);
    }
  }, 2000);
}

/***/ }),

/***/ "./node_modules/classnames/index.js":
/*!******************************************!*\
  !*** ./node_modules/classnames/index.js ***!
  \******************************************/
/***/ ((module, exports) => {

var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
  Copyright (c) 2018 Jed Watson.
  Licensed under the MIT License (MIT), see
  http://jedwatson.github.io/classnames
*/
/* global define */

(function () {
	'use strict';

	var hasOwn = {}.hasOwnProperty;

	function classNames() {
		var classes = [];

		for (var i = 0; i < arguments.length; i++) {
			var arg = arguments[i];
			if (!arg) continue;

			var argType = typeof arg;

			if (argType === 'string' || argType === 'number') {
				classes.push(arg);
			} else if (Array.isArray(arg)) {
				if (arg.length) {
					var inner = classNames.apply(null, arg);
					if (inner) {
						classes.push(inner);
					}
				}
			} else if (argType === 'object') {
				if (arg.toString === Object.prototype.toString) {
					for (var key in arg) {
						if (hasOwn.call(arg, key) && arg[key]) {
							classes.push(key);
						}
					}
				} else {
					classes.push(arg.toString());
				}
			}
		}

		return classes.join(' ');
	}

	if ( true && module.exports) {
		classNames.default = classNames;
		module.exports = classNames;
	} else if (true) {
		// register as 'classnames', consistent with npm package name
		!(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_RESULT__ = (function () {
			return classNames;
		}).apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__),
		__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
	} else {}
}());


/***/ }),

/***/ "./node_modules/desandro-matches-selector/matches-selector.js":
/*!********************************************************************!*\
  !*** ./node_modules/desandro-matches-selector/matches-selector.js ***!
  \********************************************************************/
/***/ ((module, exports, __webpack_require__) => {

var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;/**
 * matchesSelector v2.0.2
 * matchesSelector( element, '.selector' )
 * MIT license
 */

/*jshint browser: true, strict: true, undef: true, unused: true */

( function( window, factory ) {
  /*global define: false, module: false */
  'use strict';
  // universal module definition
  if ( true ) {
    // AMD
    !(__WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
		__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
		(__WEBPACK_AMD_DEFINE_FACTORY__.call(exports, __webpack_require__, exports, module)) :
		__WEBPACK_AMD_DEFINE_FACTORY__),
		__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
  } else {}

}( window, function factory() {
  'use strict';

  var matchesMethod = ( function() {
    var ElemProto = window.Element.prototype;
    // check for the standard method name first
    if ( ElemProto.matches ) {
      return 'matches';
    }
    // check un-prefixed
    if ( ElemProto.matchesSelector ) {
      return 'matchesSelector';
    }
    // check vendor prefixes
    var prefixes = [ 'webkit', 'moz', 'ms', 'o' ];

    for ( var i=0; i < prefixes.length; i++ ) {
      var prefix = prefixes[i];
      var method = prefix + 'MatchesSelector';
      if ( ElemProto[ method ] ) {
        return method;
      }
    }
  })();

  return function matchesSelector( elem, selector ) {
    return elem[ matchesMethod ]( selector );
  };

}));


/***/ }),

/***/ "./node_modules/ev-emitter/ev-emitter.js":
/*!***********************************************!*\
  !*** ./node_modules/ev-emitter/ev-emitter.js ***!
  \***********************************************/
/***/ (function(module, exports, __webpack_require__) {

var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;/**
 * EvEmitter v1.1.0
 * Lil' event emitter
 * MIT License
 */

/* jshint unused: true, undef: true, strict: true */

( function( global, factory ) {
  // universal module definition
  /* jshint strict: false */ /* globals define, module, window */
  if ( true ) {
    // AMD - RequireJS
    !(__WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
		__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
		(__WEBPACK_AMD_DEFINE_FACTORY__.call(exports, __webpack_require__, exports, module)) :
		__WEBPACK_AMD_DEFINE_FACTORY__),
		__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
  } else {}

}( typeof window != 'undefined' ? window : this, function() {

"use strict";

function EvEmitter() {}

var proto = EvEmitter.prototype;

proto.on = function( eventName, listener ) {
  if ( !eventName || !listener ) {
    return;
  }
  // set events hash
  var events = this._events = this._events || {};
  // set listeners array
  var listeners = events[ eventName ] = events[ eventName ] || [];
  // only add once
  if ( listeners.indexOf( listener ) == -1 ) {
    listeners.push( listener );
  }

  return this;
};

proto.once = function( eventName, listener ) {
  if ( !eventName || !listener ) {
    return;
  }
  // add event
  this.on( eventName, listener );
  // set once flag
  // set onceEvents hash
  var onceEvents = this._onceEvents = this._onceEvents || {};
  // set onceListeners object
  var onceListeners = onceEvents[ eventName ] = onceEvents[ eventName ] || {};
  // set flag
  onceListeners[ listener ] = true;

  return this;
};

proto.off = function( eventName, listener ) {
  var listeners = this._events && this._events[ eventName ];
  if ( !listeners || !listeners.length ) {
    return;
  }
  var index = listeners.indexOf( listener );
  if ( index != -1 ) {
    listeners.splice( index, 1 );
  }

  return this;
};

proto.emitEvent = function( eventName, args ) {
  var listeners = this._events && this._events[ eventName ];
  if ( !listeners || !listeners.length ) {
    return;
  }
  // copy over to avoid interference if .off() in listener
  listeners = listeners.slice(0);
  args = args || [];
  // once stuff
  var onceListeners = this._onceEvents && this._onceEvents[ eventName ];

  for ( var i=0; i < listeners.length; i++ ) {
    var listener = listeners[i]
    var isOnce = onceListeners && onceListeners[ listener ];
    if ( isOnce ) {
      // remove listener
      // remove before trigger to prevent recursion
      this.off( eventName, listener );
      // unset once flag
      delete onceListeners[ listener ];
    }
    // trigger listener
    listener.apply( this, args );
  }

  return this;
};

proto.allOff = function() {
  delete this._events;
  delete this._onceEvents;
};

return EvEmitter;

}));


/***/ }),

/***/ "./node_modules/fizzy-ui-utils/utils.js":
/*!**********************************************!*\
  !*** ./node_modules/fizzy-ui-utils/utils.js ***!
  \**********************************************/
/***/ ((module, exports, __webpack_require__) => {

var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/**
 * Fizzy UI utils v2.0.7
 * MIT license
 */

/*jshint browser: true, undef: true, unused: true, strict: true */

( function( window, factory ) {
  // universal module definition
  /*jshint strict: false */ /*globals define, module, require */

  if ( true ) {
    // AMD
    !(__WEBPACK_AMD_DEFINE_ARRAY__ = [
      __webpack_require__(/*! desandro-matches-selector/matches-selector */ "./node_modules/desandro-matches-selector/matches-selector.js")
    ], __WEBPACK_AMD_DEFINE_RESULT__ = (function( matchesSelector ) {
      return factory( window, matchesSelector );
    }).apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__),
		__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
  } else {}

}( window, function factory( window, matchesSelector ) {

'use strict';

var utils = {};

// ----- extend ----- //

// extends objects
utils.extend = function( a, b ) {
  for ( var prop in b ) {
    a[ prop ] = b[ prop ];
  }
  return a;
};

// ----- modulo ----- //

utils.modulo = function( num, div ) {
  return ( ( num % div ) + div ) % div;
};

// ----- makeArray ----- //

var arraySlice = Array.prototype.slice;

// turn element or nodeList into an array
utils.makeArray = function( obj ) {
  if ( Array.isArray( obj ) ) {
    // use object if already an array
    return obj;
  }
  // return empty array if undefined or null. #6
  if ( obj === null || obj === undefined ) {
    return [];
  }

  var isArrayLike = typeof obj == 'object' && typeof obj.length == 'number';
  if ( isArrayLike ) {
    // convert nodeList to array
    return arraySlice.call( obj );
  }

  // array of single index
  return [ obj ];
};

// ----- removeFrom ----- //

utils.removeFrom = function( ary, obj ) {
  var index = ary.indexOf( obj );
  if ( index != -1 ) {
    ary.splice( index, 1 );
  }
};

// ----- getParent ----- //

utils.getParent = function( elem, selector ) {
  while ( elem.parentNode && elem != document.body ) {
    elem = elem.parentNode;
    if ( matchesSelector( elem, selector ) ) {
      return elem;
    }
  }
};

// ----- getQueryElement ----- //

// use element as selector string
utils.getQueryElement = function( elem ) {
  if ( typeof elem == 'string' ) {
    return document.querySelector( elem );
  }
  return elem;
};

// ----- handleEvent ----- //

// enable .ontype to trigger from .addEventListener( elem, 'type' )
utils.handleEvent = function( event ) {
  var method = 'on' + event.type;
  if ( this[ method ] ) {
    this[ method ]( event );
  }
};

// ----- filterFindElements ----- //

utils.filterFindElements = function( elems, selector ) {
  // make array of elems
  elems = utils.makeArray( elems );
  var ffElems = [];

  elems.forEach( function( elem ) {
    // check that elem is an actual element
    if ( !( elem instanceof HTMLElement ) ) {
      return;
    }
    // add elem if no selector
    if ( !selector ) {
      ffElems.push( elem );
      return;
    }
    // filter & find items if we have a selector
    // filter
    if ( matchesSelector( elem, selector ) ) {
      ffElems.push( elem );
    }
    // find children
    var childElems = elem.querySelectorAll( selector );
    // concat childElems to filterFound array
    for ( var i=0; i < childElems.length; i++ ) {
      ffElems.push( childElems[i] );
    }
  });

  return ffElems;
};

// ----- debounceMethod ----- //

utils.debounceMethod = function( _class, methodName, threshold ) {
  threshold = threshold || 100;
  // original method
  var method = _class.prototype[ methodName ];
  var timeoutName = methodName + 'Timeout';

  _class.prototype[ methodName ] = function() {
    var timeout = this[ timeoutName ];
    clearTimeout( timeout );

    var args = arguments;
    var _this = this;
    this[ timeoutName ] = setTimeout( function() {
      method.apply( _this, args );
      delete _this[ timeoutName ];
    }, threshold );
  };
};

// ----- docReady ----- //

utils.docReady = function( callback ) {
  var readyState = document.readyState;
  if ( readyState == 'complete' || readyState == 'interactive' ) {
    // do async to allow for other scripts to run. metafizzy/flickity#441
    setTimeout( callback );
  } else {
    document.addEventListener( 'DOMContentLoaded', callback );
  }
};

// ----- htmlInit ----- //

// http://jamesroberts.name/blog/2010/02/22/string-functions-for-javascript-trim-to-camel-case-to-dashed-and-to-underscore/
utils.toDashed = function( str ) {
  return str.replace( /(.)([A-Z])/g, function( match, $1, $2 ) {
    return $1 + '-' + $2;
  }).toLowerCase();
};

var console = window.console;
/**
 * allow user to initialize classes via [data-namespace] or .js-namespace class
 * htmlInit( Widget, 'widgetName' )
 * options are parsed from data-namespace-options
 */
utils.htmlInit = function( WidgetClass, namespace ) {
  utils.docReady( function() {
    var dashedNamespace = utils.toDashed( namespace );
    var dataAttr = 'data-' + dashedNamespace;
    var dataAttrElems = document.querySelectorAll( '[' + dataAttr + ']' );
    var jsDashElems = document.querySelectorAll( '.js-' + dashedNamespace );
    var elems = utils.makeArray( dataAttrElems )
      .concat( utils.makeArray( jsDashElems ) );
    var dataOptionsAttr = dataAttr + '-options';
    var jQuery = window.jQuery;

    elems.forEach( function( elem ) {
      var attr = elem.getAttribute( dataAttr ) ||
        elem.getAttribute( dataOptionsAttr );
      var options;
      try {
        options = attr && JSON.parse( attr );
      } catch ( error ) {
        // log error, do not initialize
        if ( console ) {
          console.error( 'Error parsing ' + dataAttr + ' on ' + elem.className +
          ': ' + error );
        }
        return;
      }
      // initialize
      var instance = new WidgetClass( elem, options );
      // make available via $().data('namespace')
      if ( jQuery ) {
        jQuery.data( elem, namespace, instance );
      }
    });

  });
};

// -----  ----- //

return utils;

}));


/***/ }),

/***/ "./node_modules/fslightbox/index.js":
/*!******************************************!*\
  !*** ./node_modules/fslightbox/index.js ***!
  \******************************************/
/***/ ((module) => {

!function(e,t){if(true)module.exports=t();else { var o, n; }}(window,(function(){return function(e){var t={};function n(o){if(t[o])return t[o].exports;var i=t[o]={i:o,l:!1,exports:{}};return e[o].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)n.d(o,i,function(t){return e[t]}.bind(null,i));return o},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){"use strict";n.r(t);var o,i="fslightbox-",r="".concat(i,"styles"),s="".concat(i,"cursor-grabbing"),a="".concat(i,"full-dimension"),c="".concat(i,"flex-centered"),l="".concat(i,"open"),u="".concat(i,"transform-transition"),d="".concat(i,"absoluted"),f="".concat(i,"slide-btn"),p="".concat(f,"-container"),h="".concat(i,"fade-in"),m="".concat(i,"fade-out"),g=h+"-strong",v=m+"-strong",b="".concat(i,"opacity-"),x="".concat(b,"1"),y="".concat(i,"source");function w(e){return(w="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function S(e){var t=e.stageIndexes,n=e.core.stageManager,o=e.props.sources.length-1;n.getPreviousSlideIndex=function(){return 0===t.current?o:t.current-1},n.getNextSlideIndex=function(){return t.current===o?0:t.current+1},n.updateStageIndexes=0===o?function(){}:1===o?function(){0===t.current?(t.next=1,delete t.previous):(t.previous=0,delete t.next)}:function(){t.previous=n.getPreviousSlideIndex(),t.next=n.getNextSlideIndex()},n.i=o<=2?function(){return!0}:function(e){var n=t.current;if(0===n&&e===o||n===o&&0===e)return!0;var i=n-e;return-1===i||0===i||1===i}}"object"===("undefined"==typeof document?"undefined":w(document))&&((o=document.createElement("style")).className=r,o.appendChild(document.createTextNode(".fslightbox-absoluted{position:absolute;top:0;left:0}.fslightbox-fade-in{animation:fslightbox-fade-in .3s cubic-bezier(0,0,.7,1)}.fslightbox-fade-out{animation:fslightbox-fade-out .3s ease}.fslightbox-fade-in-strong{animation:fslightbox-fade-in-strong .3s cubic-bezier(0,0,.7,1)}.fslightbox-fade-out-strong{animation:fslightbox-fade-out-strong .3s ease}@keyframes fslightbox-fade-in{from{opacity:.65}to{opacity:1}}@keyframes fslightbox-fade-out{from{opacity:.35}to{opacity:0}}@keyframes fslightbox-fade-in-strong{from{opacity:.3}to{opacity:1}}@keyframes fslightbox-fade-out-strong{from{opacity:1}to{opacity:0}}.fslightbox-cursor-grabbing{cursor:grabbing}.fslightbox-full-dimension{width:100%;height:100%}.fslightbox-open{overflow:hidden;height:100%}.fslightbox-flex-centered{display:flex;justify-content:center;align-items:center}.fslightbox-opacity-0{opacity:0!important}.fslightbox-opacity-1{opacity:1!important}.fslightbox-scrollbarfix{padding-right:17px}.fslightbox-transform-transition{transition:transform .3s}.fslightbox-container{font-family:Arial,sans-serif;position:fixed;top:0;left:0;background:linear-gradient(rgba(30,30,30,.9),#000 1810%);touch-action:pinch-zoom;z-index:1000000000;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.fslightbox-container *{box-sizing:border-box}.fslightbox-svg-path{transition:fill .15s ease;fill:#ddd}.fslightbox-nav{height:45px;width:100%;position:absolute;top:0;left:0}.fslightbox-slide-number-container{display:flex;justify-content:center;align-items:center;position:relative;height:100%;font-size:15px;color:#d7d7d7;z-index:0;max-width:55px;text-align:left}.fslightbox-slide-number-container .fslightbox-flex-centered{height:100%}.fslightbox-slash{display:block;margin:0 5px;width:1px;height:12px;transform:rotate(15deg);background:#fff}.fslightbox-toolbar{position:absolute;z-index:3;right:0;top:0;height:100%;display:flex;background:rgba(35,35,35,.65)}.fslightbox-toolbar-button{height:100%;width:45px;cursor:pointer}.fslightbox-toolbar-button:hover .fslightbox-svg-path{fill:#fff}.fslightbox-slide-btn-container{display:flex;align-items:center;padding:12px 12px 12px 6px;position:absolute;top:50%;cursor:pointer;z-index:3;transform:translateY(-50%)}@media (min-width:476px){.fslightbox-slide-btn-container{padding:22px 22px 22px 6px}}@media (min-width:768px){.fslightbox-slide-btn-container{padding:30px 30px 30px 6px}}.fslightbox-slide-btn-container:hover .fslightbox-svg-path{fill:#f1f1f1}.fslightbox-slide-btn{padding:9px;font-size:26px;background:rgba(35,35,35,.65)}@media (min-width:768px){.fslightbox-slide-btn{padding:10px}}@media (min-width:1600px){.fslightbox-slide-btn{padding:11px}}.fslightbox-slide-btn-container-previous{left:0}@media (max-width:475.99px){.fslightbox-slide-btn-container-previous{padding-left:3px}}.fslightbox-slide-btn-container-next{right:0;padding-left:12px;padding-right:3px}@media (min-width:476px){.fslightbox-slide-btn-container-next{padding-left:22px}}@media (min-width:768px){.fslightbox-slide-btn-container-next{padding-left:30px}}@media (min-width:476px){.fslightbox-slide-btn-container-next{padding-right:6px}}.fslightbox-down-event-detector{position:absolute;z-index:1}.fslightbox-slide-swiping-hoverer{z-index:4}.fslightbox-invalid-file-wrapper{font-size:22px;color:#eaebeb;margin:auto}.fslightbox-video{object-fit:cover}.fslightbox-youtube-iframe{border:0}.fslightboxl{display:block;margin:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:67px;height:67px}.fslightboxl div{box-sizing:border-box;display:block;position:absolute;width:54px;height:54px;margin:6px;border:5px solid;border-color:#999 transparent transparent transparent;border-radius:50%;animation:fslightboxl 1.2s cubic-bezier(.5,0,.5,1) infinite}.fslightboxl div:nth-child(1){animation-delay:-.45s}.fslightboxl div:nth-child(2){animation-delay:-.3s}.fslightboxl div:nth-child(3){animation-delay:-.15s}@keyframes fslightboxl{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.fslightbox-source{position:relative;z-index:2;opacity:0}")),document.head.appendChild(o));function L(e){var t,n=e.props,o=0,i={};this.getSourceTypeFromLocalStorageByUrl=function(e){return t[e]?t[e]:r(e)},this.handleReceivedSourceTypeForUrl=function(e,n){if(!1===i[n]&&(o--,"invalid"!==e?i[n]=e:delete i[n],0===o)){!function(e,t){for(var n in t)e[n]=t[n]}(t,i);try{localStorage.setItem("fslightbox-types",JSON.stringify(t))}catch(e){}}};var r=function(e){o++,i[e]=!1};if(n.disableLocalStorage)this.getSourceTypeFromLocalStorageByUrl=function(){},this.handleReceivedSourceTypeForUrl=function(){};else{try{t=JSON.parse(localStorage.getItem("fslightbox-types"))}catch(e){}t||(t={},this.getSourceTypeFromLocalStorageByUrl=r)}}function A(e,t,n,o){var i=e.data,r=e.elements.sources,s=n/o,a=0;this.adjustSize=function(){if((a=i.maxSourceWidth/s)<i.maxSourceHeight)return n<i.maxSourceWidth&&(a=o),c();a=o>i.maxSourceHeight?i.maxSourceHeight:o,c()};var c=function(){r[t].style.width=a*s+"px",r[t].style.height=a+"px"}}function C(e,t){var n=this,o=e.collections.sourceSizers,i=e.elements,r=i.sourceAnimationWrappers,s=i.sources,a=e.isl,c=e.resolve;function l(e,n){o[t]=c(A,[t,e,n]),o[t].adjustSize()}this.runActions=function(e,o){a[t]=!0,s[t].classList.add(x),r[t].classList.add(g),r[t].removeChild(r[t].firstChild),l(e,o),n.runActions=l}}function E(e,t){var n,o=this,i=e.elements.sources,r=e.props,s=(0,e.resolve)(C,[t]);this.handleImageLoad=function(e){var t=e.target,n=t.naturalWidth,o=t.naturalHeight;s.runActions(n,o)},this.handleVideoLoad=function(e){var t=e.target,o=t.videoWidth,i=t.videoHeight;n=!0,s.runActions(o,i)},this.handleNotMetaDatedVideoLoad=function(){n||o.handleYoutubeLoad()},this.handleYoutubeLoad=function(){var e=1920,t=1080;r.maxYoutubeDimensions&&(e=r.maxYoutubeDimensions.width,t=r.maxYoutubeDimensions.height),s.runActions(e,t)},this.handleCustomLoad=function(){var e=i[t],n=e.offsetWidth,r=e.offsetHeight;n&&r?s.runActions(n,r):setTimeout(o.handleCustomLoad)}}function F(e,t,n){var o=e.elements.sources,i=e.props.customClasses,r=i[t]?i[t]:"";o[t].className=n+" "+r}function I(e,t){var n=e.elements.sources,o=e.props.customAttributes;for(var i in o[t])n[t].setAttribute(i,o[t][i])}function T(e,t){var n=e.collections.sourceLoadHandlers,o=e.elements,i=o.sources,r=o.sourceAnimationWrappers,s=e.props.sources;i[t]=document.createElement("img"),F(e,t,y),i[t].src=s[t],i[t].onload=n[t].handleImageLoad,I(e,t),r[t].appendChild(i[t])}function N(e,t){var n=e.collections.sourceLoadHandlers,o=e.elements,i=o.sources,r=o.sourceAnimationWrappers,s=e.props,a=s.sources,c=s.videosPosters;i[t]=document.createElement("video"),F(e,t,y),i[t].src=a[t],i[t].onloadedmetadata=function(e){n[t].handleVideoLoad(e)},i[t].controls=!0,I(e,t),c[t]&&(i[t].poster=c[t]);var l=document.createElement("source");l.src=a[t],i[t].appendChild(l),setTimeout(n[t].handleNotMetaDatedVideoLoad,3e3),r[t].appendChild(i[t])}function z(e,t){var n=e.collections.sourceLoadHandlers,o=e.elements,r=o.sources,s=o.sourceAnimationWrappers,a=e.props.sources;r[t]=document.createElement("iframe"),F(e,t,"".concat(y," ").concat(i,"youtube-iframe"));var c=a[t],l=c.split("?")[1];r[t].src="https://www.youtube.com/embed/".concat(c.match(/^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/)[2],"?").concat(l||""),r[t].allowFullscreen=!0,I(e,t),s[t].appendChild(r[t]),n[t].handleYoutubeLoad()}function P(e,t){var n=e.collections.sourceLoadHandlers,o=e.elements,i=o.sources,r=o.sourceAnimationWrappers,s=e.props.sources;i[t]=s[t],F(e,t,"".concat(i[t].className," ").concat(y)),r[t].appendChild(i[t]),n[t].handleCustomLoad()}function k(e,t){var n=e.elements,o=n.sources,r=n.sourceAnimationWrappers;e.props.sources;o[t]=document.createElement("div"),o[t].className="".concat(i,"invalid-file-wrapper ").concat(c),o[t].innerHTML="Invalid source",r[t].classList.add(g),r[t].removeChild(r[t].firstChild),r[t].appendChild(o[t])}function H(e){var t=e.collections,n=t.sourceLoadHandlers,o=t.sourcesRenderFunctions,i=e.core.sourceDisplayFacade,r=e.resolve;this.runActionsForSourceTypeAndIndex=function(t,s){var a;switch("invalid"!==t&&(n[s]=r(E,[s])),t){case"image":a=T;break;case"video":a=N;break;case"youtube":a=z;break;case"custom":a=P;break;default:a=k}o[s]=function(){return a(e,s)},i.displaySourcesWhichShouldBeDisplayed()}}function W(){var e,t,n,o={isUrlYoutubeOne:function(e){var t=document.createElement("a");return t.href=e,"www.youtube.com"===t.hostname||"youtu.be"===t.hostname},getTypeFromResponseContentType:function(e){return e.slice(0,e.indexOf("/"))}};function i(){if(4!==n.readyState){if(2===n.readyState){var e;switch(o.getTypeFromResponseContentType(n.getResponseHeader("content-type"))){case"image":e="image";break;case"video":e="video";break;default:e="invalid"}n.onreadystatechange=null,n.abort(),t(e)}}else t("invalid")}this.setUrlToCheck=function(t){e=t},this.getSourceType=function(r){if(o.isUrlYoutubeOne(e))return r("youtube");t=r,(n=new XMLHttpRequest).onreadystatechange=i,n.open("GET",e,!0),n.send()}}function R(e,t,n){var o=e.props,i=o.types,r=o.type,s=o.sources,a=e.resolve;this.getTypeSetByClientForIndex=function(e){var t;return i&&i[e]?t=i[e]:r&&(t=r),t},this.retrieveTypeWithXhrForIndex=function(e){var o=a(W);o.setUrlToCheck(s[e]),o.getSourceType((function(o){t.handleReceivedSourceTypeForUrl(o,s[e]),n.runActionsForSourceTypeAndIndex(o,e)}))}}function D(e,t){var n=e.core.stageManager,o=e.elements,i=o.smw,r=o.sourceWrappersContainer,s=e.props,l=0,f=document.createElement("div");function p(e){f.style.transform="translateX(".concat(e+l,"px)"),l=0}function h(){return(1+s.slideDistance)*innerWidth}f.className="".concat(d," ").concat(a," ").concat(c),f.s=function(){f.style.display="flex"},f.h=function(){f.style.display="none"},f.a=function(){f.classList.add(u)},f.d=function(){f.classList.remove(u)},f.n=function(){f.style.removeProperty("transform")},f.v=function(e){return l=e,f},f.ne=function(){p(-h())},f.z=function(){p(0)},f.p=function(){p(h())},n.i(t)||f.h(),i[t]=f,r.appendChild(f),function(e,t){var n=e.elements,o=n.smw,i=n.sourceAnimationWrappers,r=document.createElement("div"),s=document.createElement("div");s.className="fslightboxl";for(var a=0;a<3;a++){var c=document.createElement("div");s.appendChild(c)}r.appendChild(s),o[t].appendChild(r),i[t]=r}(e,t)}function O(e,t,n,o){var r=document.createElementNS("http://www.w3.org/2000/svg","svg");r.setAttributeNS(null,"width",t),r.setAttributeNS(null,"height",t),r.setAttributeNS(null,"viewBox",n);var s=document.createElementNS("http://www.w3.org/2000/svg","path");return s.setAttributeNS(null,"class","".concat(i,"svg-path")),s.setAttributeNS(null,"d",o),r.appendChild(s),e.appendChild(r),r}function M(e,t){var n=document.createElement("div");return n.className="".concat(i,"toolbar-button ").concat(c),n.title=t,e.appendChild(n),n}function j(e,t){var n=document.createElement("div");n.className="".concat(i,"toolbar"),t.appendChild(n),function(e,t){var n=e.componentsServices,o=e.data,i=e.fs,r="M4.5 11H3v4h4v-1.5H4.5V11zM3 7h1.5V4.5H7V3H3v4zm10.5 6.5H11V15h4v-4h-1.5v2.5zM11 3v1.5h2.5V7H15V3h-4z",s=M(t);s.title="Enter fullscreen";var a=O(s,"20px","0 0 18 18",r);n.ofs=function(){o.ifs=!0,s.title="Exit fullscreen",a.setAttributeNS(null,"width","24px"),a.setAttributeNS(null,"height","24px"),a.setAttributeNS(null,"viewBox","0 0 950 1024"),a.firstChild.setAttributeNS(null,"d","M682 342h128v84h-212v-212h84v128zM598 810v-212h212v84h-128v128h-84zM342 342v-128h84v212h-212v-84h128zM214 682v-84h212v212h-84v-128h-128z")},n.xfs=function(){o.ifs=!1,s.title="Enter fullscreen",a.setAttributeNS(null,"width","20px"),a.setAttributeNS(null,"height","20px"),a.setAttributeNS(null,"viewBox","0 0 18 18"),a.firstChild.setAttributeNS(null,"d",r)},s.onclick=i.t}(e,n),function(e,t){var n=M(t,"Close");n.onclick=e.core.lightboxCloser.closeLightbox,O(n,"20px","0 0 24 24","M 4.7070312 3.2929688 L 3.2929688 4.7070312 L 10.585938 12 L 3.2929688 19.292969 L 4.7070312 20.707031 L 12 13.414062 L 19.292969 20.707031 L 20.707031 19.292969 L 13.414062 12 L 20.707031 4.7070312 L 19.292969 3.2929688 L 12 10.585938 L 4.7070312 3.2929688 z")}(e,n)}function X(e){var t=e.props.sources,n=e.elements.container,o=document.createElement("div");o.className="".concat(i,"nav"),n.appendChild(o),j(e,o),t.length>1&&function(e,t){var n=e.componentsServices,o=e.props.sources,r=(e.stageIndexes,document.createElement("div"));r.className="".concat(i,"slide-number-container");var s=document.createElement("div");s.className=c;var a=document.createElement("span");n.setSlideNumber=function(e){return a.innerHTML=e};var l=document.createElement("span");l.className="".concat(i,"slash");var u=document.createElement("div");u.innerHTML=o.length,r.appendChild(s),s.appendChild(a),s.appendChild(l),s.appendChild(u),t.appendChild(r),setTimeout((function(){s.offsetWidth>55&&(r.style.justifyContent="flex-start")}))}(e,o)}function B(e,t,n,o){var i=e.elements.container,r=n.charAt(0).toUpperCase()+n.slice(1),s=document.createElement("div");s.className="".concat(p," ").concat(p,"-").concat(n),s.title="".concat(r," slide"),s.onclick=t,function(e,t){var n=document.createElement("div");n.className="".concat(f," ").concat(c),O(n,"20px","0 0 20 20",t),e.appendChild(n)}(s,o),i.appendChild(s)}function U(e){var t=e.core,n=t.lightboxCloser,o=t.slideChangeFacade,i=e.fs;this.listener=function(e){switch(e.key){case"Escape":n.closeLightbox();break;case"ArrowLeft":o.changeToPrevious();break;case"ArrowRight":o.changeToNext();break;case"F11":e.preventDefault(),i.t()}}}function q(e){var t=e.elements,n=e.sourcePointerProps,o=e.stageIndexes;function i(e,o){t.smw[e].v(n.swipedX)[o]()}this.runActionsForEvent=function(e){var r,a,c;t.container.contains(t.slideSwipingHoverer)||t.container.appendChild(t.slideSwipingHoverer),r=t.container,a=s,(c=r.classList).contains(a)||c.add(a),n.swipedX=e.screenX-n.downScreenX;var l=o.previous,u=o.next;i(o.current,"z"),void 0!==l&&n.swipedX>0?i(l,"ne"):void 0!==u&&n.swipedX<0&&i(u,"p")}}function V(e){var t=e.props.sources,n=e.resolve,o=e.sourcePointerProps,i=n(q);1===t.length?this.listener=function(){o.swipedX=1}:this.listener=function(e){o.isPointering&&i.runActionsForEvent(e)}}function _(e){var t=e.core.slideIndexChanger,n=e.elements.smw,o=e.stageIndexes,i=e.sws;function r(e){var t=n[o.current];t.a(),t[e]()}function s(e,t){void 0!==e&&(n[e].s(),n[e][t]())}this.runPositiveSwipedXActions=function(){var e=o.previous;if(void 0===e)r("z");else{r("p");var n=o.next;t.changeTo(e);var a=o.previous;i.d(a),i.b(n),r("z"),s(a,"ne")}},this.runNegativeSwipedXActions=function(){var e=o.next;if(void 0===e)r("z");else{r("ne");var n=o.previous;t.changeTo(e);var a=o.next;i.d(a),i.b(n),r("z"),s(a,"p")}}}function Y(e,t){e.contains(t)&&e.removeChild(t)}function J(e){var t=e.core.lightboxCloser,n=e.elements,o=e.resolve,i=e.sourcePointerProps,r=o(_);this.runNoSwipeActions=function(){Y(n.container,n.slideSwipingHoverer),i.isSourceDownEventTarget||t.closeLightbox(),i.isPointering=!1},this.runActions=function(){i.swipedX>0?r.runPositiveSwipedXActions():r.runNegativeSwipedXActions(),Y(n.container,n.slideSwipingHoverer),n.container.classList.remove(s),i.isPointering=!1}}function G(e){var t=e.resolve,n=e.sourcePointerProps,o=t(J);this.listener=function(){n.isPointering&&(n.swipedX?o.runActions():o.runNoSwipeActions())}}function $(e){var t=this,n=e.core,o=n.eventsDispatcher,i=n.globalEventsController,r=n.scrollbarRecompensor,s=e.data,a=e.elements,c=e.fs,u=e.props,d=e.sourcePointerProps;this.isLightboxFadingOut=!1,this.runActions=function(){t.isLightboxFadingOut=!0,a.container.classList.add(v),i.removeListeners(),u.exitFullscreenOnClose&&s.ifs&&c.x(),setTimeout((function(){t.isLightboxFadingOut=!1,d.isPointering=!1,a.container.classList.remove(v),document.documentElement.classList.remove(l),r.removeRecompense(),document.body.removeChild(a.container),o.dispatch("onClose")}),270)}}function K(e,t){var n=e.classList;n.contains(t)&&n.remove(t)}function Q(e){var t,n,o;n=(t=e).core.eventsDispatcher,o=t.props,n.dispatch=function(e){o[e]&&o[e]()},function(e){var t=e.componentsServices,n=e.data,o=e.fs,i=["fullscreenchange","webkitfullscreenchange","mozfullscreenchange","MSFullscreenChange"];function r(e){for(var t=0;t<i.length;t++)document[e](i[t],s)}function s(){document.fullscreenElement||document.webkitIsFullScreen||document.mozFullScreen||document.msFullscreenElement?t.ofs():t.xfs()}o.o=function(){t.ofs();var e=document.documentElement;e.requestFullscreen?e.requestFullscreen():e.mozRequestFullScreen?e.mozRequestFullScreen():e.webkitRequestFullscreen?e.webkitRequestFullscreen():e.msRequestFullscreen&&e.msRequestFullscreen()},o.x=function(){t.xfs(),document.exitFullscreen?document.exitFullscreen():document.mozCancelFullScreen?document.mozCancelFullScreen():document.webkitExitFullscreen?document.webkitExitFullscreen():document.msExitFullscreen&&document.msExitFullscreen()},o.t=function(){n.ifs?o.x():o.o()},o.l=function(){r("addEventListener")},o.q=function(){r("removeEventListener")}}(e),function(e){var t=e.core,n=t.globalEventsController,o=t.windowResizeActioner,i=e.fs,r=e.resolve,s=r(U),a=r(V),c=r(G);n.attachListeners=function(){document.addEventListener("pointermove",a.listener),document.addEventListener("pointerup",c.listener),addEventListener("resize",o.runActions),document.addEventListener("keydown",s.listener),i.l()},n.removeListeners=function(){document.removeEventListener("pointermove",a.listener),document.removeEventListener("pointerup",c.listener),removeEventListener("resize",o.runActions),document.removeEventListener("keydown",s.listener),i.q()}}(e),function(e){var t=e.core.lightboxCloser,n=(0,e.resolve)($);t.closeLightbox=function(){n.isLightboxFadingOut||n.runActions()}}(e),function(e){var t=e.data,n=e.core.scrollbarRecompensor;function o(){document.body.offsetHeight>innerHeight&&(document.body.style.marginRight=t.scrollbarWidth+"px")}n.addRecompense=function(){"complete"===document.readyState?o():addEventListener("load",(function(){o(),n.addRecompense=o}))},n.removeRecompense=function(){document.body.style.removeProperty("margin-right")}}(e),function(e){var t=e.core,n=t.slideChangeFacade,o=t.slideIndexChanger,i=t.stageManager;e.props.sources.length>1?(n.changeToPrevious=function(){o.jumpTo(i.getPreviousSlideIndex())},n.changeToNext=function(){o.jumpTo(i.getNextSlideIndex())}):(n.changeToPrevious=function(){},n.changeToNext=function(){})}(e),function(e){var t=e.componentsServices,n=e.core,o=n.slideIndexChanger,i=n.sourceDisplayFacade,r=n.stageManager,s=e.elements,a=s.smw,c=s.sourceAnimationWrappers,l=e.isl,u=e.stageIndexes,d=e.sws;o.changeTo=function(e){u.current=e,r.updateStageIndexes(),t.setSlideNumber(e+1),i.displaySourcesWhichShouldBeDisplayed()},o.jumpTo=function(e){var t=u.previous,n=u.current,i=u.next,s=l[n],f=l[e];o.changeTo(e);for(var p=0;p<a.length;p++)a[p].d();d.d(n),d.c(),requestAnimationFrame((function(){requestAnimationFrame((function(){var e=u.previous,o=u.next;function p(){r.i(n)?n===u.previous?a[n].ne():n===u.next&&a[n].p():(a[n].h(),a[n].n())}s&&c[n].classList.add(m),f&&c[u.current].classList.add(h),d.a(),void 0!==e&&e!==n&&a[e].ne(),a[u.current].n(),void 0!==o&&o!==n&&a[o].p(),d.b(t),d.b(i),l[n]?setTimeout(p,260):p()}))}))}}(e),function(e){var t=e.core.sourcesPointerDown,n=e.elements,o=n.smw,i=n.sources,r=e.sourcePointerProps,s=e.stageIndexes;t.listener=function(e){"VIDEO"!==e.target.tagName&&e.preventDefault(),r.isPointering=!0,r.downScreenX=e.screenX,r.swipedX=0;var t=i[s.current];t&&t.contains(e.target)?r.isSourceDownEventTarget=!0:r.isSourceDownEventTarget=!1;for(var n=0;n<o.length;n++)o[n].d()}}(e),function(e){var t=e.collections.sourcesRenderFunctions,n=e.core.sourceDisplayFacade,o=e.props,i=e.stageIndexes;function r(e){t[e]&&(t[e](),delete t[e])}n.displaySourcesWhichShouldBeDisplayed=function(){if(o.loadOnlyCurrentSource)r(i.current);else for(var e in i)r(i[e])}}(e),function(e){var t=e.core.stageManager,n=e.elements,o=n.smw,i=n.sourceAnimationWrappers,r=e.isl,s=e.stageIndexes,a=e.sws;a.a=function(){for(var e in s)o[s[e]].s()},a.b=function(e){void 0===e||t.i(e)||(o[e].h(),o[e].n())},a.c=function(){for(var e in s)a.d(s[e])},a.d=function(e){if(r[e]){var t=i[e];K(t,g),K(t,h),K(t,m)}}}(e),function(e){var t=e.collections.sourceSizers,n=e.core.windowResizeActioner,o=e.data,i=e.elements.smw,r=e.stageIndexes;n.runActions=function(){innerWidth<992?o.maxSourceWidth=innerWidth:o.maxSourceWidth=.9*innerWidth,o.maxSourceHeight=.9*innerHeight;for(var e=0;e<i.length;e++)i[e].d(),t[e]&&t[e].adjustSize();var n=r.previous,s=r.next;void 0!==n&&i[n].ne(),void 0!==s&&i[s].p()}}(e)}function Z(e){var t=e.componentsServices,n=e.core,o=n.eventsDispatcher,r=n.globalEventsController,s=n.scrollbarRecompensor,c=n.sourceDisplayFacade,u=n.stageManager,f=n.windowResizeActioner,p=e.data,h=e.elements,m=(e.props,e.stageIndexes),v=e.sws;function b(){var t,n;p.i=!0,p.scrollbarWidth=function(){var e=document.createElement("div"),t=e.style,n=document.createElement("div");t.visibility="hidden",t.width="100px",t.msOverflowStyle="scrollbar",t.overflow="scroll",n.style.width="100%",document.body.appendChild(e);var o=e.offsetWidth;e.appendChild(n);var i=n.offsetWidth;return document.body.removeChild(e),o-i}(),Q(e),h.container=document.createElement("div"),h.container.className="".concat(i,"container ").concat(a," ").concat(g),function(e){var t=e.elements;t.slideSwipingHoverer=document.createElement("div"),t.slideSwipingHoverer.className="".concat(i,"slide-swiping-hoverer ").concat(a," ").concat(d)}(e),X(e),function(e){var t=e.core.sourcesPointerDown,n=e.elements,o=e.props.sources,i=document.createElement("div");i.className="".concat(d," ").concat(a),n.container.appendChild(i),i.addEventListener("pointerdown",t.listener),n.sourceWrappersContainer=i;for(var r=0;r<o.length;r++)D(e,r)}(e),e.props.sources.length>1&&(n=(t=e).core.slideChangeFacade,B(t,n.changeToPrevious,"previous","M18.271,9.212H3.615l4.184-4.184c0.306-0.306,0.306-0.801,0-1.107c-0.306-0.306-0.801-0.306-1.107,0L1.21,9.403C1.194,9.417,1.174,9.421,1.158,9.437c-0.181,0.181-0.242,0.425-0.209,0.66c0.005,0.038,0.012,0.071,0.022,0.109c0.028,0.098,0.075,0.188,0.142,0.271c0.021,0.026,0.021,0.061,0.045,0.085c0.015,0.016,0.034,0.02,0.05,0.033l5.484,5.483c0.306,0.307,0.801,0.307,1.107,0c0.306-0.305,0.306-0.801,0-1.105l-4.184-4.185h14.656c0.436,0,0.788-0.353,0.788-0.788S18.707,9.212,18.271,9.212z"),B(t,n.changeToNext,"next","M1.729,9.212h14.656l-4.184-4.184c-0.307-0.306-0.307-0.801,0-1.107c0.305-0.306,0.801-0.306,1.106,0l5.481,5.482c0.018,0.014,0.037,0.019,0.053,0.034c0.181,0.181,0.242,0.425,0.209,0.66c-0.004,0.038-0.012,0.071-0.021,0.109c-0.028,0.098-0.075,0.188-0.143,0.271c-0.021,0.026-0.021,0.061-0.045,0.085c-0.015,0.016-0.034,0.02-0.051,0.033l-5.483,5.483c-0.306,0.307-0.802,0.307-1.106,0c-0.307-0.305-0.307-0.801,0-1.105l4.184-4.185H1.729c-0.436,0-0.788-0.353-0.788-0.788S1.293,9.212,1.729,9.212z")),function(e){for(var t=e.props.sources,n=e.resolve,o=n(L),i=n(H),r=n(R,[o,i]),s=0;s<t.length;s++)if("string"==typeof t[s]){var a=r.getTypeSetByClientForIndex(s);if(a)i.runActionsForSourceTypeAndIndex(a,s);else{var c=o.getSourceTypeFromLocalStorageByUrl(t[s]);c?i.runActionsForSourceTypeAndIndex(c,s):r.retrieveTypeWithXhrForIndex(s)}}else i.runActionsForSourceTypeAndIndex("custom",s)}(e),o.dispatch("onInit")}e.open=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,i=m.previous,a=m.current,d=m.next;m.current=n,p.i||S(e),u.updateStageIndexes(),p.i?(v.c(),v.a(),v.b(i),v.b(a),v.b(d),o.dispatch("onShow")):b(),c.displaySourcesWhichShouldBeDisplayed(),t.setSlideNumber(n+1),document.body.appendChild(h.container),document.documentElement.classList.add(l),s.addRecompense(),r.attachListeners(),f.runActions(),h.smw[m.current].n(),o.dispatch("onOpen")}}function ee(e,t,n){return(ee=te()?Reflect.construct.bind():function(e,t,n){var o=[null];o.push.apply(o,t);var i=new(Function.bind.apply(e,o));return n&&ne(i,n.prototype),i}).apply(null,arguments)}function te(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}function ne(e,t){return(ne=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e})(e,t)}function oe(e){return function(e){if(Array.isArray(e))return ie(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return ie(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return ie(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function ie(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}function re(){for(var e=document.getElementsByTagName("a"),t=function(t){if(!e[t].hasAttribute("data-fslightbox"))return"continue";var n=e[t].hasAttribute("data-href")?e[t].getAttribute("data-href"):e[t].getAttribute("href");if(!n)return console.warn('The "data-fslightbox" attribute was set without the "href" attribute.'),"continue";var o=e[t].getAttribute("data-fslightbox");fsLightboxInstances[o]||(fsLightboxInstances[o]=new FsLightbox);var i=null;"#"===n.charAt(0)?(i=document.getElementById(n.substring(1)).cloneNode(!0)).removeAttribute("id"):i=n,fsLightboxInstances[o].props.sources.push(i),fsLightboxInstances[o].elements.a.push(e[t]);var r=fsLightboxInstances[o].props.sources.length-1;e[t].onclick=function(e){e.preventDefault(),fsLightboxInstances[o].open(r)},d("types","data-type"),d("videosPosters","data-video-poster"),d("customClasses","data-class"),d("customClasses","data-custom-class");for(var s=["href","data-fslightbox","data-href","data-type","data-video-poster","data-class","data-custom-class"],a=e[t].attributes,c=fsLightboxInstances[o].props.customAttributes,l=0;l<a.length;l++)if(-1===s.indexOf(a[l].name)&&"data-"===a[l].name.substr(0,5)){c[r]||(c[r]={});var u=a[l].name.substr(5);c[r][u]=a[l].value}function d(n,i){e[t].hasAttribute(i)&&(fsLightboxInstances[o].props[n][r]=e[t].getAttribute(i))}},n=0;n<e.length;n++)t(n);var o=Object.keys(fsLightboxInstances);window.fsLightbox=fsLightboxInstances[o[o.length-1]]}window.FsLightbox=function(){var e=this;this.props={sources:[],customAttributes:[],customClasses:[],types:[],videosPosters:[],slideDistance:.3},this.data={isFullscreenOpen:!1,maxSourceWidth:0,maxSourceHeight:0,scrollbarWidth:0},this.isl=[],this.sourcePointerProps={downScreenX:null,isPointering:!1,isSourceDownEventTarget:!1,swipedX:0},this.stageIndexes={},this.elements={a:[],container:null,slideSwipingHoverer:null,smw:[],sourceWrappersContainer:null,sources:[],sourceAnimationWrappers:[]},this.componentsServices={setSlideNumber:function(){}},this.resolve=function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];return n.unshift(e),ee(t,oe(n))},this.collections={sourceLoadHandlers:[],sourcesRenderFunctions:[],sourceSizers:[]},this.core={eventsDispatcher:{},globalEventsController:{},lightboxCloser:{},lightboxUpdater:{},scrollbarRecompensor:{},slideChangeFacade:{},slideIndexChanger:{},sourcesPointerDown:{},sourceDisplayFacade:{},stageManager:{},windowResizeActioner:{}},this.fs={},this.sws={},Z(this),this.close=function(){return e.core.lightboxCloser.closeLightbox()}},window.fsLightboxInstances={},re(),window.refreshFsLightbox=function(){for(var e in fsLightboxInstances){var t=fsLightboxInstances[e].props;fsLightboxInstances[e]=new FsLightbox,fsLightboxInstances[e].props=t,fsLightboxInstances[e].props.sources=[],fsLightboxInstances[e].elements.a=[]}re()}}])}));

/***/ }),

/***/ "./node_modules/get-size/get-size.js":
/*!*******************************************!*\
  !*** ./node_modules/get-size/get-size.js ***!
  \*******************************************/
/***/ ((module, exports, __webpack_require__) => {

var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
 * getSize v2.0.3
 * measure size of elements
 * MIT license
 */

/* jshint browser: true, strict: true, undef: true, unused: true */
/* globals console: false */

( function( window, factory ) {
  /* jshint strict: false */ /* globals define, module */
  if ( true ) {
    // AMD
    !(__WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
		__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
		(__WEBPACK_AMD_DEFINE_FACTORY__.call(exports, __webpack_require__, exports, module)) :
		__WEBPACK_AMD_DEFINE_FACTORY__),
		__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
  } else {}

})( window, function factory() {
'use strict';

// -------------------------- helpers -------------------------- //

// get a number from a string, not a percentage
function getStyleSize( value ) {
  var num = parseFloat( value );
  // not a percent like '100%', and a number
  var isValid = value.indexOf('%') == -1 && !isNaN( num );
  return isValid && num;
}

function noop() {}

var logError = typeof console == 'undefined' ? noop :
  function( message ) {
    console.error( message );
  };

// -------------------------- measurements -------------------------- //

var measurements = [
  'paddingLeft',
  'paddingRight',
  'paddingTop',
  'paddingBottom',
  'marginLeft',
  'marginRight',
  'marginTop',
  'marginBottom',
  'borderLeftWidth',
  'borderRightWidth',
  'borderTopWidth',
  'borderBottomWidth'
];

var measurementsLength = measurements.length;

function getZeroSize() {
  var size = {
    width: 0,
    height: 0,
    innerWidth: 0,
    innerHeight: 0,
    outerWidth: 0,
    outerHeight: 0
  };
  for ( var i=0; i < measurementsLength; i++ ) {
    var measurement = measurements[i];
    size[ measurement ] = 0;
  }
  return size;
}

// -------------------------- getStyle -------------------------- //

/**
 * getStyle, get style of element, check for Firefox bug
 * https://bugzilla.mozilla.org/show_bug.cgi?id=548397
 */
function getStyle( elem ) {
  var style = getComputedStyle( elem );
  if ( !style ) {
    logError( 'Style returned ' + style +
      '. Are you running this code in a hidden iframe on Firefox? ' +
      'See https://bit.ly/getsizebug1' );
  }
  return style;
}

// -------------------------- setup -------------------------- //

var isSetup = false;

var isBoxSizeOuter;

/**
 * setup
 * check isBoxSizerOuter
 * do on first getSize() rather than on page load for Firefox bug
 */
function setup() {
  // setup once
  if ( isSetup ) {
    return;
  }
  isSetup = true;

  // -------------------------- box sizing -------------------------- //

  /**
   * Chrome & Safari measure the outer-width on style.width on border-box elems
   * IE11 & Firefox<29 measures the inner-width
   */
  var div = document.createElement('div');
  div.style.width = '200px';
  div.style.padding = '1px 2px 3px 4px';
  div.style.borderStyle = 'solid';
  div.style.borderWidth = '1px 2px 3px 4px';
  div.style.boxSizing = 'border-box';

  var body = document.body || document.documentElement;
  body.appendChild( div );
  var style = getStyle( div );
  // round value for browser zoom. desandro/masonry#928
  isBoxSizeOuter = Math.round( getStyleSize( style.width ) ) == 200;
  getSize.isBoxSizeOuter = isBoxSizeOuter;

  body.removeChild( div );
}

// -------------------------- getSize -------------------------- //

function getSize( elem ) {
  setup();

  // use querySeletor if elem is string
  if ( typeof elem == 'string' ) {
    elem = document.querySelector( elem );
  }

  // do not proceed on non-objects
  if ( !elem || typeof elem != 'object' || !elem.nodeType ) {
    return;
  }

  var style = getStyle( elem );

  // if hidden, everything is 0
  if ( style.display == 'none' ) {
    return getZeroSize();
  }

  var size = {};
  size.width = elem.offsetWidth;
  size.height = elem.offsetHeight;

  var isBorderBox = size.isBorderBox = style.boxSizing == 'border-box';

  // get all measurements
  for ( var i=0; i < measurementsLength; i++ ) {
    var measurement = measurements[i];
    var value = style[ measurement ];
    var num = parseFloat( value );
    // any 'auto', 'medium' value will be 0
    size[ measurement ] = !isNaN( num ) ? num : 0;
  }

  var paddingWidth = size.paddingLeft + size.paddingRight;
  var paddingHeight = size.paddingTop + size.paddingBottom;
  var marginWidth = size.marginLeft + size.marginRight;
  var marginHeight = size.marginTop + size.marginBottom;
  var borderWidth = size.borderLeftWidth + size.borderRightWidth;
  var borderHeight = size.borderTopWidth + size.borderBottomWidth;

  var isBorderBoxSizeOuter = isBorderBox && isBoxSizeOuter;

  // overwrite width and height if we can get it from style
  var styleWidth = getStyleSize( style.width );
  if ( styleWidth !== false ) {
    size.width = styleWidth +
      // add padding and border unless it's already including it
      ( isBorderBoxSizeOuter ? 0 : paddingWidth + borderWidth );
  }

  var styleHeight = getStyleSize( style.height );
  if ( styleHeight !== false ) {
    size.height = styleHeight +
      // add padding and border unless it's already including it
      ( isBorderBoxSizeOuter ? 0 : paddingHeight + borderHeight );
  }

  size.innerWidth = size.width - ( paddingWidth + borderWidth );
  size.innerHeight = size.height - ( paddingHeight + borderHeight );

  size.outerWidth = size.width + marginWidth;
  size.outerHeight = size.height + marginHeight;

  return size;
}

return getSize;

});


/***/ }),

/***/ "./node_modules/html-to-image/es/apply-style.js":
/*!******************************************************!*\
  !*** ./node_modules/html-to-image/es/apply-style.js ***!
  \******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "applyStyle": () => (/* binding */ applyStyle)
/* harmony export */ });
function applyStyle(node, options) {
    const { style } = node;
    if (options.backgroundColor) {
        style.backgroundColor = options.backgroundColor;
    }
    if (options.width) {
        style.width = `${options.width}px`;
    }
    if (options.height) {
        style.height = `${options.height}px`;
    }
    const manual = options.style;
    if (manual != null) {
        Object.keys(manual).forEach((key) => {
            style[key] = manual[key];
        });
    }
    return node;
}
//# sourceMappingURL=apply-style.js.map

/***/ }),

/***/ "./node_modules/html-to-image/es/clone-node.js":
/*!*****************************************************!*\
  !*** ./node_modules/html-to-image/es/clone-node.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "cloneNode": () => (/* binding */ cloneNode)
/* harmony export */ });
/* harmony import */ var _clone_pseudos__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./clone-pseudos */ "./node_modules/html-to-image/es/clone-pseudos.js");
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./util */ "./node_modules/html-to-image/es/util.js");
/* harmony import */ var _mimes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./mimes */ "./node_modules/html-to-image/es/mimes.js");
/* harmony import */ var _dataurl__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./dataurl */ "./node_modules/html-to-image/es/dataurl.js");




async function cloneCanvasElement(canvas) {
    const dataURL = canvas.toDataURL();
    if (dataURL === 'data:,') {
        return canvas.cloneNode(false);
    }
    return (0,_util__WEBPACK_IMPORTED_MODULE_1__.createImage)(dataURL);
}
async function cloneVideoElement(video, options) {
    if (video.currentSrc) {
        const canvas = document.createElement('canvas');
        const ctx = canvas.getContext('2d');
        canvas.width = video.clientWidth;
        canvas.height = video.clientHeight;
        ctx === null || ctx === void 0 ? void 0 : ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
        const dataURL = canvas.toDataURL();
        return (0,_util__WEBPACK_IMPORTED_MODULE_1__.createImage)(dataURL);
    }
    const poster = video.poster;
    const contentType = (0,_mimes__WEBPACK_IMPORTED_MODULE_2__.getMimeType)(poster);
    const dataURL = await (0,_dataurl__WEBPACK_IMPORTED_MODULE_3__.resourceToDataURL)(poster, contentType, options);
    return (0,_util__WEBPACK_IMPORTED_MODULE_1__.createImage)(dataURL);
}
async function cloneIFrameElement(iframe) {
    var _a;
    try {
        if ((_a = iframe === null || iframe === void 0 ? void 0 : iframe.contentDocument) === null || _a === void 0 ? void 0 : _a.body) {
            return (await cloneNode(iframe.contentDocument.body, {}, true));
        }
    }
    catch (_b) {
        // Failed to clone iframe
    }
    return iframe.cloneNode(false);
}
async function cloneSingleNode(node, options) {
    if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(node, HTMLCanvasElement)) {
        return cloneCanvasElement(node);
    }
    if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(node, HTMLVideoElement)) {
        return cloneVideoElement(node, options);
    }
    if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(node, HTMLIFrameElement)) {
        return cloneIFrameElement(node);
    }
    return node.cloneNode(false);
}
const isSlotElement = (node) => node.tagName != null && node.tagName.toUpperCase() === 'SLOT';
async function cloneChildren(nativeNode, clonedNode, options) {
    var _a, _b;
    let children = [];
    if (isSlotElement(nativeNode) && nativeNode.assignedNodes) {
        children = (0,_util__WEBPACK_IMPORTED_MODULE_1__.toArray)(nativeNode.assignedNodes());
    }
    else if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(nativeNode, HTMLIFrameElement) &&
        ((_a = nativeNode.contentDocument) === null || _a === void 0 ? void 0 : _a.body)) {
        children = (0,_util__WEBPACK_IMPORTED_MODULE_1__.toArray)(nativeNode.contentDocument.body.childNodes);
    }
    else {
        children = (0,_util__WEBPACK_IMPORTED_MODULE_1__.toArray)(((_b = nativeNode.shadowRoot) !== null && _b !== void 0 ? _b : nativeNode).childNodes);
    }
    if (children.length === 0 ||
        (0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(nativeNode, HTMLVideoElement)) {
        return clonedNode;
    }
    await children.reduce((deferred, child) => deferred
        .then(() => cloneNode(child, options))
        .then((clonedChild) => {
        if (clonedChild) {
            clonedNode.appendChild(clonedChild);
        }
    }), Promise.resolve());
    return clonedNode;
}
function cloneCSSStyle(nativeNode, clonedNode) {
    const targetStyle = clonedNode.style;
    if (!targetStyle) {
        return;
    }
    const sourceStyle = window.getComputedStyle(nativeNode);
    if (sourceStyle.cssText) {
        targetStyle.cssText = sourceStyle.cssText;
        targetStyle.transformOrigin = sourceStyle.transformOrigin;
    }
    else {
        (0,_util__WEBPACK_IMPORTED_MODULE_1__.toArray)(sourceStyle).forEach((name) => {
            let value = sourceStyle.getPropertyValue(name);
            if (name === 'font-size' && value.endsWith('px')) {
                const reducedFont = Math.floor(parseFloat(value.substring(0, value.length - 2))) - 0.1;
                value = `${reducedFont}px`;
            }
            if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(nativeNode, HTMLIFrameElement) &&
                name === 'display' &&
                value === 'inline') {
                value = 'block';
            }
            if (name === 'd' && clonedNode.getAttribute('d')) {
                value = `path(${clonedNode.getAttribute('d')})`;
            }
            targetStyle.setProperty(name, value, sourceStyle.getPropertyPriority(name));
        });
    }
}
function cloneInputValue(nativeNode, clonedNode) {
    if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(nativeNode, HTMLTextAreaElement)) {
        clonedNode.innerHTML = nativeNode.value;
    }
    if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(nativeNode, HTMLInputElement)) {
        clonedNode.setAttribute('value', nativeNode.value);
    }
}
function cloneSelectValue(nativeNode, clonedNode) {
    if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(nativeNode, HTMLSelectElement)) {
        const clonedSelect = clonedNode;
        const selectedOption = Array.from(clonedSelect.children).find((child) => nativeNode.value === child.getAttribute('value'));
        if (selectedOption) {
            selectedOption.setAttribute('selected', '');
        }
    }
}
function decorate(nativeNode, clonedNode) {
    if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(clonedNode, Element)) {
        cloneCSSStyle(nativeNode, clonedNode);
        (0,_clone_pseudos__WEBPACK_IMPORTED_MODULE_0__.clonePseudoElements)(nativeNode, clonedNode);
        cloneInputValue(nativeNode, clonedNode);
        cloneSelectValue(nativeNode, clonedNode);
    }
    return clonedNode;
}
async function ensureSVGSymbols(clone, options) {
    const uses = clone.querySelectorAll ? clone.querySelectorAll('use') : [];
    if (uses.length === 0) {
        return clone;
    }
    const processedDefs = {};
    for (let i = 0; i < uses.length; i++) {
        const use = uses[i];
        const id = use.getAttribute('xlink:href');
        if (id) {
            const exist = clone.querySelector(id);
            const definition = document.querySelector(id);
            if (!exist && definition && !processedDefs[id]) {
                // eslint-disable-next-line no-await-in-loop
                processedDefs[id] = (await cloneNode(definition, options, true));
            }
        }
    }
    const nodes = Object.values(processedDefs);
    if (nodes.length) {
        const ns = 'http://www.w3.org/1999/xhtml';
        const svg = document.createElementNS(ns, 'svg');
        svg.setAttribute('xmlns', ns);
        svg.style.position = 'absolute';
        svg.style.width = '0';
        svg.style.height = '0';
        svg.style.overflow = 'hidden';
        svg.style.display = 'none';
        const defs = document.createElementNS(ns, 'defs');
        svg.appendChild(defs);
        for (let i = 0; i < nodes.length; i++) {
            defs.appendChild(nodes[i]);
        }
        clone.appendChild(svg);
    }
    return clone;
}
async function cloneNode(node, options, isRoot) {
    if (!isRoot && options.filter && !options.filter(node)) {
        return null;
    }
    return Promise.resolve(node)
        .then((clonedNode) => cloneSingleNode(clonedNode, options))
        .then((clonedNode) => cloneChildren(node, clonedNode, options))
        .then((clonedNode) => decorate(node, clonedNode))
        .then((clonedNode) => ensureSVGSymbols(clonedNode, options));
}
//# sourceMappingURL=clone-node.js.map

/***/ }),

/***/ "./node_modules/html-to-image/es/clone-pseudos.js":
/*!********************************************************!*\
  !*** ./node_modules/html-to-image/es/clone-pseudos.js ***!
  \********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "clonePseudoElements": () => (/* binding */ clonePseudoElements)
/* harmony export */ });
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./util */ "./node_modules/html-to-image/es/util.js");

function formatCSSText(style) {
    const content = style.getPropertyValue('content');
    return `${style.cssText} content: '${content.replace(/'|"/g, '')}';`;
}
function formatCSSProperties(style) {
    return (0,_util__WEBPACK_IMPORTED_MODULE_0__.toArray)(style)
        .map((name) => {
        const value = style.getPropertyValue(name);
        const priority = style.getPropertyPriority(name);
        return `${name}: ${value}${priority ? ' !important' : ''};`;
    })
        .join(' ');
}
function getPseudoElementStyle(className, pseudo, style) {
    const selector = `.${className}:${pseudo}`;
    const cssText = style.cssText
        ? formatCSSText(style)
        : formatCSSProperties(style);
    return document.createTextNode(`${selector}{${cssText}}`);
}
function clonePseudoElement(nativeNode, clonedNode, pseudo) {
    const style = window.getComputedStyle(nativeNode, pseudo);
    const content = style.getPropertyValue('content');
    if (content === '' || content === 'none') {
        return;
    }
    const className = (0,_util__WEBPACK_IMPORTED_MODULE_0__.uuid)();
    try {
        clonedNode.className = `${clonedNode.className} ${className}`;
    }
    catch (err) {
        return;
    }
    const styleElement = document.createElement('style');
    styleElement.appendChild(getPseudoElementStyle(className, pseudo, style));
    clonedNode.appendChild(styleElement);
}
function clonePseudoElements(nativeNode, clonedNode) {
    clonePseudoElement(nativeNode, clonedNode, ':before');
    clonePseudoElement(nativeNode, clonedNode, ':after');
}
//# sourceMappingURL=clone-pseudos.js.map

/***/ }),

/***/ "./node_modules/html-to-image/es/dataurl.js":
/*!**************************************************!*\
  !*** ./node_modules/html-to-image/es/dataurl.js ***!
  \**************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "fetchAsDataURL": () => (/* binding */ fetchAsDataURL),
/* harmony export */   "isDataUrl": () => (/* binding */ isDataUrl),
/* harmony export */   "makeDataUrl": () => (/* binding */ makeDataUrl),
/* harmony export */   "resourceToDataURL": () => (/* binding */ resourceToDataURL)
/* harmony export */ });
function getContentFromDataUrl(dataURL) {
    return dataURL.split(/,/)[1];
}
function isDataUrl(url) {
    return url.search(/^(data:)/) !== -1;
}
function makeDataUrl(content, mimeType) {
    return `data:${mimeType};base64,${content}`;
}
async function fetchAsDataURL(url, init, process) {
    const res = await fetch(url, init);
    if (res.status === 404) {
        throw new Error(`Resource "${res.url}" not found`);
    }
    const blob = await res.blob();
    return new Promise((resolve, reject) => {
        const reader = new FileReader();
        reader.onerror = reject;
        reader.onloadend = () => {
            try {
                resolve(process({ res, result: reader.result }));
            }
            catch (error) {
                reject(error);
            }
        };
        reader.readAsDataURL(blob);
    });
}
const cache = {};
function getCacheKey(url, contentType, includeQueryParams) {
    let key = url.replace(/\?.*/, '');
    if (includeQueryParams) {
        key = url;
    }
    // font resource
    if (/ttf|otf|eot|woff2?/i.test(key)) {
        key = key.replace(/.*\//, '');
    }
    return contentType ? `[${contentType}]${key}` : key;
}
async function resourceToDataURL(resourceUrl, contentType, options) {
    const cacheKey = getCacheKey(resourceUrl, contentType, options.includeQueryParams);
    if (cache[cacheKey] != null) {
        return cache[cacheKey];
    }
    // ref: https://developer.mozilla.org/en/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Bypassing_the_cache
    if (options.cacheBust) {
        // eslint-disable-next-line no-param-reassign
        resourceUrl += (/\?/.test(resourceUrl) ? '&' : '?') + new Date().getTime();
    }
    let dataURL;
    try {
        const content = await fetchAsDataURL(resourceUrl, options.fetchRequestInit, ({ res, result }) => {
            if (!contentType) {
                // eslint-disable-next-line no-param-reassign
                contentType = res.headers.get('Content-Type') || '';
            }
            return getContentFromDataUrl(result);
        });
        dataURL = makeDataUrl(content, contentType);
    }
    catch (error) {
        dataURL = options.imagePlaceholder || '';
        let msg = `Failed to fetch resource: ${resourceUrl}`;
        if (error) {
            msg = typeof error === 'string' ? error : error.message;
        }
        if (msg) {
            console.warn(msg);
        }
    }
    cache[cacheKey] = dataURL;
    return dataURL;
}
//# sourceMappingURL=dataurl.js.map

/***/ }),

/***/ "./node_modules/html-to-image/es/embed-images.js":
/*!*******************************************************!*\
  !*** ./node_modules/html-to-image/es/embed-images.js ***!
  \*******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "embedImages": () => (/* binding */ embedImages)
/* harmony export */ });
/* harmony import */ var _embed_resources__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./embed-resources */ "./node_modules/html-to-image/es/embed-resources.js");
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./util */ "./node_modules/html-to-image/es/util.js");
/* harmony import */ var _dataurl__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./dataurl */ "./node_modules/html-to-image/es/dataurl.js");
/* harmony import */ var _mimes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./mimes */ "./node_modules/html-to-image/es/mimes.js");




async function embedProp(propName, node, options) {
    var _a;
    const propValue = (_a = node.style) === null || _a === void 0 ? void 0 : _a.getPropertyValue(propName);
    if (propValue) {
        const cssString = await (0,_embed_resources__WEBPACK_IMPORTED_MODULE_0__.embedResources)(propValue, null, options);
        node.style.setProperty(propName, cssString, node.style.getPropertyPriority(propName));
        return true;
    }
    return false;
}
async function embedBackground(clonedNode, options) {
    if (!(await embedProp('background', clonedNode, options))) {
        await embedProp('background-image', clonedNode, options);
    }
    if (!(await embedProp('mask', clonedNode, options))) {
        await embedProp('mask-image', clonedNode, options);
    }
}
async function embedImageNode(clonedNode, options) {
    const isImageElement = (0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(clonedNode, HTMLImageElement);
    if (!(isImageElement && !(0,_dataurl__WEBPACK_IMPORTED_MODULE_2__.isDataUrl)(clonedNode.src)) &&
        !((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(clonedNode, SVGImageElement) &&
            !(0,_dataurl__WEBPACK_IMPORTED_MODULE_2__.isDataUrl)(clonedNode.href.baseVal))) {
        return;
    }
    const url = isImageElement ? clonedNode.src : clonedNode.href.baseVal;
    const dataURL = await (0,_dataurl__WEBPACK_IMPORTED_MODULE_2__.resourceToDataURL)(url, (0,_mimes__WEBPACK_IMPORTED_MODULE_3__.getMimeType)(url), options);
    await new Promise((resolve, reject) => {
        clonedNode.onload = resolve;
        clonedNode.onerror = reject;
        const image = clonedNode;
        if (image.decode) {
            image.decode = resolve;
        }
        if (image.loading === 'lazy') {
            image.loading = 'eager';
        }
        if (isImageElement) {
            clonedNode.srcset = '';
            clonedNode.src = dataURL;
        }
        else {
            clonedNode.href.baseVal = dataURL;
        }
    });
}
async function embedChildren(clonedNode, options) {
    const children = (0,_util__WEBPACK_IMPORTED_MODULE_1__.toArray)(clonedNode.childNodes);
    const deferreds = children.map((child) => embedImages(child, options));
    await Promise.all(deferreds).then(() => clonedNode);
}
async function embedImages(clonedNode, options) {
    if ((0,_util__WEBPACK_IMPORTED_MODULE_1__.isInstanceOfElement)(clonedNode, Element)) {
        await embedBackground(clonedNode, options);
        await embedImageNode(clonedNode, options);
        await embedChildren(clonedNode, options);
    }
}
//# sourceMappingURL=embed-images.js.map

/***/ }),

/***/ "./node_modules/html-to-image/es/embed-resources.js":
/*!**********************************************************!*\
  !*** ./node_modules/html-to-image/es/embed-resources.js ***!
  \**********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "embed": () => (/* binding */ embed),
/* harmony export */   "embedResources": () => (/* binding */ embedResources),
/* harmony export */   "parseURLs": () => (/* binding */ parseURLs),
/* harmony export */   "shouldEmbed": () => (/* binding */ shouldEmbed)
/* harmony export */ });
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./util */ "./node_modules/html-to-image/es/util.js");
/* harmony import */ var _mimes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./mimes */ "./node_modules/html-to-image/es/mimes.js");
/* harmony import */ var _dataurl__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./dataurl */ "./node_modules/html-to-image/es/dataurl.js");



const URL_REGEX = /url\((['"]?)([^'"]+?)\1\)/g;
const URL_WITH_FORMAT_REGEX = /url\([^)]+\)\s*format\((["']?)([^"']+)\1\)/g;
const FONT_SRC_REGEX = /src:\s*(?:url\([^)]+\)\s*format\([^)]+\)[,;]\s*)+/g;
function toRegex(url) {
    // eslint-disable-next-line no-useless-escape
    const escaped = url.replace(/([.*+?^${}()|\[\]\/\\])/g, '\\$1');
    return new RegExp(`(url\\(['"]?)(${escaped})(['"]?\\))`, 'g');
}
function parseURLs(cssText) {
    const urls = [];
    cssText.replace(URL_REGEX, (raw, quotation, url) => {
        urls.push(url);
        return raw;
    });
    return urls.filter((url) => !(0,_dataurl__WEBPACK_IMPORTED_MODULE_2__.isDataUrl)(url));
}
async function embed(cssText, resourceURL, baseURL, options, getContentFromUrl) {
    try {
        const resolvedURL = baseURL ? (0,_util__WEBPACK_IMPORTED_MODULE_0__.resolveUrl)(resourceURL, baseURL) : resourceURL;
        const contentType = (0,_mimes__WEBPACK_IMPORTED_MODULE_1__.getMimeType)(resourceURL);
        let dataURL;
        if (getContentFromUrl) {
            const content = await getContentFromUrl(resolvedURL);
            dataURL = (0,_dataurl__WEBPACK_IMPORTED_MODULE_2__.makeDataUrl)(content, contentType);
        }
        else {
            dataURL = await (0,_dataurl__WEBPACK_IMPORTED_MODULE_2__.resourceToDataURL)(resolvedURL, contentType, options);
        }
        return cssText.replace(toRegex(resourceURL), `$1${dataURL}$3`);
    }
    catch (error) {
        // pass
    }
    return cssText;
}
function filterPreferredFontFormat(str, { preferredFontFormat }) {
    return !preferredFontFormat
        ? str
        : str.replace(FONT_SRC_REGEX, (match) => {
            // eslint-disable-next-line no-constant-condition
            while (true) {
                const [src, , format] = URL_WITH_FORMAT_REGEX.exec(match) || [];
                if (!format) {
                    return '';
                }
                if (format === preferredFontFormat) {
                    return `src: ${src};`;
                }
            }
        });
}
function shouldEmbed(url) {
    return url.search(URL_REGEX) !== -1;
}
async function embedResources(cssText, baseUrl, options) {
    if (!shouldEmbed(cssText)) {
        return cssText;
    }
    const filteredCSSText = filterPreferredFontFormat(cssText, options);
    const urls = parseURLs(filteredCSSText);
    return urls.reduce((deferred, url) => deferred.then((css) => embed(css, url, baseUrl, options)), Promise.resolve(filteredCSSText));
}
//# sourceMappingURL=embed-resources.js.map

/***/ }),

/***/ "./node_modules/html-to-image/es/embed-webfonts.js":
/*!*********************************************************!*\
  !*** ./node_modules/html-to-image/es/embed-webfonts.js ***!
  \*********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "embedWebFonts": () => (/* binding */ embedWebFonts),
/* harmony export */   "getWebFontCSS": () => (/* binding */ getWebFontCSS)
/* harmony export */ });
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./util */ "./node_modules/html-to-image/es/util.js");
/* harmony import */ var _dataurl__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./dataurl */ "./node_modules/html-to-image/es/dataurl.js");
/* harmony import */ var _embed_resources__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./embed-resources */ "./node_modules/html-to-image/es/embed-resources.js");



const cssFetchCache = {};
async function fetchCSS(url) {
    let cache = cssFetchCache[url];
    if (cache != null) {
        return cache;
    }
    const res = await fetch(url);
    const cssText = await res.text();
    cache = { url, cssText };
    cssFetchCache[url] = cache;
    return cache;
}
async function embedFonts(data, options) {
    let cssText = data.cssText;
    const regexUrl = /url\(["']?([^"')]+)["']?\)/g;
    const fontLocs = cssText.match(/url\([^)]+\)/g) || [];
    const loadFonts = fontLocs.map(async (loc) => {
        let url = loc.replace(regexUrl, '$1');
        if (!url.startsWith('https://')) {
            url = new URL(url, data.url).href;
        }
        return (0,_dataurl__WEBPACK_IMPORTED_MODULE_1__.fetchAsDataURL)(url, options.fetchRequestInit, ({ result }) => {
            cssText = cssText.replace(loc, `url(${result})`);
            return [loc, result];
        });
    });
    return Promise.all(loadFonts).then(() => cssText);
}
function parseCSS(source) {
    if (source == null) {
        return [];
    }
    const result = [];
    const commentsRegex = /(\/\*[\s\S]*?\*\/)/gi;
    // strip out comments
    let cssText = source.replace(commentsRegex, '');
    // eslint-disable-next-line prefer-regex-literals
    const keyframesRegex = new RegExp('((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)})', 'gi');
    // eslint-disable-next-line no-constant-condition
    while (true) {
        const matches = keyframesRegex.exec(cssText);
        if (matches === null) {
            break;
        }
        result.push(matches[0]);
    }
    cssText = cssText.replace(keyframesRegex, '');
    const importRegex = /@import[\s\S]*?url\([^)]*\)[\s\S]*?;/gi;
    // to match css & media queries together
    const combinedCSSRegex = '((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]' +
        '*?){([\\s\\S]*?)}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)})';
    // unified regex
    const unifiedRegex = new RegExp(combinedCSSRegex, 'gi');
    // eslint-disable-next-line no-constant-condition
    while (true) {
        let matches = importRegex.exec(cssText);
        if (matches === null) {
            matches = unifiedRegex.exec(cssText);
            if (matches === null) {
                break;
            }
            else {
                importRegex.lastIndex = unifiedRegex.lastIndex;
            }
        }
        else {
            unifiedRegex.lastIndex = importRegex.lastIndex;
        }
        result.push(matches[0]);
    }
    return result;
}
async function getCSSRules(styleSheets, options) {
    const ret = [];
    const deferreds = [];
    // First loop inlines imports
    styleSheets.forEach((sheet) => {
        if ('cssRules' in sheet) {
            try {
                (0,_util__WEBPACK_IMPORTED_MODULE_0__.toArray)(sheet.cssRules || []).forEach((item, index) => {
                    if (item.type === CSSRule.IMPORT_RULE) {
                        let importIndex = index + 1;
                        const url = item.href;
                        const deferred = fetchCSS(url)
                            .then((metadata) => embedFonts(metadata, options))
                            .then((cssText) => parseCSS(cssText).forEach((rule) => {
                            try {
                                sheet.insertRule(rule, rule.startsWith('@import')
                                    ? (importIndex += 1)
                                    : sheet.cssRules.length);
                            }
                            catch (error) {
                                console.error('Error inserting rule from remote css', {
                                    rule,
                                    error,
                                });
                            }
                        }))
                            .catch((e) => {
                            console.error('Error loading remote css', e.toString());
                        });
                        deferreds.push(deferred);
                    }
                });
            }
            catch (e) {
                const inline = styleSheets.find((a) => a.href == null) || document.styleSheets[0];
                if (sheet.href != null) {
                    deferreds.push(fetchCSS(sheet.href)
                        .then((metadata) => embedFonts(metadata, options))
                        .then((cssText) => parseCSS(cssText).forEach((rule) => {
                        inline.insertRule(rule, sheet.cssRules.length);
                    }))
                        .catch((err) => {
                        console.error('Error loading remote stylesheet', err);
                    }));
                }
                console.error('Error inlining remote css file', e);
            }
        }
    });
    return Promise.all(deferreds).then(() => {
        // Second loop parses rules
        styleSheets.forEach((sheet) => {
            if ('cssRules' in sheet) {
                try {
                    (0,_util__WEBPACK_IMPORTED_MODULE_0__.toArray)(sheet.cssRules || []).forEach((item) => {
                        ret.push(item);
                    });
                }
                catch (e) {
                    console.error(`Error while reading CSS rules from ${sheet.href}`, e);
                }
            }
        });
        return ret;
    });
}
function getWebFontRules(cssRules) {
    return cssRules
        .filter((rule) => rule.type === CSSRule.FONT_FACE_RULE)
        .filter((rule) => (0,_embed_resources__WEBPACK_IMPORTED_MODULE_2__.shouldEmbed)(rule.style.getPropertyValue('src')));
}
async function parseWebFontRules(node, options) {
    if (node.ownerDocument == null) {
        throw new Error('Provided element is not within a Document');
    }
    const styleSheets = (0,_util__WEBPACK_IMPORTED_MODULE_0__.toArray)(node.ownerDocument.styleSheets);
    const cssRules = await getCSSRules(styleSheets, options);
    return getWebFontRules(cssRules);
}
async function getWebFontCSS(node, options) {
    const rules = await parseWebFontRules(node, options);
    const cssTexts = await Promise.all(rules.map((rule) => {
        const baseUrl = rule.parentStyleSheet ? rule.parentStyleSheet.href : null;
        return (0,_embed_resources__WEBPACK_IMPORTED_MODULE_2__.embedResources)(rule.cssText, baseUrl, options);
    }));
    return cssTexts.join('\n');
}
async function embedWebFonts(clonedNode, options) {
    const cssText = options.fontEmbedCSS != null
        ? options.fontEmbedCSS
        : options.skipFonts
            ? null
            : await getWebFontCSS(clonedNode, options);
    if (cssText) {
        const styleNode = document.createElement('style');
        const sytleContent = document.createTextNode(cssText);
        styleNode.appendChild(sytleContent);
        if (clonedNode.firstChild) {
            clonedNode.insertBefore(styleNode, clonedNode.firstChild);
        }
        else {
            clonedNode.appendChild(styleNode);
        }
    }
}
//# sourceMappingURL=embed-webfonts.js.map

/***/ }),

/***/ "./node_modules/html-to-image/es/index.js":
/*!************************************************!*\
  !*** ./node_modules/html-to-image/es/index.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "getFontEmbedCSS": () => (/* binding */ getFontEmbedCSS),
/* harmony export */   "toBlob": () => (/* binding */ toBlob),
/* harmony export */   "toCanvas": () => (/* binding */ toCanvas),
/* harmony export */   "toJpeg": () => (/* binding */ toJpeg),
/* harmony export */   "toPixelData": () => (/* binding */ toPixelData),
/* harmony export */   "toPng": () => (/* binding */ toPng),
/* harmony export */   "toSvg": () => (/* binding */ toSvg)
/* harmony export */ });
/* harmony import */ var _clone_node__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./clone-node */ "./node_modules/html-to-image/es/clone-node.js");
/* harmony import */ var _embed_images__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./embed-images */ "./node_modules/html-to-image/es/embed-images.js");
/* harmony import */ var _apply_style__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./apply-style */ "./node_modules/html-to-image/es/apply-style.js");
/* harmony import */ var _embed_webfonts__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./embed-webfonts */ "./node_modules/html-to-image/es/embed-webfonts.js");
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./util */ "./node_modules/html-to-image/es/util.js");





async function toSvg(node, options = {}) {
    const { width, height } = (0,_util__WEBPACK_IMPORTED_MODULE_4__.getImageSize)(node, options);
    const clonedNode = (await (0,_clone_node__WEBPACK_IMPORTED_MODULE_0__.cloneNode)(node, options, true));
    await (0,_embed_webfonts__WEBPACK_IMPORTED_MODULE_3__.embedWebFonts)(clonedNode, options);
    await (0,_embed_images__WEBPACK_IMPORTED_MODULE_1__.embedImages)(clonedNode, options);
    (0,_apply_style__WEBPACK_IMPORTED_MODULE_2__.applyStyle)(clonedNode, options);
    const datauri = await (0,_util__WEBPACK_IMPORTED_MODULE_4__.nodeToDataURL)(clonedNode, width, height);
    return datauri;
}
async function toCanvas(node, options = {}) {
    const { width, height } = (0,_util__WEBPACK_IMPORTED_MODULE_4__.getImageSize)(node, options);
    const svg = await toSvg(node, options);
    const img = await (0,_util__WEBPACK_IMPORTED_MODULE_4__.createImage)(svg);
    const canvas = document.createElement('canvas');
    const context = canvas.getContext('2d');
    const ratio = options.pixelRatio || (0,_util__WEBPACK_IMPORTED_MODULE_4__.getPixelRatio)();
    const canvasWidth = options.canvasWidth || width;
    const canvasHeight = options.canvasHeight || height;
    canvas.width = canvasWidth * ratio;
    canvas.height = canvasHeight * ratio;
    if (!options.skipAutoScale) {
        (0,_util__WEBPACK_IMPORTED_MODULE_4__.checkCanvasDimensions)(canvas);
    }
    canvas.style.width = `${canvasWidth}`;
    canvas.style.height = `${canvasHeight}`;
    if (options.backgroundColor) {
        context.fillStyle = options.backgroundColor;
        context.fillRect(0, 0, canvas.width, canvas.height);
    }
    context.drawImage(img, 0, 0, canvas.width, canvas.height);
    return canvas;
}
async function toPixelData(node, options = {}) {
    const { width, height } = (0,_util__WEBPACK_IMPORTED_MODULE_4__.getImageSize)(node, options);
    const canvas = await toCanvas(node, options);
    const ctx = canvas.getContext('2d');
    return ctx.getImageData(0, 0, width, height).data;
}
async function toPng(node, options = {}) {
    const canvas = await toCanvas(node, options);
    return canvas.toDataURL();
}
async function toJpeg(node, options = {}) {
    const canvas = await toCanvas(node, options);
    return canvas.toDataURL('image/jpeg', options.quality || 1);
}
async function toBlob(node, options = {}) {
    const canvas = await toCanvas(node, options);
    const blob = await (0,_util__WEBPACK_IMPORTED_MODULE_4__.canvasToBlob)(canvas);
    return blob;
}
async function getFontEmbedCSS(node, options = {}) {
    return (0,_embed_webfonts__WEBPACK_IMPORTED_MODULE_3__.getWebFontCSS)(node, options);
}
//# sourceMappingURL=index.js.map

/***/ }),

/***/ "./node_modules/html-to-image/es/mimes.js":
/*!************************************************!*\
  !*** ./node_modules/html-to-image/es/mimes.js ***!
  \************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "getMimeType": () => (/* binding */ getMimeType)
/* harmony export */ });
const WOFF = 'application/font-woff';
const JPEG = 'image/jpeg';
const mimes = {
    woff: WOFF,
    woff2: WOFF,
    ttf: 'application/font-truetype',
    eot: 'application/vnd.ms-fontobject',
    png: 'image/png',
    jpg: JPEG,
    jpeg: JPEG,
    gif: 'image/gif',
    tiff: 'image/tiff',
    svg: 'image/svg+xml',
    webp: 'image/webp',
};
function getExtension(url) {
    const match = /\.([^./]*?)$/g.exec(url);
    return match ? match[1] : '';
}
function getMimeType(url) {
    const extension = getExtension(url).toLowerCase();
    return mimes[extension] || '';
}
//# sourceMappingURL=mimes.js.map

/***/ }),

/***/ "./node_modules/html-to-image/es/util.js":
/*!***********************************************!*\
  !*** ./node_modules/html-to-image/es/util.js ***!
  \***********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "canvasToBlob": () => (/* binding */ canvasToBlob),
/* harmony export */   "checkCanvasDimensions": () => (/* binding */ checkCanvasDimensions),
/* harmony export */   "createImage": () => (/* binding */ createImage),
/* harmony export */   "delay": () => (/* binding */ delay),
/* harmony export */   "getImageSize": () => (/* binding */ getImageSize),
/* harmony export */   "getPixelRatio": () => (/* binding */ getPixelRatio),
/* harmony export */   "isInstanceOfElement": () => (/* binding */ isInstanceOfElement),
/* harmony export */   "nodeToDataURL": () => (/* binding */ nodeToDataURL),
/* harmony export */   "resolveUrl": () => (/* binding */ resolveUrl),
/* harmony export */   "svgToDataURL": () => (/* binding */ svgToDataURL),
/* harmony export */   "toArray": () => (/* binding */ toArray),
/* harmony export */   "uuid": () => (/* binding */ uuid)
/* harmony export */ });
function resolveUrl(url, baseUrl) {
    // url is absolute already
    if (url.match(/^[a-z]+:\/\//i)) {
        return url;
    }
    // url is absolute already, without protocol
    if (url.match(/^\/\//)) {
        return window.location.protocol + url;
    }
    // dataURI, mailto:, tel:, etc.
    if (url.match(/^[a-z]+:/i)) {
        return url;
    }
    const doc = document.implementation.createHTMLDocument();
    const base = doc.createElement('base');
    const a = doc.createElement('a');
    doc.head.appendChild(base);
    doc.body.appendChild(a);
    if (baseUrl) {
        base.href = baseUrl;
    }
    a.href = url;
    return a.href;
}
const uuid = (() => {
    // generate uuid for className of pseudo elements.
    // We should not use GUIDs, otherwise pseudo elements sometimes cannot be captured.
    let counter = 0;
    // ref: http://stackoverflow.com/a/6248722/2519373
    const random = () => 
    // eslint-disable-next-line no-bitwise
    `0000${((Math.random() * 36 ** 4) << 0).toString(36)}`.slice(-4);
    return () => {
        counter += 1;
        return `u${random()}${counter}`;
    };
})();
function delay(ms) {
    return (args) => new Promise((resolve) => {
        setTimeout(() => resolve(args), ms);
    });
}
function toArray(arrayLike) {
    const arr = [];
    for (let i = 0, l = arrayLike.length; i < l; i++) {
        arr.push(arrayLike[i]);
    }
    return arr;
}
function px(node, styleProperty) {
    const win = node.ownerDocument.defaultView || window;
    const val = win.getComputedStyle(node).getPropertyValue(styleProperty);
    return val ? parseFloat(val.replace('px', '')) : 0;
}
function getNodeWidth(node) {
    const leftBorder = px(node, 'border-left-width');
    const rightBorder = px(node, 'border-right-width');
    return node.clientWidth + leftBorder + rightBorder;
}
function getNodeHeight(node) {
    const topBorder = px(node, 'border-top-width');
    const bottomBorder = px(node, 'border-bottom-width');
    return node.clientHeight + topBorder + bottomBorder;
}
function getImageSize(targetNode, options = {}) {
    const width = options.width || getNodeWidth(targetNode);
    const height = options.height || getNodeHeight(targetNode);
    return { width, height };
}
function getPixelRatio() {
    let ratio;
    let FINAL_PROCESS;
    try {
        FINAL_PROCESS = process;
    }
    catch (e) {
        // pass
    }
    const val = FINAL_PROCESS && FINAL_PROCESS.env
        ? FINAL_PROCESS.env.devicePixelRatio
        : null;
    if (val) {
        ratio = parseInt(val, 10);
        if (Number.isNaN(ratio)) {
            ratio = 1;
        }
    }
    return ratio || window.devicePixelRatio || 1;
}
// @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas#maximum_canvas_size
const canvasDimensionLimit = 16384;
function checkCanvasDimensions(canvas) {
    if (canvas.width > canvasDimensionLimit ||
        canvas.height > canvasDimensionLimit) {
        if (canvas.width > canvasDimensionLimit &&
            canvas.height > canvasDimensionLimit) {
            if (canvas.width > canvas.height) {
                canvas.height *= canvasDimensionLimit / canvas.width;
                canvas.width = canvasDimensionLimit;
            }
            else {
                canvas.width *= canvasDimensionLimit / canvas.height;
                canvas.height = canvasDimensionLimit;
            }
        }
        else if (canvas.width > canvasDimensionLimit) {
            canvas.height *= canvasDimensionLimit / canvas.width;
            canvas.width = canvasDimensionLimit;
        }
        else {
            canvas.width *= canvasDimensionLimit / canvas.height;
            canvas.height = canvasDimensionLimit;
        }
    }
}
function canvasToBlob(canvas, options = {}) {
    if (canvas.toBlob) {
        return new Promise((resolve) => {
            canvas.toBlob(resolve, options.type ? options.type : 'image/png', options.quality ? options.quality : 1);
        });
    }
    return new Promise((resolve) => {
        const binaryString = window.atob(canvas
            .toDataURL(options.type ? options.type : undefined, options.quality ? options.quality : undefined)
            .split(',')[1]);
        const len = binaryString.length;
        const binaryArray = new Uint8Array(len);
        for (let i = 0; i < len; i += 1) {
            binaryArray[i] = binaryString.charCodeAt(i);
        }
        resolve(new Blob([binaryArray], {
            type: options.type ? options.type : 'image/png',
        }));
    });
}
function createImage(url) {
    return new Promise((resolve, reject) => {
        const img = new Image();
        img.decode = () => resolve(img);
        img.onload = () => resolve(img);
        img.onerror = reject;
        img.crossOrigin = 'anonymous';
        img.decoding = 'async';
        img.src = url;
    });
}
async function svgToDataURL(svg) {
    return Promise.resolve()
        .then(() => new XMLSerializer().serializeToString(svg))
        .then(encodeURIComponent)
        .then((html) => `data:image/svg+xml;charset=utf-8,${html}`);
}
async function nodeToDataURL(node, width, height) {
    const xmlns = 'http://www.w3.org/2000/svg';
    const svg = document.createElementNS(xmlns, 'svg');
    const foreignObject = document.createElementNS(xmlns, 'foreignObject');
    svg.setAttribute('width', `${width}`);
    svg.setAttribute('height', `${height}`);
    svg.setAttribute('viewBox', `0 0 ${width} ${height}`);
    foreignObject.setAttribute('width', '100%');
    foreignObject.setAttribute('height', '100%');
    foreignObject.setAttribute('x', '0');
    foreignObject.setAttribute('y', '0');
    foreignObject.setAttribute('externalResourcesRequired', 'true');
    svg.appendChild(foreignObject);
    foreignObject.appendChild(node);
    return svgToDataURL(svg);
}
const isInstanceOfElement = (node, instance) => {
    if (node instanceof instance)
        return true;
    const nodePrototype = Object.getPrototypeOf(node);
    if (nodePrototype === null)
        return false;
    return (nodePrototype.constructor.name === instance.name ||
        isInstanceOfElement(nodePrototype, instance));
};
//# sourceMappingURL=util.js.map

/***/ }),

/***/ "./node_modules/html2canvas/dist/html2canvas.js":
/*!******************************************************!*\
  !*** ./node_modules/html2canvas/dist/html2canvas.js ***!
  \******************************************************/
/***/ (function(module) {

/*!
 * html2canvas 1.4.1 <https://html2canvas.hertzen.com>
 * Copyright (c) 2022 Niklas von Hertzen <https://hertzen.com>
 * Released under MIT License
 */
(function (global, factory) {
     true ? module.exports = factory() :
    0;
}(this, (function () { 'use strict';

    /*! *****************************************************************************
    Copyright (c) Microsoft Corporation.

    Permission to use, copy, modify, and/or distribute this software for any
    purpose with or without fee is hereby granted.

    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
    PERFORMANCE OF THIS SOFTWARE.
    ***************************************************************************** */
    /* global Reflect, Promise */

    var extendStatics = function(d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };

    function __extends(d, b) {
        if (typeof b !== "function" && b !== null)
            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    }

    var __assign = function() {
        __assign = Object.assign || function __assign(t) {
            for (var s, i = 1, n = arguments.length; i < n; i++) {
                s = arguments[i];
                for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
            }
            return t;
        };
        return __assign.apply(this, arguments);
    };

    function __awaiter(thisArg, _arguments, P, generator) {
        function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
        return new (P || (P = Promise))(function (resolve, reject) {
            function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
            function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
            function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
            step((generator = generator.apply(thisArg, _arguments || [])).next());
        });
    }

    function __generator(thisArg, body) {
        var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
        return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
        function verb(n) { return function (v) { return step([n, v]); }; }
        function step(op) {
            if (f) throw new TypeError("Generator is already executing.");
            while (_) try {
                if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
                if (y = 0, t) op = [op[0] & 2, t.value];
                switch (op[0]) {
                    case 0: case 1: t = op; break;
                    case 4: _.label++; return { value: op[1], done: false };
                    case 5: _.label++; y = op[1]; op = [0]; continue;
                    case 7: op = _.ops.pop(); _.trys.pop(); continue;
                    default:
                        if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
                        if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
                        if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
                        if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
                        if (t[2]) _.ops.pop();
                        _.trys.pop(); continue;
                }
                op = body.call(thisArg, _);
            } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
            if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
        }
    }

    function __spreadArray(to, from, pack) {
        if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
            if (ar || !(i in from)) {
                if (!ar) ar = Array.prototype.slice.call(from, 0, i);
                ar[i] = from[i];
            }
        }
        return to.concat(ar || from);
    }

    var Bounds = /** @class */ (function () {
        function Bounds(left, top, width, height) {
            this.left = left;
            this.top = top;
            this.width = width;
            this.height = height;
        }
        Bounds.prototype.add = function (x, y, w, h) {
            return new Bounds(this.left + x, this.top + y, this.width + w, this.height + h);
        };
        Bounds.fromClientRect = function (context, clientRect) {
            return new Bounds(clientRect.left + context.windowBounds.left, clientRect.top + context.windowBounds.top, clientRect.width, clientRect.height);
        };
        Bounds.fromDOMRectList = function (context, domRectList) {
            var domRect = Array.from(domRectList).find(function (rect) { return rect.width !== 0; });
            return domRect
                ? new Bounds(domRect.left + context.windowBounds.left, domRect.top + context.windowBounds.top, domRect.width, domRect.height)
                : Bounds.EMPTY;
        };
        Bounds.EMPTY = new Bounds(0, 0, 0, 0);
        return Bounds;
    }());
    var parseBounds = function (context, node) {
        return Bounds.fromClientRect(context, node.getBoundingClientRect());
    };
    var parseDocumentSize = function (document) {
        var body = document.body;
        var documentElement = document.documentElement;
        if (!body || !documentElement) {
            throw new Error("Unable to get document size");
        }
        var width = Math.max(Math.max(body.scrollWidth, documentElement.scrollWidth), Math.max(body.offsetWidth, documentElement.offsetWidth), Math.max(body.clientWidth, documentElement.clientWidth));
        var height = Math.max(Math.max(body.scrollHeight, documentElement.scrollHeight), Math.max(body.offsetHeight, documentElement.offsetHeight), Math.max(body.clientHeight, documentElement.clientHeight));
        return new Bounds(0, 0, width, height);
    };

    /*
     * css-line-break 2.1.0 <https://github.com/niklasvh/css-line-break#readme>
     * Copyright (c) 2022 Niklas von Hertzen <https://hertzen.com>
     * Released under MIT License
     */
    var toCodePoints$1 = function (str) {
        var codePoints = [];
        var i = 0;
        var length = str.length;
        while (i < length) {
            var value = str.charCodeAt(i++);
            if (value >= 0xd800 && value <= 0xdbff && i < length) {
                var extra = str.charCodeAt(i++);
                if ((extra & 0xfc00) === 0xdc00) {
                    codePoints.push(((value & 0x3ff) << 10) + (extra & 0x3ff) + 0x10000);
                }
                else {
                    codePoints.push(value);
                    i--;
                }
            }
            else {
                codePoints.push(value);
            }
        }
        return codePoints;
    };
    var fromCodePoint$1 = function () {
        var codePoints = [];
        for (var _i = 0; _i < arguments.length; _i++) {
            codePoints[_i] = arguments[_i];
        }
        if (String.fromCodePoint) {
            return String.fromCodePoint.apply(String, codePoints);
        }
        var length = codePoints.length;
        if (!length) {
            return '';
        }
        var codeUnits = [];
        var index = -1;
        var result = '';
        while (++index < length) {
            var codePoint = codePoints[index];
            if (codePoint <= 0xffff) {
                codeUnits.push(codePoint);
            }
            else {
                codePoint -= 0x10000;
                codeUnits.push((codePoint >> 10) + 0xd800, (codePoint % 0x400) + 0xdc00);
            }
            if (index + 1 === length || codeUnits.length > 0x4000) {
                result += String.fromCharCode.apply(String, codeUnits);
                codeUnits.length = 0;
            }
        }
        return result;
    };
    var chars$2 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
    // Use a lookup table to find the index.
    var lookup$2 = typeof Uint8Array === 'undefined' ? [] : new Uint8Array(256);
    for (var i$2 = 0; i$2 < chars$2.length; i$2++) {
        lookup$2[chars$2.charCodeAt(i$2)] = i$2;
    }

    /*
     * utrie 1.0.2 <https://github.com/niklasvh/utrie>
     * Copyright (c) 2022 Niklas von Hertzen <https://hertzen.com>
     * Released under MIT License
     */
    var chars$1$1 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
    // Use a lookup table to find the index.
    var lookup$1$1 = typeof Uint8Array === 'undefined' ? [] : new Uint8Array(256);
    for (var i$1$1 = 0; i$1$1 < chars$1$1.length; i$1$1++) {
        lookup$1$1[chars$1$1.charCodeAt(i$1$1)] = i$1$1;
    }
    var decode$1 = function (base64) {
        var bufferLength = base64.length * 0.75, len = base64.length, i, p = 0, encoded1, encoded2, encoded3, encoded4;
        if (base64[base64.length - 1] === '=') {
            bufferLength--;
            if (base64[base64.length - 2] === '=') {
                bufferLength--;
            }
        }
        var buffer = typeof ArrayBuffer !== 'undefined' &&
            typeof Uint8Array !== 'undefined' &&
            typeof Uint8Array.prototype.slice !== 'undefined'
            ? new ArrayBuffer(bufferLength)
            : new Array(bufferLength);
        var bytes = Array.isArray(buffer) ? buffer : new Uint8Array(buffer);
        for (i = 0; i < len; i += 4) {
            encoded1 = lookup$1$1[base64.charCodeAt(i)];
            encoded2 = lookup$1$1[base64.charCodeAt(i + 1)];
            encoded3 = lookup$1$1[base64.charCodeAt(i + 2)];
            encoded4 = lookup$1$1[base64.charCodeAt(i + 3)];
            bytes[p++] = (encoded1 << 2) | (encoded2 >> 4);
            bytes[p++] = ((encoded2 & 15) << 4) | (encoded3 >> 2);
            bytes[p++] = ((encoded3 & 3) << 6) | (encoded4 & 63);
        }
        return buffer;
    };
    var polyUint16Array$1 = function (buffer) {
        var length = buffer.length;
        var bytes = [];
        for (var i = 0; i < length; i += 2) {
            bytes.push((buffer[i + 1] << 8) | buffer[i]);
        }
        return bytes;
    };
    var polyUint32Array$1 = function (buffer) {
        var length = buffer.length;
        var bytes = [];
        for (var i = 0; i < length; i += 4) {
            bytes.push((buffer[i + 3] << 24) | (buffer[i + 2] << 16) | (buffer[i + 1] << 8) | buffer[i]);
        }
        return bytes;
    };

    /** Shift size for getting the index-2 table offset. */
    var UTRIE2_SHIFT_2$1 = 5;
    /** Shift size for getting the index-1 table offset. */
    var UTRIE2_SHIFT_1$1 = 6 + 5;
    /**
     * Shift size for shifting left the index array values.
     * Increases possible data size with 16-bit index values at the cost
     * of compactability.
     * This requires data blocks to be aligned by UTRIE2_DATA_GRANULARITY.
     */
    var UTRIE2_INDEX_SHIFT$1 = 2;
    /**
     * Difference between the two shift sizes,
     * for getting an index-1 offset from an index-2 offset. 6=11-5
     */
    var UTRIE2_SHIFT_1_2$1 = UTRIE2_SHIFT_1$1 - UTRIE2_SHIFT_2$1;
    /**
     * The part of the index-2 table for U+D800..U+DBFF stores values for
     * lead surrogate code _units_ not code _points_.
     * Values for lead surrogate code _points_ are indexed with this portion of the table.
     * Length=32=0x20=0x400>>UTRIE2_SHIFT_2. (There are 1024=0x400 lead surrogates.)
     */
    var UTRIE2_LSCP_INDEX_2_OFFSET$1 = 0x10000 >> UTRIE2_SHIFT_2$1;
    /** Number of entries in a data block. 32=0x20 */
    var UTRIE2_DATA_BLOCK_LENGTH$1 = 1 << UTRIE2_SHIFT_2$1;
    /** Mask for getting the lower bits for the in-data-block offset. */
    var UTRIE2_DATA_MASK$1 = UTRIE2_DATA_BLOCK_LENGTH$1 - 1;
    var UTRIE2_LSCP_INDEX_2_LENGTH$1 = 0x400 >> UTRIE2_SHIFT_2$1;
    /** Count the lengths of both BMP pieces. 2080=0x820 */
    var UTRIE2_INDEX_2_BMP_LENGTH$1 = UTRIE2_LSCP_INDEX_2_OFFSET$1 + UTRIE2_LSCP_INDEX_2_LENGTH$1;
    /**
     * The 2-byte UTF-8 version of the index-2 table follows at offset 2080=0x820.
     * Length 32=0x20 for lead bytes C0..DF, regardless of UTRIE2_SHIFT_2.
     */
    var UTRIE2_UTF8_2B_INDEX_2_OFFSET$1 = UTRIE2_INDEX_2_BMP_LENGTH$1;
    var UTRIE2_UTF8_2B_INDEX_2_LENGTH$1 = 0x800 >> 6; /* U+0800 is the first code point after 2-byte UTF-8 */
    /**
     * The index-1 table, only used for supplementary code points, at offset 2112=0x840.
     * Variable length, for code points up to highStart, where the last single-value range starts.
     * Maximum length 512=0x200=0x100000>>UTRIE2_SHIFT_1.
     * (For 0x100000 supplementary code points U+10000..U+10ffff.)
     *
     * The part of the index-2 table for supplementary code points starts
     * after this index-1 table.
     *
     * Both the index-1 table and the following part of the index-2 table
     * are omitted completely if there is only BMP data.
     */
    var UTRIE2_INDEX_1_OFFSET$1 = UTRIE2_UTF8_2B_INDEX_2_OFFSET$1 + UTRIE2_UTF8_2B_INDEX_2_LENGTH$1;
    /**
     * Number of index-1 entries for the BMP. 32=0x20
     * This part of the index-1 table is omitted from the serialized form.
     */
    var UTRIE2_OMITTED_BMP_INDEX_1_LENGTH$1 = 0x10000 >> UTRIE2_SHIFT_1$1;
    /** Number of entries in an index-2 block. 64=0x40 */
    var UTRIE2_INDEX_2_BLOCK_LENGTH$1 = 1 << UTRIE2_SHIFT_1_2$1;
    /** Mask for getting the lower bits for the in-index-2-block offset. */
    var UTRIE2_INDEX_2_MASK$1 = UTRIE2_INDEX_2_BLOCK_LENGTH$1 - 1;
    var slice16$1 = function (view, start, end) {
        if (view.slice) {
            return view.slice(start, end);
        }
        return new Uint16Array(Array.prototype.slice.call(view, start, end));
    };
    var slice32$1 = function (view, start, end) {
        if (view.slice) {
            return view.slice(start, end);
        }
        return new Uint32Array(Array.prototype.slice.call(view, start, end));
    };
    var createTrieFromBase64$1 = function (base64, _byteLength) {
        var buffer = decode$1(base64);
        var view32 = Array.isArray(buffer) ? polyUint32Array$1(buffer) : new Uint32Array(buffer);
        var view16 = Array.isArray(buffer) ? polyUint16Array$1(buffer) : new Uint16Array(buffer);
        var headerLength = 24;
        var index = slice16$1(view16, headerLength / 2, view32[4] / 2);
        var data = view32[5] === 2
            ? slice16$1(view16, (headerLength + view32[4]) / 2)
            : slice32$1(view32, Math.ceil((headerLength + view32[4]) / 4));
        return new Trie$1(view32[0], view32[1], view32[2], view32[3], index, data);
    };
    var Trie$1 = /** @class */ (function () {
        function Trie(initialValue, errorValue, highStart, highValueIndex, index, data) {
            this.initialValue = initialValue;
            this.errorValue = errorValue;
            this.highStart = highStart;
            this.highValueIndex = highValueIndex;
            this.index = index;
            this.data = data;
        }
        /**
         * Get the value for a code point as stored in the Trie.
         *
         * @param codePoint the code point
         * @return the value
         */
        Trie.prototype.get = function (codePoint) {
            var ix;
            if (codePoint >= 0) {
                if (codePoint < 0x0d800 || (codePoint > 0x0dbff && codePoint <= 0x0ffff)) {
                    // Ordinary BMP code point, excluding leading surrogates.
                    // BMP uses a single level lookup.  BMP index starts at offset 0 in the Trie2 index.
                    // 16 bit data is stored in the index array itself.
                    ix = this.index[codePoint >> UTRIE2_SHIFT_2$1];
                    ix = (ix << UTRIE2_INDEX_SHIFT$1) + (codePoint & UTRIE2_DATA_MASK$1);
                    return this.data[ix];
                }
                if (codePoint <= 0xffff) {
                    // Lead Surrogate Code Point.  A Separate index section is stored for
                    // lead surrogate code units and code points.
                    //   The main index has the code unit data.
                    //   For this function, we need the code point data.
                    // Note: this expression could be refactored for slightly improved efficiency, but
                    //       surrogate code points will be so rare in practice that it's not worth it.
                    ix = this.index[UTRIE2_LSCP_INDEX_2_OFFSET$1 + ((codePoint - 0xd800) >> UTRIE2_SHIFT_2$1)];
                    ix = (ix << UTRIE2_INDEX_SHIFT$1) + (codePoint & UTRIE2_DATA_MASK$1);
                    return this.data[ix];
                }
                if (codePoint < this.highStart) {
                    // Supplemental code point, use two-level lookup.
                    ix = UTRIE2_INDEX_1_OFFSET$1 - UTRIE2_OMITTED_BMP_INDEX_1_LENGTH$1 + (codePoint >> UTRIE2_SHIFT_1$1);
                    ix = this.index[ix];
                    ix += (codePoint >> UTRIE2_SHIFT_2$1) & UTRIE2_INDEX_2_MASK$1;
                    ix = this.index[ix];
                    ix = (ix << UTRIE2_INDEX_SHIFT$1) + (codePoint & UTRIE2_DATA_MASK$1);
                    return this.data[ix];
                }
                if (codePoint <= 0x10ffff) {
                    return this.data[this.highValueIndex];
                }
            }
            // Fall through.  The code point is outside of the legal range of 0..0x10ffff.
            return this.errorValue;
        };
        return Trie;
    }());

    /*
     * base64-arraybuffer 1.0.2 <https://github.com/niklasvh/base64-arraybuffer>
     * Copyright (c) 2022 Niklas von Hertzen <https://hertzen.com>
     * Released under MIT License
     */
    var chars$3 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
    // Use a lookup table to find the index.
    var lookup$3 = typeof Uint8Array === 'undefined' ? [] : new Uint8Array(256);
    for (var i$3 = 0; i$3 < chars$3.length; i$3++) {
        lookup$3[chars$3.charCodeAt(i$3)] = i$3;
    }

    var base64$1 = ' ';

    var LETTER_NUMBER_MODIFIER = 50;
    // Non-tailorable Line Breaking Classes
    var BK = 1; //  Cause a line break (after)
    var CR$1 = 2; //  Cause a line break (after), except between CR and LF
    var LF$1 = 3; //  Cause a line break (after)
    var CM = 4; //  Prohibit a line break between the character and the preceding character
    var NL = 5; //  Cause a line break (after)
    var WJ = 7; //  Prohibit line breaks before and after
    var ZW = 8; //  Provide a break opportunity
    var GL = 9; //  Prohibit line breaks before and after
    var SP = 10; // Enable indirect line breaks
    var ZWJ$1 = 11; // Prohibit line breaks within joiner sequences
    // Break Opportunities
    var B2 = 12; //  Provide a line break opportunity before and after the character
    var BA = 13; //  Generally provide a line break opportunity after the character
    var BB = 14; //  Generally provide a line break opportunity before the character
    var HY = 15; //  Provide a line break opportunity after the character, except in numeric context
    var CB = 16; //   Provide a line break opportunity contingent on additional information
    // Characters Prohibiting Certain Breaks
    var CL = 17; //  Prohibit line breaks before
    var CP = 18; //  Prohibit line breaks before
    var EX = 19; //  Prohibit line breaks before
    var IN = 20; //  Allow only indirect line breaks between pairs
    var NS = 21; //  Allow only indirect line breaks before
    var OP = 22; //  Prohibit line breaks after
    var QU = 23; //  Act like they are both opening and closing
    // Numeric Context
    var IS = 24; //  Prevent breaks after any and before numeric
    var NU = 25; //  Form numeric expressions for line breaking purposes
    var PO = 26; //  Do not break following a numeric expression
    var PR = 27; //  Do not break in front of a numeric expression
    var SY = 28; //  Prevent a break before; and allow a break after
    // Other Characters
    var AI = 29; //  Act like AL when the resolvedEAW is N; otherwise; act as ID
    var AL = 30; //  Are alphabetic characters or symbols that are used with alphabetic characters
    var CJ = 31; //  Treat as NS or ID for strict or normal breaking.
    var EB = 32; //  Do not break from following Emoji Modifier
    var EM = 33; //  Do not break from preceding Emoji Base
    var H2 = 34; //  Form Korean syllable blocks
    var H3 = 35; //  Form Korean syllable blocks
    var HL = 36; //  Do not break around a following hyphen; otherwise act as Alphabetic
    var ID = 37; //  Break before or after; except in some numeric context
    var JL = 38; //  Form Korean syllable blocks
    var JV = 39; //  Form Korean syllable blocks
    var JT = 40; //  Form Korean syllable blocks
    var RI$1 = 41; //  Keep pairs together. For pairs; break before and after other classes
    var SA = 42; //  Provide a line break opportunity contingent on additional, language-specific context analysis
    var XX = 43; //  Have as yet unknown line breaking behavior or unassigned code positions
    var ea_OP = [0x2329, 0xff08];
    var BREAK_MANDATORY = '!';
    var BREAK_NOT_ALLOWED$1 = '×';
    var BREAK_ALLOWED$1 = '÷';
    var UnicodeTrie$1 = createTrieFromBase64$1(base64$1);
    var ALPHABETICS = [AL, HL];
    var HARD_LINE_BREAKS = [BK, CR$1, LF$1, NL];
    var SPACE$1 = [SP, ZW];
    var PREFIX_POSTFIX = [PR, PO];
    var LINE_BREAKS = HARD_LINE_BREAKS.concat(SPACE$1);
    var KOREAN_SYLLABLE_BLOCK = [JL, JV, JT, H2, H3];
    var HYPHEN = [HY, BA];
    var codePointsToCharacterClasses = function (codePoints, lineBreak) {
        if (lineBreak === void 0) { lineBreak = 'strict'; }
        var types = [];
        var indices = [];
        var categories = [];
        codePoints.forEach(function (codePoint, index) {
            var classType = UnicodeTrie$1.get(codePoint);
            if (classType > LETTER_NUMBER_MODIFIER) {
                categories.push(true);
                classType -= LETTER_NUMBER_MODIFIER;
            }
            else {
                categories.push(false);
            }
            if (['normal', 'auto', 'loose'].indexOf(lineBreak) !== -1) {
                // U+2010, – U+2013, 〜 U+301C, ゠ U+30A0
                if ([0x2010, 0x2013, 0x301c, 0x30a0].indexOf(codePoint) !== -1) {
                    indices.push(index);
                    return types.push(CB);
                }
            }
            if (classType === CM || classType === ZWJ$1) {
                // LB10 Treat any remaining combining mark or ZWJ as AL.
                if (index === 0) {
                    indices.push(index);
                    return types.push(AL);
                }
                // LB9 Do not break a combining character sequence; treat it as if it has the line breaking class of
                // the base character in all of the following rules. Treat ZWJ as if it were CM.
                var prev = types[index - 1];
                if (LINE_BREAKS.indexOf(prev) === -1) {
                    indices.push(indices[index - 1]);
                    return types.push(prev);
                }
                indices.push(index);
                return types.push(AL);
            }
            indices.push(index);
            if (classType === CJ) {
                return types.push(lineBreak === 'strict' ? NS : ID);
            }
            if (classType === SA) {
                return types.push(AL);
            }
            if (classType === AI) {
                return types.push(AL);
            }
            // For supplementary characters, a useful default is to treat characters in the range 10000..1FFFD as AL
            // and characters in the ranges 20000..2FFFD and 30000..3FFFD as ID, until the implementation can be revised
            // to take into account the actual line breaking properties for these characters.
            if (classType === XX) {
                if ((codePoint >= 0x20000 && codePoint <= 0x2fffd) || (codePoint >= 0x30000 && codePoint <= 0x3fffd)) {
                    return types.push(ID);
                }
                else {
                    return types.push(AL);
                }
            }
            types.push(classType);
        });
        return [indices, types, categories];
    };
    var isAdjacentWithSpaceIgnored = function (a, b, currentIndex, classTypes) {
        var current = classTypes[currentIndex];
        if (Array.isArray(a) ? a.indexOf(current) !== -1 : a === current) {
            var i = currentIndex;
            while (i <= classTypes.length) {
                i++;
                var next = classTypes[i];
                if (next === b) {
                    return true;
                }
                if (next !== SP) {
                    break;
                }
            }
        }
        if (current === SP) {
            var i = currentIndex;
            while (i > 0) {
                i--;
                var prev = classTypes[i];
                if (Array.isArray(a) ? a.indexOf(prev) !== -1 : a === prev) {
                    var n = currentIndex;
                    while (n <= classTypes.length) {
                        n++;
                        var next = classTypes[n];
                        if (next === b) {
                            return true;
                        }
                        if (next !== SP) {
                            break;
                        }
                    }
                }
                if (prev !== SP) {
                    break;
                }
            }
        }
        return false;
    };
    var previousNonSpaceClassType = function (currentIndex, classTypes) {
        var i = currentIndex;
        while (i >= 0) {
            var type = classTypes[i];
            if (type === SP) {
                i--;
            }
            else {
                return type;
            }
        }
        return 0;
    };
    var _lineBreakAtIndex = function (codePoints, classTypes, indicies, index, forbiddenBreaks) {
        if (indicies[index] === 0) {
            return BREAK_NOT_ALLOWED$1;
        }
        var currentIndex = index - 1;
        if (Array.isArray(forbiddenBreaks) && forbiddenBreaks[currentIndex] === true) {
            return BREAK_NOT_ALLOWED$1;
        }
        var beforeIndex = currentIndex - 1;
        var afterIndex = currentIndex + 1;
        var current = classTypes[currentIndex];
        // LB4 Always break after hard line breaks.
        // LB5 Treat CR followed by LF, as well as CR, LF, and NL as hard line breaks.
        var before = beforeIndex >= 0 ? classTypes[beforeIndex] : 0;
        var next = classTypes[afterIndex];
        if (current === CR$1 && next === LF$1) {
            return BREAK_NOT_ALLOWED$1;
        }
        if (HARD_LINE_BREAKS.indexOf(current) !== -1) {
            return BREAK_MANDATORY;
        }
        // LB6 Do not break before hard line breaks.
        if (HARD_LINE_BREAKS.indexOf(next) !== -1) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB7 Do not break before spaces or zero width space.
        if (SPACE$1.indexOf(next) !== -1) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB8 Break before any character following a zero-width space, even if one or more spaces intervene.
        if (previousNonSpaceClassType(currentIndex, classTypes) === ZW) {
            return BREAK_ALLOWED$1;
        }
        // LB8a Do not break after a zero width joiner.
        if (UnicodeTrie$1.get(codePoints[currentIndex]) === ZWJ$1) {
            return BREAK_NOT_ALLOWED$1;
        }
        // zwj emojis
        if ((current === EB || current === EM) && UnicodeTrie$1.get(codePoints[afterIndex]) === ZWJ$1) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB11 Do not break before or after Word joiner and related characters.
        if (current === WJ || next === WJ) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB12 Do not break after NBSP and related characters.
        if (current === GL) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB12a Do not break before NBSP and related characters, except after spaces and hyphens.
        if ([SP, BA, HY].indexOf(current) === -1 && next === GL) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB13 Do not break before ‘]’ or ‘!’ or ‘;’ or ‘/’, even after spaces.
        if ([CL, CP, EX, IS, SY].indexOf(next) !== -1) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB14 Do not break after ‘[’, even after spaces.
        if (previousNonSpaceClassType(currentIndex, classTypes) === OP) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB15 Do not break within ‘”[’, even with intervening spaces.
        if (isAdjacentWithSpaceIgnored(QU, OP, currentIndex, classTypes)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB16 Do not break between closing punctuation and a nonstarter (lb=NS), even with intervening spaces.
        if (isAdjacentWithSpaceIgnored([CL, CP], NS, currentIndex, classTypes)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB17 Do not break within ‘——’, even with intervening spaces.
        if (isAdjacentWithSpaceIgnored(B2, B2, currentIndex, classTypes)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB18 Break after spaces.
        if (current === SP) {
            return BREAK_ALLOWED$1;
        }
        // LB19 Do not break before or after quotation marks, such as ‘ ” ’.
        if (current === QU || next === QU) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB20 Break before and after unresolved CB.
        if (next === CB || current === CB) {
            return BREAK_ALLOWED$1;
        }
        // LB21 Do not break before hyphen-minus, other hyphens, fixed-width spaces, small kana, and other non-starters, or after acute accents.
        if ([BA, HY, NS].indexOf(next) !== -1 || current === BB) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB21a Don't break after Hebrew + Hyphen.
        if (before === HL && HYPHEN.indexOf(current) !== -1) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB21b Don’t break between Solidus and Hebrew letters.
        if (current === SY && next === HL) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB22 Do not break before ellipsis.
        if (next === IN) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB23 Do not break between digits and letters.
        if ((ALPHABETICS.indexOf(next) !== -1 && current === NU) || (ALPHABETICS.indexOf(current) !== -1 && next === NU)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB23a Do not break between numeric prefixes and ideographs, or between ideographs and numeric postfixes.
        if ((current === PR && [ID, EB, EM].indexOf(next) !== -1) ||
            ([ID, EB, EM].indexOf(current) !== -1 && next === PO)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB24 Do not break between numeric prefix/postfix and letters, or between letters and prefix/postfix.
        if ((ALPHABETICS.indexOf(current) !== -1 && PREFIX_POSTFIX.indexOf(next) !== -1) ||
            (PREFIX_POSTFIX.indexOf(current) !== -1 && ALPHABETICS.indexOf(next) !== -1)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB25 Do not break between the following pairs of classes relevant to numbers:
        if (
        // (PR | PO) × ( OP | HY )? NU
        ([PR, PO].indexOf(current) !== -1 &&
            (next === NU || ([OP, HY].indexOf(next) !== -1 && classTypes[afterIndex + 1] === NU))) ||
            // ( OP | HY ) × NU
            ([OP, HY].indexOf(current) !== -1 && next === NU) ||
            // NU ×	(NU | SY | IS)
            (current === NU && [NU, SY, IS].indexOf(next) !== -1)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // NU (NU | SY | IS)* × (NU | SY | IS | CL | CP)
        if ([NU, SY, IS, CL, CP].indexOf(next) !== -1) {
            var prevIndex = currentIndex;
            while (prevIndex >= 0) {
                var type = classTypes[prevIndex];
                if (type === NU) {
                    return BREAK_NOT_ALLOWED$1;
                }
                else if ([SY, IS].indexOf(type) !== -1) {
                    prevIndex--;
                }
                else {
                    break;
                }
            }
        }
        // NU (NU | SY | IS)* (CL | CP)? × (PO | PR))
        if ([PR, PO].indexOf(next) !== -1) {
            var prevIndex = [CL, CP].indexOf(current) !== -1 ? beforeIndex : currentIndex;
            while (prevIndex >= 0) {
                var type = classTypes[prevIndex];
                if (type === NU) {
                    return BREAK_NOT_ALLOWED$1;
                }
                else if ([SY, IS].indexOf(type) !== -1) {
                    prevIndex--;
                }
                else {
                    break;
                }
            }
        }
        // LB26 Do not break a Korean syllable.
        if ((JL === current && [JL, JV, H2, H3].indexOf(next) !== -1) ||
            ([JV, H2].indexOf(current) !== -1 && [JV, JT].indexOf(next) !== -1) ||
            ([JT, H3].indexOf(current) !== -1 && next === JT)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB27 Treat a Korean Syllable Block the same as ID.
        if ((KOREAN_SYLLABLE_BLOCK.indexOf(current) !== -1 && [IN, PO].indexOf(next) !== -1) ||
            (KOREAN_SYLLABLE_BLOCK.indexOf(next) !== -1 && current === PR)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB28 Do not break between alphabetics (“at”).
        if (ALPHABETICS.indexOf(current) !== -1 && ALPHABETICS.indexOf(next) !== -1) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB29 Do not break between numeric punctuation and alphabetics (“e.g.”).
        if (current === IS && ALPHABETICS.indexOf(next) !== -1) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB30 Do not break between letters, numbers, or ordinary symbols and opening or closing parentheses.
        if ((ALPHABETICS.concat(NU).indexOf(current) !== -1 &&
            next === OP &&
            ea_OP.indexOf(codePoints[afterIndex]) === -1) ||
            (ALPHABETICS.concat(NU).indexOf(next) !== -1 && current === CP)) {
            return BREAK_NOT_ALLOWED$1;
        }
        // LB30a Break between two regional indicator symbols if and only if there are an even number of regional
        // indicators preceding the position of the break.
        if (current === RI$1 && next === RI$1) {
            var i = indicies[currentIndex];
            var count = 1;
            while (i > 0) {
                i--;
                if (classTypes[i] === RI$1) {
                    count++;
                }
                else {
                    break;
                }
            }
            if (count % 2 !== 0) {
                return BREAK_NOT_ALLOWED$1;
            }
        }
        // LB30b Do not break between an emoji base and an emoji modifier.
        if (current === EB && next === EM) {
            return BREAK_NOT_ALLOWED$1;
        }
        return BREAK_ALLOWED$1;
    };
    var cssFormattedClasses = function (codePoints, options) {
        if (!options) {
            options = { lineBreak: 'normal', wordBreak: 'normal' };
        }
        var _a = codePointsToCharacterClasses(codePoints, options.lineBreak), indicies = _a[0], classTypes = _a[1], isLetterNumber = _a[2];
        if (options.wordBreak === 'break-all' || options.wordBreak === 'break-word') {
            classTypes = classTypes.map(function (type) { return ([NU, AL, SA].indexOf(type) !== -1 ? ID : type); });
        }
        var forbiddenBreakpoints = options.wordBreak === 'keep-all'
            ? isLetterNumber.map(function (letterNumber, i) {
                return letterNumber && codePoints[i] >= 0x4e00 && codePoints[i] <= 0x9fff;
            })
            : undefined;
        return [indicies, classTypes, forbiddenBreakpoints];
    };
    var Break = /** @class */ (function () {
        function Break(codePoints, lineBreak, start, end) {
            this.codePoints = codePoints;
            this.required = lineBreak === BREAK_MANDATORY;
            this.start = start;
            this.end = end;
        }
        Break.prototype.slice = function () {
            return fromCodePoint$1.apply(void 0, this.codePoints.slice(this.start, this.end));
        };
        return Break;
    }());
    var LineBreaker = function (str, options) {
        var codePoints = toCodePoints$1(str);
        var _a = cssFormattedClasses(codePoints, options), indicies = _a[0], classTypes = _a[1], forbiddenBreakpoints = _a[2];
        var length = codePoints.length;
        var lastEnd = 0;
        var nextIndex = 0;
        return {
            next: function () {
                if (nextIndex >= length) {
                    return { done: true, value: null };
                }
                var lineBreak = BREAK_NOT_ALLOWED$1;
                while (nextIndex < length &&
                    (lineBreak = _lineBreakAtIndex(codePoints, classTypes, indicies, ++nextIndex, forbiddenBreakpoints)) ===
                        BREAK_NOT_ALLOWED$1) { }
                if (lineBreak !== BREAK_NOT_ALLOWED$1 || nextIndex === length) {
                    var value = new Break(codePoints, lineBreak, lastEnd, nextIndex);
                    lastEnd = nextIndex;
                    return { value: value, done: false };
                }
                return { done: true, value: null };
            },
        };
    };

    // https://www.w3.org/TR/css-syntax-3
    var FLAG_UNRESTRICTED = 1 << 0;
    var FLAG_ID = 1 << 1;
    var FLAG_INTEGER = 1 << 2;
    var FLAG_NUMBER = 1 << 3;
    var LINE_FEED = 0x000a;
    var SOLIDUS = 0x002f;
    var REVERSE_SOLIDUS = 0x005c;
    var CHARACTER_TABULATION = 0x0009;
    var SPACE = 0x0020;
    var QUOTATION_MARK = 0x0022;
    var EQUALS_SIGN = 0x003d;
    var NUMBER_SIGN = 0x0023;
    var DOLLAR_SIGN = 0x0024;
    var PERCENTAGE_SIGN = 0x0025;
    var APOSTROPHE = 0x0027;
    var LEFT_PARENTHESIS = 0x0028;
    var RIGHT_PARENTHESIS = 0x0029;
    var LOW_LINE = 0x005f;
    var HYPHEN_MINUS = 0x002d;
    var EXCLAMATION_MARK = 0x0021;
    var LESS_THAN_SIGN = 0x003c;
    var GREATER_THAN_SIGN = 0x003e;
    var COMMERCIAL_AT = 0x0040;
    var LEFT_SQUARE_BRACKET = 0x005b;
    var RIGHT_SQUARE_BRACKET = 0x005d;
    var CIRCUMFLEX_ACCENT = 0x003d;
    var LEFT_CURLY_BRACKET = 0x007b;
    var QUESTION_MARK = 0x003f;
    var RIGHT_CURLY_BRACKET = 0x007d;
    var VERTICAL_LINE = 0x007c;
    var TILDE = 0x007e;
    var CONTROL = 0x0080;
    var REPLACEMENT_CHARACTER = 0xfffd;
    var ASTERISK = 0x002a;
    var PLUS_SIGN = 0x002b;
    var COMMA = 0x002c;
    var COLON = 0x003a;
    var SEMICOLON = 0x003b;
    var FULL_STOP = 0x002e;
    var NULL = 0x0000;
    var BACKSPACE = 0x0008;
    var LINE_TABULATION = 0x000b;
    var SHIFT_OUT = 0x000e;
    var INFORMATION_SEPARATOR_ONE = 0x001f;
    var DELETE = 0x007f;
    var EOF = -1;
    var ZERO = 0x0030;
    var a = 0x0061;
    var e = 0x0065;
    var f = 0x0066;
    var u = 0x0075;
    var z = 0x007a;
    var A = 0x0041;
    var E = 0x0045;
    var F = 0x0046;
    var U = 0x0055;
    var Z = 0x005a;
    var isDigit = function (codePoint) { return codePoint >= ZERO && codePoint <= 0x0039; };
    var isSurrogateCodePoint = function (codePoint) { return codePoint >= 0xd800 && codePoint <= 0xdfff; };
    var isHex = function (codePoint) {
        return isDigit(codePoint) || (codePoint >= A && codePoint <= F) || (codePoint >= a && codePoint <= f);
    };
    var isLowerCaseLetter = function (codePoint) { return codePoint >= a && codePoint <= z; };
    var isUpperCaseLetter = function (codePoint) { return codePoint >= A && codePoint <= Z; };
    var isLetter = function (codePoint) { return isLowerCaseLetter(codePoint) || isUpperCaseLetter(codePoint); };
    var isNonASCIICodePoint = function (codePoint) { return codePoint >= CONTROL; };
    var isWhiteSpace = function (codePoint) {
        return codePoint === LINE_FEED || codePoint === CHARACTER_TABULATION || codePoint === SPACE;
    };
    var isNameStartCodePoint = function (codePoint) {
        return isLetter(codePoint) || isNonASCIICodePoint(codePoint) || codePoint === LOW_LINE;
    };
    var isNameCodePoint = function (codePoint) {
        return isNameStartCodePoint(codePoint) || isDigit(codePoint) || codePoint === HYPHEN_MINUS;
    };
    var isNonPrintableCodePoint = function (codePoint) {
        return ((codePoint >= NULL && codePoint <= BACKSPACE) ||
            codePoint === LINE_TABULATION ||
            (codePoint >= SHIFT_OUT && codePoint <= INFORMATION_SEPARATOR_ONE) ||
            codePoint === DELETE);
    };
    var isValidEscape = function (c1, c2) {
        if (c1 !== REVERSE_SOLIDUS) {
            return false;
        }
        return c2 !== LINE_FEED;
    };
    var isIdentifierStart = function (c1, c2, c3) {
        if (c1 === HYPHEN_MINUS) {
            return isNameStartCodePoint(c2) || isValidEscape(c2, c3);
        }
        else if (isNameStartCodePoint(c1)) {
            return true;
        }
        else if (c1 === REVERSE_SOLIDUS && isValidEscape(c1, c2)) {
            return true;
        }
        return false;
    };
    var isNumberStart = function (c1, c2, c3) {
        if (c1 === PLUS_SIGN || c1 === HYPHEN_MINUS) {
            if (isDigit(c2)) {
                return true;
            }
            return c2 === FULL_STOP && isDigit(c3);
        }
        if (c1 === FULL_STOP) {
            return isDigit(c2);
        }
        return isDigit(c1);
    };
    var stringToNumber = function (codePoints) {
        var c = 0;
        var sign = 1;
        if (codePoints[c] === PLUS_SIGN || codePoints[c] === HYPHEN_MINUS) {
            if (codePoints[c] === HYPHEN_MINUS) {
                sign = -1;
            }
            c++;
        }
        var integers = [];
        while (isDigit(codePoints[c])) {
            integers.push(codePoints[c++]);
        }
        var int = integers.length ? parseInt(fromCodePoint$1.apply(void 0, integers), 10) : 0;
        if (codePoints[c] === FULL_STOP) {
            c++;
        }
        var fraction = [];
        while (isDigit(codePoints[c])) {
            fraction.push(codePoints[c++]);
        }
        var fracd = fraction.length;
        var frac = fracd ? parseInt(fromCodePoint$1.apply(void 0, fraction), 10) : 0;
        if (codePoints[c] === E || codePoints[c] === e) {
            c++;
        }
        var expsign = 1;
        if (codePoints[c] === PLUS_SIGN || codePoints[c] === HYPHEN_MINUS) {
            if (codePoints[c] === HYPHEN_MINUS) {
                expsign = -1;
            }
            c++;
        }
        var exponent = [];
        while (isDigit(codePoints[c])) {
            exponent.push(codePoints[c++]);
        }
        var exp = exponent.length ? parseInt(fromCodePoint$1.apply(void 0, exponent), 10) : 0;
        return sign * (int + frac * Math.pow(10, -fracd)) * Math.pow(10, expsign * exp);
    };
    var LEFT_PARENTHESIS_TOKEN = {
        type: 2 /* LEFT_PARENTHESIS_TOKEN */
    };
    var RIGHT_PARENTHESIS_TOKEN = {
        type: 3 /* RIGHT_PARENTHESIS_TOKEN */
    };
    var COMMA_TOKEN = { type: 4 /* COMMA_TOKEN */ };
    var SUFFIX_MATCH_TOKEN = { type: 13 /* SUFFIX_MATCH_TOKEN */ };
    var PREFIX_MATCH_TOKEN = { type: 8 /* PREFIX_MATCH_TOKEN */ };
    var COLUMN_TOKEN = { type: 21 /* COLUMN_TOKEN */ };
    var DASH_MATCH_TOKEN = { type: 9 /* DASH_MATCH_TOKEN */ };
    var INCLUDE_MATCH_TOKEN = { type: 10 /* INCLUDE_MATCH_TOKEN */ };
    var LEFT_CURLY_BRACKET_TOKEN = {
        type: 11 /* LEFT_CURLY_BRACKET_TOKEN */
    };
    var RIGHT_CURLY_BRACKET_TOKEN = {
        type: 12 /* RIGHT_CURLY_BRACKET_TOKEN */
    };
    var SUBSTRING_MATCH_TOKEN = { type: 14 /* SUBSTRING_MATCH_TOKEN */ };
    var BAD_URL_TOKEN = { type: 23 /* BAD_URL_TOKEN */ };
    var BAD_STRING_TOKEN = { type: 1 /* BAD_STRING_TOKEN */ };
    var CDO_TOKEN = { type: 25 /* CDO_TOKEN */ };
    var CDC_TOKEN = { type: 24 /* CDC_TOKEN */ };
    var COLON_TOKEN = { type: 26 /* COLON_TOKEN */ };
    var SEMICOLON_TOKEN = { type: 27 /* SEMICOLON_TOKEN */ };
    var LEFT_SQUARE_BRACKET_TOKEN = {
        type: 28 /* LEFT_SQUARE_BRACKET_TOKEN */
    };
    var RIGHT_SQUARE_BRACKET_TOKEN = {
        type: 29 /* RIGHT_SQUARE_BRACKET_TOKEN */
    };
    var WHITESPACE_TOKEN = { type: 31 /* WHITESPACE_TOKEN */ };
    var EOF_TOKEN = { type: 32 /* EOF_TOKEN */ };
    var Tokenizer = /** @class */ (function () {
        function Tokenizer() {
            this._value = [];
        }
        Tokenizer.prototype.write = function (chunk) {
            this._value = this._value.concat(toCodePoints$1(chunk));
        };
        Tokenizer.prototype.read = function () {
            var tokens = [];
            var token = this.consumeToken();
            while (token !== EOF_TOKEN) {
                tokens.push(token);
                token = this.consumeToken();
            }
            return tokens;
        };
        Tokenizer.prototype.consumeToken = function () {
            var codePoint = this.consumeCodePoint();
            switch (codePoint) {
                case QUOTATION_MARK:
                    return this.consumeStringToken(QUOTATION_MARK);
                case NUMBER_SIGN:
                    var c1 = this.peekCodePoint(0);
                    var c2 = this.peekCodePoint(1);
                    var c3 = this.peekCodePoint(2);
                    if (isNameCodePoint(c1) || isValidEscape(c2, c3)) {
                        var flags = isIdentifierStart(c1, c2, c3) ? FLAG_ID : FLAG_UNRESTRICTED;
                        var value = this.consumeName();
                        return { type: 5 /* HASH_TOKEN */, value: value, flags: flags };
                    }
                    break;
                case DOLLAR_SIGN:
                    if (this.peekCodePoint(0) === EQUALS_SIGN) {
                        this.consumeCodePoint();
                        return SUFFIX_MATCH_TOKEN;
                    }
                    break;
                case APOSTROPHE:
                    return this.consumeStringToken(APOSTROPHE);
                case LEFT_PARENTHESIS:
                    return LEFT_PARENTHESIS_TOKEN;
                case RIGHT_PARENTHESIS:
                    return RIGHT_PARENTHESIS_TOKEN;
                case ASTERISK:
                    if (this.peekCodePoint(0) === EQUALS_SIGN) {
                        this.consumeCodePoint();
                        return SUBSTRING_MATCH_TOKEN;
                    }
                    break;
                case PLUS_SIGN:
                    if (isNumberStart(codePoint, this.peekCodePoint(0), this.peekCodePoint(1))) {
                        this.reconsumeCodePoint(codePoint);
                        return this.consumeNumericToken();
                    }
                    break;
                case COMMA:
                    return COMMA_TOKEN;
                case HYPHEN_MINUS:
                    var e1 = codePoint;
                    var e2 = this.peekCodePoint(0);
                    var e3 = this.peekCodePoint(1);
                    if (isNumberStart(e1, e2, e3)) {
                        this.reconsumeCodePoint(codePoint);
                        return this.consumeNumericToken();
                    }
                    if (isIdentifierStart(e1, e2, e3)) {
                        this.reconsumeCodePoint(codePoint);
                        return this.consumeIdentLikeToken();
                    }
                    if (e2 === HYPHEN_MINUS && e3 === GREATER_THAN_SIGN) {
                        this.consumeCodePoint();
                        this.consumeCodePoint();
                        return CDC_TOKEN;
                    }
                    break;
                case FULL_STOP:
                    if (isNumberStart(codePoint, this.peekCodePoint(0), this.peekCodePoint(1))) {
                        this.reconsumeCodePoint(codePoint);
                        return this.consumeNumericToken();
                    }
                    break;
                case SOLIDUS:
                    if (this.peekCodePoint(0) === ASTERISK) {
                        this.consumeCodePoint();
                        while (true) {
                            var c = this.consumeCodePoint();
                            if (c === ASTERISK) {
                                c = this.consumeCodePoint();
                                if (c === SOLIDUS) {
                                    return this.consumeToken();
                                }
                            }
                            if (c === EOF) {
                                return this.consumeToken();
                            }
                        }
                    }
                    break;
                case COLON:
                    return COLON_TOKEN;
                case SEMICOLON:
                    return SEMICOLON_TOKEN;
                case LESS_THAN_SIGN:
                    if (this.peekCodePoint(0) === EXCLAMATION_MARK &&
                        this.peekCodePoint(1) === HYPHEN_MINUS &&
                        this.peekCodePoint(2) === HYPHEN_MINUS) {
                        this.consumeCodePoint();
                        this.consumeCodePoint();
                        return CDO_TOKEN;
                    }
                    break;
                case COMMERCIAL_AT:
                    var a1 = this.peekCodePoint(0);
                    var a2 = this.peekCodePoint(1);
                    var a3 = this.peekCodePoint(2);
                    if (isIdentifierStart(a1, a2, a3)) {
                        var value = this.consumeName();
                        return { type: 7 /* AT_KEYWORD_TOKEN */, value: value };
                    }
                    break;
                case LEFT_SQUARE_BRACKET:
                    return LEFT_SQUARE_BRACKET_TOKEN;
                case REVERSE_SOLIDUS:
                    if (isValidEscape(codePoint, this.peekCodePoint(0))) {
                        this.reconsumeCodePoint(codePoint);
                        return this.consumeIdentLikeToken();
                    }
                    break;
                case RIGHT_SQUARE_BRACKET:
                    return RIGHT_SQUARE_BRACKET_TOKEN;
                case CIRCUMFLEX_ACCENT:
                    if (this.peekCodePoint(0) === EQUALS_SIGN) {
                        this.consumeCodePoint();
                        return PREFIX_MATCH_TOKEN;
                    }
                    break;
                case LEFT_CURLY_BRACKET:
                    return LEFT_CURLY_BRACKET_TOKEN;
                case RIGHT_CURLY_BRACKET:
                    return RIGHT_CURLY_BRACKET_TOKEN;
                case u:
                case U:
                    var u1 = this.peekCodePoint(0);
                    var u2 = this.peekCodePoint(1);
                    if (u1 === PLUS_SIGN && (isHex(u2) || u2 === QUESTION_MARK)) {
                        this.consumeCodePoint();
                        this.consumeUnicodeRangeToken();
                    }
                    this.reconsumeCodePoint(codePoint);
                    return this.consumeIdentLikeToken();
                case VERTICAL_LINE:
                    if (this.peekCodePoint(0) === EQUALS_SIGN) {
                        this.consumeCodePoint();
                        return DASH_MATCH_TOKEN;
                    }
                    if (this.peekCodePoint(0) === VERTICAL_LINE) {
                        this.consumeCodePoint();
                        return COLUMN_TOKEN;
                    }
                    break;
                case TILDE:
                    if (this.peekCodePoint(0) === EQUALS_SIGN) {
                        this.consumeCodePoint();
                        return INCLUDE_MATCH_TOKEN;
                    }
                    break;
                case EOF:
                    return EOF_TOKEN;
            }
            if (isWhiteSpace(codePoint)) {
                this.consumeWhiteSpace();
                return WHITESPACE_TOKEN;
            }
            if (isDigit(codePoint)) {
                this.reconsumeCodePoint(codePoint);
                return this.consumeNumericToken();
            }
            if (isNameStartCodePoint(codePoint)) {
                this.reconsumeCodePoint(codePoint);
                return this.consumeIdentLikeToken();
            }
            return { type: 6 /* DELIM_TOKEN */, value: fromCodePoint$1(codePoint) };
        };
        Tokenizer.prototype.consumeCodePoint = function () {
            var value = this._value.shift();
            return typeof value === 'undefined' ? -1 : value;
        };
        Tokenizer.prototype.reconsumeCodePoint = function (codePoint) {
            this._value.unshift(codePoint);
        };
        Tokenizer.prototype.peekCodePoint = function (delta) {
            if (delta >= this._value.length) {
                return -1;
            }
            return this._value[delta];
        };
        Tokenizer.prototype.consumeUnicodeRangeToken = function () {
            var digits = [];
            var codePoint = this.consumeCodePoint();
            while (isHex(codePoint) && digits.length < 6) {
                digits.push(codePoint);
                codePoint = this.consumeCodePoint();
            }
            var questionMarks = false;
            while (codePoint === QUESTION_MARK && digits.length < 6) {
                digits.push(codePoint);
                codePoint = this.consumeCodePoint();
                questionMarks = true;
            }
            if (questionMarks) {
                var start_1 = parseInt(fromCodePoint$1.apply(void 0, digits.map(function (digit) { return (digit === QUESTION_MARK ? ZERO : digit); })), 16);
                var end = parseInt(fromCodePoint$1.apply(void 0, digits.map(function (digit) { return (digit === QUESTION_MARK ? F : digit); })), 16);
                return { type: 30 /* UNICODE_RANGE_TOKEN */, start: start_1, end: end };
            }
            var start = parseInt(fromCodePoint$1.apply(void 0, digits), 16);
            if (this.peekCodePoint(0) === HYPHEN_MINUS && isHex(this.peekCodePoint(1))) {
                this.consumeCodePoint();
                codePoint = this.consumeCodePoint();
                var endDigits = [];
                while (isHex(codePoint) && endDigits.length < 6) {
                    endDigits.push(codePoint);
                    codePoint = this.consumeCodePoint();
                }
                var end = parseInt(fromCodePoint$1.apply(void 0, endDigits), 16);
                return { type: 30 /* UNICODE_RANGE_TOKEN */, start: start, end: end };
            }
            else {
                return { type: 30 /* UNICODE_RANGE_TOKEN */, start: start, end: start };
            }
        };
        Tokenizer.prototype.consumeIdentLikeToken = function () {
            var value = this.consumeName();
            if (value.toLowerCase() === 'url' && this.peekCodePoint(0) === LEFT_PARENTHESIS) {
                this.consumeCodePoint();
                return this.consumeUrlToken();
            }
            else if (this.peekCodePoint(0) === LEFT_PARENTHESIS) {
                this.consumeCodePoint();
                return { type: 19 /* FUNCTION_TOKEN */, value: value };
            }
            return { type: 20 /* IDENT_TOKEN */, value: value };
        };
        Tokenizer.prototype.consumeUrlToken = function () {
            var value = [];
            this.consumeWhiteSpace();
            if (this.peekCodePoint(0) === EOF) {
                return { type: 22 /* URL_TOKEN */, value: '' };
            }
            var next = this.peekCodePoint(0);
            if (next === APOSTROPHE || next === QUOTATION_MARK) {
                var stringToken = this.consumeStringToken(this.consumeCodePoint());
                if (stringToken.type === 0 /* STRING_TOKEN */) {
                    this.consumeWhiteSpace();
                    if (this.peekCodePoint(0) === EOF || this.peekCodePoint(0) === RIGHT_PARENTHESIS) {
                        this.consumeCodePoint();
                        return { type: 22 /* URL_TOKEN */, value: stringToken.value };
                    }
                }
                this.consumeBadUrlRemnants();
                return BAD_URL_TOKEN;
            }
            while (true) {
                var codePoint = this.consumeCodePoint();
                if (codePoint === EOF || codePoint === RIGHT_PARENTHESIS) {
                    return { type: 22 /* URL_TOKEN */, value: fromCodePoint$1.apply(void 0, value) };
                }
                else if (isWhiteSpace(codePoint)) {
                    this.consumeWhiteSpace();
                    if (this.peekCodePoint(0) === EOF || this.peekCodePoint(0) === RIGHT_PARENTHESIS) {
                        this.consumeCodePoint();
                        return { type: 22 /* URL_TOKEN */, value: fromCodePoint$1.apply(void 0, value) };
                    }
                    this.consumeBadUrlRemnants();
                    return BAD_URL_TOKEN;
                }
                else if (codePoint === QUOTATION_MARK ||
                    codePoint === APOSTROPHE ||
                    codePoint === LEFT_PARENTHESIS ||
                    isNonPrintableCodePoint(codePoint)) {
                    this.consumeBadUrlRemnants();
                    return BAD_URL_TOKEN;
                }
                else if (codePoint === REVERSE_SOLIDUS) {
                    if (isValidEscape(codePoint, this.peekCodePoint(0))) {
                        value.push(this.consumeEscapedCodePoint());
                    }
                    else {
                        this.consumeBadUrlRemnants();
                        return BAD_URL_TOKEN;
                    }
                }
                else {
                    value.push(codePoint);
                }
            }
        };
        Tokenizer.prototype.consumeWhiteSpace = function () {
            while (isWhiteSpace(this.peekCodePoint(0))) {
                this.consumeCodePoint();
            }
        };
        Tokenizer.prototype.consumeBadUrlRemnants = function () {
            while (true) {
                var codePoint = this.consumeCodePoint();
                if (codePoint === RIGHT_PARENTHESIS || codePoint === EOF) {
                    return;
                }
                if (isValidEscape(codePoint, this.peekCodePoint(0))) {
                    this.consumeEscapedCodePoint();
                }
            }
        };
        Tokenizer.prototype.consumeStringSlice = function (count) {
            var SLICE_STACK_SIZE = 50000;
            var value = '';
            while (count > 0) {
                var amount = Math.min(SLICE_STACK_SIZE, count);
                value += fromCodePoint$1.apply(void 0, this._value.splice(0, amount));
                count -= amount;
            }
            this._value.shift();
            return value;
        };
        Tokenizer.prototype.consumeStringToken = function (endingCodePoint) {
            var value = '';
            var i = 0;
            do {
                var codePoint = this._value[i];
                if (codePoint === EOF || codePoint === undefined || codePoint === endingCodePoint) {
                    value += this.consumeStringSlice(i);
                    return { type: 0 /* STRING_TOKEN */, value: value };
                }
                if (codePoint === LINE_FEED) {
                    this._value.splice(0, i);
                    return BAD_STRING_TOKEN;
                }
                if (codePoint === REVERSE_SOLIDUS) {
                    var next = this._value[i + 1];
                    if (next !== EOF && next !== undefined) {
                        if (next === LINE_FEED) {
                            value += this.consumeStringSlice(i);
                            i = -1;
                            this._value.shift();
                        }
                        else if (isValidEscape(codePoint, next)) {
                            value += this.consumeStringSlice(i);
                            value += fromCodePoint$1(this.consumeEscapedCodePoint());
                            i = -1;
                        }
                    }
                }
                i++;
            } while (true);
        };
        Tokenizer.prototype.consumeNumber = function () {
            var repr = [];
            var type = FLAG_INTEGER;
            var c1 = this.peekCodePoint(0);
            if (c1 === PLUS_SIGN || c1 === HYPHEN_MINUS) {
                repr.push(this.consumeCodePoint());
            }
            while (isDigit(this.peekCodePoint(0))) {
                repr.push(this.consumeCodePoint());
            }
            c1 = this.peekCodePoint(0);
            var c2 = this.peekCodePoint(1);
            if (c1 === FULL_STOP && isDigit(c2)) {
                repr.push(this.consumeCodePoint(), this.consumeCodePoint());
                type = FLAG_NUMBER;
                while (isDigit(this.peekCodePoint(0))) {
                    repr.push(this.consumeCodePoint());
                }
            }
            c1 = this.peekCodePoint(0);
            c2 = this.peekCodePoint(1);
            var c3 = this.peekCodePoint(2);
            if ((c1 === E || c1 === e) && (((c2 === PLUS_SIGN || c2 === HYPHEN_MINUS) && isDigit(c3)) || isDigit(c2))) {
                repr.push(this.consumeCodePoint(), this.consumeCodePoint());
                type = FLAG_NUMBER;
                while (isDigit(this.peekCodePoint(0))) {
                    repr.push(this.consumeCodePoint());
                }
            }
            return [stringToNumber(repr), type];
        };
        Tokenizer.prototype.consumeNumericToken = function () {
            var _a = this.consumeNumber(), number = _a[0], flags = _a[1];
            var c1 = this.peekCodePoint(0);
            var c2 = this.peekCodePoint(1);
            var c3 = this.peekCodePoint(2);
            if (isIdentifierStart(c1, c2, c3)) {
                var unit = this.consumeName();
                return { type: 15 /* DIMENSION_TOKEN */, number: number, flags: flags, unit: unit };
            }
            if (c1 === PERCENTAGE_SIGN) {
                this.consumeCodePoint();
                return { type: 16 /* PERCENTAGE_TOKEN */, number: number, flags: flags };
            }
            return { type: 17 /* NUMBER_TOKEN */, number: number, flags: flags };
        };
        Tokenizer.prototype.consumeEscapedCodePoint = function () {
            var codePoint = this.consumeCodePoint();
            if (isHex(codePoint)) {
                var hex = fromCodePoint$1(codePoint);
                while (isHex(this.peekCodePoint(0)) && hex.length < 6) {
                    hex += fromCodePoint$1(this.consumeCodePoint());
                }
                if (isWhiteSpace(this.peekCodePoint(0))) {
                    this.consumeCodePoint();
                }
                var hexCodePoint = parseInt(hex, 16);
                if (hexCodePoint === 0 || isSurrogateCodePoint(hexCodePoint) || hexCodePoint > 0x10ffff) {
                    return REPLACEMENT_CHARACTER;
                }
                return hexCodePoint;
            }
            if (codePoint === EOF) {
                return REPLACEMENT_CHARACTER;
            }
            return codePoint;
        };
        Tokenizer.prototype.consumeName = function () {
            var result = '';
            while (true) {
                var codePoint = this.consumeCodePoint();
                if (isNameCodePoint(codePoint)) {
                    result += fromCodePoint$1(codePoint);
                }
                else if (isValidEscape(codePoint, this.peekCodePoint(0))) {
                    result += fromCodePoint$1(this.consumeEscapedCodePoint());
                }
                else {
                    this.reconsumeCodePoint(codePoint);
                    return result;
                }
            }
        };
        return Tokenizer;
    }());

    var Parser = /** @class */ (function () {
        function Parser(tokens) {
            this._tokens = tokens;
        }
        Parser.create = function (value) {
            var tokenizer = new Tokenizer();
            tokenizer.write(value);
            return new Parser(tokenizer.read());
        };
        Parser.parseValue = function (value) {
            return Parser.create(value).parseComponentValue();
        };
        Parser.parseValues = function (value) {
            return Parser.create(value).parseComponentValues();
        };
        Parser.prototype.parseComponentValue = function () {
            var token = this.consumeToken();
            while (token.type === 31 /* WHITESPACE_TOKEN */) {
                token = this.consumeToken();
            }
            if (token.type === 32 /* EOF_TOKEN */) {
                throw new SyntaxError("Error parsing CSS component value, unexpected EOF");
            }
            this.reconsumeToken(token);
            var value = this.consumeComponentValue();
            do {
                token = this.consumeToken();
            } while (token.type === 31 /* WHITESPACE_TOKEN */);
            if (token.type === 32 /* EOF_TOKEN */) {
                return value;
            }
            throw new SyntaxError("Error parsing CSS component value, multiple values found when expecting only one");
        };
        Parser.prototype.parseComponentValues = function () {
            var values = [];
            while (true) {
                var value = this.consumeComponentValue();
                if (value.type === 32 /* EOF_TOKEN */) {
                    return values;
                }
                values.push(value);
                values.push();
            }
        };
        Parser.prototype.consumeComponentValue = function () {
            var token = this.consumeToken();
            switch (token.type) {
                case 11 /* LEFT_CURLY_BRACKET_TOKEN */:
                case 28 /* LEFT_SQUARE_BRACKET_TOKEN */:
                case 2 /* LEFT_PARENTHESIS_TOKEN */:
                    return this.consumeSimpleBlock(token.type);
                case 19 /* FUNCTION_TOKEN */:
                    return this.consumeFunction(token);
            }
            return token;
        };
        Parser.prototype.consumeSimpleBlock = function (type) {
            var block = { type: type, values: [] };
            var token = this.consumeToken();
            while (true) {
                if (token.type === 32 /* EOF_TOKEN */ || isEndingTokenFor(token, type)) {
                    return block;
                }
                this.reconsumeToken(token);
                block.values.push(this.consumeComponentValue());
                token = this.consumeToken();
            }
        };
        Parser.prototype.consumeFunction = function (functionToken) {
            var cssFunction = {
                name: functionToken.value,
                values: [],
                type: 18 /* FUNCTION */
            };
            while (true) {
                var token = this.consumeToken();
                if (token.type === 32 /* EOF_TOKEN */ || token.type === 3 /* RIGHT_PARENTHESIS_TOKEN */) {
                    return cssFunction;
                }
                this.reconsumeToken(token);
                cssFunction.values.push(this.consumeComponentValue());
            }
        };
        Parser.prototype.consumeToken = function () {
            var token = this._tokens.shift();
            return typeof token === 'undefined' ? EOF_TOKEN : token;
        };
        Parser.prototype.reconsumeToken = function (token) {
            this._tokens.unshift(token);
        };
        return Parser;
    }());
    var isDimensionToken = function (token) { return token.type === 15 /* DIMENSION_TOKEN */; };
    var isNumberToken = function (token) { return token.type === 17 /* NUMBER_TOKEN */; };
    var isIdentToken = function (token) { return token.type === 20 /* IDENT_TOKEN */; };
    var isStringToken = function (token) { return token.type === 0 /* STRING_TOKEN */; };
    var isIdentWithValue = function (token, value) {
        return isIdentToken(token) && token.value === value;
    };
    var nonWhiteSpace = function (token) { return token.type !== 31 /* WHITESPACE_TOKEN */; };
    var nonFunctionArgSeparator = function (token) {
        return token.type !== 31 /* WHITESPACE_TOKEN */ && token.type !== 4 /* COMMA_TOKEN */;
    };
    var parseFunctionArgs = function (tokens) {
        var args = [];
        var arg = [];
        tokens.forEach(function (token) {
            if (token.type === 4 /* COMMA_TOKEN */) {
                if (arg.length === 0) {
                    throw new Error("Error parsing function args, zero tokens for arg");
                }
                args.push(arg);
                arg = [];
                return;
            }
            if (token.type !== 31 /* WHITESPACE_TOKEN */) {
                arg.push(token);
            }
        });
        if (arg.length) {
            args.push(arg);
        }
        return args;
    };
    var isEndingTokenFor = function (token, type) {
        if (type === 11 /* LEFT_CURLY_BRACKET_TOKEN */ && token.type === 12 /* RIGHT_CURLY_BRACKET_TOKEN */) {
            return true;
        }
        if (type === 28 /* LEFT_SQUARE_BRACKET_TOKEN */ && token.type === 29 /* RIGHT_SQUARE_BRACKET_TOKEN */) {
            return true;
        }
        return type === 2 /* LEFT_PARENTHESIS_TOKEN */ && token.type === 3 /* RIGHT_PARENTHESIS_TOKEN */;
    };

    var isLength = function (token) {
        return token.type === 17 /* NUMBER_TOKEN */ || token.type === 15 /* DIMENSION_TOKEN */;
    };

    var isLengthPercentage = function (token) {
        return token.type === 16 /* PERCENTAGE_TOKEN */ || isLength(token);
    };
    var parseLengthPercentageTuple = function (tokens) {
        return tokens.length > 1 ? [tokens[0], tokens[1]] : [tokens[0]];
    };
    var ZERO_LENGTH = {
        type: 17 /* NUMBER_TOKEN */,
        number: 0,
        flags: FLAG_INTEGER
    };
    var FIFTY_PERCENT = {
        type: 16 /* PERCENTAGE_TOKEN */,
        number: 50,
        flags: FLAG_INTEGER
    };
    var HUNDRED_PERCENT = {
        type: 16 /* PERCENTAGE_TOKEN */,
        number: 100,
        flags: FLAG_INTEGER
    };
    var getAbsoluteValueForTuple = function (tuple, width, height) {
        var x = tuple[0], y = tuple[1];
        return [getAbsoluteValue(x, width), getAbsoluteValue(typeof y !== 'undefined' ? y : x, height)];
    };
    var getAbsoluteValue = function (token, parent) {
        if (token.type === 16 /* PERCENTAGE_TOKEN */) {
            return (token.number / 100) * parent;
        }
        if (isDimensionToken(token)) {
            switch (token.unit) {
                case 'rem':
                case 'em':
                    return 16 * token.number; // TODO use correct font-size
                case 'px':
                default:
                    return token.number;
            }
        }
        return token.number;
    };

    var DEG = 'deg';
    var GRAD = 'grad';
    var RAD = 'rad';
    var TURN = 'turn';
    var angle = {
        name: 'angle',
        parse: function (_context, value) {
            if (value.type === 15 /* DIMENSION_TOKEN */) {
                switch (value.unit) {
                    case DEG:
                        return (Math.PI * value.number) / 180;
                    case GRAD:
                        return (Math.PI / 200) * value.number;
                    case RAD:
                        return value.number;
                    case TURN:
                        return Math.PI * 2 * value.number;
                }
            }
            throw new Error("Unsupported angle type");
        }
    };
    var isAngle = function (value) {
        if (value.type === 15 /* DIMENSION_TOKEN */) {
            if (value.unit === DEG || value.unit === GRAD || value.unit === RAD || value.unit === TURN) {
                return true;
            }
        }
        return false;
    };
    var parseNamedSide = function (tokens) {
        var sideOrCorner = tokens
            .filter(isIdentToken)
            .map(function (ident) { return ident.value; })
            .join(' ');
        switch (sideOrCorner) {
            case 'to bottom right':
            case 'to right bottom':
            case 'left top':
            case 'top left':
                return [ZERO_LENGTH, ZERO_LENGTH];
            case 'to top':
            case 'bottom':
                return deg(0);
            case 'to bottom left':
            case 'to left bottom':
            case 'right top':
            case 'top right':
                return [ZERO_LENGTH, HUNDRED_PERCENT];
            case 'to right':
            case 'left':
                return deg(90);
            case 'to top left':
            case 'to left top':
            case 'right bottom':
            case 'bottom right':
                return [HUNDRED_PERCENT, HUNDRED_PERCENT];
            case 'to bottom':
            case 'top':
                return deg(180);
            case 'to top right':
            case 'to right top':
            case 'left bottom':
            case 'bottom left':
                return [HUNDRED_PERCENT, ZERO_LENGTH];
            case 'to left':
            case 'right':
                return deg(270);
        }
        return 0;
    };
    var deg = function (deg) { return (Math.PI * deg) / 180; };

    var color$1 = {
        name: 'color',
        parse: function (context, value) {
            if (value.type === 18 /* FUNCTION */) {
                var colorFunction = SUPPORTED_COLOR_FUNCTIONS[value.name];
                if (typeof colorFunction === 'undefined') {
                    throw new Error("Attempting to parse an unsupported color function \"" + value.name + "\"");
                }
                return colorFunction(context, value.values);
            }
            if (value.type === 5 /* HASH_TOKEN */) {
                if (value.value.length === 3) {
                    var r = value.value.substring(0, 1);
                    var g = value.value.substring(1, 2);
                    var b = value.value.substring(2, 3);
                    return pack(parseInt(r + r, 16), parseInt(g + g, 16), parseInt(b + b, 16), 1);
                }
                if (value.value.length === 4) {
                    var r = value.value.substring(0, 1);
                    var g = value.value.substring(1, 2);
                    var b = value.value.substring(2, 3);
                    var a = value.value.substring(3, 4);
                    return pack(parseInt(r + r, 16), parseInt(g + g, 16), parseInt(b + b, 16), parseInt(a + a, 16) / 255);
                }
                if (value.value.length === 6) {
                    var r = value.value.substring(0, 2);
                    var g = value.value.substring(2, 4);
                    var b = value.value.substring(4, 6);
                    return pack(parseInt(r, 16), parseInt(g, 16), parseInt(b, 16), 1);
                }
                if (value.value.length === 8) {
                    var r = value.value.substring(0, 2);
                    var g = value.value.substring(2, 4);
                    var b = value.value.substring(4, 6);
                    var a = value.value.substring(6, 8);
                    return pack(parseInt(r, 16), parseInt(g, 16), parseInt(b, 16), parseInt(a, 16) / 255);
                }
            }
            if (value.type === 20 /* IDENT_TOKEN */) {
                var namedColor = COLORS[value.value.toUpperCase()];
                if (typeof namedColor !== 'undefined') {
                    return namedColor;
                }
            }
            return COLORS.TRANSPARENT;
        }
    };
    var isTransparent = function (color) { return (0xff & color) === 0; };
    var asString = function (color) {
        var alpha = 0xff & color;
        var blue = 0xff & (color >> 8);
        var green = 0xff & (color >> 16);
        var red = 0xff & (color >> 24);
        return alpha < 255 ? "rgba(" + red + "," + green + "," + blue + "," + alpha / 255 + ")" : "rgb(" + red + "," + green + "," + blue + ")";
    };
    var pack = function (r, g, b, a) {
        return ((r << 24) | (g << 16) | (b << 8) | (Math.round(a * 255) << 0)) >>> 0;
    };
    var getTokenColorValue = function (token, i) {
        if (token.type === 17 /* NUMBER_TOKEN */) {
            return token.number;
        }
        if (token.type === 16 /* PERCENTAGE_TOKEN */) {
            var max = i === 3 ? 1 : 255;
            return i === 3 ? (token.number / 100) * max : Math.round((token.number / 100) * max);
        }
        return 0;
    };
    var rgb = function (_context, args) {
        var tokens = args.filter(nonFunctionArgSeparator);
        if (tokens.length === 3) {
            var _a = tokens.map(getTokenColorValue), r = _a[0], g = _a[1], b = _a[2];
            return pack(r, g, b, 1);
        }
        if (tokens.length === 4) {
            var _b = tokens.map(getTokenColorValue), r = _b[0], g = _b[1], b = _b[2], a = _b[3];
            return pack(r, g, b, a);
        }
        return 0;
    };
    function hue2rgb(t1, t2, hue) {
        if (hue < 0) {
            hue += 1;
        }
        if (hue >= 1) {
            hue -= 1;
        }
        if (hue < 1 / 6) {
            return (t2 - t1) * hue * 6 + t1;
        }
        else if (hue < 1 / 2) {
            return t2;
        }
        else if (hue < 2 / 3) {
            return (t2 - t1) * 6 * (2 / 3 - hue) + t1;
        }
        else {
            return t1;
        }
    }
    var hsl = function (context, args) {
        var tokens = args.filter(nonFunctionArgSeparator);
        var hue = tokens[0], saturation = tokens[1], lightness = tokens[2], alpha = tokens[3];
        var h = (hue.type === 17 /* NUMBER_TOKEN */ ? deg(hue.number) : angle.parse(context, hue)) / (Math.PI * 2);
        var s = isLengthPercentage(saturation) ? saturation.number / 100 : 0;
        var l = isLengthPercentage(lightness) ? lightness.number / 100 : 0;
        var a = typeof alpha !== 'undefined' && isLengthPercentage(alpha) ? getAbsoluteValue(alpha, 1) : 1;
        if (s === 0) {
            return pack(l * 255, l * 255, l * 255, 1);
        }
        var t2 = l <= 0.5 ? l * (s + 1) : l + s - l * s;
        var t1 = l * 2 - t2;
        var r = hue2rgb(t1, t2, h + 1 / 3);
        var g = hue2rgb(t1, t2, h);
        var b = hue2rgb(t1, t2, h - 1 / 3);
        return pack(r * 255, g * 255, b * 255, a);
    };
    var SUPPORTED_COLOR_FUNCTIONS = {
        hsl: hsl,
        hsla: hsl,
        rgb: rgb,
        rgba: rgb
    };
    var parseColor = function (context, value) {
        return color$1.parse(context, Parser.create(value).parseComponentValue());
    };
    var COLORS = {
        ALICEBLUE: 0xf0f8ffff,
        ANTIQUEWHITE: 0xfaebd7ff,
        AQUA: 0x00ffffff,
        AQUAMARINE: 0x7fffd4ff,
        AZURE: 0xf0ffffff,
        BEIGE: 0xf5f5dcff,
        BISQUE: 0xffe4c4ff,
        BLACK: 0x000000ff,
        BLANCHEDALMOND: 0xffebcdff,
        BLUE: 0x0000ffff,
        BLUEVIOLET: 0x8a2be2ff,
        BROWN: 0xa52a2aff,
        BURLYWOOD: 0xdeb887ff,
        CADETBLUE: 0x5f9ea0ff,
        CHARTREUSE: 0x7fff00ff,
        CHOCOLATE: 0xd2691eff,
        CORAL: 0xff7f50ff,
        CORNFLOWERBLUE: 0x6495edff,
        CORNSILK: 0xfff8dcff,
        CRIMSON: 0xdc143cff,
        CYAN: 0x00ffffff,
        DARKBLUE: 0x00008bff,
        DARKCYAN: 0x008b8bff,
        DARKGOLDENROD: 0xb886bbff,
        DARKGRAY: 0xa9a9a9ff,
        DARKGREEN: 0x006400ff,
        DARKGREY: 0xa9a9a9ff,
        DARKKHAKI: 0xbdb76bff,
        DARKMAGENTA: 0x8b008bff,
        DARKOLIVEGREEN: 0x556b2fff,
        DARKORANGE: 0xff8c00ff,
        DARKORCHID: 0x9932ccff,
        DARKRED: 0x8b0000ff,
        DARKSALMON: 0xe9967aff,
        DARKSEAGREEN: 0x8fbc8fff,
        DARKSLATEBLUE: 0x483d8bff,
        DARKSLATEGRAY: 0x2f4f4fff,
        DARKSLATEGREY: 0x2f4f4fff,
        DARKTURQUOISE: 0x00ced1ff,
        DARKVIOLET: 0x9400d3ff,
        DEEPPINK: 0xff1493ff,
        DEEPSKYBLUE: 0x00bfffff,
        DIMGRAY: 0x696969ff,
        DIMGREY: 0x696969ff,
        DODGERBLUE: 0x1e90ffff,
        FIREBRICK: 0xb22222ff,
        FLORALWHITE: 0xfffaf0ff,
        FORESTGREEN: 0x228b22ff,
        FUCHSIA: 0xff00ffff,
        GAINSBORO: 0xdcdcdcff,
        GHOSTWHITE: 0xf8f8ffff,
        GOLD: 0xffd700ff,
        GOLDENROD: 0xdaa520ff,
        GRAY: 0x808080ff,
        GREEN: 0x008000ff,
        GREENYELLOW: 0xadff2fff,
        GREY: 0x808080ff,
        HONEYDEW: 0xf0fff0ff,
        HOTPINK: 0xff69b4ff,
        INDIANRED: 0xcd5c5cff,
        INDIGO: 0x4b0082ff,
        IVORY: 0xfffff0ff,
        KHAKI: 0xf0e68cff,
        LAVENDER: 0xe6e6faff,
        LAVENDERBLUSH: 0xfff0f5ff,
        LAWNGREEN: 0x7cfc00ff,
        LEMONCHIFFON: 0xfffacdff,
        LIGHTBLUE: 0xadd8e6ff,
        LIGHTCORAL: 0xf08080ff,
        LIGHTCYAN: 0xe0ffffff,
        LIGHTGOLDENRODYELLOW: 0xfafad2ff,
        LIGHTGRAY: 0xd3d3d3ff,
        LIGHTGREEN: 0x90ee90ff,
        LIGHTGREY: 0xd3d3d3ff,
        LIGHTPINK: 0xffb6c1ff,
        LIGHTSALMON: 0xffa07aff,
        LIGHTSEAGREEN: 0x20b2aaff,
        LIGHTSKYBLUE: 0x87cefaff,
        LIGHTSLATEGRAY: 0x778899ff,
        LIGHTSLATEGREY: 0x778899ff,
        LIGHTSTEELBLUE: 0xb0c4deff,
        LIGHTYELLOW: 0xffffe0ff,
        LIME: 0x00ff00ff,
        LIMEGREEN: 0x32cd32ff,
        LINEN: 0xfaf0e6ff,
        MAGENTA: 0xff00ffff,
        MAROON: 0x800000ff,
        MEDIUMAQUAMARINE: 0x66cdaaff,
        MEDIUMBLUE: 0x0000cdff,
        MEDIUMORCHID: 0xba55d3ff,
        MEDIUMPURPLE: 0x9370dbff,
        MEDIUMSEAGREEN: 0x3cb371ff,
        MEDIUMSLATEBLUE: 0x7b68eeff,
        MEDIUMSPRINGGREEN: 0x00fa9aff,
        MEDIUMTURQUOISE: 0x48d1ccff,
        MEDIUMVIOLETRED: 0xc71585ff,
        MIDNIGHTBLUE: 0x191970ff,
        MINTCREAM: 0xf5fffaff,
        MISTYROSE: 0xffe4e1ff,
        MOCCASIN: 0xffe4b5ff,
        NAVAJOWHITE: 0xffdeadff,
        NAVY: 0x000080ff,
        OLDLACE: 0xfdf5e6ff,
        OLIVE: 0x808000ff,
        OLIVEDRAB: 0x6b8e23ff,
        ORANGE: 0xffa500ff,
        ORANGERED: 0xff4500ff,
        ORCHID: 0xda70d6ff,
        PALEGOLDENROD: 0xeee8aaff,
        PALEGREEN: 0x98fb98ff,
        PALETURQUOISE: 0xafeeeeff,
        PALEVIOLETRED: 0xdb7093ff,
        PAPAYAWHIP: 0xffefd5ff,
        PEACHPUFF: 0xffdab9ff,
        PERU: 0xcd853fff,
        PINK: 0xffc0cbff,
        PLUM: 0xdda0ddff,
        POWDERBLUE: 0xb0e0e6ff,
        PURPLE: 0x800080ff,
        REBECCAPURPLE: 0x663399ff,
        RED: 0xff0000ff,
        ROSYBROWN: 0xbc8f8fff,
        ROYALBLUE: 0x4169e1ff,
        SADDLEBROWN: 0x8b4513ff,
        SALMON: 0xfa8072ff,
        SANDYBROWN: 0xf4a460ff,
        SEAGREEN: 0x2e8b57ff,
        SEASHELL: 0xfff5eeff,
        SIENNA: 0xa0522dff,
        SILVER: 0xc0c0c0ff,
        SKYBLUE: 0x87ceebff,
        SLATEBLUE: 0x6a5acdff,
        SLATEGRAY: 0x708090ff,
        SLATEGREY: 0x708090ff,
        SNOW: 0xfffafaff,
        SPRINGGREEN: 0x00ff7fff,
        STEELBLUE: 0x4682b4ff,
        TAN: 0xd2b48cff,
        TEAL: 0x008080ff,
        THISTLE: 0xd8bfd8ff,
        TOMATO: 0xff6347ff,
        TRANSPARENT: 0x00000000,
        TURQUOISE: 0x40e0d0ff,
        VIOLET: 0xee82eeff,
        WHEAT: 0xf5deb3ff,
        WHITE: 0xffffffff,
        WHITESMOKE: 0xf5f5f5ff,
        YELLOW: 0xffff00ff,
        YELLOWGREEN: 0x9acd32ff
    };

    var backgroundClip = {
        name: 'background-clip',
        initialValue: 'border-box',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            return tokens.map(function (token) {
                if (isIdentToken(token)) {
                    switch (token.value) {
                        case 'padding-box':
                            return 1 /* PADDING_BOX */;
                        case 'content-box':
                            return 2 /* CONTENT_BOX */;
                    }
                }
                return 0 /* BORDER_BOX */;
            });
        }
    };

    var backgroundColor = {
        name: "background-color",
        initialValue: 'transparent',
        prefix: false,
        type: 3 /* TYPE_VALUE */,
        format: 'color'
    };

    var parseColorStop = function (context, args) {
        var color = color$1.parse(context, args[0]);
        var stop = args[1];
        return stop && isLengthPercentage(stop) ? { color: color, stop: stop } : { color: color, stop: null };
    };
    var processColorStops = function (stops, lineLength) {
        var first = stops[0];
        var last = stops[stops.length - 1];
        if (first.stop === null) {
            first.stop = ZERO_LENGTH;
        }
        if (last.stop === null) {
            last.stop = HUNDRED_PERCENT;
        }
        var processStops = [];
        var previous = 0;
        for (var i = 0; i < stops.length; i++) {
            var stop_1 = stops[i].stop;
            if (stop_1 !== null) {
                var absoluteValue = getAbsoluteValue(stop_1, lineLength);
                if (absoluteValue > previous) {
                    processStops.push(absoluteValue);
                }
                else {
                    processStops.push(previous);
                }
                previous = absoluteValue;
            }
            else {
                processStops.push(null);
            }
        }
        var gapBegin = null;
        for (var i = 0; i < processStops.length; i++) {
            var stop_2 = processStops[i];
            if (stop_2 === null) {
                if (gapBegin === null) {
                    gapBegin = i;
                }
            }
            else if (gapBegin !== null) {
                var gapLength = i - gapBegin;
                var beforeGap = processStops[gapBegin - 1];
                var gapValue = (stop_2 - beforeGap) / (gapLength + 1);
                for (var g = 1; g <= gapLength; g++) {
                    processStops[gapBegin + g - 1] = gapValue * g;
                }
                gapBegin = null;
            }
        }
        return stops.map(function (_a, i) {
            var color = _a.color;
            return { color: color, stop: Math.max(Math.min(1, processStops[i] / lineLength), 0) };
        });
    };
    var getAngleFromCorner = function (corner, width, height) {
        var centerX = width / 2;
        var centerY = height / 2;
        var x = getAbsoluteValue(corner[0], width) - centerX;
        var y = centerY - getAbsoluteValue(corner[1], height);
        return (Math.atan2(y, x) + Math.PI * 2) % (Math.PI * 2);
    };
    var calculateGradientDirection = function (angle, width, height) {
        var radian = typeof angle === 'number' ? angle : getAngleFromCorner(angle, width, height);
        var lineLength = Math.abs(width * Math.sin(radian)) + Math.abs(height * Math.cos(radian));
        var halfWidth = width / 2;
        var halfHeight = height / 2;
        var halfLineLength = lineLength / 2;
        var yDiff = Math.sin(radian - Math.PI / 2) * halfLineLength;
        var xDiff = Math.cos(radian - Math.PI / 2) * halfLineLength;
        return [lineLength, halfWidth - xDiff, halfWidth + xDiff, halfHeight - yDiff, halfHeight + yDiff];
    };
    var distance = function (a, b) { return Math.sqrt(a * a + b * b); };
    var findCorner = function (width, height, x, y, closest) {
        var corners = [
            [0, 0],
            [0, height],
            [width, 0],
            [width, height]
        ];
        return corners.reduce(function (stat, corner) {
            var cx = corner[0], cy = corner[1];
            var d = distance(x - cx, y - cy);
            if (closest ? d < stat.optimumDistance : d > stat.optimumDistance) {
                return {
                    optimumCorner: corner,
                    optimumDistance: d
                };
            }
            return stat;
        }, {
            optimumDistance: closest ? Infinity : -Infinity,
            optimumCorner: null
        }).optimumCorner;
    };
    var calculateRadius = function (gradient, x, y, width, height) {
        var rx = 0;
        var ry = 0;
        switch (gradient.size) {
            case 0 /* CLOSEST_SIDE */:
                // The ending shape is sized so that that it exactly meets the side of the gradient box closest to the gradient’s center.
                // If the shape is an ellipse, it exactly meets the closest side in each dimension.
                if (gradient.shape === 0 /* CIRCLE */) {
                    rx = ry = Math.min(Math.abs(x), Math.abs(x - width), Math.abs(y), Math.abs(y - height));
                }
                else if (gradient.shape === 1 /* ELLIPSE */) {
                    rx = Math.min(Math.abs(x), Math.abs(x - width));
                    ry = Math.min(Math.abs(y), Math.abs(y - height));
                }
                break;
            case 2 /* CLOSEST_CORNER */:
                // The ending shape is sized so that that it passes through the corner of the gradient box closest to the gradient’s center.
                // If the shape is an ellipse, the ending shape is given the same aspect-ratio it would have if closest-side were specified.
                if (gradient.shape === 0 /* CIRCLE */) {
                    rx = ry = Math.min(distance(x, y), distance(x, y - height), distance(x - width, y), distance(x - width, y - height));
                }
                else if (gradient.shape === 1 /* ELLIPSE */) {
                    // Compute the ratio ry/rx (which is to be the same as for "closest-side")
                    var c = Math.min(Math.abs(y), Math.abs(y - height)) / Math.min(Math.abs(x), Math.abs(x - width));
                    var _a = findCorner(width, height, x, y, true), cx = _a[0], cy = _a[1];
                    rx = distance(cx - x, (cy - y) / c);
                    ry = c * rx;
                }
                break;
            case 1 /* FARTHEST_SIDE */:
                // Same as closest-side, except the ending shape is sized based on the farthest side(s)
                if (gradient.shape === 0 /* CIRCLE */) {
                    rx = ry = Math.max(Math.abs(x), Math.abs(x - width), Math.abs(y), Math.abs(y - height));
                }
                else if (gradient.shape === 1 /* ELLIPSE */) {
                    rx = Math.max(Math.abs(x), Math.abs(x - width));
                    ry = Math.max(Math.abs(y), Math.abs(y - height));
                }
                break;
            case 3 /* FARTHEST_CORNER */:
                // Same as closest-corner, except the ending shape is sized based on the farthest corner.
                // If the shape is an ellipse, the ending shape is given the same aspect ratio it would have if farthest-side were specified.
                if (gradient.shape === 0 /* CIRCLE */) {
                    rx = ry = Math.max(distance(x, y), distance(x, y - height), distance(x - width, y), distance(x - width, y - height));
                }
                else if (gradient.shape === 1 /* ELLIPSE */) {
                    // Compute the ratio ry/rx (which is to be the same as for "farthest-side")
                    var c = Math.max(Math.abs(y), Math.abs(y - height)) / Math.max(Math.abs(x), Math.abs(x - width));
                    var _b = findCorner(width, height, x, y, false), cx = _b[0], cy = _b[1];
                    rx = distance(cx - x, (cy - y) / c);
                    ry = c * rx;
                }
                break;
        }
        if (Array.isArray(gradient.size)) {
            rx = getAbsoluteValue(gradient.size[0], width);
            ry = gradient.size.length === 2 ? getAbsoluteValue(gradient.size[1], height) : rx;
        }
        return [rx, ry];
    };

    var linearGradient = function (context, tokens) {
        var angle$1 = deg(180);
        var stops = [];
        parseFunctionArgs(tokens).forEach(function (arg, i) {
            if (i === 0) {
                var firstToken = arg[0];
                if (firstToken.type === 20 /* IDENT_TOKEN */ && firstToken.value === 'to') {
                    angle$1 = parseNamedSide(arg);
                    return;
                }
                else if (isAngle(firstToken)) {
                    angle$1 = angle.parse(context, firstToken);
                    return;
                }
            }
            var colorStop = parseColorStop(context, arg);
            stops.push(colorStop);
        });
        return { angle: angle$1, stops: stops, type: 1 /* LINEAR_GRADIENT */ };
    };

    var prefixLinearGradient = function (context, tokens) {
        var angle$1 = deg(180);
        var stops = [];
        parseFunctionArgs(tokens).forEach(function (arg, i) {
            if (i === 0) {
                var firstToken = arg[0];
                if (firstToken.type === 20 /* IDENT_TOKEN */ &&
                    ['top', 'left', 'right', 'bottom'].indexOf(firstToken.value) !== -1) {
                    angle$1 = parseNamedSide(arg);
                    return;
                }
                else if (isAngle(firstToken)) {
                    angle$1 = (angle.parse(context, firstToken) + deg(270)) % deg(360);
                    return;
                }
            }
            var colorStop = parseColorStop(context, arg);
            stops.push(colorStop);
        });
        return {
            angle: angle$1,
            stops: stops,
            type: 1 /* LINEAR_GRADIENT */
        };
    };

    var webkitGradient = function (context, tokens) {
        var angle = deg(180);
        var stops = [];
        var type = 1 /* LINEAR_GRADIENT */;
        var shape = 0 /* CIRCLE */;
        var size = 3 /* FARTHEST_CORNER */;
        var position = [];
        parseFunctionArgs(tokens).forEach(function (arg, i) {
            var firstToken = arg[0];
            if (i === 0) {
                if (isIdentToken(firstToken) && firstToken.value === 'linear') {
                    type = 1 /* LINEAR_GRADIENT */;
                    return;
                }
                else if (isIdentToken(firstToken) && firstToken.value === 'radial') {
                    type = 2 /* RADIAL_GRADIENT */;
                    return;
                }
            }
            if (firstToken.type === 18 /* FUNCTION */) {
                if (firstToken.name === 'from') {
                    var color = color$1.parse(context, firstToken.values[0]);
                    stops.push({ stop: ZERO_LENGTH, color: color });
                }
                else if (firstToken.name === 'to') {
                    var color = color$1.parse(context, firstToken.values[0]);
                    stops.push({ stop: HUNDRED_PERCENT, color: color });
                }
                else if (firstToken.name === 'color-stop') {
                    var values = firstToken.values.filter(nonFunctionArgSeparator);
                    if (values.length === 2) {
                        var color = color$1.parse(context, values[1]);
                        var stop_1 = values[0];
                        if (isNumberToken(stop_1)) {
                            stops.push({
                                stop: { type: 16 /* PERCENTAGE_TOKEN */, number: stop_1.number * 100, flags: stop_1.flags },
                                color: color
                            });
                        }
                    }
                }
            }
        });
        return type === 1 /* LINEAR_GRADIENT */
            ? {
                angle: (angle + deg(180)) % deg(360),
                stops: stops,
                type: type
            }
            : { size: size, shape: shape, stops: stops, position: position, type: type };
    };

    var CLOSEST_SIDE = 'closest-side';
    var FARTHEST_SIDE = 'farthest-side';
    var CLOSEST_CORNER = 'closest-corner';
    var FARTHEST_CORNER = 'farthest-corner';
    var CIRCLE = 'circle';
    var ELLIPSE = 'ellipse';
    var COVER = 'cover';
    var CONTAIN = 'contain';
    var radialGradient = function (context, tokens) {
        var shape = 0 /* CIRCLE */;
        var size = 3 /* FARTHEST_CORNER */;
        var stops = [];
        var position = [];
        parseFunctionArgs(tokens).forEach(function (arg, i) {
            var isColorStop = true;
            if (i === 0) {
                var isAtPosition_1 = false;
                isColorStop = arg.reduce(function (acc, token) {
                    if (isAtPosition_1) {
                        if (isIdentToken(token)) {
                            switch (token.value) {
                                case 'center':
                                    position.push(FIFTY_PERCENT);
                                    return acc;
                                case 'top':
                                case 'left':
                                    position.push(ZERO_LENGTH);
                                    return acc;
                                case 'right':
                                case 'bottom':
                                    position.push(HUNDRED_PERCENT);
                                    return acc;
                            }
                        }
                        else if (isLengthPercentage(token) || isLength(token)) {
                            position.push(token);
                        }
                    }
                    else if (isIdentToken(token)) {
                        switch (token.value) {
                            case CIRCLE:
                                shape = 0 /* CIRCLE */;
                                return false;
                            case ELLIPSE:
                                shape = 1 /* ELLIPSE */;
                                return false;
                            case 'at':
                                isAtPosition_1 = true;
                                return false;
                            case CLOSEST_SIDE:
                                size = 0 /* CLOSEST_SIDE */;
                                return false;
                            case COVER:
                            case FARTHEST_SIDE:
                                size = 1 /* FARTHEST_SIDE */;
                                return false;
                            case CONTAIN:
                            case CLOSEST_CORNER:
                                size = 2 /* CLOSEST_CORNER */;
                                return false;
                            case FARTHEST_CORNER:
                                size = 3 /* FARTHEST_CORNER */;
                                return false;
                        }
                    }
                    else if (isLength(token) || isLengthPercentage(token)) {
                        if (!Array.isArray(size)) {
                            size = [];
                        }
                        size.push(token);
                        return false;
                    }
                    return acc;
                }, isColorStop);
            }
            if (isColorStop) {
                var colorStop = parseColorStop(context, arg);
                stops.push(colorStop);
            }
        });
        return { size: size, shape: shape, stops: stops, position: position, type: 2 /* RADIAL_GRADIENT */ };
    };

    var prefixRadialGradient = function (context, tokens) {
        var shape = 0 /* CIRCLE */;
        var size = 3 /* FARTHEST_CORNER */;
        var stops = [];
        var position = [];
        parseFunctionArgs(tokens).forEach(function (arg, i) {
            var isColorStop = true;
            if (i === 0) {
                isColorStop = arg.reduce(function (acc, token) {
                    if (isIdentToken(token)) {
                        switch (token.value) {
                            case 'center':
                                position.push(FIFTY_PERCENT);
                                return false;
                            case 'top':
                            case 'left':
                                position.push(ZERO_LENGTH);
                                return false;
                            case 'right':
                            case 'bottom':
                                position.push(HUNDRED_PERCENT);
                                return false;
                        }
                    }
                    else if (isLengthPercentage(token) || isLength(token)) {
                        position.push(token);
                        return false;
                    }
                    return acc;
                }, isColorStop);
            }
            else if (i === 1) {
                isColorStop = arg.reduce(function (acc, token) {
                    if (isIdentToken(token)) {
                        switch (token.value) {
                            case CIRCLE:
                                shape = 0 /* CIRCLE */;
                                return false;
                            case ELLIPSE:
                                shape = 1 /* ELLIPSE */;
                                return false;
                            case CONTAIN:
                            case CLOSEST_SIDE:
                                size = 0 /* CLOSEST_SIDE */;
                                return false;
                            case FARTHEST_SIDE:
                                size = 1 /* FARTHEST_SIDE */;
                                return false;
                            case CLOSEST_CORNER:
                                size = 2 /* CLOSEST_CORNER */;
                                return false;
                            case COVER:
                            case FARTHEST_CORNER:
                                size = 3 /* FARTHEST_CORNER */;
                                return false;
                        }
                    }
                    else if (isLength(token) || isLengthPercentage(token)) {
                        if (!Array.isArray(size)) {
                            size = [];
                        }
                        size.push(token);
                        return false;
                    }
                    return acc;
                }, isColorStop);
            }
            if (isColorStop) {
                var colorStop = parseColorStop(context, arg);
                stops.push(colorStop);
            }
        });
        return { size: size, shape: shape, stops: stops, position: position, type: 2 /* RADIAL_GRADIENT */ };
    };

    var isLinearGradient = function (background) {
        return background.type === 1 /* LINEAR_GRADIENT */;
    };
    var isRadialGradient = function (background) {
        return background.type === 2 /* RADIAL_GRADIENT */;
    };
    var image = {
        name: 'image',
        parse: function (context, value) {
            if (value.type === 22 /* URL_TOKEN */) {
                var image_1 = { url: value.value, type: 0 /* URL */ };
                context.cache.addImage(value.value);
                return image_1;
            }
            if (value.type === 18 /* FUNCTION */) {
                var imageFunction = SUPPORTED_IMAGE_FUNCTIONS[value.name];
                if (typeof imageFunction === 'undefined') {
                    throw new Error("Attempting to parse an unsupported image function \"" + value.name + "\"");
                }
                return imageFunction(context, value.values);
            }
            throw new Error("Unsupported image type " + value.type);
        }
    };
    function isSupportedImage(value) {
        return (!(value.type === 20 /* IDENT_TOKEN */ && value.value === 'none') &&
            (value.type !== 18 /* FUNCTION */ || !!SUPPORTED_IMAGE_FUNCTIONS[value.name]));
    }
    var SUPPORTED_IMAGE_FUNCTIONS = {
        'linear-gradient': linearGradient,
        '-moz-linear-gradient': prefixLinearGradient,
        '-ms-linear-gradient': prefixLinearGradient,
        '-o-linear-gradient': prefixLinearGradient,
        '-webkit-linear-gradient': prefixLinearGradient,
        'radial-gradient': radialGradient,
        '-moz-radial-gradient': prefixRadialGradient,
        '-ms-radial-gradient': prefixRadialGradient,
        '-o-radial-gradient': prefixRadialGradient,
        '-webkit-radial-gradient': prefixRadialGradient,
        '-webkit-gradient': webkitGradient
    };

    var backgroundImage = {
        name: 'background-image',
        initialValue: 'none',
        type: 1 /* LIST */,
        prefix: false,
        parse: function (context, tokens) {
            if (tokens.length === 0) {
                return [];
            }
            var first = tokens[0];
            if (first.type === 20 /* IDENT_TOKEN */ && first.value === 'none') {
                return [];
            }
            return tokens
                .filter(function (value) { return nonFunctionArgSeparator(value) && isSupportedImage(value); })
                .map(function (value) { return image.parse(context, value); });
        }
    };

    var backgroundOrigin = {
        name: 'background-origin',
        initialValue: 'border-box',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            return tokens.map(function (token) {
                if (isIdentToken(token)) {
                    switch (token.value) {
                        case 'padding-box':
                            return 1 /* PADDING_BOX */;
                        case 'content-box':
                            return 2 /* CONTENT_BOX */;
                    }
                }
                return 0 /* BORDER_BOX */;
            });
        }
    };

    var backgroundPosition = {
        name: 'background-position',
        initialValue: '0% 0%',
        type: 1 /* LIST */,
        prefix: false,
        parse: function (_context, tokens) {
            return parseFunctionArgs(tokens)
                .map(function (values) { return values.filter(isLengthPercentage); })
                .map(parseLengthPercentageTuple);
        }
    };

    var backgroundRepeat = {
        name: 'background-repeat',
        initialValue: 'repeat',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            return parseFunctionArgs(tokens)
                .map(function (values) {
                return values
                    .filter(isIdentToken)
                    .map(function (token) { return token.value; })
                    .join(' ');
            })
                .map(parseBackgroundRepeat);
        }
    };
    var parseBackgroundRepeat = function (value) {
        switch (value) {
            case 'no-repeat':
                return 1 /* NO_REPEAT */;
            case 'repeat-x':
            case 'repeat no-repeat':
                return 2 /* REPEAT_X */;
            case 'repeat-y':
            case 'no-repeat repeat':
                return 3 /* REPEAT_Y */;
            case 'repeat':
            default:
                return 0 /* REPEAT */;
        }
    };

    var BACKGROUND_SIZE;
    (function (BACKGROUND_SIZE) {
        BACKGROUND_SIZE["AUTO"] = "auto";
        BACKGROUND_SIZE["CONTAIN"] = "contain";
        BACKGROUND_SIZE["COVER"] = "cover";
    })(BACKGROUND_SIZE || (BACKGROUND_SIZE = {}));
    var backgroundSize = {
        name: 'background-size',
        initialValue: '0',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            return parseFunctionArgs(tokens).map(function (values) { return values.filter(isBackgroundSizeInfoToken); });
        }
    };
    var isBackgroundSizeInfoToken = function (value) {
        return isIdentToken(value) || isLengthPercentage(value);
    };

    var borderColorForSide = function (side) { return ({
        name: "border-" + side + "-color",
        initialValue: 'transparent',
        prefix: false,
        type: 3 /* TYPE_VALUE */,
        format: 'color'
    }); };
    var borderTopColor = borderColorForSide('top');
    var borderRightColor = borderColorForSide('right');
    var borderBottomColor = borderColorForSide('bottom');
    var borderLeftColor = borderColorForSide('left');

    var borderRadiusForSide = function (side) { return ({
        name: "border-radius-" + side,
        initialValue: '0 0',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            return parseLengthPercentageTuple(tokens.filter(isLengthPercentage));
        }
    }); };
    var borderTopLeftRadius = borderRadiusForSide('top-left');
    var borderTopRightRadius = borderRadiusForSide('top-right');
    var borderBottomRightRadius = borderRadiusForSide('bottom-right');
    var borderBottomLeftRadius = borderRadiusForSide('bottom-left');

    var borderStyleForSide = function (side) { return ({
        name: "border-" + side + "-style",
        initialValue: 'solid',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, style) {
            switch (style) {
                case 'none':
                    return 0 /* NONE */;
                case 'dashed':
                    return 2 /* DASHED */;
                case 'dotted':
                    return 3 /* DOTTED */;
                case 'double':
                    return 4 /* DOUBLE */;
            }
            return 1 /* SOLID */;
        }
    }); };
    var borderTopStyle = borderStyleForSide('top');
    var borderRightStyle = borderStyleForSide('right');
    var borderBottomStyle = borderStyleForSide('bottom');
    var borderLeftStyle = borderStyleForSide('left');

    var borderWidthForSide = function (side) { return ({
        name: "border-" + side + "-width",
        initialValue: '0',
        type: 0 /* VALUE */,
        prefix: false,
        parse: function (_context, token) {
            if (isDimensionToken(token)) {
                return token.number;
            }
            return 0;
        }
    }); };
    var borderTopWidth = borderWidthForSide('top');
    var borderRightWidth = borderWidthForSide('right');
    var borderBottomWidth = borderWidthForSide('bottom');
    var borderLeftWidth = borderWidthForSide('left');

    var color = {
        name: "color",
        initialValue: 'transparent',
        prefix: false,
        type: 3 /* TYPE_VALUE */,
        format: 'color'
    };

    var direction = {
        name: 'direction',
        initialValue: 'ltr',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, direction) {
            switch (direction) {
                case 'rtl':
                    return 1 /* RTL */;
                case 'ltr':
                default:
                    return 0 /* LTR */;
            }
        }
    };

    var display = {
        name: 'display',
        initialValue: 'inline-block',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            return tokens.filter(isIdentToken).reduce(function (bit, token) {
                return bit | parseDisplayValue(token.value);
            }, 0 /* NONE */);
        }
    };
    var parseDisplayValue = function (display) {
        switch (display) {
            case 'block':
            case '-webkit-box':
                return 2 /* BLOCK */;
            case 'inline':
                return 4 /* INLINE */;
            case 'run-in':
                return 8 /* RUN_IN */;
            case 'flow':
                return 16 /* FLOW */;
            case 'flow-root':
                return 32 /* FLOW_ROOT */;
            case 'table':
                return 64 /* TABLE */;
            case 'flex':
            case '-webkit-flex':
                return 128 /* FLEX */;
            case 'grid':
            case '-ms-grid':
                return 256 /* GRID */;
            case 'ruby':
                return 512 /* RUBY */;
            case 'subgrid':
                return 1024 /* SUBGRID */;
            case 'list-item':
                return 2048 /* LIST_ITEM */;
            case 'table-row-group':
                return 4096 /* TABLE_ROW_GROUP */;
            case 'table-header-group':
                return 8192 /* TABLE_HEADER_GROUP */;
            case 'table-footer-group':
                return 16384 /* TABLE_FOOTER_GROUP */;
            case 'table-row':
                return 32768 /* TABLE_ROW */;
            case 'table-cell':
                return 65536 /* TABLE_CELL */;
            case 'table-column-group':
                return 131072 /* TABLE_COLUMN_GROUP */;
            case 'table-column':
                return 262144 /* TABLE_COLUMN */;
            case 'table-caption':
                return 524288 /* TABLE_CAPTION */;
            case 'ruby-base':
                return 1048576 /* RUBY_BASE */;
            case 'ruby-text':
                return 2097152 /* RUBY_TEXT */;
            case 'ruby-base-container':
                return 4194304 /* RUBY_BASE_CONTAINER */;
            case 'ruby-text-container':
                return 8388608 /* RUBY_TEXT_CONTAINER */;
            case 'contents':
                return 16777216 /* CONTENTS */;
            case 'inline-block':
                return 33554432 /* INLINE_BLOCK */;
            case 'inline-list-item':
                return 67108864 /* INLINE_LIST_ITEM */;
            case 'inline-table':
                return 134217728 /* INLINE_TABLE */;
            case 'inline-flex':
                return 268435456 /* INLINE_FLEX */;
            case 'inline-grid':
                return 536870912 /* INLINE_GRID */;
        }
        return 0 /* NONE */;
    };

    var float = {
        name: 'float',
        initialValue: 'none',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, float) {
            switch (float) {
                case 'left':
                    return 1 /* LEFT */;
                case 'right':
                    return 2 /* RIGHT */;
                case 'inline-start':
                    return 3 /* INLINE_START */;
                case 'inline-end':
                    return 4 /* INLINE_END */;
            }
            return 0 /* NONE */;
        }
    };

    var letterSpacing = {
        name: 'letter-spacing',
        initialValue: '0',
        prefix: false,
        type: 0 /* VALUE */,
        parse: function (_context, token) {
            if (token.type === 20 /* IDENT_TOKEN */ && token.value === 'normal') {
                return 0;
            }
            if (token.type === 17 /* NUMBER_TOKEN */) {
                return token.number;
            }
            if (token.type === 15 /* DIMENSION_TOKEN */) {
                return token.number;
            }
            return 0;
        }
    };

    var LINE_BREAK;
    (function (LINE_BREAK) {
        LINE_BREAK["NORMAL"] = "normal";
        LINE_BREAK["STRICT"] = "strict";
    })(LINE_BREAK || (LINE_BREAK = {}));
    var lineBreak = {
        name: 'line-break',
        initialValue: 'normal',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, lineBreak) {
            switch (lineBreak) {
                case 'strict':
                    return LINE_BREAK.STRICT;
                case 'normal':
                default:
                    return LINE_BREAK.NORMAL;
            }
        }
    };

    var lineHeight = {
        name: 'line-height',
        initialValue: 'normal',
        prefix: false,
        type: 4 /* TOKEN_VALUE */
    };
    var computeLineHeight = function (token, fontSize) {
        if (isIdentToken(token) && token.value === 'normal') {
            return 1.2 * fontSize;
        }
        else if (token.type === 17 /* NUMBER_TOKEN */) {
            return fontSize * token.number;
        }
        else if (isLengthPercentage(token)) {
            return getAbsoluteValue(token, fontSize);
        }
        return fontSize;
    };

    var listStyleImage = {
        name: 'list-style-image',
        initialValue: 'none',
        type: 0 /* VALUE */,
        prefix: false,
        parse: function (context, token) {
            if (token.type === 20 /* IDENT_TOKEN */ && token.value === 'none') {
                return null;
            }
            return image.parse(context, token);
        }
    };

    var listStylePosition = {
        name: 'list-style-position',
        initialValue: 'outside',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, position) {
            switch (position) {
                case 'inside':
                    return 0 /* INSIDE */;
                case 'outside':
                default:
                    return 1 /* OUTSIDE */;
            }
        }
    };

    var listStyleType = {
        name: 'list-style-type',
        initialValue: 'none',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, type) {
            switch (type) {
                case 'disc':
                    return 0 /* DISC */;
                case 'circle':
                    return 1 /* CIRCLE */;
                case 'square':
                    return 2 /* SQUARE */;
                case 'decimal':
                    return 3 /* DECIMAL */;
                case 'cjk-decimal':
                    return 4 /* CJK_DECIMAL */;
                case 'decimal-leading-zero':
                    return 5 /* DECIMAL_LEADING_ZERO */;
                case 'lower-roman':
                    return 6 /* LOWER_ROMAN */;
                case 'upper-roman':
                    return 7 /* UPPER_ROMAN */;
                case 'lower-greek':
                    return 8 /* LOWER_GREEK */;
                case 'lower-alpha':
                    return 9 /* LOWER_ALPHA */;
                case 'upper-alpha':
                    return 10 /* UPPER_ALPHA */;
                case 'arabic-indic':
                    return 11 /* ARABIC_INDIC */;
                case 'armenian':
                    return 12 /* ARMENIAN */;
                case 'bengali':
                    return 13 /* BENGALI */;
                case 'cambodian':
                    return 14 /* CAMBODIAN */;
                case 'cjk-earthly-branch':
                    return 15 /* CJK_EARTHLY_BRANCH */;
                case 'cjk-heavenly-stem':
                    return 16 /* CJK_HEAVENLY_STEM */;
                case 'cjk-ideographic':
                    return 17 /* CJK_IDEOGRAPHIC */;
                case 'devanagari':
                    return 18 /* DEVANAGARI */;
                case 'ethiopic-numeric':
                    return 19 /* ETHIOPIC_NUMERIC */;
                case 'georgian':
                    return 20 /* GEORGIAN */;
                case 'gujarati':
                    return 21 /* GUJARATI */;
                case 'gurmukhi':
                    return 22 /* GURMUKHI */;
                case 'hebrew':
                    return 22 /* HEBREW */;
                case 'hiragana':
                    return 23 /* HIRAGANA */;
                case 'hiragana-iroha':
                    return 24 /* HIRAGANA_IROHA */;
                case 'japanese-formal':
                    return 25 /* JAPANESE_FORMAL */;
                case 'japanese-informal':
                    return 26 /* JAPANESE_INFORMAL */;
                case 'kannada':
                    return 27 /* KANNADA */;
                case 'katakana':
                    return 28 /* KATAKANA */;
                case 'katakana-iroha':
                    return 29 /* KATAKANA_IROHA */;
                case 'khmer':
                    return 30 /* KHMER */;
                case 'korean-hangul-formal':
                    return 31 /* KOREAN_HANGUL_FORMAL */;
                case 'korean-hanja-formal':
                    return 32 /* KOREAN_HANJA_FORMAL */;
                case 'korean-hanja-informal':
                    return 33 /* KOREAN_HANJA_INFORMAL */;
                case 'lao':
                    return 34 /* LAO */;
                case 'lower-armenian':
                    return 35 /* LOWER_ARMENIAN */;
                case 'malayalam':
                    return 36 /* MALAYALAM */;
                case 'mongolian':
                    return 37 /* MONGOLIAN */;
                case 'myanmar':
                    return 38 /* MYANMAR */;
                case 'oriya':
                    return 39 /* ORIYA */;
                case 'persian':
                    return 40 /* PERSIAN */;
                case 'simp-chinese-formal':
                    return 41 /* SIMP_CHINESE_FORMAL */;
                case 'simp-chinese-informal':
                    return 42 /* SIMP_CHINESE_INFORMAL */;
                case 'tamil':
                    return 43 /* TAMIL */;
                case 'telugu':
                    return 44 /* TELUGU */;
                case 'thai':
                    return 45 /* THAI */;
                case 'tibetan':
                    return 46 /* TIBETAN */;
                case 'trad-chinese-formal':
                    return 47 /* TRAD_CHINESE_FORMAL */;
                case 'trad-chinese-informal':
                    return 48 /* TRAD_CHINESE_INFORMAL */;
                case 'upper-armenian':
                    return 49 /* UPPER_ARMENIAN */;
                case 'disclosure-open':
                    return 50 /* DISCLOSURE_OPEN */;
                case 'disclosure-closed':
                    return 51 /* DISCLOSURE_CLOSED */;
                case 'none':
                default:
                    return -1 /* NONE */;
            }
        }
    };

    var marginForSide = function (side) { return ({
        name: "margin-" + side,
        initialValue: '0',
        prefix: false,
        type: 4 /* TOKEN_VALUE */
    }); };
    var marginTop = marginForSide('top');
    var marginRight = marginForSide('right');
    var marginBottom = marginForSide('bottom');
    var marginLeft = marginForSide('left');

    var overflow = {
        name: 'overflow',
        initialValue: 'visible',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            return tokens.filter(isIdentToken).map(function (overflow) {
                switch (overflow.value) {
                    case 'hidden':
                        return 1 /* HIDDEN */;
                    case 'scroll':
                        return 2 /* SCROLL */;
                    case 'clip':
                        return 3 /* CLIP */;
                    case 'auto':
                        return 4 /* AUTO */;
                    case 'visible':
                    default:
                        return 0 /* VISIBLE */;
                }
            });
        }
    };

    var overflowWrap = {
        name: 'overflow-wrap',
        initialValue: 'normal',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, overflow) {
            switch (overflow) {
                case 'break-word':
                    return "break-word" /* BREAK_WORD */;
                case 'normal':
                default:
                    return "normal" /* NORMAL */;
            }
        }
    };

    var paddingForSide = function (side) { return ({
        name: "padding-" + side,
        initialValue: '0',
        prefix: false,
        type: 3 /* TYPE_VALUE */,
        format: 'length-percentage'
    }); };
    var paddingTop = paddingForSide('top');
    var paddingRight = paddingForSide('right');
    var paddingBottom = paddingForSide('bottom');
    var paddingLeft = paddingForSide('left');

    var textAlign = {
        name: 'text-align',
        initialValue: 'left',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, textAlign) {
            switch (textAlign) {
                case 'right':
                    return 2 /* RIGHT */;
                case 'center':
                case 'justify':
                    return 1 /* CENTER */;
                case 'left':
                default:
                    return 0 /* LEFT */;
            }
        }
    };

    var position = {
        name: 'position',
        initialValue: 'static',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, position) {
            switch (position) {
                case 'relative':
                    return 1 /* RELATIVE */;
                case 'absolute':
                    return 2 /* ABSOLUTE */;
                case 'fixed':
                    return 3 /* FIXED */;
                case 'sticky':
                    return 4 /* STICKY */;
            }
            return 0 /* STATIC */;
        }
    };

    var textShadow = {
        name: 'text-shadow',
        initialValue: 'none',
        type: 1 /* LIST */,
        prefix: false,
        parse: function (context, tokens) {
            if (tokens.length === 1 && isIdentWithValue(tokens[0], 'none')) {
                return [];
            }
            return parseFunctionArgs(tokens).map(function (values) {
                var shadow = {
                    color: COLORS.TRANSPARENT,
                    offsetX: ZERO_LENGTH,
                    offsetY: ZERO_LENGTH,
                    blur: ZERO_LENGTH
                };
                var c = 0;
                for (var i = 0; i < values.length; i++) {
                    var token = values[i];
                    if (isLength(token)) {
                        if (c === 0) {
                            shadow.offsetX = token;
                        }
                        else if (c === 1) {
                            shadow.offsetY = token;
                        }
                        else {
                            shadow.blur = token;
                        }
                        c++;
                    }
                    else {
                        shadow.color = color$1.parse(context, token);
                    }
                }
                return shadow;
            });
        }
    };

    var textTransform = {
        name: 'text-transform',
        initialValue: 'none',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, textTransform) {
            switch (textTransform) {
                case 'uppercase':
                    return 2 /* UPPERCASE */;
                case 'lowercase':
                    return 1 /* LOWERCASE */;
                case 'capitalize':
                    return 3 /* CAPITALIZE */;
            }
            return 0 /* NONE */;
        }
    };

    var transform$1 = {
        name: 'transform',
        initialValue: 'none',
        prefix: true,
        type: 0 /* VALUE */,
        parse: function (_context, token) {
            if (token.type === 20 /* IDENT_TOKEN */ && token.value === 'none') {
                return null;
            }
            if (token.type === 18 /* FUNCTION */) {
                var transformFunction = SUPPORTED_TRANSFORM_FUNCTIONS[token.name];
                if (typeof transformFunction === 'undefined') {
                    throw new Error("Attempting to parse an unsupported transform function \"" + token.name + "\"");
                }
                return transformFunction(token.values);
            }
            return null;
        }
    };
    var matrix = function (args) {
        var values = args.filter(function (arg) { return arg.type === 17 /* NUMBER_TOKEN */; }).map(function (arg) { return arg.number; });
        return values.length === 6 ? values : null;
    };
    // doesn't support 3D transforms at the moment
    var matrix3d = function (args) {
        var values = args.filter(function (arg) { return arg.type === 17 /* NUMBER_TOKEN */; }).map(function (arg) { return arg.number; });
        var a1 = values[0], b1 = values[1]; values[2]; values[3]; var a2 = values[4], b2 = values[5]; values[6]; values[7]; values[8]; values[9]; values[10]; values[11]; var a4 = values[12], b4 = values[13]; values[14]; values[15];
        return values.length === 16 ? [a1, b1, a2, b2, a4, b4] : null;
    };
    var SUPPORTED_TRANSFORM_FUNCTIONS = {
        matrix: matrix,
        matrix3d: matrix3d
    };

    var DEFAULT_VALUE = {
        type: 16 /* PERCENTAGE_TOKEN */,
        number: 50,
        flags: FLAG_INTEGER
    };
    var DEFAULT = [DEFAULT_VALUE, DEFAULT_VALUE];
    var transformOrigin = {
        name: 'transform-origin',
        initialValue: '50% 50%',
        prefix: true,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            var origins = tokens.filter(isLengthPercentage);
            if (origins.length !== 2) {
                return DEFAULT;
            }
            return [origins[0], origins[1]];
        }
    };

    var visibility = {
        name: 'visible',
        initialValue: 'none',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, visibility) {
            switch (visibility) {
                case 'hidden':
                    return 1 /* HIDDEN */;
                case 'collapse':
                    return 2 /* COLLAPSE */;
                case 'visible':
                default:
                    return 0 /* VISIBLE */;
            }
        }
    };

    var WORD_BREAK;
    (function (WORD_BREAK) {
        WORD_BREAK["NORMAL"] = "normal";
        WORD_BREAK["BREAK_ALL"] = "break-all";
        WORD_BREAK["KEEP_ALL"] = "keep-all";
    })(WORD_BREAK || (WORD_BREAK = {}));
    var wordBreak = {
        name: 'word-break',
        initialValue: 'normal',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, wordBreak) {
            switch (wordBreak) {
                case 'break-all':
                    return WORD_BREAK.BREAK_ALL;
                case 'keep-all':
                    return WORD_BREAK.KEEP_ALL;
                case 'normal':
                default:
                    return WORD_BREAK.NORMAL;
            }
        }
    };

    var zIndex = {
        name: 'z-index',
        initialValue: 'auto',
        prefix: false,
        type: 0 /* VALUE */,
        parse: function (_context, token) {
            if (token.type === 20 /* IDENT_TOKEN */) {
                return { auto: true, order: 0 };
            }
            if (isNumberToken(token)) {
                return { auto: false, order: token.number };
            }
            throw new Error("Invalid z-index number parsed");
        }
    };

    var time = {
        name: 'time',
        parse: function (_context, value) {
            if (value.type === 15 /* DIMENSION_TOKEN */) {
                switch (value.unit.toLowerCase()) {
                    case 's':
                        return 1000 * value.number;
                    case 'ms':
                        return value.number;
                }
            }
            throw new Error("Unsupported time type");
        }
    };

    var opacity = {
        name: 'opacity',
        initialValue: '1',
        type: 0 /* VALUE */,
        prefix: false,
        parse: function (_context, token) {
            if (isNumberToken(token)) {
                return token.number;
            }
            return 1;
        }
    };

    var textDecorationColor = {
        name: "text-decoration-color",
        initialValue: 'transparent',
        prefix: false,
        type: 3 /* TYPE_VALUE */,
        format: 'color'
    };

    var textDecorationLine = {
        name: 'text-decoration-line',
        initialValue: 'none',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            return tokens
                .filter(isIdentToken)
                .map(function (token) {
                switch (token.value) {
                    case 'underline':
                        return 1 /* UNDERLINE */;
                    case 'overline':
                        return 2 /* OVERLINE */;
                    case 'line-through':
                        return 3 /* LINE_THROUGH */;
                    case 'none':
                        return 4 /* BLINK */;
                }
                return 0 /* NONE */;
            })
                .filter(function (line) { return line !== 0 /* NONE */; });
        }
    };

    var fontFamily = {
        name: "font-family",
        initialValue: '',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            var accumulator = [];
            var results = [];
            tokens.forEach(function (token) {
                switch (token.type) {
                    case 20 /* IDENT_TOKEN */:
                    case 0 /* STRING_TOKEN */:
                        accumulator.push(token.value);
                        break;
                    case 17 /* NUMBER_TOKEN */:
                        accumulator.push(token.number.toString());
                        break;
                    case 4 /* COMMA_TOKEN */:
                        results.push(accumulator.join(' '));
                        accumulator.length = 0;
                        break;
                }
            });
            if (accumulator.length) {
                results.push(accumulator.join(' '));
            }
            return results.map(function (result) { return (result.indexOf(' ') === -1 ? result : "'" + result + "'"); });
        }
    };

    var fontSize = {
        name: "font-size",
        initialValue: '0',
        prefix: false,
        type: 3 /* TYPE_VALUE */,
        format: 'length'
    };

    var fontWeight = {
        name: 'font-weight',
        initialValue: 'normal',
        type: 0 /* VALUE */,
        prefix: false,
        parse: function (_context, token) {
            if (isNumberToken(token)) {
                return token.number;
            }
            if (isIdentToken(token)) {
                switch (token.value) {
                    case 'bold':
                        return 700;
                    case 'normal':
                    default:
                        return 400;
                }
            }
            return 400;
        }
    };

    var fontVariant = {
        name: 'font-variant',
        initialValue: 'none',
        type: 1 /* LIST */,
        prefix: false,
        parse: function (_context, tokens) {
            return tokens.filter(isIdentToken).map(function (token) { return token.value; });
        }
    };

    var fontStyle = {
        name: 'font-style',
        initialValue: 'normal',
        prefix: false,
        type: 2 /* IDENT_VALUE */,
        parse: function (_context, overflow) {
            switch (overflow) {
                case 'oblique':
                    return "oblique" /* OBLIQUE */;
                case 'italic':
                    return "italic" /* ITALIC */;
                case 'normal':
                default:
                    return "normal" /* NORMAL */;
            }
        }
    };

    var contains = function (bit, value) { return (bit & value) !== 0; };

    var content = {
        name: 'content',
        initialValue: 'none',
        type: 1 /* LIST */,
        prefix: false,
        parse: function (_context, tokens) {
            if (tokens.length === 0) {
                return [];
            }
            var first = tokens[0];
            if (first.type === 20 /* IDENT_TOKEN */ && first.value === 'none') {
                return [];
            }
            return tokens;
        }
    };

    var counterIncrement = {
        name: 'counter-increment',
        initialValue: 'none',
        prefix: true,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            if (tokens.length === 0) {
                return null;
            }
            var first = tokens[0];
            if (first.type === 20 /* IDENT_TOKEN */ && first.value === 'none') {
                return null;
            }
            var increments = [];
            var filtered = tokens.filter(nonWhiteSpace);
            for (var i = 0; i < filtered.length; i++) {
                var counter = filtered[i];
                var next = filtered[i + 1];
                if (counter.type === 20 /* IDENT_TOKEN */) {
                    var increment = next && isNumberToken(next) ? next.number : 1;
                    increments.push({ counter: counter.value, increment: increment });
                }
            }
            return increments;
        }
    };

    var counterReset = {
        name: 'counter-reset',
        initialValue: 'none',
        prefix: true,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            if (tokens.length === 0) {
                return [];
            }
            var resets = [];
            var filtered = tokens.filter(nonWhiteSpace);
            for (var i = 0; i < filtered.length; i++) {
                var counter = filtered[i];
                var next = filtered[i + 1];
                if (isIdentToken(counter) && counter.value !== 'none') {
                    var reset = next && isNumberToken(next) ? next.number : 0;
                    resets.push({ counter: counter.value, reset: reset });
                }
            }
            return resets;
        }
    };

    var duration = {
        name: 'duration',
        initialValue: '0s',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (context, tokens) {
            return tokens.filter(isDimensionToken).map(function (token) { return time.parse(context, token); });
        }
    };

    var quotes = {
        name: 'quotes',
        initialValue: 'none',
        prefix: true,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            if (tokens.length === 0) {
                return null;
            }
            var first = tokens[0];
            if (first.type === 20 /* IDENT_TOKEN */ && first.value === 'none') {
                return null;
            }
            var quotes = [];
            var filtered = tokens.filter(isStringToken);
            if (filtered.length % 2 !== 0) {
                return null;
            }
            for (var i = 0; i < filtered.length; i += 2) {
                var open_1 = filtered[i].value;
                var close_1 = filtered[i + 1].value;
                quotes.push({ open: open_1, close: close_1 });
            }
            return quotes;
        }
    };
    var getQuote = function (quotes, depth, open) {
        if (!quotes) {
            return '';
        }
        var quote = quotes[Math.min(depth, quotes.length - 1)];
        if (!quote) {
            return '';
        }
        return open ? quote.open : quote.close;
    };

    var boxShadow = {
        name: 'box-shadow',
        initialValue: 'none',
        type: 1 /* LIST */,
        prefix: false,
        parse: function (context, tokens) {
            if (tokens.length === 1 && isIdentWithValue(tokens[0], 'none')) {
                return [];
            }
            return parseFunctionArgs(tokens).map(function (values) {
                var shadow = {
                    color: 0x000000ff,
                    offsetX: ZERO_LENGTH,
                    offsetY: ZERO_LENGTH,
                    blur: ZERO_LENGTH,
                    spread: ZERO_LENGTH,
                    inset: false
                };
                var c = 0;
                for (var i = 0; i < values.length; i++) {
                    var token = values[i];
                    if (isIdentWithValue(token, 'inset')) {
                        shadow.inset = true;
                    }
                    else if (isLength(token)) {
                        if (c === 0) {
                            shadow.offsetX = token;
                        }
                        else if (c === 1) {
                            shadow.offsetY = token;
                        }
                        else if (c === 2) {
                            shadow.blur = token;
                        }
                        else {
                            shadow.spread = token;
                        }
                        c++;
                    }
                    else {
                        shadow.color = color$1.parse(context, token);
                    }
                }
                return shadow;
            });
        }
    };

    var paintOrder = {
        name: 'paint-order',
        initialValue: 'normal',
        prefix: false,
        type: 1 /* LIST */,
        parse: function (_context, tokens) {
            var DEFAULT_VALUE = [0 /* FILL */, 1 /* STROKE */, 2 /* MARKERS */];
            var layers = [];
            tokens.filter(isIdentToken).forEach(function (token) {
                switch (token.value) {
                    case 'stroke':
                        layers.push(1 /* STROKE */);
                        break;
                    case 'fill':
                        layers.push(0 /* FILL */);
                        break;
                    case 'markers':
                        layers.push(2 /* MARKERS */);
                        break;
                }
            });
            DEFAULT_VALUE.forEach(function (value) {
                if (layers.indexOf(value) === -1) {
                    layers.push(value);
                }
            });
            return layers;
        }
    };

    var webkitTextStrokeColor = {
        name: "-webkit-text-stroke-color",
        initialValue: 'currentcolor',
        prefix: false,
        type: 3 /* TYPE_VALUE */,
        format: 'color'
    };

    var webkitTextStrokeWidth = {
        name: "-webkit-text-stroke-width",
        initialValue: '0',
        type: 0 /* VALUE */,
        prefix: false,
        parse: function (_context, token) {
            if (isDimensionToken(token)) {
                return token.number;
            }
            return 0;
        }
    };

    var CSSParsedDeclaration = /** @class */ (function () {
        function CSSParsedDeclaration(context, declaration) {
            var _a, _b;
            this.animationDuration = parse(context, duration, declaration.animationDuration);
            this.backgroundClip = parse(context, backgroundClip, declaration.backgroundClip);
            this.backgroundColor = parse(context, backgroundColor, declaration.backgroundColor);
            this.backgroundImage = parse(context, backgroundImage, declaration.backgroundImage);
            this.backgroundOrigin = parse(context, backgroundOrigin, declaration.backgroundOrigin);
            this.backgroundPosition = parse(context, backgroundPosition, declaration.backgroundPosition);
            this.backgroundRepeat = parse(context, backgroundRepeat, declaration.backgroundRepeat);
            this.backgroundSize = parse(context, backgroundSize, declaration.backgroundSize);
            this.borderTopColor = parse(context, borderTopColor, declaration.borderTopColor);
            this.borderRightColor = parse(context, borderRightColor, declaration.borderRightColor);
            this.borderBottomColor = parse(context, borderBottomColor, declaration.borderBottomColor);
            this.borderLeftColor = parse(context, borderLeftColor, declaration.borderLeftColor);
            this.borderTopLeftRadius = parse(context, borderTopLeftRadius, declaration.borderTopLeftRadius);
            this.borderTopRightRadius = parse(context, borderTopRightRadius, declaration.borderTopRightRadius);
            this.borderBottomRightRadius = parse(context, borderBottomRightRadius, declaration.borderBottomRightRadius);
            this.borderBottomLeftRadius = parse(context, borderBottomLeftRadius, declaration.borderBottomLeftRadius);
            this.borderTopStyle = parse(context, borderTopStyle, declaration.borderTopStyle);
            this.borderRightStyle = parse(context, borderRightStyle, declaration.borderRightStyle);
            this.borderBottomStyle = parse(context, borderBottomStyle, declaration.borderBottomStyle);
            this.borderLeftStyle = parse(context, borderLeftStyle, declaration.borderLeftStyle);
            this.borderTopWidth = parse(context, borderTopWidth, declaration.borderTopWidth);
            this.borderRightWidth = parse(context, borderRightWidth, declaration.borderRightWidth);
            this.borderBottomWidth = parse(context, borderBottomWidth, declaration.borderBottomWidth);
            this.borderLeftWidth = parse(context, borderLeftWidth, declaration.borderLeftWidth);
            this.boxShadow = parse(context, boxShadow, declaration.boxShadow);
            this.color = parse(context, color, declaration.color);
            this.direction = parse(context, direction, declaration.direction);
            this.display = parse(context, display, declaration.display);
            this.float = parse(context, float, declaration.cssFloat);
            this.fontFamily = parse(context, fontFamily, declaration.fontFamily);
            this.fontSize = parse(context, fontSize, declaration.fontSize);
            this.fontStyle = parse(context, fontStyle, declaration.fontStyle);
            this.fontVariant = parse(context, fontVariant, declaration.fontVariant);
            this.fontWeight = parse(context, fontWeight, declaration.fontWeight);
            this.letterSpacing = parse(context, letterSpacing, declaration.letterSpacing);
            this.lineBreak = parse(context, lineBreak, declaration.lineBreak);
            this.lineHeight = parse(context, lineHeight, declaration.lineHeight);
            this.listStyleImage = parse(context, listStyleImage, declaration.listStyleImage);
            this.listStylePosition = parse(context, listStylePosition, declaration.listStylePosition);
            this.listStyleType = parse(context, listStyleType, declaration.listStyleType);
            this.marginTop = parse(context, marginTop, declaration.marginTop);
            this.marginRight = parse(context, marginRight, declaration.marginRight);
            this.marginBottom = parse(context, marginBottom, declaration.marginBottom);
            this.marginLeft = parse(context, marginLeft, declaration.marginLeft);
            this.opacity = parse(context, opacity, declaration.opacity);
            var overflowTuple = parse(context, overflow, declaration.overflow);
            this.overflowX = overflowTuple[0];
            this.overflowY = overflowTuple[overflowTuple.length > 1 ? 1 : 0];
            this.overflowWrap = parse(context, overflowWrap, declaration.overflowWrap);
            this.paddingTop = parse(context, paddingTop, declaration.paddingTop);
            this.paddingRight = parse(context, paddingRight, declaration.paddingRight);
            this.paddingBottom = parse(context, paddingBottom, declaration.paddingBottom);
            this.paddingLeft = parse(context, paddingLeft, declaration.paddingLeft);
            this.paintOrder = parse(context, paintOrder, declaration.paintOrder);
            this.position = parse(context, position, declaration.position);
            this.textAlign = parse(context, textAlign, declaration.textAlign);
            this.textDecorationColor = parse(context, textDecorationColor, (_a = declaration.textDecorationColor) !== null && _a !== void 0 ? _a : declaration.color);
            this.textDecorationLine = parse(context, textDecorationLine, (_b = declaration.textDecorationLine) !== null && _b !== void 0 ? _b : declaration.textDecoration);
            this.textShadow = parse(context, textShadow, declaration.textShadow);
            this.textTransform = parse(context, textTransform, declaration.textTransform);
            this.transform = parse(context, transform$1, declaration.transform);
            this.transformOrigin = parse(context, transformOrigin, declaration.transformOrigin);
            this.visibility = parse(context, visibility, declaration.visibility);
            this.webkitTextStrokeColor = parse(context, webkitTextStrokeColor, declaration.webkitTextStrokeColor);
            this.webkitTextStrokeWidth = parse(context, webkitTextStrokeWidth, declaration.webkitTextStrokeWidth);
            this.wordBreak = parse(context, wordBreak, declaration.wordBreak);
            this.zIndex = parse(context, zIndex, declaration.zIndex);
        }
        CSSParsedDeclaration.prototype.isVisible = function () {
            return this.display > 0 && this.opacity > 0 && this.visibility === 0 /* VISIBLE */;
        };
        CSSParsedDeclaration.prototype.isTransparent = function () {
            return isTransparent(this.backgroundColor);
        };
        CSSParsedDeclaration.prototype.isTransformed = function () {
            return this.transform !== null;
        };
        CSSParsedDeclaration.prototype.isPositioned = function () {
            return this.position !== 0 /* STATIC */;
        };
        CSSParsedDeclaration.prototype.isPositionedWithZIndex = function () {
            return this.isPositioned() && !this.zIndex.auto;
        };
        CSSParsedDeclaration.prototype.isFloating = function () {
            return this.float !== 0 /* NONE */;
        };
        CSSParsedDeclaration.prototype.isInlineLevel = function () {
            return (contains(this.display, 4 /* INLINE */) ||
                contains(this.display, 33554432 /* INLINE_BLOCK */) ||
                contains(this.display, 268435456 /* INLINE_FLEX */) ||
                contains(this.display, 536870912 /* INLINE_GRID */) ||
                contains(this.display, 67108864 /* INLINE_LIST_ITEM */) ||
                contains(this.display, 134217728 /* INLINE_TABLE */));
        };
        return CSSParsedDeclaration;
    }());
    var CSSParsedPseudoDeclaration = /** @class */ (function () {
        function CSSParsedPseudoDeclaration(context, declaration) {
            this.content = parse(context, content, declaration.content);
            this.quotes = parse(context, quotes, declaration.quotes);
        }
        return CSSParsedPseudoDeclaration;
    }());
    var CSSParsedCounterDeclaration = /** @class */ (function () {
        function CSSParsedCounterDeclaration(context, declaration) {
            this.counterIncrement = parse(context, counterIncrement, declaration.counterIncrement);
            this.counterReset = parse(context, counterReset, declaration.counterReset);
        }
        return CSSParsedCounterDeclaration;
    }());
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    var parse = function (context, descriptor, style) {
        var tokenizer = new Tokenizer();
        var value = style !== null && typeof style !== 'undefined' ? style.toString() : descriptor.initialValue;
        tokenizer.write(value);
        var parser = new Parser(tokenizer.read());
        switch (descriptor.type) {
            case 2 /* IDENT_VALUE */:
                var token = parser.parseComponentValue();
                return descriptor.parse(context, isIdentToken(token) ? token.value : descriptor.initialValue);
            case 0 /* VALUE */:
                return descriptor.parse(context, parser.parseComponentValue());
            case 1 /* LIST */:
                return descriptor.parse(context, parser.parseComponentValues());
            case 4 /* TOKEN_VALUE */:
                return parser.parseComponentValue();
            case 3 /* TYPE_VALUE */:
                switch (descriptor.format) {
                    case 'angle':
                        return angle.parse(context, parser.parseComponentValue());
                    case 'color':
                        return color$1.parse(context, parser.parseComponentValue());
                    case 'image':
                        return image.parse(context, parser.parseComponentValue());
                    case 'length':
                        var length_1 = parser.parseComponentValue();
                        return isLength(length_1) ? length_1 : ZERO_LENGTH;
                    case 'length-percentage':
                        var value_1 = parser.parseComponentValue();
                        return isLengthPercentage(value_1) ? value_1 : ZERO_LENGTH;
                    case 'time':
                        return time.parse(context, parser.parseComponentValue());
                }
                break;
        }
    };

    var elementDebuggerAttribute = 'data-html2canvas-debug';
    var getElementDebugType = function (element) {
        var attribute = element.getAttribute(elementDebuggerAttribute);
        switch (attribute) {
            case 'all':
                return 1 /* ALL */;
            case 'clone':
                return 2 /* CLONE */;
            case 'parse':
                return 3 /* PARSE */;
            case 'render':
                return 4 /* RENDER */;
            default:
                return 0 /* NONE */;
        }
    };
    var isDebugging = function (element, type) {
        var elementType = getElementDebugType(element);
        return elementType === 1 /* ALL */ || type === elementType;
    };

    var ElementContainer = /** @class */ (function () {
        function ElementContainer(context, element) {
            this.context = context;
            this.textNodes = [];
            this.elements = [];
            this.flags = 0;
            if (isDebugging(element, 3 /* PARSE */)) {
                debugger;
            }
            this.styles = new CSSParsedDeclaration(context, window.getComputedStyle(element, null));
            if (isHTMLElementNode(element)) {
                if (this.styles.animationDuration.some(function (duration) { return duration > 0; })) {
                    element.style.animationDuration = '0s';
                }
                if (this.styles.transform !== null) {
                    // getBoundingClientRect takes transforms into account
                    element.style.transform = 'none';
                }
            }
            this.bounds = parseBounds(this.context, element);
            if (isDebugging(element, 4 /* RENDER */)) {
                this.flags |= 16 /* DEBUG_RENDER */;
            }
        }
        return ElementContainer;
    }());

    /*
     * text-segmentation 1.0.3 <https://github.com/niklasvh/text-segmentation>
     * Copyright (c) 2022 Niklas von Hertzen <https://hertzen.com>
     * Released under MIT License
     */
    var base64 = ' ';

    /*
     * utrie 1.0.2 <https://github.com/niklasvh/utrie>
     * Copyright (c) 2022 Niklas von Hertzen <https://hertzen.com>
     * Released under MIT License
     */
    var chars$1 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
    // Use a lookup table to find the index.
    var lookup$1 = typeof Uint8Array === 'undefined' ? [] : new Uint8Array(256);
    for (var i$1 = 0; i$1 < chars$1.length; i$1++) {
        lookup$1[chars$1.charCodeAt(i$1)] = i$1;
    }
    var decode = function (base64) {
        var bufferLength = base64.length * 0.75, len = base64.length, i, p = 0, encoded1, encoded2, encoded3, encoded4;
        if (base64[base64.length - 1] === '=') {
            bufferLength--;
            if (base64[base64.length - 2] === '=') {
                bufferLength--;
            }
        }
        var buffer = typeof ArrayBuffer !== 'undefined' &&
            typeof Uint8Array !== 'undefined' &&
            typeof Uint8Array.prototype.slice !== 'undefined'
            ? new ArrayBuffer(bufferLength)
            : new Array(bufferLength);
        var bytes = Array.isArray(buffer) ? buffer : new Uint8Array(buffer);
        for (i = 0; i < len; i += 4) {
            encoded1 = lookup$1[base64.charCodeAt(i)];
            encoded2 = lookup$1[base64.charCodeAt(i + 1)];
            encoded3 = lookup$1[base64.charCodeAt(i + 2)];
            encoded4 = lookup$1[base64.charCodeAt(i + 3)];
            bytes[p++] = (encoded1 << 2) | (encoded2 >> 4);
            bytes[p++] = ((encoded2 & 15) << 4) | (encoded3 >> 2);
            bytes[p++] = ((encoded3 & 3) << 6) | (encoded4 & 63);
        }
        return buffer;
    };
    var polyUint16Array = function (buffer) {
        var length = buffer.length;
        var bytes = [];
        for (var i = 0; i < length; i += 2) {
            bytes.push((buffer[i + 1] << 8) | buffer[i]);
        }
        return bytes;
    };
    var polyUint32Array = function (buffer) {
        var length = buffer.length;
        var bytes = [];
        for (var i = 0; i < length; i += 4) {
            bytes.push((buffer[i + 3] << 24) | (buffer[i + 2] << 16) | (buffer[i + 1] << 8) | buffer[i]);
        }
        return bytes;
    };

    /** Shift size for getting the index-2 table offset. */
    var UTRIE2_SHIFT_2 = 5;
    /** Shift size for getting the index-1 table offset. */
    var UTRIE2_SHIFT_1 = 6 + 5;
    /**
     * Shift size for shifting left the index array values.
     * Increases possible data size with 16-bit index values at the cost
     * of compactability.
     * This requires data blocks to be aligned by UTRIE2_DATA_GRANULARITY.
     */
    var UTRIE2_INDEX_SHIFT = 2;
    /**
     * Difference between the two shift sizes,
     * for getting an index-1 offset from an index-2 offset. 6=11-5
     */
    var UTRIE2_SHIFT_1_2 = UTRIE2_SHIFT_1 - UTRIE2_SHIFT_2;
    /**
     * The part of the index-2 table for U+D800..U+DBFF stores values for
     * lead surrogate code _units_ not code _points_.
     * Values for lead surrogate code _points_ are indexed with this portion of the table.
     * Length=32=0x20=0x400>>UTRIE2_SHIFT_2. (There are 1024=0x400 lead surrogates.)
     */
    var UTRIE2_LSCP_INDEX_2_OFFSET = 0x10000 >> UTRIE2_SHIFT_2;
    /** Number of entries in a data block. 32=0x20 */
    var UTRIE2_DATA_BLOCK_LENGTH = 1 << UTRIE2_SHIFT_2;
    /** Mask for getting the lower bits for the in-data-block offset. */
    var UTRIE2_DATA_MASK = UTRIE2_DATA_BLOCK_LENGTH - 1;
    var UTRIE2_LSCP_INDEX_2_LENGTH = 0x400 >> UTRIE2_SHIFT_2;
    /** Count the lengths of both BMP pieces. 2080=0x820 */
    var UTRIE2_INDEX_2_BMP_LENGTH = UTRIE2_LSCP_INDEX_2_OFFSET + UTRIE2_LSCP_INDEX_2_LENGTH;
    /**
     * The 2-byte UTF-8 version of the index-2 table follows at offset 2080=0x820.
     * Length 32=0x20 for lead bytes C0..DF, regardless of UTRIE2_SHIFT_2.
     */
    var UTRIE2_UTF8_2B_INDEX_2_OFFSET = UTRIE2_INDEX_2_BMP_LENGTH;
    var UTRIE2_UTF8_2B_INDEX_2_LENGTH = 0x800 >> 6; /* U+0800 is the first code point after 2-byte UTF-8 */
    /**
     * The index-1 table, only used for supplementary code points, at offset 2112=0x840.
     * Variable length, for code points up to highStart, where the last single-value range starts.
     * Maximum length 512=0x200=0x100000>>UTRIE2_SHIFT_1.
     * (For 0x100000 supplementary code points U+10000..U+10ffff.)
     *
     * The part of the index-2 table for supplementary code points starts
     * after this index-1 table.
     *
     * Both the index-1 table and the following part of the index-2 table
     * are omitted completely if there is only BMP data.
     */
    var UTRIE2_INDEX_1_OFFSET = UTRIE2_UTF8_2B_INDEX_2_OFFSET + UTRIE2_UTF8_2B_INDEX_2_LENGTH;
    /**
     * Number of index-1 entries for the BMP. 32=0x20
     * This part of the index-1 table is omitted from the serialized form.
     */
    var UTRIE2_OMITTED_BMP_INDEX_1_LENGTH = 0x10000 >> UTRIE2_SHIFT_1;
    /** Number of entries in an index-2 block. 64=0x40 */
    var UTRIE2_INDEX_2_BLOCK_LENGTH = 1 << UTRIE2_SHIFT_1_2;
    /** Mask for getting the lower bits for the in-index-2-block offset. */
    var UTRIE2_INDEX_2_MASK = UTRIE2_INDEX_2_BLOCK_LENGTH - 1;
    var slice16 = function (view, start, end) {
        if (view.slice) {
            return view.slice(start, end);
        }
        return new Uint16Array(Array.prototype.slice.call(view, start, end));
    };
    var slice32 = function (view, start, end) {
        if (view.slice) {
            return view.slice(start, end);
        }
        return new Uint32Array(Array.prototype.slice.call(view, start, end));
    };
    var createTrieFromBase64 = function (base64, _byteLength) {
        var buffer = decode(base64);
        var view32 = Array.isArray(buffer) ? polyUint32Array(buffer) : new Uint32Array(buffer);
        var view16 = Array.isArray(buffer) ? polyUint16Array(buffer) : new Uint16Array(buffer);
        var headerLength = 24;
        var index = slice16(view16, headerLength / 2, view32[4] / 2);
        var data = view32[5] === 2
            ? slice16(view16, (headerLength + view32[4]) / 2)
            : slice32(view32, Math.ceil((headerLength + view32[4]) / 4));
        return new Trie(view32[0], view32[1], view32[2], view32[3], index, data);
    };
    var Trie = /** @class */ (function () {
        function Trie(initialValue, errorValue, highStart, highValueIndex, index, data) {
            this.initialValue = initialValue;
            this.errorValue = errorValue;
            this.highStart = highStart;
            this.highValueIndex = highValueIndex;
            this.index = index;
            this.data = data;
        }
        /**
         * Get the value for a code point as stored in the Trie.
         *
         * @param codePoint the code point
         * @return the value
         */
        Trie.prototype.get = function (codePoint) {
            var ix;
            if (codePoint >= 0) {
                if (codePoint < 0x0d800 || (codePoint > 0x0dbff && codePoint <= 0x0ffff)) {
                    // Ordinary BMP code point, excluding leading surrogates.
                    // BMP uses a single level lookup.  BMP index starts at offset 0 in the Trie2 index.
                    // 16 bit data is stored in the index array itself.
                    ix = this.index[codePoint >> UTRIE2_SHIFT_2];
                    ix = (ix << UTRIE2_INDEX_SHIFT) + (codePoint & UTRIE2_DATA_MASK);
                    return this.data[ix];
                }
                if (codePoint <= 0xffff) {
                    // Lead Surrogate Code Point.  A Separate index section is stored for
                    // lead surrogate code units and code points.
                    //   The main index has the code unit data.
                    //   For this function, we need the code point data.
                    // Note: this expression could be refactored for slightly improved efficiency, but
                    //       surrogate code points will be so rare in practice that it's not worth it.
                    ix = this.index[UTRIE2_LSCP_INDEX_2_OFFSET + ((codePoint - 0xd800) >> UTRIE2_SHIFT_2)];
                    ix = (ix << UTRIE2_INDEX_SHIFT) + (codePoint & UTRIE2_DATA_MASK);
                    return this.data[ix];
                }
                if (codePoint < this.highStart) {
                    // Supplemental code point, use two-level lookup.
                    ix = UTRIE2_INDEX_1_OFFSET - UTRIE2_OMITTED_BMP_INDEX_1_LENGTH + (codePoint >> UTRIE2_SHIFT_1);
                    ix = this.index[ix];
                    ix += (codePoint >> UTRIE2_SHIFT_2) & UTRIE2_INDEX_2_MASK;
                    ix = this.index[ix];
                    ix = (ix << UTRIE2_INDEX_SHIFT) + (codePoint & UTRIE2_DATA_MASK);
                    return this.data[ix];
                }
                if (codePoint <= 0x10ffff) {
                    return this.data[this.highValueIndex];
                }
            }
            // Fall through.  The code point is outside of the legal range of 0..0x10ffff.
            return this.errorValue;
        };
        return Trie;
    }());

    /*
     * base64-arraybuffer 1.0.2 <https://github.com/niklasvh/base64-arraybuffer>
     * Copyright (c) 2022 Niklas von Hertzen <https://hertzen.com>
     * Released under MIT License
     */
    var chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
    // Use a lookup table to find the index.
    var lookup = typeof Uint8Array === 'undefined' ? [] : new Uint8Array(256);
    for (var i = 0; i < chars.length; i++) {
        lookup[chars.charCodeAt(i)] = i;
    }

    var Prepend = 1;
    var CR = 2;
    var LF = 3;
    var Control = 4;
    var Extend = 5;
    var SpacingMark = 7;
    var L = 8;
    var V = 9;
    var T = 10;
    var LV = 11;
    var LVT = 12;
    var ZWJ = 13;
    var Extended_Pictographic = 14;
    var RI = 15;
    var toCodePoints = function (str) {
        var codePoints = [];
        var i = 0;
        var length = str.length;
        while (i < length) {
            var value = str.charCodeAt(i++);
            if (value >= 0xd800 && value <= 0xdbff && i < length) {
                var extra = str.charCodeAt(i++);
                if ((extra & 0xfc00) === 0xdc00) {
                    codePoints.push(((value & 0x3ff) << 10) + (extra & 0x3ff) + 0x10000);
                }
                else {
                    codePoints.push(value);
                    i--;
                }
            }
            else {
                codePoints.push(value);
            }
        }
        return codePoints;
    };
    var fromCodePoint = function () {
        var codePoints = [];
        for (var _i = 0; _i < arguments.length; _i++) {
            codePoints[_i] = arguments[_i];
        }
        if (String.fromCodePoint) {
            return String.fromCodePoint.apply(String, codePoints);
        }
        var length = codePoints.length;
        if (!length) {
            return '';
        }
        var codeUnits = [];
        var index = -1;
        var result = '';
        while (++index < length) {
            var codePoint = codePoints[index];
            if (codePoint <= 0xffff) {
                codeUnits.push(codePoint);
            }
            else {
                codePoint -= 0x10000;
                codeUnits.push((codePoint >> 10) + 0xd800, (codePoint % 0x400) + 0xdc00);
            }
            if (index + 1 === length || codeUnits.length > 0x4000) {
                result += String.fromCharCode.apply(String, codeUnits);
                codeUnits.length = 0;
            }
        }
        return result;
    };
    var UnicodeTrie = createTrieFromBase64(base64);
    var BREAK_NOT_ALLOWED = '×';
    var BREAK_ALLOWED = '÷';
    var codePointToClass = function (codePoint) { return UnicodeTrie.get(codePoint); };
    var _graphemeBreakAtIndex = function (_codePoints, classTypes, index) {
        var prevIndex = index - 2;
        var prev = classTypes[prevIndex];
        var current = classTypes[index - 1];
        var next = classTypes[index];
        // GB3 Do not break between a CR and LF
        if (current === CR && next === LF) {
            return BREAK_NOT_ALLOWED;
        }
        // GB4 Otherwise, break before and after controls.
        if (current === CR || current === LF || current === Control) {
            return BREAK_ALLOWED;
        }
        // GB5
        if (next === CR || next === LF || next === Control) {
            return BREAK_ALLOWED;
        }
        // Do not break Hangul syllable sequences.
        // GB6
        if (current === L && [L, V, LV, LVT].indexOf(next) !== -1) {
            return BREAK_NOT_ALLOWED;
        }
        // GB7
        if ((current === LV || current === V) && (next === V || next === T)) {
            return BREAK_NOT_ALLOWED;
        }
        // GB8
        if ((current === LVT || current === T) && next === T) {
            return BREAK_NOT_ALLOWED;
        }
        // GB9 Do not break before extending characters or ZWJ.
        if (next === ZWJ || next === Extend) {
            return BREAK_NOT_ALLOWED;
        }
        // Do not break before SpacingMarks, or after Prepend characters.
        // GB9a
        if (next === SpacingMark) {
            return BREAK_NOT_ALLOWED;
        }
        // GB9a
        if (current === Prepend) {
            return BREAK_NOT_ALLOWED;
        }
        // GB11 Do not break within emoji modifier sequences or emoji zwj sequences.
        if (current === ZWJ && next === Extended_Pictographic) {
            while (prev === Extend) {
                prev = classTypes[--prevIndex];
            }
            if (prev === Extended_Pictographic) {
                return BREAK_NOT_ALLOWED;
            }
        }
        // GB12 Do not break within emoji flag sequences.
        // That is, do not break between regional indicator (RI) symbols
        // if there is an odd number of RI characters before the break point.
        if (current === RI && next === RI) {
            var countRI = 0;
            while (prev === RI) {
                countRI++;
                prev = classTypes[--prevIndex];
            }
            if (countRI % 2 === 0) {
                return BREAK_NOT_ALLOWED;
            }
        }
        return BREAK_ALLOWED;
    };
    var GraphemeBreaker = function (str) {
        var codePoints = toCodePoints(str);
        var length = codePoints.length;
        var index = 0;
        var lastEnd = 0;
        var classTypes = codePoints.map(codePointToClass);
        return {
            next: function () {
                if (index >= length) {
                    return { done: true, value: null };
                }
                var graphemeBreak = BREAK_NOT_ALLOWED;
                while (index < length &&
                    (graphemeBreak = _graphemeBreakAtIndex(codePoints, classTypes, ++index)) === BREAK_NOT_ALLOWED) { }
                if (graphemeBreak !== BREAK_NOT_ALLOWED || index === length) {
                    var value = fromCodePoint.apply(null, codePoints.slice(lastEnd, index));
                    lastEnd = index;
                    return { value: value, done: false };
                }
                return { done: true, value: null };
            },
        };
    };
    var splitGraphemes = function (str) {
        var breaker = GraphemeBreaker(str);
        var graphemes = [];
        var bk;
        while (!(bk = breaker.next()).done) {
            if (bk.value) {
                graphemes.push(bk.value.slice());
            }
        }
        return graphemes;
    };

    var testRangeBounds = function (document) {
        var TEST_HEIGHT = 123;
        if (document.createRange) {
            var range = document.createRange();
            if (range.getBoundingClientRect) {
                var testElement = document.createElement('boundtest');
                testElement.style.height = TEST_HEIGHT + "px";
                testElement.style.display = 'block';
                document.body.appendChild(testElement);
                range.selectNode(testElement);
                var rangeBounds = range.getBoundingClientRect();
                var rangeHeight = Math.round(rangeBounds.height);
                document.body.removeChild(testElement);
                if (rangeHeight === TEST_HEIGHT) {
                    return true;
                }
            }
        }
        return false;
    };
    var testIOSLineBreak = function (document) {
        var testElement = document.createElement('boundtest');
        testElement.style.width = '50px';
        testElement.style.display = 'block';
        testElement.style.fontSize = '12px';
        testElement.style.letterSpacing = '0px';
        testElement.style.wordSpacing = '0px';
        document.body.appendChild(testElement);
        var range = document.createRange();
        testElement.innerHTML = typeof ''.repeat === 'function' ? '&#128104;'.repeat(10) : '';
        var node = testElement.firstChild;
        var textList = toCodePoints$1(node.data).map(function (i) { return fromCodePoint$1(i); });
        var offset = 0;
        var prev = {};
        // ios 13 does not handle range getBoundingClientRect line changes correctly #2177
        var supports = textList.every(function (text, i) {
            range.setStart(node, offset);
            range.setEnd(node, offset + text.length);
            var rect = range.getBoundingClientRect();
            offset += text.length;
            var boundAhead = rect.x > prev.x || rect.y > prev.y;
            prev = rect;
            if (i === 0) {
                return true;
            }
            return boundAhead;
        });
        document.body.removeChild(testElement);
        return supports;
    };
    var testCORS = function () { return typeof new Image().crossOrigin !== 'undefined'; };
    var testResponseType = function () { return typeof new XMLHttpRequest().responseType === 'string'; };
    var testSVG = function (document) {
        var img = new Image();
        var canvas = document.createElement('canvas');
        var ctx = canvas.getContext('2d');
        if (!ctx) {
            return false;
        }
        img.src = "data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'></svg>";
        try {
            ctx.drawImage(img, 0, 0);
            canvas.toDataURL();
        }
        catch (e) {
            return false;
        }
        return true;
    };
    var isGreenPixel = function (data) {
        return data[0] === 0 && data[1] === 255 && data[2] === 0 && data[3] === 255;
    };
    var testForeignObject = function (document) {
        var canvas = document.createElement('canvas');
        var size = 100;
        canvas.width = size;
        canvas.height = size;
        var ctx = canvas.getContext('2d');
        if (!ctx) {
            return Promise.reject(false);
        }
        ctx.fillStyle = 'rgb(0, 255, 0)';
        ctx.fillRect(0, 0, size, size);
        var img = new Image();
        var greenImageSrc = canvas.toDataURL();
        img.src = greenImageSrc;
        var svg = createForeignObjectSVG(size, size, 0, 0, img);
        ctx.fillStyle = 'red';
        ctx.fillRect(0, 0, size, size);
        return loadSerializedSVG$1(svg)
            .then(function (img) {
            ctx.drawImage(img, 0, 0);
            var data = ctx.getImageData(0, 0, size, size).data;
            ctx.fillStyle = 'red';
            ctx.fillRect(0, 0, size, size);
            var node = document.createElement('div');
            node.style.backgroundImage = "url(" + greenImageSrc + ")";
            node.style.height = size + "px";
            // Firefox 55 does not render inline <img /> tags
            return isGreenPixel(data)
                ? loadSerializedSVG$1(createForeignObjectSVG(size, size, 0, 0, node))
                : Promise.reject(false);
        })
            .then(function (img) {
            ctx.drawImage(img, 0, 0);
            // Edge does not render background-images
            return isGreenPixel(ctx.getImageData(0, 0, size, size).data);
        })
            .catch(function () { return false; });
    };
    var createForeignObjectSVG = function (width, height, x, y, node) {
        var xmlns = 'http://www.w3.org/2000/svg';
        var svg = document.createElementNS(xmlns, 'svg');
        var foreignObject = document.createElementNS(xmlns, 'foreignObject');
        svg.setAttributeNS(null, 'width', width.toString());
        svg.setAttributeNS(null, 'height', height.toString());
        foreignObject.setAttributeNS(null, 'width', '100%');
        foreignObject.setAttributeNS(null, 'height', '100%');
        foreignObject.setAttributeNS(null, 'x', x.toString());
        foreignObject.setAttributeNS(null, 'y', y.toString());
        foreignObject.setAttributeNS(null, 'externalResourcesRequired', 'true');
        svg.appendChild(foreignObject);
        foreignObject.appendChild(node);
        return svg;
    };
    var loadSerializedSVG$1 = function (svg) {
        return new Promise(function (resolve, reject) {
            var img = new Image();
            img.onload = function () { return resolve(img); };
            img.onerror = reject;
            img.src = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(new XMLSerializer().serializeToString(svg));
        });
    };
    var FEATURES = {
        get SUPPORT_RANGE_BOUNDS() {
            var value = testRangeBounds(document);
            Object.defineProperty(FEATURES, 'SUPPORT_RANGE_BOUNDS', { value: value });
            return value;
        },
        get SUPPORT_WORD_BREAKING() {
            var value = FEATURES.SUPPORT_RANGE_BOUNDS && testIOSLineBreak(document);
            Object.defineProperty(FEATURES, 'SUPPORT_WORD_BREAKING', { value: value });
            return value;
        },
        get SUPPORT_SVG_DRAWING() {
            var value = testSVG(document);
            Object.defineProperty(FEATURES, 'SUPPORT_SVG_DRAWING', { value: value });
            return value;
        },
        get SUPPORT_FOREIGNOBJECT_DRAWING() {
            var value = typeof Array.from === 'function' && typeof window.fetch === 'function'
                ? testForeignObject(document)
                : Promise.resolve(false);
            Object.defineProperty(FEATURES, 'SUPPORT_FOREIGNOBJECT_DRAWING', { value: value });
            return value;
        },
        get SUPPORT_CORS_IMAGES() {
            var value = testCORS();
            Object.defineProperty(FEATURES, 'SUPPORT_CORS_IMAGES', { value: value });
            return value;
        },
        get SUPPORT_RESPONSE_TYPE() {
            var value = testResponseType();
            Object.defineProperty(FEATURES, 'SUPPORT_RESPONSE_TYPE', { value: value });
            return value;
        },
        get SUPPORT_CORS_XHR() {
            var value = 'withCredentials' in new XMLHttpRequest();
            Object.defineProperty(FEATURES, 'SUPPORT_CORS_XHR', { value: value });
            return value;
        },
        get SUPPORT_NATIVE_TEXT_SEGMENTATION() {
            // eslint-disable-next-line @typescript-eslint/no-explicit-any
            var value = !!(typeof Intl !== 'undefined' && Intl.Segmenter);
            Object.defineProperty(FEATURES, 'SUPPORT_NATIVE_TEXT_SEGMENTATION', { value: value });
            return value;
        }
    };

    var TextBounds = /** @class */ (function () {
        function TextBounds(text, bounds) {
            this.text = text;
            this.bounds = bounds;
        }
        return TextBounds;
    }());
    var parseTextBounds = function (context, value, styles, node) {
        var textList = breakText(value, styles);
        var textBounds = [];
        var offset = 0;
        textList.forEach(function (text) {
            if (styles.textDecorationLine.length || text.trim().length > 0) {
                if (FEATURES.SUPPORT_RANGE_BOUNDS) {
                    var clientRects = createRange(node, offset, text.length).getClientRects();
                    if (clientRects.length > 1) {
                        var subSegments = segmentGraphemes(text);
                        var subOffset_1 = 0;
                        subSegments.forEach(function (subSegment) {
                            textBounds.push(new TextBounds(subSegment, Bounds.fromDOMRectList(context, createRange(node, subOffset_1 + offset, subSegment.length).getClientRects())));
                            subOffset_1 += subSegment.length;
                        });
                    }
                    else {
                        textBounds.push(new TextBounds(text, Bounds.fromDOMRectList(context, clientRects)));
                    }
                }
                else {
                    var replacementNode = node.splitText(text.length);
                    textBounds.push(new TextBounds(text, getWrapperBounds(context, node)));
                    node = replacementNode;
                }
            }
            else if (!FEATURES.SUPPORT_RANGE_BOUNDS) {
                node = node.splitText(text.length);
            }
            offset += text.length;
        });
        return textBounds;
    };
    var getWrapperBounds = function (context, node) {
        var ownerDocument = node.ownerDocument;
        if (ownerDocument) {
            var wrapper = ownerDocument.createElement('html2canvaswrapper');
            wrapper.appendChild(node.cloneNode(true));
            var parentNode = node.parentNode;
            if (parentNode) {
                parentNode.replaceChild(wrapper, node);
                var bounds = parseBounds(context, wrapper);
                if (wrapper.firstChild) {
                    parentNode.replaceChild(wrapper.firstChild, wrapper);
                }
                return bounds;
            }
        }
        return Bounds.EMPTY;
    };
    var createRange = function (node, offset, length) {
        var ownerDocument = node.ownerDocument;
        if (!ownerDocument) {
            throw new Error('Node has no owner document');
        }
        var range = ownerDocument.createRange();
        range.setStart(node, offset);
        range.setEnd(node, offset + length);
        return range;
    };
    var segmentGraphemes = function (value) {
        if (FEATURES.SUPPORT_NATIVE_TEXT_SEGMENTATION) {
            // eslint-disable-next-line @typescript-eslint/no-explicit-any
            var segmenter = new Intl.Segmenter(void 0, { granularity: 'grapheme' });
            // eslint-disable-next-line @typescript-eslint/no-explicit-any
            return Array.from(segmenter.segment(value)).map(function (segment) { return segment.segment; });
        }
        return splitGraphemes(value);
    };
    var segmentWords = function (value, styles) {
        if (FEATURES.SUPPORT_NATIVE_TEXT_SEGMENTATION) {
            // eslint-disable-next-line @typescript-eslint/no-explicit-any
            var segmenter = new Intl.Segmenter(void 0, {
                granularity: 'word'
            });
            // eslint-disable-next-line @typescript-eslint/no-explicit-any
            return Array.from(segmenter.segment(value)).map(function (segment) { return segment.segment; });
        }
        return breakWords(value, styles);
    };
    var breakText = function (value, styles) {
        return styles.letterSpacing !== 0 ? segmentGraphemes(value) : segmentWords(value, styles);
    };
    // https://drafts.csswg.org/css-text/#word-separator
    var wordSeparators = [0x0020, 0x00a0, 0x1361, 0x10100, 0x10101, 0x1039, 0x1091];
    var breakWords = function (str, styles) {
        var breaker = LineBreaker(str, {
            lineBreak: styles.lineBreak,
            wordBreak: styles.overflowWrap === "break-word" /* BREAK_WORD */ ? 'break-word' : styles.wordBreak
        });
        var words = [];
        var bk;
        var _loop_1 = function () {
            if (bk.value) {
                var value = bk.value.slice();
                var codePoints = toCodePoints$1(value);
                var word_1 = '';
                codePoints.forEach(function (codePoint) {
                    if (wordSeparators.indexOf(codePoint) === -1) {
                        word_1 += fromCodePoint$1(codePoint);
                    }
                    else {
                        if (word_1.length) {
                            words.push(word_1);
                        }
                        words.push(fromCodePoint$1(codePoint));
                        word_1 = '';
                    }
                });
                if (word_1.length) {
                    words.push(word_1);
                }
            }
        };
        while (!(bk = breaker.next()).done) {
            _loop_1();
        }
        return words;
    };

    var TextContainer = /** @class */ (function () {
        function TextContainer(context, node, styles) {
            this.text = transform(node.data, styles.textTransform);
            this.textBounds = parseTextBounds(context, this.text, styles, node);
        }
        return TextContainer;
    }());
    var transform = function (text, transform) {
        switch (transform) {
            case 1 /* LOWERCASE */:
                return text.toLowerCase();
            case 3 /* CAPITALIZE */:
                return text.replace(CAPITALIZE, capitalize);
            case 2 /* UPPERCASE */:
                return text.toUpperCase();
            default:
                return text;
        }
    };
    var CAPITALIZE = /(^|\s|:|-|\(|\))([a-z])/g;
    var capitalize = function (m, p1, p2) {
        if (m.length > 0) {
            return p1 + p2.toUpperCase();
        }
        return m;
    };

    var ImageElementContainer = /** @class */ (function (_super) {
        __extends(ImageElementContainer, _super);
        function ImageElementContainer(context, img) {
            var _this = _super.call(this, context, img) || this;
            _this.src = img.currentSrc || img.src;
            _this.intrinsicWidth = img.naturalWidth;
            _this.intrinsicHeight = img.naturalHeight;
            _this.context.cache.addImage(_this.src);
            return _this;
        }
        return ImageElementContainer;
    }(ElementContainer));

    var CanvasElementContainer = /** @class */ (function (_super) {
        __extends(CanvasElementContainer, _super);
        function CanvasElementContainer(context, canvas) {
            var _this = _super.call(this, context, canvas) || this;
            _this.canvas = canvas;
            _this.intrinsicWidth = canvas.width;
            _this.intrinsicHeight = canvas.height;
            return _this;
        }
        return CanvasElementContainer;
    }(ElementContainer));

    var SVGElementContainer = /** @class */ (function (_super) {
        __extends(SVGElementContainer, _super);
        function SVGElementContainer(context, img) {
            var _this = _super.call(this, context, img) || this;
            var s = new XMLSerializer();
            var bounds = parseBounds(context, img);
            img.setAttribute('width', bounds.width + "px");
            img.setAttribute('height', bounds.height + "px");
            _this.svg = "data:image/svg+xml," + encodeURIComponent(s.serializeToString(img));
            _this.intrinsicWidth = img.width.baseVal.value;
            _this.intrinsicHeight = img.height.baseVal.value;
            _this.context.cache.addImage(_this.svg);
            return _this;
        }
        return SVGElementContainer;
    }(ElementContainer));

    var LIElementContainer = /** @class */ (function (_super) {
        __extends(LIElementContainer, _super);
        function LIElementContainer(context, element) {
            var _this = _super.call(this, context, element) || this;
            _this.value = element.value;
            return _this;
        }
        return LIElementContainer;
    }(ElementContainer));

    var OLElementContainer = /** @class */ (function (_super) {
        __extends(OLElementContainer, _super);
        function OLElementContainer(context, element) {
            var _this = _super.call(this, context, element) || this;
            _this.start = element.start;
            _this.reversed = typeof element.reversed === 'boolean' && element.reversed === true;
            return _this;
        }
        return OLElementContainer;
    }(ElementContainer));

    var CHECKBOX_BORDER_RADIUS = [
        {
            type: 15 /* DIMENSION_TOKEN */,
            flags: 0,
            unit: 'px',
            number: 3
        }
    ];
    var RADIO_BORDER_RADIUS = [
        {
            type: 16 /* PERCENTAGE_TOKEN */,
            flags: 0,
            number: 50
        }
    ];
    var reformatInputBounds = function (bounds) {
        if (bounds.width > bounds.height) {
            return new Bounds(bounds.left + (bounds.width - bounds.height) / 2, bounds.top, bounds.height, bounds.height);
        }
        else if (bounds.width < bounds.height) {
            return new Bounds(bounds.left, bounds.top + (bounds.height - bounds.width) / 2, bounds.width, bounds.width);
        }
        return bounds;
    };
    var getInputValue = function (node) {
        var value = node.type === PASSWORD ? new Array(node.value.length + 1).join('\u2022') : node.value;
        return value.length === 0 ? node.placeholder || '' : value;
    };
    var CHECKBOX = 'checkbox';
    var RADIO = 'radio';
    var PASSWORD = 'password';
    var INPUT_COLOR = 0x2a2a2aff;
    var InputElementContainer = /** @class */ (function (_super) {
        __extends(InputElementContainer, _super);
        function InputElementContainer(context, input) {
            var _this = _super.call(this, context, input) || this;
            _this.type = input.type.toLowerCase();
            _this.checked = input.checked;
            _this.value = getInputValue(input);
            if (_this.type === CHECKBOX || _this.type === RADIO) {
                _this.styles.backgroundColor = 0xdededeff;
                _this.styles.borderTopColor =
                    _this.styles.borderRightColor =
                        _this.styles.borderBottomColor =
                            _this.styles.borderLeftColor =
                                0xa5a5a5ff;
                _this.styles.borderTopWidth =
                    _this.styles.borderRightWidth =
                        _this.styles.borderBottomWidth =
                            _this.styles.borderLeftWidth =
                                1;
                _this.styles.borderTopStyle =
                    _this.styles.borderRightStyle =
                        _this.styles.borderBottomStyle =
                            _this.styles.borderLeftStyle =
                                1 /* SOLID */;
                _this.styles.backgroundClip = [0 /* BORDER_BOX */];
                _this.styles.backgroundOrigin = [0 /* BORDER_BOX */];
                _this.bounds = reformatInputBounds(_this.bounds);
            }
            switch (_this.type) {
                case CHECKBOX:
                    _this.styles.borderTopRightRadius =
                        _this.styles.borderTopLeftRadius =
                            _this.styles.borderBottomRightRadius =
                                _this.styles.borderBottomLeftRadius =
                                    CHECKBOX_BORDER_RADIUS;
                    break;
                case RADIO:
                    _this.styles.borderTopRightRadius =
                        _this.styles.borderTopLeftRadius =
                            _this.styles.borderBottomRightRadius =
                                _this.styles.borderBottomLeftRadius =
                                    RADIO_BORDER_RADIUS;
                    break;
            }
            return _this;
        }
        return InputElementContainer;
    }(ElementContainer));

    var SelectElementContainer = /** @class */ (function (_super) {
        __extends(SelectElementContainer, _super);
        function SelectElementContainer(context, element) {
            var _this = _super.call(this, context, element) || this;
            var option = element.options[element.selectedIndex || 0];
            _this.value = option ? option.text || '' : '';
            return _this;
        }
        return SelectElementContainer;
    }(ElementContainer));

    var TextareaElementContainer = /** @class */ (function (_super) {
        __extends(TextareaElementContainer, _super);
        function TextareaElementContainer(context, element) {
            var _this = _super.call(this, context, element) || this;
            _this.value = element.value;
            return _this;
        }
        return TextareaElementContainer;
    }(ElementContainer));

    var IFrameElementContainer = /** @class */ (function (_super) {
        __extends(IFrameElementContainer, _super);
        function IFrameElementContainer(context, iframe) {
            var _this = _super.call(this, context, iframe) || this;
            _this.src = iframe.src;
            _this.width = parseInt(iframe.width, 10) || 0;
            _this.height = parseInt(iframe.height, 10) || 0;
            _this.backgroundColor = _this.styles.backgroundColor;
            try {
                if (iframe.contentWindow &&
                    iframe.contentWindow.document &&
                    iframe.contentWindow.document.documentElement) {
                    _this.tree = parseTree(context, iframe.contentWindow.document.documentElement);
                    // http://www.w3.org/TR/css3-background/#special-backgrounds
                    var documentBackgroundColor = iframe.contentWindow.document.documentElement
                        ? parseColor(context, getComputedStyle(iframe.contentWindow.document.documentElement).backgroundColor)
                        : COLORS.TRANSPARENT;
                    var bodyBackgroundColor = iframe.contentWindow.document.body
                        ? parseColor(context, getComputedStyle(iframe.contentWindow.document.body).backgroundColor)
                        : COLORS.TRANSPARENT;
                    _this.backgroundColor = isTransparent(documentBackgroundColor)
                        ? isTransparent(bodyBackgroundColor)
                            ? _this.styles.backgroundColor
                            : bodyBackgroundColor
                        : documentBackgroundColor;
                }
            }
            catch (e) { }
            return _this;
        }
        return IFrameElementContainer;
    }(ElementContainer));

    var LIST_OWNERS = ['OL', 'UL', 'MENU'];
    var parseNodeTree = function (context, node, parent, root) {
        for (var childNode = node.firstChild, nextNode = void 0; childNode; childNode = nextNode) {
            nextNode = childNode.nextSibling;
            if (isTextNode(childNode) && childNode.data.trim().length > 0) {
                parent.textNodes.push(new TextContainer(context, childNode, parent.styles));
            }
            else if (isElementNode(childNode)) {
                if (isSlotElement(childNode) && childNode.assignedNodes) {
                    childNode.assignedNodes().forEach(function (childNode) { return parseNodeTree(context, childNode, parent, root); });
                }
                else {
                    var container = createContainer(context, childNode);
                    if (container.styles.isVisible()) {
                        if (createsRealStackingContext(childNode, container, root)) {
                            container.flags |= 4 /* CREATES_REAL_STACKING_CONTEXT */;
                        }
                        else if (createsStackingContext(container.styles)) {
                            container.flags |= 2 /* CREATES_STACKING_CONTEXT */;
                        }
                        if (LIST_OWNERS.indexOf(childNode.tagName) !== -1) {
                            container.flags |= 8 /* IS_LIST_OWNER */;
                        }
                        parent.elements.push(container);
                        childNode.slot;
                        if (childNode.shadowRoot) {
                            parseNodeTree(context, childNode.shadowRoot, container, root);
                        }
                        else if (!isTextareaElement(childNode) &&
                            !isSVGElement(childNode) &&
                            !isSelectElement(childNode)) {
                            parseNodeTree(context, childNode, container, root);
                        }
                    }
                }
            }
        }
    };
    var createContainer = function (context, element) {
        if (isImageElement(element)) {
            return new ImageElementContainer(context, element);
        }
        if (isCanvasElement(element)) {
            return new CanvasElementContainer(context, element);
        }
        if (isSVGElement(element)) {
            return new SVGElementContainer(context, element);
        }
        if (isLIElement(element)) {
            return new LIElementContainer(context, element);
        }
        if (isOLElement(element)) {
            return new OLElementContainer(context, element);
        }
        if (isInputElement(element)) {
            return new InputElementContainer(context, element);
        }
        if (isSelectElement(element)) {
            return new SelectElementContainer(context, element);
        }
        if (isTextareaElement(element)) {
            return new TextareaElementContainer(context, element);
        }
        if (isIFrameElement(element)) {
            return new IFrameElementContainer(context, element);
        }
        return new ElementContainer(context, element);
    };
    var parseTree = function (context, element) {
        var container = createContainer(context, element);
        container.flags |= 4 /* CREATES_REAL_STACKING_CONTEXT */;
        parseNodeTree(context, element, container, container);
        return container;
    };
    var createsRealStackingContext = function (node, container, root) {
        return (container.styles.isPositionedWithZIndex() ||
            container.styles.opacity < 1 ||
            container.styles.isTransformed() ||
            (isBodyElement(node) && root.styles.isTransparent()));
    };
    var createsStackingContext = function (styles) { return styles.isPositioned() || styles.isFloating(); };
    var isTextNode = function (node) { return node.nodeType === Node.TEXT_NODE; };
    var isElementNode = function (node) { return node.nodeType === Node.ELEMENT_NODE; };
    var isHTMLElementNode = function (node) {
        return isElementNode(node) && typeof node.style !== 'undefined' && !isSVGElementNode(node);
    };
    var isSVGElementNode = function (element) {
        return typeof element.className === 'object';
    };
    var isLIElement = function (node) { return node.tagName === 'LI'; };
    var isOLElement = function (node) { return node.tagName === 'OL'; };
    var isInputElement = function (node) { return node.tagName === 'INPUT'; };
    var isHTMLElement = function (node) { return node.tagName === 'HTML'; };
    var isSVGElement = function (node) { return node.tagName === 'svg'; };
    var isBodyElement = function (node) { return node.tagName === 'BODY'; };
    var isCanvasElement = function (node) { return node.tagName === 'CANVAS'; };
    var isVideoElement = function (node) { return node.tagName === 'VIDEO'; };
    var isImageElement = function (node) { return node.tagName === 'IMG'; };
    var isIFrameElement = function (node) { return node.tagName === 'IFRAME'; };
    var isStyleElement = function (node) { return node.tagName === 'STYLE'; };
    var isScriptElement = function (node) { return node.tagName === 'SCRIPT'; };
    var isTextareaElement = function (node) { return node.tagName === 'TEXTAREA'; };
    var isSelectElement = function (node) { return node.tagName === 'SELECT'; };
    var isSlotElement = function (node) { return node.tagName === 'SLOT'; };
    // https://html.spec.whatwg.org/multipage/custom-elements.html#valid-custom-element-name
    var isCustomElement = function (node) { return node.tagName.indexOf('-') > 0; };

    var CounterState = /** @class */ (function () {
        function CounterState() {
            this.counters = {};
        }
        CounterState.prototype.getCounterValue = function (name) {
            var counter = this.counters[name];
            if (counter && counter.length) {
                return counter[counter.length - 1];
            }
            return 1;
        };
        CounterState.prototype.getCounterValues = function (name) {
            var counter = this.counters[name];
            return counter ? counter : [];
        };
        CounterState.prototype.pop = function (counters) {
            var _this = this;
            counters.forEach(function (counter) { return _this.counters[counter].pop(); });
        };
        CounterState.prototype.parse = function (style) {
            var _this = this;
            var counterIncrement = style.counterIncrement;
            var counterReset = style.counterReset;
            var canReset = true;
            if (counterIncrement !== null) {
                counterIncrement.forEach(function (entry) {
                    var counter = _this.counters[entry.counter];
                    if (counter && entry.increment !== 0) {
                        canReset = false;
                        if (!counter.length) {
                            counter.push(1);
                        }
                        counter[Math.max(0, counter.length - 1)] += entry.increment;
                    }
                });
            }
            var counterNames = [];
            if (canReset) {
                counterReset.forEach(function (entry) {
                    var counter = _this.counters[entry.counter];
                    counterNames.push(entry.counter);
                    if (!counter) {
                        counter = _this.counters[entry.counter] = [];
                    }
                    counter.push(entry.reset);
                });
            }
            return counterNames;
        };
        return CounterState;
    }());
    var ROMAN_UPPER = {
        integers: [1000, 900, 500, 400, 100, 90, 50, 40, 10, 9, 5, 4, 1],
        values: ['M', 'CM', 'D', 'CD', 'C', 'XC', 'L', 'XL', 'X', 'IX', 'V', 'IV', 'I']
    };
    var ARMENIAN = {
        integers: [
            9000, 8000, 7000, 6000, 5000, 4000, 3000, 2000, 1000, 900, 800, 700, 600, 500, 400, 300, 200, 100, 90, 80, 70,
            60, 50, 40, 30, 20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1
        ],
        values: [
            'Ք',
            'Փ',
            'Ւ',
            'Ց',
            'Ր',
            'Տ',
            'Վ',
            'Ս',
            'Ռ',
            'Ջ',
            'Պ',
            'Չ',
            'Ո',
            'Շ',
            'Ն',
            'Յ',
            'Մ',
            'Ճ',
            'Ղ',
            'Ձ',
            'Հ',
            'Կ',
            'Ծ',
            'Խ',
            'Լ',
            'Ի',
            'Ժ',
            'Թ',
            'Ը',
            'Է',
            'Զ',
            'Ե',
            'Դ',
            'Գ',
            'Բ',
            'Ա'
        ]
    };
    var HEBREW = {
        integers: [
            10000, 9000, 8000, 7000, 6000, 5000, 4000, 3000, 2000, 1000, 400, 300, 200, 100, 90, 80, 70, 60, 50, 40, 30, 20,
            19, 18, 17, 16, 15, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1
        ],
        values: [
            'י׳',
            'ט׳',
            'ח׳',
            'ז׳',
            'ו׳',
            'ה׳',
            'ד׳',
            'ג׳',
            'ב׳',
            'א׳',
            'ת',
            'ש',
            'ר',
            'ק',
            'צ',
            'פ',
            'ע',
            'ס',
            'נ',
            'מ',
            'ל',
            'כ',
            'יט',
            'יח',
            'יז',
            'טז',
            'טו',
            'י',
            'ט',
            'ח',
            'ז',
            'ו',
            'ה',
            'ד',
            'ג',
            'ב',
            'א'
        ]
    };
    var GEORGIAN = {
        integers: [
            10000, 9000, 8000, 7000, 6000, 5000, 4000, 3000, 2000, 1000, 900, 800, 700, 600, 500, 400, 300, 200, 100, 90,
            80, 70, 60, 50, 40, 30, 20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1
        ],
        values: [
            'ჵ',
            'ჰ',
            'ჯ',
            'ჴ',
            'ხ',
            'ჭ',
            'წ',
            'ძ',
            'ც',
            'ჩ',
            'შ',
            'ყ',
            'ღ',
            'ქ',
            'ფ',
            'ჳ',
            'ტ',
            'ს',
            'რ',
            'ჟ',
            'პ',
            'ო',
            'ჲ',
            'ნ',
            'მ',
            'ლ',
            'კ',
            'ი',
            'თ',
            'ჱ',
            'ზ',
            'ვ',
            'ე',
            'დ',
            'გ',
            'ბ',
            'ა'
        ]
    };
    var createAdditiveCounter = function (value, min, max, symbols, fallback, suffix) {
        if (value < min || value > max) {
            return createCounterText(value, fallback, suffix.length > 0);
        }
        return (symbols.integers.reduce(function (string, integer, index) {
            while (value >= integer) {
                value -= integer;
                string += symbols.values[index];
            }
            return string;
        }, '') + suffix);
    };
    var createCounterStyleWithSymbolResolver = function (value, codePointRangeLength, isNumeric, resolver) {
        var string = '';
        do {
            if (!isNumeric) {
                value--;
            }
            string = resolver(value) + string;
            value /= codePointRangeLength;
        } while (value * codePointRangeLength >= codePointRangeLength);
        return string;
    };
    var createCounterStyleFromRange = function (value, codePointRangeStart, codePointRangeEnd, isNumeric, suffix) {
        var codePointRangeLength = codePointRangeEnd - codePointRangeStart + 1;
        return ((value < 0 ? '-' : '') +
            (createCounterStyleWithSymbolResolver(Math.abs(value), codePointRangeLength, isNumeric, function (codePoint) {
                return fromCodePoint$1(Math.floor(codePoint % codePointRangeLength) + codePointRangeStart);
            }) +
                suffix));
    };
    var createCounterStyleFromSymbols = function (value, symbols, suffix) {
        if (suffix === void 0) { suffix = '. '; }
        var codePointRangeLength = symbols.length;
        return (createCounterStyleWithSymbolResolver(Math.abs(value), codePointRangeLength, false, function (codePoint) { return symbols[Math.floor(codePoint % codePointRangeLength)]; }) + suffix);
    };
    var CJK_ZEROS = 1 << 0;
    var CJK_TEN_COEFFICIENTS = 1 << 1;
    var CJK_TEN_HIGH_COEFFICIENTS = 1 << 2;
    var CJK_HUNDRED_COEFFICIENTS = 1 << 3;
    var createCJKCounter = function (value, numbers, multipliers, negativeSign, suffix, flags) {
        if (value < -9999 || value > 9999) {
            return createCounterText(value, 4 /* CJK_DECIMAL */, suffix.length > 0);
        }
        var tmp = Math.abs(value);
        var string = suffix;
        if (tmp === 0) {
            return numbers[0] + string;
        }
        for (var digit = 0; tmp > 0 && digit <= 4; digit++) {
            var coefficient = tmp % 10;
            if (coefficient === 0 && contains(flags, CJK_ZEROS) && string !== '') {
                string = numbers[coefficient] + string;
            }
            else if (coefficient > 1 ||
                (coefficient === 1 && digit === 0) ||
                (coefficient === 1 && digit === 1 && contains(flags, CJK_TEN_COEFFICIENTS)) ||
                (coefficient === 1 && digit === 1 && contains(flags, CJK_TEN_HIGH_COEFFICIENTS) && value > 100) ||
                (coefficient === 1 && digit > 1 && contains(flags, CJK_HUNDRED_COEFFICIENTS))) {
                string = numbers[coefficient] + (digit > 0 ? multipliers[digit - 1] : '') + string;
            }
            else if (coefficient === 1 && digit > 0) {
                string = multipliers[digit - 1] + string;
            }
            tmp = Math.floor(tmp / 10);
        }
        return (value < 0 ? negativeSign : '') + string;
    };
    var CHINESE_INFORMAL_MULTIPLIERS = '十百千萬';
    var CHINESE_FORMAL_MULTIPLIERS = '拾佰仟萬';
    var JAPANESE_NEGATIVE = 'マイナス';
    var KOREAN_NEGATIVE = '마이너스';
    var createCounterText = function (value, type, appendSuffix) {
        var defaultSuffix = appendSuffix ? '. ' : '';
        var cjkSuffix = appendSuffix ? '、' : '';
        var koreanSuffix = appendSuffix ? ', ' : '';
        var spaceSuffix = appendSuffix ? ' ' : '';
        switch (type) {
            case 0 /* DISC */:
                return '•' + spaceSuffix;
            case 1 /* CIRCLE */:
                return '◦' + spaceSuffix;
            case 2 /* SQUARE */:
                return '◾' + spaceSuffix;
            case 5 /* DECIMAL_LEADING_ZERO */:
                var string = createCounterStyleFromRange(value, 48, 57, true, defaultSuffix);
                return string.length < 4 ? "0" + string : string;
            case 4 /* CJK_DECIMAL */:
                return createCounterStyleFromSymbols(value, '〇一二三四五六七八九', cjkSuffix);
            case 6 /* LOWER_ROMAN */:
                return createAdditiveCounter(value, 1, 3999, ROMAN_UPPER, 3 /* DECIMAL */, defaultSuffix).toLowerCase();
            case 7 /* UPPER_ROMAN */:
                return createAdditiveCounter(value, 1, 3999, ROMAN_UPPER, 3 /* DECIMAL */, defaultSuffix);
            case 8 /* LOWER_GREEK */:
                return createCounterStyleFromRange(value, 945, 969, false, defaultSuffix);
            case 9 /* LOWER_ALPHA */:
                return createCounterStyleFromRange(value, 97, 122, false, defaultSuffix);
            case 10 /* UPPER_ALPHA */:
                return createCounterStyleFromRange(value, 65, 90, false, defaultSuffix);
            case 11 /* ARABIC_INDIC */:
                return createCounterStyleFromRange(value, 1632, 1641, true, defaultSuffix);
            case 12 /* ARMENIAN */:
            case 49 /* UPPER_ARMENIAN */:
                return createAdditiveCounter(value, 1, 9999, ARMENIAN, 3 /* DECIMAL */, defaultSuffix);
            case 35 /* LOWER_ARMENIAN */:
                return createAdditiveCounter(value, 1, 9999, ARMENIAN, 3 /* DECIMAL */, defaultSuffix).toLowerCase();
            case 13 /* BENGALI */:
                return createCounterStyleFromRange(value, 2534, 2543, true, defaultSuffix);
            case 14 /* CAMBODIAN */:
            case 30 /* KHMER */:
                return createCounterStyleFromRange(value, 6112, 6121, true, defaultSuffix);
            case 15 /* CJK_EARTHLY_BRANCH */:
                return createCounterStyleFromSymbols(value, '子丑寅卯辰巳午未申酉戌亥', cjkSuffix);
            case 16 /* CJK_HEAVENLY_STEM */:
                return createCounterStyleFromSymbols(value, '甲乙丙丁戊己庚辛壬癸', cjkSuffix);
            case 17 /* CJK_IDEOGRAPHIC */:
            case 48 /* TRAD_CHINESE_INFORMAL */:
                return createCJKCounter(value, '零一二三四五六七八九', CHINESE_INFORMAL_MULTIPLIERS, '負', cjkSuffix, CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS | CJK_HUNDRED_COEFFICIENTS);
            case 47 /* TRAD_CHINESE_FORMAL */:
                return createCJKCounter(value, '零壹貳參肆伍陸柒捌玖', CHINESE_FORMAL_MULTIPLIERS, '負', cjkSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS | CJK_HUNDRED_COEFFICIENTS);
            case 42 /* SIMP_CHINESE_INFORMAL */:
                return createCJKCounter(value, '零一二三四五六七八九', CHINESE_INFORMAL_MULTIPLIERS, '负', cjkSuffix, CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS | CJK_HUNDRED_COEFFICIENTS);
            case 41 /* SIMP_CHINESE_FORMAL */:
                return createCJKCounter(value, '零壹贰叁肆伍陆柒捌玖', CHINESE_FORMAL_MULTIPLIERS, '负', cjkSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS | CJK_HUNDRED_COEFFICIENTS);
            case 26 /* JAPANESE_INFORMAL */:
                return createCJKCounter(value, '〇一二三四五六七八九', '十百千万', JAPANESE_NEGATIVE, cjkSuffix, 0);
            case 25 /* JAPANESE_FORMAL */:
                return createCJKCounter(value, '零壱弐参四伍六七八九', '拾百千万', JAPANESE_NEGATIVE, cjkSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS);
            case 31 /* KOREAN_HANGUL_FORMAL */:
                return createCJKCounter(value, '영일이삼사오육칠팔구', '십백천만', KOREAN_NEGATIVE, koreanSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS);
            case 33 /* KOREAN_HANJA_INFORMAL */:
                return createCJKCounter(value, '零一二三四五六七八九', '十百千萬', KOREAN_NEGATIVE, koreanSuffix, 0);
            case 32 /* KOREAN_HANJA_FORMAL */:
                return createCJKCounter(value, '零壹貳參四五六七八九', '拾百千', KOREAN_NEGATIVE, koreanSuffix, CJK_ZEROS | CJK_TEN_COEFFICIENTS | CJK_TEN_HIGH_COEFFICIENTS);
            case 18 /* DEVANAGARI */:
                return createCounterStyleFromRange(value, 0x966, 0x96f, true, defaultSuffix);
            case 20 /* GEORGIAN */:
                return createAdditiveCounter(value, 1, 19999, GEORGIAN, 3 /* DECIMAL */, defaultSuffix);
            case 21 /* GUJARATI */:
                return createCounterStyleFromRange(value, 0xae6, 0xaef, true, defaultSuffix);
            case 22 /* GURMUKHI */:
                return createCounterStyleFromRange(value, 0xa66, 0xa6f, true, defaultSuffix);
            case 22 /* HEBREW */:
                return createAdditiveCounter(value, 1, 10999, HEBREW, 3 /* DECIMAL */, defaultSuffix);
            case 23 /* HIRAGANA */:
                return createCounterStyleFromSymbols(value, 'あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわゐゑをん');
            case 24 /* HIRAGANA_IROHA */:
                return createCounterStyleFromSymbols(value, 'いろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせす');
            case 27 /* KANNADA */:
                return createCounterStyleFromRange(value, 0xce6, 0xcef, true, defaultSuffix);
            case 28 /* KATAKANA */:
                return createCounterStyleFromSymbols(value, 'アイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワヰヱヲン', cjkSuffix);
            case 29 /* KATAKANA_IROHA */:
                return createCounterStyleFromSymbols(value, 'イロハニホヘトチリヌルヲワカヨタレソツネナラムウヰノオクヤマケフコエテアサキユメミシヱヒモセス', cjkSuffix);
            case 34 /* LAO */:
                return createCounterStyleFromRange(value, 0xed0, 0xed9, true, defaultSuffix);
            case 37 /* MONGOLIAN */:
                return createCounterStyleFromRange(value, 0x1810, 0x1819, true, defaultSuffix);
            case 38 /* MYANMAR */:
                return createCounterStyleFromRange(value, 0x1040, 0x1049, true, defaultSuffix);
            case 39 /* ORIYA */:
                return createCounterStyleFromRange(value, 0xb66, 0xb6f, true, defaultSuffix);
            case 40 /* PERSIAN */:
                return createCounterStyleFromRange(value, 0x6f0, 0x6f9, true, defaultSuffix);
            case 43 /* TAMIL */:
                return createCounterStyleFromRange(value, 0xbe6, 0xbef, true, defaultSuffix);
            case 44 /* TELUGU */:
                return createCounterStyleFromRange(value, 0xc66, 0xc6f, true, defaultSuffix);
            case 45 /* THAI */:
                return createCounterStyleFromRange(value, 0xe50, 0xe59, true, defaultSuffix);
            case 46 /* TIBETAN */:
                return createCounterStyleFromRange(value, 0xf20, 0xf29, true, defaultSuffix);
            case 3 /* DECIMAL */:
            default:
                return createCounterStyleFromRange(value, 48, 57, true, defaultSuffix);
        }
    };

    var IGNORE_ATTRIBUTE = 'data-html2canvas-ignore';
    var DocumentCloner = /** @class */ (function () {
        function DocumentCloner(context, element, options) {
            this.context = context;
            this.options = options;
            this.scrolledElements = [];
            this.referenceElement = element;
            this.counters = new CounterState();
            this.quoteDepth = 0;
            if (!element.ownerDocument) {
                throw new Error('Cloned element does not have an owner document');
            }
            this.documentElement = this.cloneNode(element.ownerDocument.documentElement, false);
        }
        DocumentCloner.prototype.toIFrame = function (ownerDocument, windowSize) {
            var _this = this;
            var iframe = createIFrameContainer(ownerDocument, windowSize);
            if (!iframe.contentWindow) {
                return Promise.reject("Unable to find iframe window");
            }
            var scrollX = ownerDocument.defaultView.pageXOffset;
            var scrollY = ownerDocument.defaultView.pageYOffset;
            var cloneWindow = iframe.contentWindow;
            var documentClone = cloneWindow.document;
            /* Chrome doesn't detect relative background-images assigned in inline <style> sheets when fetched through getComputedStyle
             if window url is about:blank, we can assign the url to current by writing onto the document
             */
            var iframeLoad = iframeLoader(iframe).then(function () { return __awaiter(_this, void 0, void 0, function () {
                var onclone, referenceElement;
                return __generator(this, function (_a) {
                    switch (_a.label) {
                        case 0:
                            this.scrolledElements.forEach(restoreNodeScroll);
                            if (cloneWindow) {
                                cloneWindow.scrollTo(windowSize.left, windowSize.top);
                                if (/(iPad|iPhone|iPod)/g.test(navigator.userAgent) &&
                                    (cloneWindow.scrollY !== windowSize.top || cloneWindow.scrollX !== windowSize.left)) {
                                    this.context.logger.warn('Unable to restore scroll position for cloned document');
                                    this.context.windowBounds = this.context.windowBounds.add(cloneWindow.scrollX - windowSize.left, cloneWindow.scrollY - windowSize.top, 0, 0);
                                }
                            }
                            onclone = this.options.onclone;
                            referenceElement = this.clonedReferenceElement;
                            if (typeof referenceElement === 'undefined') {
                                return [2 /*return*/, Promise.reject("Error finding the " + this.referenceElement.nodeName + " in the cloned document")];
                            }
                            if (!(documentClone.fonts && documentClone.fonts.ready)) return [3 /*break*/, 2];
                            return [4 /*yield*/, documentClone.fonts.ready];
                        case 1:
                            _a.sent();
                            _a.label = 2;
                        case 2:
                            if (!/(AppleWebKit)/g.test(navigator.userAgent)) return [3 /*break*/, 4];
                            return [4 /*yield*/, imagesReady(documentClone)];
                        case 3:
                            _a.sent();
                            _a.label = 4;
                        case 4:
                            if (typeof onclone === 'function') {
                                return [2 /*return*/, Promise.resolve()
                                        .then(function () { return onclone(documentClone, referenceElement); })
                                        .then(function () { return iframe; })];
                            }
                            return [2 /*return*/, iframe];
                    }
                });
            }); });
            documentClone.open();
            documentClone.write(serializeDoctype(document.doctype) + "<html></html>");
            // Chrome scrolls the parent document for some reason after the write to the cloned window???
            restoreOwnerScroll(this.referenceElement.ownerDocument, scrollX, scrollY);
            documentClone.replaceChild(documentClone.adoptNode(this.documentElement), documentClone.documentElement);
            documentClone.close();
            return iframeLoad;
        };
        DocumentCloner.prototype.createElementClone = function (node) {
            if (isDebugging(node, 2 /* CLONE */)) {
                debugger;
            }
            if (isCanvasElement(node)) {
                return this.createCanvasClone(node);
            }
            if (isVideoElement(node)) {
                return this.createVideoClone(node);
            }
            if (isStyleElement(node)) {
                return this.createStyleClone(node);
            }
            var clone = node.cloneNode(false);
            if (isImageElement(clone)) {
                if (isImageElement(node) && node.currentSrc && node.currentSrc !== node.src) {
                    clone.src = node.currentSrc;
                    clone.srcset = '';
                }
                if (clone.loading === 'lazy') {
                    clone.loading = 'eager';
                }
            }
            if (isCustomElement(clone)) {
                return this.createCustomElementClone(clone);
            }
            return clone;
        };
        DocumentCloner.prototype.createCustomElementClone = function (node) {
            var clone = document.createElement('html2canvascustomelement');
            copyCSSStyles(node.style, clone);
            return clone;
        };
        DocumentCloner.prototype.createStyleClone = function (node) {
            try {
                var sheet = node.sheet;
                if (sheet && sheet.cssRules) {
                    var css = [].slice.call(sheet.cssRules, 0).reduce(function (css, rule) {
                        if (rule && typeof rule.cssText === 'string') {
                            return css + rule.cssText;
                        }
                        return css;
                    }, '');
                    var style = node.cloneNode(false);
                    style.textContent = css;
                    return style;
                }
            }
            catch (e) {
                // accessing node.sheet.cssRules throws a DOMException
                this.context.logger.error('Unable to access cssRules property', e);
                if (e.name !== 'SecurityError') {
                    throw e;
                }
            }
            return node.cloneNode(false);
        };
        DocumentCloner.prototype.createCanvasClone = function (canvas) {
            var _a;
            if (this.options.inlineImages && canvas.ownerDocument) {
                var img = canvas.ownerDocument.createElement('img');
                try {
                    img.src = canvas.toDataURL();
                    return img;
                }
                catch (e) {
                    this.context.logger.info("Unable to inline canvas contents, canvas is tainted", canvas);
                }
            }
            var clonedCanvas = canvas.cloneNode(false);
            try {
                clonedCanvas.width = canvas.width;
                clonedCanvas.height = canvas.height;
                var ctx = canvas.getContext('2d');
                var clonedCtx = clonedCanvas.getContext('2d');
                if (clonedCtx) {
                    if (!this.options.allowTaint && ctx) {
                        clonedCtx.putImageData(ctx.getImageData(0, 0, canvas.width, canvas.height), 0, 0);
                    }
                    else {
                        var gl = (_a = canvas.getContext('webgl2')) !== null && _a !== void 0 ? _a : canvas.getContext('webgl');
                        if (gl) {
                            var attribs = gl.getContextAttributes();
                            if ((attribs === null || attribs === void 0 ? void 0 : attribs.preserveDrawingBuffer) === false) {
                                this.context.logger.warn('Unable to clone WebGL context as it has preserveDrawingBuffer=false', canvas);
                            }
                        }
                        clonedCtx.drawImage(canvas, 0, 0);
                    }
                }
                return clonedCanvas;
            }
            catch (e) {
                this.context.logger.info("Unable to clone canvas as it is tainted", canvas);
            }
            return clonedCanvas;
        };
        DocumentCloner.prototype.createVideoClone = function (video) {
            var canvas = video.ownerDocument.createElement('canvas');
            canvas.width = video.offsetWidth;
            canvas.height = video.offsetHeight;
            var ctx = canvas.getContext('2d');
            try {
                if (ctx) {
                    ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
                    if (!this.options.allowTaint) {
                        ctx.getImageData(0, 0, canvas.width, canvas.height);
                    }
                }
                return canvas;
            }
            catch (e) {
                this.context.logger.info("Unable to clone video as it is tainted", video);
            }
            var blankCanvas = video.ownerDocument.createElement('canvas');
            blankCanvas.width = video.offsetWidth;
            blankCanvas.height = video.offsetHeight;
            return blankCanvas;
        };
        DocumentCloner.prototype.appendChildNode = function (clone, child, copyStyles) {
            if (!isElementNode(child) ||
                (!isScriptElement(child) &&
                    !child.hasAttribute(IGNORE_ATTRIBUTE) &&
                    (typeof this.options.ignoreElements !== 'function' || !this.options.ignoreElements(child)))) {
                if (!this.options.copyStyles || !isElementNode(child) || !isStyleElement(child)) {
                    clone.appendChild(this.cloneNode(child, copyStyles));
                }
            }
        };
        DocumentCloner.prototype.cloneChildNodes = function (node, clone, copyStyles) {
            var _this = this;
            for (var child = node.shadowRoot ? node.shadowRoot.firstChild : node.firstChild; child; child = child.nextSibling) {
                if (isElementNode(child) && isSlotElement(child) && typeof child.assignedNodes === 'function') {
                    var assignedNodes = child.assignedNodes();
                    if (assignedNodes.length) {
                        assignedNodes.forEach(function (assignedNode) { return _this.appendChildNode(clone, assignedNode, copyStyles); });
                    }
                }
                else {
                    this.appendChildNode(clone, child, copyStyles);
                }
            }
        };
        DocumentCloner.prototype.cloneNode = function (node, copyStyles) {
            if (isTextNode(node)) {
                return document.createTextNode(node.data);
            }
            if (!node.ownerDocument) {
                return node.cloneNode(false);
            }
            var window = node.ownerDocument.defaultView;
            if (window && isElementNode(node) && (isHTMLElementNode(node) || isSVGElementNode(node))) {
                var clone = this.createElementClone(node);
                clone.style.transitionProperty = 'none';
                var style = window.getComputedStyle(node);
                var styleBefore = window.getComputedStyle(node, ':before');
                var styleAfter = window.getComputedStyle(node, ':after');
                if (this.referenceElement === node && isHTMLElementNode(clone)) {
                    this.clonedReferenceElement = clone;
                }
                if (isBodyElement(clone)) {
                    createPseudoHideStyles(clone);
                }
                var counters = this.counters.parse(new CSSParsedCounterDeclaration(this.context, style));
                var before = this.resolvePseudoContent(node, clone, styleBefore, PseudoElementType.BEFORE);
                if (isCustomElement(node)) {
                    copyStyles = true;
                }
                if (!isVideoElement(node)) {
                    this.cloneChildNodes(node, clone, copyStyles);
                }
                if (before) {
                    clone.insertBefore(before, clone.firstChild);
                }
                var after = this.resolvePseudoContent(node, clone, styleAfter, PseudoElementType.AFTER);
                if (after) {
                    clone.appendChild(after);
                }
                this.counters.pop(counters);
                if ((style && (this.options.copyStyles || isSVGElementNode(node)) && !isIFrameElement(node)) ||
                    copyStyles) {
                    copyCSSStyles(style, clone);
                }
                if (node.scrollTop !== 0 || node.scrollLeft !== 0) {
                    this.scrolledElements.push([clone, node.scrollLeft, node.scrollTop]);
                }
                if ((isTextareaElement(node) || isSelectElement(node)) &&
                    (isTextareaElement(clone) || isSelectElement(clone))) {
                    clone.value = node.value;
                }
                return clone;
            }
            return node.cloneNode(false);
        };
        DocumentCloner.prototype.resolvePseudoContent = function (node, clone, style, pseudoElt) {
            var _this = this;
            if (!style) {
                return;
            }
            var value = style.content;
            var document = clone.ownerDocument;
            if (!document || !value || value === 'none' || value === '-moz-alt-content' || style.display === 'none') {
                return;
            }
            this.counters.parse(new CSSParsedCounterDeclaration(this.context, style));
            var declaration = new CSSParsedPseudoDeclaration(this.context, style);
            var anonymousReplacedElement = document.createElement('html2canvaspseudoelement');
            copyCSSStyles(style, anonymousReplacedElement);
            declaration.content.forEach(function (token) {
                if (token.type === 0 /* STRING_TOKEN */) {
                    anonymousReplacedElement.appendChild(document.createTextNode(token.value));
                }
                else if (token.type === 22 /* URL_TOKEN */) {
                    var img = document.createElement('img');
                    img.src = token.value;
                    img.style.opacity = '1';
                    anonymousReplacedElement.appendChild(img);
                }
                else if (token.type === 18 /* FUNCTION */) {
                    if (token.name === 'attr') {
                        var attr = token.values.filter(isIdentToken);
                        if (attr.length) {
                            anonymousReplacedElement.appendChild(document.createTextNode(node.getAttribute(attr[0].value) || ''));
                        }
                    }
                    else if (token.name === 'counter') {
                        var _a = token.values.filter(nonFunctionArgSeparator), counter = _a[0], counterStyle = _a[1];
                        if (counter && isIdentToken(counter)) {
                            var counterState = _this.counters.getCounterValue(counter.value);
                            var counterType = counterStyle && isIdentToken(counterStyle)
                                ? listStyleType.parse(_this.context, counterStyle.value)
                                : 3 /* DECIMAL */;
                            anonymousReplacedElement.appendChild(document.createTextNode(createCounterText(counterState, counterType, false)));
                        }
                    }
                    else if (token.name === 'counters') {
                        var _b = token.values.filter(nonFunctionArgSeparator), counter = _b[0], delim = _b[1], counterStyle = _b[2];
                        if (counter && isIdentToken(counter)) {
                            var counterStates = _this.counters.getCounterValues(counter.value);
                            var counterType_1 = counterStyle && isIdentToken(counterStyle)
                                ? listStyleType.parse(_this.context, counterStyle.value)
                                : 3 /* DECIMAL */;
                            var separator = delim && delim.type === 0 /* STRING_TOKEN */ ? delim.value : '';
                            var text = counterStates
                                .map(function (value) { return createCounterText(value, counterType_1, false); })
                                .join(separator);
                            anonymousReplacedElement.appendChild(document.createTextNode(text));
                        }
                    }
                    else ;
                }
                else if (token.type === 20 /* IDENT_TOKEN */) {
                    switch (token.value) {
                        case 'open-quote':
                            anonymousReplacedElement.appendChild(document.createTextNode(getQuote(declaration.quotes, _this.quoteDepth++, true)));
                            break;
                        case 'close-quote':
                            anonymousReplacedElement.appendChild(document.createTextNode(getQuote(declaration.quotes, --_this.quoteDepth, false)));
                            break;
                        default:
                            // safari doesn't parse string tokens correctly because of lack of quotes
                            anonymousReplacedElement.appendChild(document.createTextNode(token.value));
                    }
                }
            });
            anonymousReplacedElement.className = PSEUDO_HIDE_ELEMENT_CLASS_BEFORE + " " + PSEUDO_HIDE_ELEMENT_CLASS_AFTER;
            var newClassName = pseudoElt === PseudoElementType.BEFORE
                ? " " + PSEUDO_HIDE_ELEMENT_CLASS_BEFORE
                : " " + PSEUDO_HIDE_ELEMENT_CLASS_AFTER;
            if (isSVGElementNode(clone)) {
                clone.className.baseValue += newClassName;
            }
            else {
                clone.className += newClassName;
            }
            return anonymousReplacedElement;
        };
        DocumentCloner.destroy = function (container) {
            if (container.parentNode) {
                container.parentNode.removeChild(container);
                return true;
            }
            return false;
        };
        return DocumentCloner;
    }());
    var PseudoElementType;
    (function (PseudoElementType) {
        PseudoElementType[PseudoElementType["BEFORE"] = 0] = "BEFORE";
        PseudoElementType[PseudoElementType["AFTER"] = 1] = "AFTER";
    })(PseudoElementType || (PseudoElementType = {}));
    var createIFrameContainer = function (ownerDocument, bounds) {
        var cloneIframeContainer = ownerDocument.createElement('iframe');
        cloneIframeContainer.className = 'html2canvas-container';
        cloneIframeContainer.style.visibility = 'hidden';
        cloneIframeContainer.style.position = 'fixed';
        cloneIframeContainer.style.left = '-10000px';
        cloneIframeContainer.style.top = '0px';
        cloneIframeContainer.style.border = '0';
        cloneIframeContainer.width = bounds.width.toString();
        cloneIframeContainer.height = bounds.height.toString();
        cloneIframeContainer.scrolling = 'no'; // ios won't scroll without it
        cloneIframeContainer.setAttribute(IGNORE_ATTRIBUTE, 'true');
        ownerDocument.body.appendChild(cloneIframeContainer);
        return cloneIframeContainer;
    };
    var imageReady = function (img) {
        return new Promise(function (resolve) {
            if (img.complete) {
                resolve();
                return;
            }
            if (!img.src) {
                resolve();
                return;
            }
            img.onload = resolve;
            img.onerror = resolve;
        });
    };
    var imagesReady = function (document) {
        return Promise.all([].slice.call(document.images, 0).map(imageReady));
    };
    var iframeLoader = function (iframe) {
        return new Promise(function (resolve, reject) {
            var cloneWindow = iframe.contentWindow;
            if (!cloneWindow) {
                return reject("No window assigned for iframe");
            }
            var documentClone = cloneWindow.document;
            cloneWindow.onload = iframe.onload = function () {
                cloneWindow.onload = iframe.onload = null;
                var interval = setInterval(function () {
                    if (documentClone.body.childNodes.length > 0 && documentClone.readyState === 'complete') {
                        clearInterval(interval);
                        resolve(iframe);
                    }
                }, 50);
            };
        });
    };
    var ignoredStyleProperties = [
        'all',
        'd',
        'content' // Safari shows pseudoelements if content is set
    ];
    var copyCSSStyles = function (style, target) {
        // Edge does not provide value for cssText
        for (var i = style.length - 1; i >= 0; i--) {
            var property = style.item(i);
            if (ignoredStyleProperties.indexOf(property) === -1) {
                target.style.setProperty(property, style.getPropertyValue(property));
            }
        }
        return target;
    };
    var serializeDoctype = function (doctype) {
        var str = '';
        if (doctype) {
            str += '<!DOCTYPE ';
            if (doctype.name) {
                str += doctype.name;
            }
            if (doctype.internalSubset) {
                str += doctype.internalSubset;
            }
            if (doctype.publicId) {
                str += "\"" + doctype.publicId + "\"";
            }
            if (doctype.systemId) {
                str += "\"" + doctype.systemId + "\"";
            }
            str += '>';
        }
        return str;
    };
    var restoreOwnerScroll = function (ownerDocument, x, y) {
        if (ownerDocument &&
            ownerDocument.defaultView &&
            (x !== ownerDocument.defaultView.pageXOffset || y !== ownerDocument.defaultView.pageYOffset)) {
            ownerDocument.defaultView.scrollTo(x, y);
        }
    };
    var restoreNodeScroll = function (_a) {
        var element = _a[0], x = _a[1], y = _a[2];
        element.scrollLeft = x;
        element.scrollTop = y;
    };
    var PSEUDO_BEFORE = ':before';
    var PSEUDO_AFTER = ':after';
    var PSEUDO_HIDE_ELEMENT_CLASS_BEFORE = '___html2canvas___pseudoelement_before';
    var PSEUDO_HIDE_ELEMENT_CLASS_AFTER = '___html2canvas___pseudoelement_after';
    var PSEUDO_HIDE_ELEMENT_STYLE = "{\n    content: \"\" !important;\n    display: none !important;\n}";
    var createPseudoHideStyles = function (body) {
        createStyles(body, "." + PSEUDO_HIDE_ELEMENT_CLASS_BEFORE + PSEUDO_BEFORE + PSEUDO_HIDE_ELEMENT_STYLE + "\n         ." + PSEUDO_HIDE_ELEMENT_CLASS_AFTER + PSEUDO_AFTER + PSEUDO_HIDE_ELEMENT_STYLE);
    };
    var createStyles = function (body, styles) {
        var document = body.ownerDocument;
        if (document) {
            var style = document.createElement('style');
            style.textContent = styles;
            body.appendChild(style);
        }
    };

    var CacheStorage = /** @class */ (function () {
        function CacheStorage() {
        }
        CacheStorage.getOrigin = function (url) {
            var link = CacheStorage._link;
            if (!link) {
                return 'about:blank';
            }
            link.href = url;
            link.href = link.href; // IE9, LOL! - http://jsfiddle.net/niklasvh/2e48b/
            return link.protocol + link.hostname + link.port;
        };
        CacheStorage.isSameOrigin = function (src) {
            return CacheStorage.getOrigin(src) === CacheStorage._origin;
        };
        CacheStorage.setContext = function (window) {
            CacheStorage._link = window.document.createElement('a');
            CacheStorage._origin = CacheStorage.getOrigin(window.location.href);
        };
        CacheStorage._origin = 'about:blank';
        return CacheStorage;
    }());
    var Cache = /** @class */ (function () {
        function Cache(context, _options) {
            this.context = context;
            this._options = _options;
            // eslint-disable-next-line @typescript-eslint/no-explicit-any
            this._cache = {};
        }
        Cache.prototype.addImage = function (src) {
            var result = Promise.resolve();
            if (this.has(src)) {
                return result;
            }
            if (isBlobImage(src) || isRenderable(src)) {
                (this._cache[src] = this.loadImage(src)).catch(function () {
                    // prevent unhandled rejection
                });
                return result;
            }
            return result;
        };
        // eslint-disable-next-line @typescript-eslint/no-explicit-any
        Cache.prototype.match = function (src) {
            return this._cache[src];
        };
        Cache.prototype.loadImage = function (key) {
            return __awaiter(this, void 0, void 0, function () {
                var isSameOrigin, useCORS, useProxy, src;
                var _this = this;
                return __generator(this, function (_a) {
                    switch (_a.label) {
                        case 0:
                            isSameOrigin = CacheStorage.isSameOrigin(key);
                            useCORS = !isInlineImage(key) && this._options.useCORS === true && FEATURES.SUPPORT_CORS_IMAGES && !isSameOrigin;
                            useProxy = !isInlineImage(key) &&
                                !isSameOrigin &&
                                !isBlobImage(key) &&
                                typeof this._options.proxy === 'string' &&
                                FEATURES.SUPPORT_CORS_XHR &&
                                !useCORS;
                            if (!isSameOrigin &&
                                this._options.allowTaint === false &&
                                !isInlineImage(key) &&
                                !isBlobImage(key) &&
                                !useProxy &&
                                !useCORS) {
                                return [2 /*return*/];
                            }
                            src = key;
                            if (!useProxy) return [3 /*break*/, 2];
                            return [4 /*yield*/, this.proxy(src)];
                        case 1:
                            src = _a.sent();
                            _a.label = 2;
                        case 2:
                            this.context.logger.debug("Added image " + key.substring(0, 256));
                            return [4 /*yield*/, new Promise(function (resolve, reject) {
                                    var img = new Image();
                                    img.onload = function () { return resolve(img); };
                                    img.onerror = reject;
                                    //ios safari 10.3 taints canvas with data urls unless crossOrigin is set to anonymous
                                    if (isInlineBase64Image(src) || useCORS) {
                                        img.crossOrigin = 'anonymous';
                                    }
                                    img.src = src;
                                    if (img.complete === true) {
                                        // Inline XML images may fail to parse, throwing an Error later on
                                        setTimeout(function () { return resolve(img); }, 500);
                                    }
                                    if (_this._options.imageTimeout > 0) {
                                        setTimeout(function () { return reject("Timed out (" + _this._options.imageTimeout + "ms) loading image"); }, _this._options.imageTimeout);
                                    }
                                })];
                        case 3: return [2 /*return*/, _a.sent()];
                    }
                });
            });
        };
        Cache.prototype.has = function (key) {
            return typeof this._cache[key] !== 'undefined';
        };
        Cache.prototype.keys = function () {
            return Promise.resolve(Object.keys(this._cache));
        };
        Cache.prototype.proxy = function (src) {
            var _this = this;
            var proxy = this._options.proxy;
            if (!proxy) {
                throw new Error('No proxy defined');
            }
            var key = src.substring(0, 256);
            return new Promise(function (resolve, reject) {
                var responseType = FEATURES.SUPPORT_RESPONSE_TYPE ? 'blob' : 'text';
                var xhr = new XMLHttpRequest();
                xhr.onload = function () {
                    if (xhr.status === 200) {
                        if (responseType === 'text') {
                            resolve(xhr.response);
                        }
                        else {
                            var reader_1 = new FileReader();
                            reader_1.addEventListener('load', function () { return resolve(reader_1.result); }, false);
                            reader_1.addEventListener('error', function (e) { return reject(e); }, false);
                            reader_1.readAsDataURL(xhr.response);
                        }
                    }
                    else {
                        reject("Failed to proxy resource " + key + " with status code " + xhr.status);
                    }
                };
                xhr.onerror = reject;
                var queryString = proxy.indexOf('?') > -1 ? '&' : '?';
                xhr.open('GET', "" + proxy + queryString + "url=" + encodeURIComponent(src) + "&responseType=" + responseType);
                if (responseType !== 'text' && xhr instanceof XMLHttpRequest) {
                    xhr.responseType = responseType;
                }
                if (_this._options.imageTimeout) {
                    var timeout_1 = _this._options.imageTimeout;
                    xhr.timeout = timeout_1;
                    xhr.ontimeout = function () { return reject("Timed out (" + timeout_1 + "ms) proxying " + key); };
                }
                xhr.send();
            });
        };
        return Cache;
    }());
    var INLINE_SVG = /^data:image\/svg\+xml/i;
    var INLINE_BASE64 = /^data:image\/.*;base64,/i;
    var INLINE_IMG = /^data:image\/.*/i;
    var isRenderable = function (src) { return FEATURES.SUPPORT_SVG_DRAWING || !isSVG(src); };
    var isInlineImage = function (src) { return INLINE_IMG.test(src); };
    var isInlineBase64Image = function (src) { return INLINE_BASE64.test(src); };
    var isBlobImage = function (src) { return src.substr(0, 4) === 'blob'; };
    var isSVG = function (src) { return src.substr(-3).toLowerCase() === 'svg' || INLINE_SVG.test(src); };

    var Vector = /** @class */ (function () {
        function Vector(x, y) {
            this.type = 0 /* VECTOR */;
            this.x = x;
            this.y = y;
        }
        Vector.prototype.add = function (deltaX, deltaY) {
            return new Vector(this.x + deltaX, this.y + deltaY);
        };
        return Vector;
    }());

    var lerp = function (a, b, t) {
        return new Vector(a.x + (b.x - a.x) * t, a.y + (b.y - a.y) * t);
    };
    var BezierCurve = /** @class */ (function () {
        function BezierCurve(start, startControl, endControl, end) {
            this.type = 1 /* BEZIER_CURVE */;
            this.start = start;
            this.startControl = startControl;
            this.endControl = endControl;
            this.end = end;
        }
        BezierCurve.prototype.subdivide = function (t, firstHalf) {
            var ab = lerp(this.start, this.startControl, t);
            var bc = lerp(this.startControl, this.endControl, t);
            var cd = lerp(this.endControl, this.end, t);
            var abbc = lerp(ab, bc, t);
            var bccd = lerp(bc, cd, t);
            var dest = lerp(abbc, bccd, t);
            return firstHalf ? new BezierCurve(this.start, ab, abbc, dest) : new BezierCurve(dest, bccd, cd, this.end);
        };
        BezierCurve.prototype.add = function (deltaX, deltaY) {
            return new BezierCurve(this.start.add(deltaX, deltaY), this.startControl.add(deltaX, deltaY), this.endControl.add(deltaX, deltaY), this.end.add(deltaX, deltaY));
        };
        BezierCurve.prototype.reverse = function () {
            return new BezierCurve(this.end, this.endControl, this.startControl, this.start);
        };
        return BezierCurve;
    }());
    var isBezierCurve = function (path) { return path.type === 1 /* BEZIER_CURVE */; };

    var BoundCurves = /** @class */ (function () {
        function BoundCurves(element) {
            var styles = element.styles;
            var bounds = element.bounds;
            var _a = getAbsoluteValueForTuple(styles.borderTopLeftRadius, bounds.width, bounds.height), tlh = _a[0], tlv = _a[1];
            var _b = getAbsoluteValueForTuple(styles.borderTopRightRadius, bounds.width, bounds.height), trh = _b[0], trv = _b[1];
            var _c = getAbsoluteValueForTuple(styles.borderBottomRightRadius, bounds.width, bounds.height), brh = _c[0], brv = _c[1];
            var _d = getAbsoluteValueForTuple(styles.borderBottomLeftRadius, bounds.width, bounds.height), blh = _d[0], blv = _d[1];
            var factors = [];
            factors.push((tlh + trh) / bounds.width);
            factors.push((blh + brh) / bounds.width);
            factors.push((tlv + blv) / bounds.height);
            factors.push((trv + brv) / bounds.height);
            var maxFactor = Math.max.apply(Math, factors);
            if (maxFactor > 1) {
                tlh /= maxFactor;
                tlv /= maxFactor;
                trh /= maxFactor;
                trv /= maxFactor;
                brh /= maxFactor;
                brv /= maxFactor;
                blh /= maxFactor;
                blv /= maxFactor;
            }
            var topWidth = bounds.width - trh;
            var rightHeight = bounds.height - brv;
            var bottomWidth = bounds.width - brh;
            var leftHeight = bounds.height - blv;
            var borderTopWidth = styles.borderTopWidth;
            var borderRightWidth = styles.borderRightWidth;
            var borderBottomWidth = styles.borderBottomWidth;
            var borderLeftWidth = styles.borderLeftWidth;
            var paddingTop = getAbsoluteValue(styles.paddingTop, element.bounds.width);
            var paddingRight = getAbsoluteValue(styles.paddingRight, element.bounds.width);
            var paddingBottom = getAbsoluteValue(styles.paddingBottom, element.bounds.width);
            var paddingLeft = getAbsoluteValue(styles.paddingLeft, element.bounds.width);
            this.topLeftBorderDoubleOuterBox =
                tlh > 0 || tlv > 0
                    ? getCurvePoints(bounds.left + borderLeftWidth / 3, bounds.top + borderTopWidth / 3, tlh - borderLeftWidth / 3, tlv - borderTopWidth / 3, CORNER.TOP_LEFT)
                    : new Vector(bounds.left + borderLeftWidth / 3, bounds.top + borderTopWidth / 3);
            this.topRightBorderDoubleOuterBox =
                tlh > 0 || tlv > 0
                    ? getCurvePoints(bounds.left + topWidth, bounds.top + borderTopWidth / 3, trh - borderRightWidth / 3, trv - borderTopWidth / 3, CORNER.TOP_RIGHT)
                    : new Vector(bounds.left + bounds.width - borderRightWidth / 3, bounds.top + borderTopWidth / 3);
            this.bottomRightBorderDoubleOuterBox =
                brh > 0 || brv > 0
                    ? getCurvePoints(bounds.left + bottomWidth, bounds.top + rightHeight, brh - borderRightWidth / 3, brv - borderBottomWidth / 3, CORNER.BOTTOM_RIGHT)
                    : new Vector(bounds.left + bounds.width - borderRightWidth / 3, bounds.top + bounds.height - borderBottomWidth / 3);
            this.bottomLeftBorderDoubleOuterBox =
                blh > 0 || blv > 0
                    ? getCurvePoints(bounds.left + borderLeftWidth / 3, bounds.top + leftHeight, blh - borderLeftWidth / 3, blv - borderBottomWidth / 3, CORNER.BOTTOM_LEFT)
                    : new Vector(bounds.left + borderLeftWidth / 3, bounds.top + bounds.height - borderBottomWidth / 3);
            this.topLeftBorderDoubleInnerBox =
                tlh > 0 || tlv > 0
                    ? getCurvePoints(bounds.left + (borderLeftWidth * 2) / 3, bounds.top + (borderTopWidth * 2) / 3, tlh - (borderLeftWidth * 2) / 3, tlv - (borderTopWidth * 2) / 3, CORNER.TOP_LEFT)
                    : new Vector(bounds.left + (borderLeftWidth * 2) / 3, bounds.top + (borderTopWidth * 2) / 3);
            this.topRightBorderDoubleInnerBox =
                tlh > 0 || tlv > 0
                    ? getCurvePoints(bounds.left + topWidth, bounds.top + (borderTopWidth * 2) / 3, trh - (borderRightWidth * 2) / 3, trv - (borderTopWidth * 2) / 3, CORNER.TOP_RIGHT)
                    : new Vector(bounds.left + bounds.width - (borderRightWidth * 2) / 3, bounds.top + (borderTopWidth * 2) / 3);
            this.bottomRightBorderDoubleInnerBox =
                brh > 0 || brv > 0
                    ? getCurvePoints(bounds.left + bottomWidth, bounds.top + rightHeight, brh - (borderRightWidth * 2) / 3, brv - (borderBottomWidth * 2) / 3, CORNER.BOTTOM_RIGHT)
                    : new Vector(bounds.left + bounds.width - (borderRightWidth * 2) / 3, bounds.top + bounds.height - (borderBottomWidth * 2) / 3);
            this.bottomLeftBorderDoubleInnerBox =
                blh > 0 || blv > 0
                    ? getCurvePoints(bounds.left + (borderLeftWidth * 2) / 3, bounds.top + leftHeight, blh - (borderLeftWidth * 2) / 3, blv - (borderBottomWidth * 2) / 3, CORNER.BOTTOM_LEFT)
                    : new Vector(bounds.left + (borderLeftWidth * 2) / 3, bounds.top + bounds.height - (borderBottomWidth * 2) / 3);
            this.topLeftBorderStroke =
                tlh > 0 || tlv > 0
                    ? getCurvePoints(bounds.left + borderLeftWidth / 2, bounds.top + borderTopWidth / 2, tlh - borderLeftWidth / 2, tlv - borderTopWidth / 2, CORNER.TOP_LEFT)
                    : new Vector(bounds.left + borderLeftWidth / 2, bounds.top + borderTopWidth / 2);
            this.topRightBorderStroke =
                tlh > 0 || tlv > 0
                    ? getCurvePoints(bounds.left + topWidth, bounds.top + borderTopWidth / 2, trh - borderRightWidth / 2, trv - borderTopWidth / 2, CORNER.TOP_RIGHT)
                    : new Vector(bounds.left + bounds.width - borderRightWidth / 2, bounds.top + borderTopWidth / 2);
            this.bottomRightBorderStroke =
                brh > 0 || brv > 0
                    ? getCurvePoints(bounds.left + bottomWidth, bounds.top + rightHeight, brh - borderRightWidth / 2, brv - borderBottomWidth / 2, CORNER.BOTTOM_RIGHT)
                    : new Vector(bounds.left + bounds.width - borderRightWidth / 2, bounds.top + bounds.height - borderBottomWidth / 2);
            this.bottomLeftBorderStroke =
                blh > 0 || blv > 0
                    ? getCurvePoints(bounds.left + borderLeftWidth / 2, bounds.top + leftHeight, blh - borderLeftWidth / 2, blv - borderBottomWidth / 2, CORNER.BOTTOM_LEFT)
                    : new Vector(bounds.left + borderLeftWidth / 2, bounds.top + bounds.height - borderBottomWidth / 2);
            this.topLeftBorderBox =
                tlh > 0 || tlv > 0
                    ? getCurvePoints(bounds.left, bounds.top, tlh, tlv, CORNER.TOP_LEFT)
                    : new Vector(bounds.left, bounds.top);
            this.topRightBorderBox =
                trh > 0 || trv > 0
                    ? getCurvePoints(bounds.left + topWidth, bounds.top, trh, trv, CORNER.TOP_RIGHT)
                    : new Vector(bounds.left + bounds.width, bounds.top);
            this.bottomRightBorderBox =
                brh > 0 || brv > 0
                    ? getCurvePoints(bounds.left + bottomWidth, bounds.top + rightHeight, brh, brv, CORNER.BOTTOM_RIGHT)
                    : new Vector(bounds.left + bounds.width, bounds.top + bounds.height);
            this.bottomLeftBorderBox =
                blh > 0 || blv > 0
                    ? getCurvePoints(bounds.left, bounds.top + leftHeight, blh, blv, CORNER.BOTTOM_LEFT)
                    : new Vector(bounds.left, bounds.top + bounds.height);
            this.topLeftPaddingBox =
                tlh > 0 || tlv > 0
                    ? getCurvePoints(bounds.left + borderLeftWidth, bounds.top + borderTopWidth, Math.max(0, tlh - borderLeftWidth), Math.max(0, tlv - borderTopWidth), CORNER.TOP_LEFT)
                    : new Vector(bounds.left + borderLeftWidth, bounds.top + borderTopWidth);
            this.topRightPaddingBox =
                trh > 0 || trv > 0
                    ? getCurvePoints(bounds.left + Math.min(topWidth, bounds.width - borderRightWidth), bounds.top + borderTopWidth, topWidth > bounds.width + borderRightWidth ? 0 : Math.max(0, trh - borderRightWidth), Math.max(0, trv - borderTopWidth), CORNER.TOP_RIGHT)
                    : new Vector(bounds.left + bounds.width - borderRightWidth, bounds.top + borderTopWidth);
            this.bottomRightPaddingBox =
                brh > 0 || brv > 0
                    ? getCurvePoints(bounds.left + Math.min(bottomWidth, bounds.width - borderLeftWidth), bounds.top + Math.min(rightHeight, bounds.height - borderBottomWidth), Math.max(0, brh - borderRightWidth), Math.max(0, brv - borderBottomWidth), CORNER.BOTTOM_RIGHT)
                    : new Vector(bounds.left + bounds.width - borderRightWidth, bounds.top + bounds.height - borderBottomWidth);
            this.bottomLeftPaddingBox =
                blh > 0 || blv > 0
                    ? getCurvePoints(bounds.left + borderLeftWidth, bounds.top + Math.min(leftHeight, bounds.height - borderBottomWidth), Math.max(0, blh - borderLeftWidth), Math.max(0, blv - borderBottomWidth), CORNER.BOTTOM_LEFT)
                    : new Vector(bounds.left + borderLeftWidth, bounds.top + bounds.height - borderBottomWidth);
            this.topLeftContentBox =
                tlh > 0 || tlv > 0
                    ? getCurvePoints(bounds.left + borderLeftWidth + paddingLeft, bounds.top + borderTopWidth + paddingTop, Math.max(0, tlh - (borderLeftWidth + paddingLeft)), Math.max(0, tlv - (borderTopWidth + paddingTop)), CORNER.TOP_LEFT)
                    : new Vector(bounds.left + borderLeftWidth + paddingLeft, bounds.top + borderTopWidth + paddingTop);
            this.topRightContentBox =
                trh > 0 || trv > 0
                    ? getCurvePoints(bounds.left + Math.min(topWidth, bounds.width + borderLeftWidth + paddingLeft), bounds.top + borderTopWidth + paddingTop, topWidth > bounds.width + borderLeftWidth + paddingLeft ? 0 : trh - borderLeftWidth + paddingLeft, trv - (borderTopWidth + paddingTop), CORNER.TOP_RIGHT)
                    : new Vector(bounds.left + bounds.width - (borderRightWidth + paddingRight), bounds.top + borderTopWidth + paddingTop);
            this.bottomRightContentBox =
                brh > 0 || brv > 0
                    ? getCurvePoints(bounds.left + Math.min(bottomWidth, bounds.width - (borderLeftWidth + paddingLeft)), bounds.top + Math.min(rightHeight, bounds.height + borderTopWidth + paddingTop), Math.max(0, brh - (borderRightWidth + paddingRight)), brv - (borderBottomWidth + paddingBottom), CORNER.BOTTOM_RIGHT)
                    : new Vector(bounds.left + bounds.width - (borderRightWidth + paddingRight), bounds.top + bounds.height - (borderBottomWidth + paddingBottom));
            this.bottomLeftContentBox =
                blh > 0 || blv > 0
                    ? getCurvePoints(bounds.left + borderLeftWidth + paddingLeft, bounds.top + leftHeight, Math.max(0, blh - (borderLeftWidth + paddingLeft)), blv - (borderBottomWidth + paddingBottom), CORNER.BOTTOM_LEFT)
                    : new Vector(bounds.left + borderLeftWidth + paddingLeft, bounds.top + bounds.height - (borderBottomWidth + paddingBottom));
        }
        return BoundCurves;
    }());
    var CORNER;
    (function (CORNER) {
        CORNER[CORNER["TOP_LEFT"] = 0] = "TOP_LEFT";
        CORNER[CORNER["TOP_RIGHT"] = 1] = "TOP_RIGHT";
        CORNER[CORNER["BOTTOM_RIGHT"] = 2] = "BOTTOM_RIGHT";
        CORNER[CORNER["BOTTOM_LEFT"] = 3] = "BOTTOM_LEFT";
    })(CORNER || (CORNER = {}));
    var getCurvePoints = function (x, y, r1, r2, position) {
        var kappa = 4 * ((Math.sqrt(2) - 1) / 3);
        var ox = r1 * kappa; // control point offset horizontal
        var oy = r2 * kappa; // control point offset vertical
        var xm = x + r1; // x-middle
        var ym = y + r2; // y-middle
        switch (position) {
            case CORNER.TOP_LEFT:
                return new BezierCurve(new Vector(x, ym), new Vector(x, ym - oy), new Vector(xm - ox, y), new Vector(xm, y));
            case CORNER.TOP_RIGHT:
                return new BezierCurve(new Vector(x, y), new Vector(x + ox, y), new Vector(xm, ym - oy), new Vector(xm, ym));
            case CORNER.BOTTOM_RIGHT:
                return new BezierCurve(new Vector(xm, y), new Vector(xm, y + oy), new Vector(x + ox, ym), new Vector(x, ym));
            case CORNER.BOTTOM_LEFT:
            default:
                return new BezierCurve(new Vector(xm, ym), new Vector(xm - ox, ym), new Vector(x, y + oy), new Vector(x, y));
        }
    };
    var calculateBorderBoxPath = function (curves) {
        return [curves.topLeftBorderBox, curves.topRightBorderBox, curves.bottomRightBorderBox, curves.bottomLeftBorderBox];
    };
    var calculateContentBoxPath = function (curves) {
        return [
            curves.topLeftContentBox,
            curves.topRightContentBox,
            curves.bottomRightContentBox,
            curves.bottomLeftContentBox
        ];
    };
    var calculatePaddingBoxPath = function (curves) {
        return [
            curves.topLeftPaddingBox,
            curves.topRightPaddingBox,
            curves.bottomRightPaddingBox,
            curves.bottomLeftPaddingBox
        ];
    };

    var TransformEffect = /** @class */ (function () {
        function TransformEffect(offsetX, offsetY, matrix) {
            this.offsetX = offsetX;
            this.offsetY = offsetY;
            this.matrix = matrix;
            this.type = 0 /* TRANSFORM */;
            this.target = 2 /* BACKGROUND_BORDERS */ | 4 /* CONTENT */;
        }
        return TransformEffect;
    }());
    var ClipEffect = /** @class */ (function () {
        function ClipEffect(path, target) {
            this.path = path;
            this.target = target;
            this.type = 1 /* CLIP */;
        }
        return ClipEffect;
    }());
    var OpacityEffect = /** @class */ (function () {
        function OpacityEffect(opacity) {
            this.opacity = opacity;
            this.type = 2 /* OPACITY */;
            this.target = 2 /* BACKGROUND_BORDERS */ | 4 /* CONTENT */;
        }
        return OpacityEffect;
    }());
    var isTransformEffect = function (effect) {
        return effect.type === 0 /* TRANSFORM */;
    };
    var isClipEffect = function (effect) { return effect.type === 1 /* CLIP */; };
    var isOpacityEffect = function (effect) { return effect.type === 2 /* OPACITY */; };

    var equalPath = function (a, b) {
        if (a.length === b.length) {
            return a.some(function (v, i) { return v === b[i]; });
        }
        return false;
    };
    var transformPath = function (path, deltaX, deltaY, deltaW, deltaH) {
        return path.map(function (point, index) {
            switch (index) {
                case 0:
                    return point.add(deltaX, deltaY);
                case 1:
                    return point.add(deltaX + deltaW, deltaY);
                case 2:
                    return point.add(deltaX + deltaW, deltaY + deltaH);
                case 3:
                    return point.add(deltaX, deltaY + deltaH);
            }
            return point;
        });
    };

    var StackingContext = /** @class */ (function () {
        function StackingContext(container) {
            this.element = container;
            this.inlineLevel = [];
            this.nonInlineLevel = [];
            this.negativeZIndex = [];
            this.zeroOrAutoZIndexOrTransformedOrOpacity = [];
            this.positiveZIndex = [];
            this.nonPositionedFloats = [];
            this.nonPositionedInlineLevel = [];
        }
        return StackingContext;
    }());
    var ElementPaint = /** @class */ (function () {
        function ElementPaint(container, parent) {
            this.container = container;
            this.parent = parent;
            this.effects = [];
            this.curves = new BoundCurves(this.container);
            if (this.container.styles.opacity < 1) {
                this.effects.push(new OpacityEffect(this.container.styles.opacity));
            }
            if (this.container.styles.transform !== null) {
                var offsetX = this.container.bounds.left + this.container.styles.transformOrigin[0].number;
                var offsetY = this.container.bounds.top + this.container.styles.transformOrigin[1].number;
                var matrix = this.container.styles.transform;
                this.effects.push(new TransformEffect(offsetX, offsetY, matrix));
            }
            if (this.container.styles.overflowX !== 0 /* VISIBLE */) {
                var borderBox = calculateBorderBoxPath(this.curves);
                var paddingBox = calculatePaddingBoxPath(this.curves);
                if (equalPath(borderBox, paddingBox)) {
                    this.effects.push(new ClipEffect(borderBox, 2 /* BACKGROUND_BORDERS */ | 4 /* CONTENT */));
                }
                else {
                    this.effects.push(new ClipEffect(borderBox, 2 /* BACKGROUND_BORDERS */));
                    this.effects.push(new ClipEffect(paddingBox, 4 /* CONTENT */));
                }
            }
        }
        ElementPaint.prototype.getEffects = function (target) {
            var inFlow = [2 /* ABSOLUTE */, 3 /* FIXED */].indexOf(this.container.styles.position) === -1;
            var parent = this.parent;
            var effects = this.effects.slice(0);
            while (parent) {
                var croplessEffects = parent.effects.filter(function (effect) { return !isClipEffect(effect); });
                if (inFlow || parent.container.styles.position !== 0 /* STATIC */ || !parent.parent) {
                    effects.unshift.apply(effects, croplessEffects);
                    inFlow = [2 /* ABSOLUTE */, 3 /* FIXED */].indexOf(parent.container.styles.position) === -1;
                    if (parent.container.styles.overflowX !== 0 /* VISIBLE */) {
                        var borderBox = calculateBorderBoxPath(parent.curves);
                        var paddingBox = calculatePaddingBoxPath(parent.curves);
                        if (!equalPath(borderBox, paddingBox)) {
                            effects.unshift(new ClipEffect(paddingBox, 2 /* BACKGROUND_BORDERS */ | 4 /* CONTENT */));
                        }
                    }
                }
                else {
                    effects.unshift.apply(effects, croplessEffects);
                }
                parent = parent.parent;
            }
            return effects.filter(function (effect) { return contains(effect.target, target); });
        };
        return ElementPaint;
    }());
    var parseStackTree = function (parent, stackingContext, realStackingContext, listItems) {
        parent.container.elements.forEach(function (child) {
            var treatAsRealStackingContext = contains(child.flags, 4 /* CREATES_REAL_STACKING_CONTEXT */);
            var createsStackingContext = contains(child.flags, 2 /* CREATES_STACKING_CONTEXT */);
            var paintContainer = new ElementPaint(child, parent);
            if (contains(child.styles.display, 2048 /* LIST_ITEM */)) {
                listItems.push(paintContainer);
            }
            var listOwnerItems = contains(child.flags, 8 /* IS_LIST_OWNER */) ? [] : listItems;
            if (treatAsRealStackingContext || createsStackingContext) {
                var parentStack = treatAsRealStackingContext || child.styles.isPositioned() ? realStackingContext : stackingContext;
                var stack = new StackingContext(paintContainer);
                if (child.styles.isPositioned() || child.styles.opacity < 1 || child.styles.isTransformed()) {
                    var order_1 = child.styles.zIndex.order;
                    if (order_1 < 0) {
                        var index_1 = 0;
                        parentStack.negativeZIndex.some(function (current, i) {
                            if (order_1 > current.element.container.styles.zIndex.order) {
                                index_1 = i;
                                return false;
                            }
                            else if (index_1 > 0) {
                                return true;
                            }
                            return false;
                        });
                        parentStack.negativeZIndex.splice(index_1, 0, stack);
                    }
                    else if (order_1 > 0) {
                        var index_2 = 0;
                        parentStack.positiveZIndex.some(function (current, i) {
                            if (order_1 >= current.element.container.styles.zIndex.order) {
                                index_2 = i + 1;
                                return false;
                            }
                            else if (index_2 > 0) {
                                return true;
                            }
                            return false;
                        });
                        parentStack.positiveZIndex.splice(index_2, 0, stack);
                    }
                    else {
                        parentStack.zeroOrAutoZIndexOrTransformedOrOpacity.push(stack);
                    }
                }
                else {
                    if (child.styles.isFloating()) {
                        parentStack.nonPositionedFloats.push(stack);
                    }
                    else {
                        parentStack.nonPositionedInlineLevel.push(stack);
                    }
                }
                parseStackTree(paintContainer, stack, treatAsRealStackingContext ? stack : realStackingContext, listOwnerItems);
            }
            else {
                if (child.styles.isInlineLevel()) {
                    stackingContext.inlineLevel.push(paintContainer);
                }
                else {
                    stackingContext.nonInlineLevel.push(paintContainer);
                }
                parseStackTree(paintContainer, stackingContext, realStackingContext, listOwnerItems);
            }
            if (contains(child.flags, 8 /* IS_LIST_OWNER */)) {
                processListItems(child, listOwnerItems);
            }
        });
    };
    var processListItems = function (owner, elements) {
        var numbering = owner instanceof OLElementContainer ? owner.start : 1;
        var reversed = owner instanceof OLElementContainer ? owner.reversed : false;
        for (var i = 0; i < elements.length; i++) {
            var item = elements[i];
            if (item.container instanceof LIElementContainer &&
                typeof item.container.value === 'number' &&
                item.container.value !== 0) {
                numbering = item.container.value;
            }
            item.listValue = createCounterText(numbering, item.container.styles.listStyleType, true);
            numbering += reversed ? -1 : 1;
        }
    };
    var parseStackingContexts = function (container) {
        var paintContainer = new ElementPaint(container, null);
        var root = new StackingContext(paintContainer);
        var listItems = [];
        parseStackTree(paintContainer, root, root, listItems);
        processListItems(paintContainer.container, listItems);
        return root;
    };

    var parsePathForBorder = function (curves, borderSide) {
        switch (borderSide) {
            case 0:
                return createPathFromCurves(curves.topLeftBorderBox, curves.topLeftPaddingBox, curves.topRightBorderBox, curves.topRightPaddingBox);
            case 1:
                return createPathFromCurves(curves.topRightBorderBox, curves.topRightPaddingBox, curves.bottomRightBorderBox, curves.bottomRightPaddingBox);
            case 2:
                return createPathFromCurves(curves.bottomRightBorderBox, curves.bottomRightPaddingBox, curves.bottomLeftBorderBox, curves.bottomLeftPaddingBox);
            case 3:
            default:
                return createPathFromCurves(curves.bottomLeftBorderBox, curves.bottomLeftPaddingBox, curves.topLeftBorderBox, curves.topLeftPaddingBox);
        }
    };
    var parsePathForBorderDoubleOuter = function (curves, borderSide) {
        switch (borderSide) {
            case 0:
                return createPathFromCurves(curves.topLeftBorderBox, curves.topLeftBorderDoubleOuterBox, curves.topRightBorderBox, curves.topRightBorderDoubleOuterBox);
            case 1:
                return createPathFromCurves(curves.topRightBorderBox, curves.topRightBorderDoubleOuterBox, curves.bottomRightBorderBox, curves.bottomRightBorderDoubleOuterBox);
            case 2:
                return createPathFromCurves(curves.bottomRightBorderBox, curves.bottomRightBorderDoubleOuterBox, curves.bottomLeftBorderBox, curves.bottomLeftBorderDoubleOuterBox);
            case 3:
            default:
                return createPathFromCurves(curves.bottomLeftBorderBox, curves.bottomLeftBorderDoubleOuterBox, curves.topLeftBorderBox, curves.topLeftBorderDoubleOuterBox);
        }
    };
    var parsePathForBorderDoubleInner = function (curves, borderSide) {
        switch (borderSide) {
            case 0:
                return createPathFromCurves(curves.topLeftBorderDoubleInnerBox, curves.topLeftPaddingBox, curves.topRightBorderDoubleInnerBox, curves.topRightPaddingBox);
            case 1:
                return createPathFromCurves(curves.topRightBorderDoubleInnerBox, curves.topRightPaddingBox, curves.bottomRightBorderDoubleInnerBox, curves.bottomRightPaddingBox);
            case 2:
                return createPathFromCurves(curves.bottomRightBorderDoubleInnerBox, curves.bottomRightPaddingBox, curves.bottomLeftBorderDoubleInnerBox, curves.bottomLeftPaddingBox);
            case 3:
            default:
                return createPathFromCurves(curves.bottomLeftBorderDoubleInnerBox, curves.bottomLeftPaddingBox, curves.topLeftBorderDoubleInnerBox, curves.topLeftPaddingBox);
        }
    };
    var parsePathForBorderStroke = function (curves, borderSide) {
        switch (borderSide) {
            case 0:
                return createStrokePathFromCurves(curves.topLeftBorderStroke, curves.topRightBorderStroke);
            case 1:
                return createStrokePathFromCurves(curves.topRightBorderStroke, curves.bottomRightBorderStroke);
            case 2:
                return createStrokePathFromCurves(curves.bottomRightBorderStroke, curves.bottomLeftBorderStroke);
            case 3:
            default:
                return createStrokePathFromCurves(curves.bottomLeftBorderStroke, curves.topLeftBorderStroke);
        }
    };
    var createStrokePathFromCurves = function (outer1, outer2) {
        var path = [];
        if (isBezierCurve(outer1)) {
            path.push(outer1.subdivide(0.5, false));
        }
        else {
            path.push(outer1);
        }
        if (isBezierCurve(outer2)) {
            path.push(outer2.subdivide(0.5, true));
        }
        else {
            path.push(outer2);
        }
        return path;
    };
    var createPathFromCurves = function (outer1, inner1, outer2, inner2) {
        var path = [];
        if (isBezierCurve(outer1)) {
            path.push(outer1.subdivide(0.5, false));
        }
        else {
            path.push(outer1);
        }
        if (isBezierCurve(outer2)) {
            path.push(outer2.subdivide(0.5, true));
        }
        else {
            path.push(outer2);
        }
        if (isBezierCurve(inner2)) {
            path.push(inner2.subdivide(0.5, true).reverse());
        }
        else {
            path.push(inner2);
        }
        if (isBezierCurve(inner1)) {
            path.push(inner1.subdivide(0.5, false).reverse());
        }
        else {
            path.push(inner1);
        }
        return path;
    };

    var paddingBox = function (element) {
        var bounds = element.bounds;
        var styles = element.styles;
        return bounds.add(styles.borderLeftWidth, styles.borderTopWidth, -(styles.borderRightWidth + styles.borderLeftWidth), -(styles.borderTopWidth + styles.borderBottomWidth));
    };
    var contentBox = function (element) {
        var styles = element.styles;
        var bounds = element.bounds;
        var paddingLeft = getAbsoluteValue(styles.paddingLeft, bounds.width);
        var paddingRight = getAbsoluteValue(styles.paddingRight, bounds.width);
        var paddingTop = getAbsoluteValue(styles.paddingTop, bounds.width);
        var paddingBottom = getAbsoluteValue(styles.paddingBottom, bounds.width);
        return bounds.add(paddingLeft + styles.borderLeftWidth, paddingTop + styles.borderTopWidth, -(styles.borderRightWidth + styles.borderLeftWidth + paddingLeft + paddingRight), -(styles.borderTopWidth + styles.borderBottomWidth + paddingTop + paddingBottom));
    };

    var calculateBackgroundPositioningArea = function (backgroundOrigin, element) {
        if (backgroundOrigin === 0 /* BORDER_BOX */) {
            return element.bounds;
        }
        if (backgroundOrigin === 2 /* CONTENT_BOX */) {
            return contentBox(element);
        }
        return paddingBox(element);
    };
    var calculateBackgroundPaintingArea = function (backgroundClip, element) {
        if (backgroundClip === 0 /* BORDER_BOX */) {
            return element.bounds;
        }
        if (backgroundClip === 2 /* CONTENT_BOX */) {
            return contentBox(element);
        }
        return paddingBox(element);
    };
    var calculateBackgroundRendering = function (container, index, intrinsicSize) {
        var backgroundPositioningArea = calculateBackgroundPositioningArea(getBackgroundValueForIndex(container.styles.backgroundOrigin, index), container);
        var backgroundPaintingArea = calculateBackgroundPaintingArea(getBackgroundValueForIndex(container.styles.backgroundClip, index), container);
        var backgroundImageSize = calculateBackgroundSize(getBackgroundValueForIndex(container.styles.backgroundSize, index), intrinsicSize, backgroundPositioningArea);
        var sizeWidth = backgroundImageSize[0], sizeHeight = backgroundImageSize[1];
        var position = getAbsoluteValueForTuple(getBackgroundValueForIndex(container.styles.backgroundPosition, index), backgroundPositioningArea.width - sizeWidth, backgroundPositioningArea.height - sizeHeight);
        var path = calculateBackgroundRepeatPath(getBackgroundValueForIndex(container.styles.backgroundRepeat, index), position, backgroundImageSize, backgroundPositioningArea, backgroundPaintingArea);
        var offsetX = Math.round(backgroundPositioningArea.left + position[0]);
        var offsetY = Math.round(backgroundPositioningArea.top + position[1]);
        return [path, offsetX, offsetY, sizeWidth, sizeHeight];
    };
    var isAuto = function (token) { return isIdentToken(token) && token.value === BACKGROUND_SIZE.AUTO; };
    var hasIntrinsicValue = function (value) { return typeof value === 'number'; };
    var calculateBackgroundSize = function (size, _a, bounds) {
        var intrinsicWidth = _a[0], intrinsicHeight = _a[1], intrinsicProportion = _a[2];
        var first = size[0], second = size[1];
        if (!first) {
            return [0, 0];
        }
        if (isLengthPercentage(first) && second && isLengthPercentage(second)) {
            return [getAbsoluteValue(first, bounds.width), getAbsoluteValue(second, bounds.height)];
        }
        var hasIntrinsicProportion = hasIntrinsicValue(intrinsicProportion);
        if (isIdentToken(first) && (first.value === BACKGROUND_SIZE.CONTAIN || first.value === BACKGROUND_SIZE.COVER)) {
            if (hasIntrinsicValue(intrinsicProportion)) {
                var targetRatio = bounds.width / bounds.height;
                return targetRatio < intrinsicProportion !== (first.value === BACKGROUND_SIZE.COVER)
                    ? [bounds.width, bounds.width / intrinsicProportion]
                    : [bounds.height * intrinsicProportion, bounds.height];
            }
            return [bounds.width, bounds.height];
        }
        var hasIntrinsicWidth = hasIntrinsicValue(intrinsicWidth);
        var hasIntrinsicHeight = hasIntrinsicValue(intrinsicHeight);
        var hasIntrinsicDimensions = hasIntrinsicWidth || hasIntrinsicHeight;
        // If the background-size is auto or auto auto:
        if (isAuto(first) && (!second || isAuto(second))) {
            // If the image has both horizontal and vertical intrinsic dimensions, it's rendered at that size.
            if (hasIntrinsicWidth && hasIntrinsicHeight) {
                return [intrinsicWidth, intrinsicHeight];
            }
            // If the image has no intrinsic dimensions and has no intrinsic proportions,
            // it's rendered at the size of the background positioning area.
            if (!hasIntrinsicProportion && !hasIntrinsicDimensions) {
                return [bounds.width, bounds.height];
            }
            // TODO If the image has no intrinsic dimensions but has intrinsic proportions, it's rendered as if contain had been specified instead.
            // If the image has only one intrinsic dimension and has intrinsic proportions, it's rendered at the size corresponding to that one dimension.
            // The other dimension is computed using the specified dimension and the intrinsic proportions.
            if (hasIntrinsicDimensions && hasIntrinsicProportion) {
                var width_1 = hasIntrinsicWidth
                    ? intrinsicWidth
                    : intrinsicHeight * intrinsicProportion;
                var height_1 = hasIntrinsicHeight
                    ? intrinsicHeight
                    : intrinsicWidth / intrinsicProportion;
                return [width_1, height_1];
            }
            // If the image has only one intrinsic dimension but has no intrinsic proportions,
            // it's rendered using the specified dimension and the other dimension of the background positioning area.
            var width_2 = hasIntrinsicWidth ? intrinsicWidth : bounds.width;
            var height_2 = hasIntrinsicHeight ? intrinsicHeight : bounds.height;
            return [width_2, height_2];
        }
        // If the image has intrinsic proportions, it's stretched to the specified dimension.
        // The unspecified dimension is computed using the specified dimension and the intrinsic proportions.
        if (hasIntrinsicProportion) {
            var width_3 = 0;
            var height_3 = 0;
            if (isLengthPercentage(first)) {
                width_3 = getAbsoluteValue(first, bounds.width);
            }
            else if (isLengthPercentage(second)) {
                height_3 = getAbsoluteValue(second, bounds.height);
            }
            if (isAuto(first)) {
                width_3 = height_3 * intrinsicProportion;
            }
            else if (!second || isAuto(second)) {
                height_3 = width_3 / intrinsicProportion;
            }
            return [width_3, height_3];
        }
        // If the image has no intrinsic proportions, it's stretched to the specified dimension.
        // The unspecified dimension is computed using the image's corresponding intrinsic dimension,
        // if there is one. If there is no such intrinsic dimension,
        // it becomes the corresponding dimension of the background positioning area.
        var width = null;
        var height = null;
        if (isLengthPercentage(first)) {
            width = getAbsoluteValue(first, bounds.width);
        }
        else if (second && isLengthPercentage(second)) {
            height = getAbsoluteValue(second, bounds.height);
        }
        if (width !== null && (!second || isAuto(second))) {
            height =
                hasIntrinsicWidth && hasIntrinsicHeight
                    ? (width / intrinsicWidth) * intrinsicHeight
                    : bounds.height;
        }
        if (height !== null && isAuto(first)) {
            width =
                hasIntrinsicWidth && hasIntrinsicHeight
                    ? (height / intrinsicHeight) * intrinsicWidth
                    : bounds.width;
        }
        if (width !== null && height !== null) {
            return [width, height];
        }
        throw new Error("Unable to calculate background-size for element");
    };
    var getBackgroundValueForIndex = function (values, index) {
        var value = values[index];
        if (typeof value === 'undefined') {
            return values[0];
        }
        return value;
    };
    var calculateBackgroundRepeatPath = function (repeat, _a, _b, backgroundPositioningArea, backgroundPaintingArea) {
        var x = _a[0], y = _a[1];
        var width = _b[0], height = _b[1];
        switch (repeat) {
            case 2 /* REPEAT_X */:
                return [
                    new Vector(Math.round(backgroundPositioningArea.left), Math.round(backgroundPositioningArea.top + y)),
                    new Vector(Math.round(backgroundPositioningArea.left + backgroundPositioningArea.width), Math.round(backgroundPositioningArea.top + y)),
                    new Vector(Math.round(backgroundPositioningArea.left + backgroundPositioningArea.width), Math.round(height + backgroundPositioningArea.top + y)),
                    new Vector(Math.round(backgroundPositioningArea.left), Math.round(height + backgroundPositioningArea.top + y))
                ];
            case 3 /* REPEAT_Y */:
                return [
                    new Vector(Math.round(backgroundPositioningArea.left + x), Math.round(backgroundPositioningArea.top)),
                    new Vector(Math.round(backgroundPositioningArea.left + x + width), Math.round(backgroundPositioningArea.top)),
                    new Vector(Math.round(backgroundPositioningArea.left + x + width), Math.round(backgroundPositioningArea.height + backgroundPositioningArea.top)),
                    new Vector(Math.round(backgroundPositioningArea.left + x), Math.round(backgroundPositioningArea.height + backgroundPositioningArea.top))
                ];
            case 1 /* NO_REPEAT */:
                return [
                    new Vector(Math.round(backgroundPositioningArea.left + x), Math.round(backgroundPositioningArea.top + y)),
                    new Vector(Math.round(backgroundPositioningArea.left + x + width), Math.round(backgroundPositioningArea.top + y)),
                    new Vector(Math.round(backgroundPositioningArea.left + x + width), Math.round(backgroundPositioningArea.top + y + height)),
                    new Vector(Math.round(backgroundPositioningArea.left + x), Math.round(backgroundPositioningArea.top + y + height))
                ];
            default:
                return [
                    new Vector(Math.round(backgroundPaintingArea.left), Math.round(backgroundPaintingArea.top)),
                    new Vector(Math.round(backgroundPaintingArea.left + backgroundPaintingArea.width), Math.round(backgroundPaintingArea.top)),
                    new Vector(Math.round(backgroundPaintingArea.left + backgroundPaintingArea.width), Math.round(backgroundPaintingArea.height + backgroundPaintingArea.top)),
                    new Vector(Math.round(backgroundPaintingArea.left), Math.round(backgroundPaintingArea.height + backgroundPaintingArea.top))
                ];
        }
    };

    var SMALL_IMAGE = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';

    var SAMPLE_TEXT = 'Hidden Text';
    var FontMetrics = /** @class */ (function () {
        function FontMetrics(document) {
            this._data = {};
            this._document = document;
        }
        FontMetrics.prototype.parseMetrics = function (fontFamily, fontSize) {
            var container = this._document.createElement('div');
            var img = this._document.createElement('img');
            var span = this._document.createElement('span');
            var body = this._document.body;
            container.style.visibility = 'hidden';
            container.style.fontFamily = fontFamily;
            container.style.fontSize = fontSize;
            container.style.margin = '0';
            container.style.padding = '0';
            container.style.whiteSpace = 'nowrap';
            body.appendChild(container);
            img.src = SMALL_IMAGE;
            img.width = 1;
            img.height = 1;
            img.style.margin = '0';
            img.style.padding = '0';
            img.style.verticalAlign = 'baseline';
            span.style.fontFamily = fontFamily;
            span.style.fontSize = fontSize;
            span.style.margin = '0';
            span.style.padding = '0';
            span.appendChild(this._document.createTextNode(SAMPLE_TEXT));
            container.appendChild(span);
            container.appendChild(img);
            var baseline = img.offsetTop - span.offsetTop + 2;
            container.removeChild(span);
            container.appendChild(this._document.createTextNode(SAMPLE_TEXT));
            container.style.lineHeight = 'normal';
            img.style.verticalAlign = 'super';
            var middle = img.offsetTop - container.offsetTop + 2;
            body.removeChild(container);
            return { baseline: baseline, middle: middle };
        };
        FontMetrics.prototype.getMetrics = function (fontFamily, fontSize) {
            var key = fontFamily + " " + fontSize;
            if (typeof this._data[key] === 'undefined') {
                this._data[key] = this.parseMetrics(fontFamily, fontSize);
            }
            return this._data[key];
        };
        return FontMetrics;
    }());

    var Renderer = /** @class */ (function () {
        function Renderer(context, options) {
            this.context = context;
            this.options = options;
        }
        return Renderer;
    }());

    var MASK_OFFSET = 10000;
    var CanvasRenderer = /** @class */ (function (_super) {
        __extends(CanvasRenderer, _super);
        function CanvasRenderer(context, options) {
            var _this = _super.call(this, context, options) || this;
            _this._activeEffects = [];
            _this.canvas = options.canvas ? options.canvas : document.createElement('canvas');
            _this.ctx = _this.canvas.getContext('2d');
            if (!options.canvas) {
                _this.canvas.width = Math.floor(options.width * options.scale);
                _this.canvas.height = Math.floor(options.height * options.scale);
                _this.canvas.style.width = options.width + "px";
                _this.canvas.style.height = options.height + "px";
            }
            _this.fontMetrics = new FontMetrics(document);
            _this.ctx.scale(_this.options.scale, _this.options.scale);
            _this.ctx.translate(-options.x, -options.y);
            _this.ctx.textBaseline = 'bottom';
            _this._activeEffects = [];
            _this.context.logger.debug("Canvas renderer initialized (" + options.width + "x" + options.height + ") with scale " + options.scale);
            return _this;
        }
        CanvasRenderer.prototype.applyEffects = function (effects) {
            var _this = this;
            while (this._activeEffects.length) {
                this.popEffect();
            }
            effects.forEach(function (effect) { return _this.applyEffect(effect); });
        };
        CanvasRenderer.prototype.applyEffect = function (effect) {
            this.ctx.save();
            if (isOpacityEffect(effect)) {
                this.ctx.globalAlpha = effect.opacity;
            }
            if (isTransformEffect(effect)) {
                this.ctx.translate(effect.offsetX, effect.offsetY);
                this.ctx.transform(effect.matrix[0], effect.matrix[1], effect.matrix[2], effect.matrix[3], effect.matrix[4], effect.matrix[5]);
                this.ctx.translate(-effect.offsetX, -effect.offsetY);
            }
            if (isClipEffect(effect)) {
                this.path(effect.path);
                this.ctx.clip();
            }
            this._activeEffects.push(effect);
        };
        CanvasRenderer.prototype.popEffect = function () {
            this._activeEffects.pop();
            this.ctx.restore();
        };
        CanvasRenderer.prototype.renderStack = function (stack) {
            return __awaiter(this, void 0, void 0, function () {
                var styles;
                return __generator(this, function (_a) {
                    switch (_a.label) {
                        case 0:
                            styles = stack.element.container.styles;
                            if (!styles.isVisible()) return [3 /*break*/, 2];
                            return [4 /*yield*/, this.renderStackContent(stack)];
                        case 1:
                            _a.sent();
                            _a.label = 2;
                        case 2: return [2 /*return*/];
                    }
                });
            });
        };
        CanvasRenderer.prototype.renderNode = function (paint) {
            return __awaiter(this, void 0, void 0, function () {
                return __generator(this, function (_a) {
                    switch (_a.label) {
                        case 0:
                            if (contains(paint.container.flags, 16 /* DEBUG_RENDER */)) {
                                debugger;
                            }
                            if (!paint.container.styles.isVisible()) return [3 /*break*/, 3];
                            return [4 /*yield*/, this.renderNodeBackgroundAndBorders(paint)];
                        case 1:
                            _a.sent();
                            return [4 /*yield*/, this.renderNodeContent(paint)];
                        case 2:
                            _a.sent();
                            _a.label = 3;
                        case 3: return [2 /*return*/];
                    }
                });
            });
        };
        CanvasRenderer.prototype.renderTextWithLetterSpacing = function (text, letterSpacing, baseline) {
            var _this = this;
            if (letterSpacing === 0) {
                this.ctx.fillText(text.text, text.bounds.left, text.bounds.top + baseline);
            }
            else {
                var letters = segmentGraphemes(text.text);
                letters.reduce(function (left, letter) {
                    _this.ctx.fillText(letter, left, text.bounds.top + baseline);
                    return left + _this.ctx.measureText(letter).width;
                }, text.bounds.left);
            }
        };
        CanvasRenderer.prototype.createFontStyle = function (styles) {
            var fontVariant = styles.fontVariant
                .filter(function (variant) { return variant === 'normal' || variant === 'small-caps'; })
                .join('');
            var fontFamily = fixIOSSystemFonts(styles.fontFamily).join(', ');
            var fontSize = isDimensionToken(styles.fontSize)
                ? "" + styles.fontSize.number + styles.fontSize.unit
                : styles.fontSize.number + "px";
            return [
                [styles.fontStyle, fontVariant, styles.fontWeight, fontSize, fontFamily].join(' '),
                fontFamily,
                fontSize
            ];
        };
        CanvasRenderer.prototype.renderTextNode = function (text, styles) {
            return __awaiter(this, void 0, void 0, function () {
                var _a, font, fontFamily, fontSize, _b, baseline, middle, paintOrder;
                var _this = this;
                return __generator(this, function (_c) {
                    _a = this.createFontStyle(styles), font = _a[0], fontFamily = _a[1], fontSize = _a[2];
                    this.ctx.font = font;
                    this.ctx.direction = styles.direction === 1 /* RTL */ ? 'rtl' : 'ltr';
                    this.ctx.textAlign = 'left';
                    this.ctx.textBaseline = 'alphabetic';
                    _b = this.fontMetrics.getMetrics(fontFamily, fontSize), baseline = _b.baseline, middle = _b.middle;
                    paintOrder = styles.paintOrder;
                    text.textBounds.forEach(function (text) {
                        paintOrder.forEach(function (paintOrderLayer) {
                            switch (paintOrderLayer) {
                                case 0 /* FILL */:
                                    _this.ctx.fillStyle = asString(styles.color);
                                    _this.renderTextWithLetterSpacing(text, styles.letterSpacing, baseline);
                                    var textShadows = styles.textShadow;
                                    if (textShadows.length && text.text.trim().length) {
                                        textShadows
                                            .slice(0)
                                            .reverse()
                                            .forEach(function (textShadow) {
                                            _this.ctx.shadowColor = asString(textShadow.color);
                                            _this.ctx.shadowOffsetX = textShadow.offsetX.number * _this.options.scale;
                                            _this.ctx.shadowOffsetY = textShadow.offsetY.number * _this.options.scale;
                                            _this.ctx.shadowBlur = textShadow.blur.number;
                                            _this.renderTextWithLetterSpacing(text, styles.letterSpacing, baseline);
                                        });
                                        _this.ctx.shadowColor = '';
                                        _this.ctx.shadowOffsetX = 0;
                                        _this.ctx.shadowOffsetY = 0;
                                        _this.ctx.shadowBlur = 0;
                                    }
                                    if (styles.textDecorationLine.length) {
                                        _this.ctx.fillStyle = asString(styles.textDecorationColor || styles.color);
                                        styles.textDecorationLine.forEach(function (textDecorationLine) {
                                            switch (textDecorationLine) {
                                                case 1 /* UNDERLINE */:
                                                    // Draws a line at the baseline of the font
                                                    // TODO As some browsers display the line as more than 1px if the font-size is big,
                                                    // need to take that into account both in position and size
                                                    _this.ctx.fillRect(text.bounds.left, Math.round(text.bounds.top + baseline), text.bounds.width, 1);
                                                    break;
                                                case 2 /* OVERLINE */:
                                                    _this.ctx.fillRect(text.bounds.left, Math.round(text.bounds.top), text.bounds.width, 1);
                                                    break;
                                                case 3 /* LINE_THROUGH */:
                                                    // TODO try and find exact position for line-through
                                                    _this.ctx.fillRect(text.bounds.left, Math.ceil(text.bounds.top + middle), text.bounds.width, 1);
                                                    break;
                                            }
                                        });
                                    }
                                    break;
                                case 1 /* STROKE */:
                                    if (styles.webkitTextStrokeWidth && text.text.trim().length) {
                                        _this.ctx.strokeStyle = asString(styles.webkitTextStrokeColor);
                                        _this.ctx.lineWidth = styles.webkitTextStrokeWidth;
                                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
                                        _this.ctx.lineJoin = !!window.chrome ? 'miter' : 'round';
                                        _this.ctx.strokeText(text.text, text.bounds.left, text.bounds.top + baseline);
                                    }
                                    _this.ctx.strokeStyle = '';
                                    _this.ctx.lineWidth = 0;
                                    _this.ctx.lineJoin = 'miter';
                                    break;
                            }
                        });
                    });
                    return [2 /*return*/];
                });
            });
        };
        CanvasRenderer.prototype.renderReplacedElement = function (container, curves, image) {
            if (image && container.intrinsicWidth > 0 && container.intrinsicHeight > 0) {
                var box = contentBox(container);
                var path = calculatePaddingBoxPath(curves);
                this.path(path);
                this.ctx.save();
                this.ctx.clip();
                this.ctx.drawImage(image, 0, 0, container.intrinsicWidth, container.intrinsicHeight, box.left, box.top, box.width, box.height);
                this.ctx.restore();
            }
        };
        CanvasRenderer.prototype.renderNodeContent = function (paint) {
            return __awaiter(this, void 0, void 0, function () {
                var container, curves, styles, _i, _a, child, image, image, iframeRenderer, canvas, size, _b, fontFamily, fontSize, baseline, bounds, x, textBounds, img, image, url, fontFamily, bounds;
                return __generator(this, function (_c) {
                    switch (_c.label) {
                        case 0:
                            this.applyEffects(paint.getEffects(4 /* CONTENT */));
                            container = paint.container;
                            curves = paint.curves;
                            styles = container.styles;
                            _i = 0, _a = container.textNodes;
                            _c.label = 1;
                        case 1:
                            if (!(_i < _a.length)) return [3 /*break*/, 4];
                            child = _a[_i];
                            return [4 /*yield*/, this.renderTextNode(child, styles)];
                        case 2:
                            _c.sent();
                            _c.label = 3;
                        case 3:
                            _i++;
                            return [3 /*break*/, 1];
                        case 4:
                            if (!(container instanceof ImageElementContainer)) return [3 /*break*/, 8];
                            _c.label = 5;
                        case 5:
                            _c.trys.push([5, 7, , 8]);
                            return [4 /*yield*/, this.context.cache.match(container.src)];
                        case 6:
                            image = _c.sent();
                            this.renderReplacedElement(container, curves, image);
                            return [3 /*break*/, 8];
                        case 7:
                            _c.sent();
                            this.context.logger.error("Error loading image " + container.src);
                            return [3 /*break*/, 8];
                        case 8:
                            if (container instanceof CanvasElementContainer) {
                                this.renderReplacedElement(container, curves, container.canvas);
                            }
                            if (!(container instanceof SVGElementContainer)) return [3 /*break*/, 12];
                            _c.label = 9;
                        case 9:
                            _c.trys.push([9, 11, , 12]);
                            return [4 /*yield*/, this.context.cache.match(container.svg)];
                        case 10:
                            image = _c.sent();
                            this.renderReplacedElement(container, curves, image);
                            return [3 /*break*/, 12];
                        case 11:
                            _c.sent();
                            this.context.logger.error("Error loading svg " + container.svg.substring(0, 255));
                            return [3 /*break*/, 12];
                        case 12:
                            if (!(container instanceof IFrameElementContainer && container.tree)) return [3 /*break*/, 14];
                            iframeRenderer = new CanvasRenderer(this.context, {
                                scale: this.options.scale,
                                backgroundColor: container.backgroundColor,
                                x: 0,
                                y: 0,
                                width: container.width,
                                height: container.height
                            });
                            return [4 /*yield*/, iframeRenderer.render(container.tree)];
                        case 13:
                            canvas = _c.sent();
                            if (container.width && container.height) {
                                this.ctx.drawImage(canvas, 0, 0, container.width, container.height, container.bounds.left, container.bounds.top, container.bounds.width, container.bounds.height);
                            }
                            _c.label = 14;
                        case 14:
                            if (container instanceof InputElementContainer) {
                                size = Math.min(container.bounds.width, container.bounds.height);
                                if (container.type === CHECKBOX) {
                                    if (container.checked) {
                                        this.ctx.save();
                                        this.path([
                                            new Vector(container.bounds.left + size * 0.39363, container.bounds.top + size * 0.79),
                                            new Vector(container.bounds.left + size * 0.16, container.bounds.top + size * 0.5549),
                                            new Vector(container.bounds.left + size * 0.27347, container.bounds.top + size * 0.44071),
                                            new Vector(container.bounds.left + size * 0.39694, container.bounds.top + size * 0.5649),
                                            new Vector(container.bounds.left + size * 0.72983, container.bounds.top + size * 0.23),
                                            new Vector(container.bounds.left + size * 0.84, container.bounds.top + size * 0.34085),
                                            new Vector(container.bounds.left + size * 0.39363, container.bounds.top + size * 0.79)
                                        ]);
                                        this.ctx.fillStyle = asString(INPUT_COLOR);
                                        this.ctx.fill();
                                        this.ctx.restore();
                                    }
                                }
                                else if (container.type === RADIO) {
                                    if (container.checked) {
                                        this.ctx.save();
                                        this.ctx.beginPath();
                                        this.ctx.arc(container.bounds.left + size / 2, container.bounds.top + size / 2, size / 4, 0, Math.PI * 2, true);
                                        this.ctx.fillStyle = asString(INPUT_COLOR);
                                        this.ctx.fill();
                                        this.ctx.restore();
                                    }
                                }
                            }
                            if (isTextInputElement(container) && container.value.length) {
                                _b = this.createFontStyle(styles), fontFamily = _b[0], fontSize = _b[1];
                                baseline = this.fontMetrics.getMetrics(fontFamily, fontSize).baseline;
                                this.ctx.font = fontFamily;
                                this.ctx.fillStyle = asString(styles.color);
                                this.ctx.textBaseline = 'alphabetic';
                                this.ctx.textAlign = canvasTextAlign(container.styles.textAlign);
                                bounds = contentBox(container);
                                x = 0;
                                switch (container.styles.textAlign) {
                                    case 1 /* CENTER */:
                                        x += bounds.width / 2;
                                        break;
                                    case 2 /* RIGHT */:
                                        x += bounds.width;
                                        break;
                                }
                                textBounds = bounds.add(x, 0, 0, -bounds.height / 2 + 1);
                                this.ctx.save();
                                this.path([
                                    new Vector(bounds.left, bounds.top),
                                    new Vector(bounds.left + bounds.width, bounds.top),
                                    new Vector(bounds.left + bounds.width, bounds.top + bounds.height),
                                    new Vector(bounds.left, bounds.top + bounds.height)
                                ]);
                                this.ctx.clip();
                                this.renderTextWithLetterSpacing(new TextBounds(container.value, textBounds), styles.letterSpacing, baseline);
                                this.ctx.restore();
                                this.ctx.textBaseline = 'alphabetic';
                                this.ctx.textAlign = 'left';
                            }
                            if (!contains(container.styles.display, 2048 /* LIST_ITEM */)) return [3 /*break*/, 20];
                            if (!(container.styles.listStyleImage !== null)) return [3 /*break*/, 19];
                            img = container.styles.listStyleImage;
                            if (!(img.type === 0 /* URL */)) return [3 /*break*/, 18];
                            image = void 0;
                            url = img.url;
                            _c.label = 15;
                        case 15:
                            _c.trys.push([15, 17, , 18]);
                            return [4 /*yield*/, this.context.cache.match(url)];
                        case 16:
                            image = _c.sent();
                            this.ctx.drawImage(image, container.bounds.left - (image.width + 10), container.bounds.top);
                            return [3 /*break*/, 18];
                        case 17:
                            _c.sent();
                            this.context.logger.error("Error loading list-style-image " + url);
                            return [3 /*break*/, 18];
                        case 18: return [3 /*break*/, 20];
                        case 19:
                            if (paint.listValue && container.styles.listStyleType !== -1 /* NONE */) {
                                fontFamily = this.createFontStyle(styles)[0];
                                this.ctx.font = fontFamily;
                                this.ctx.fillStyle = asString(styles.color);
                                this.ctx.textBaseline = 'middle';
                                this.ctx.textAlign = 'right';
                                bounds = new Bounds(container.bounds.left, container.bounds.top + getAbsoluteValue(container.styles.paddingTop, container.bounds.width), container.bounds.width, computeLineHeight(styles.lineHeight, styles.fontSize.number) / 2 + 1);
                                this.renderTextWithLetterSpacing(new TextBounds(paint.listValue, bounds), styles.letterSpacing, computeLineHeight(styles.lineHeight, styles.fontSize.number) / 2 + 2);
                                this.ctx.textBaseline = 'bottom';
                                this.ctx.textAlign = 'left';
                            }
                            _c.label = 20;
                        case 20: return [2 /*return*/];
                    }
                });
            });
        };
        CanvasRenderer.prototype.renderStackContent = function (stack) {
            return __awaiter(this, void 0, void 0, function () {
                var _i, _a, child, _b, _c, child, _d, _e, child, _f, _g, child, _h, _j, child, _k, _l, child, _m, _o, child;
                return __generator(this, function (_p) {
                    switch (_p.label) {
                        case 0:
                            if (contains(stack.element.container.flags, 16 /* DEBUG_RENDER */)) {
                                debugger;
                            }
                            // https://www.w3.org/TR/css-position-3/#painting-order
                            // 1. the background and borders of the element forming the stacking context.
                            return [4 /*yield*/, this.renderNodeBackgroundAndBorders(stack.element)];
                        case 1:
                            // https://www.w3.org/TR/css-position-3/#painting-order
                            // 1. the background and borders of the element forming the stacking context.
                            _p.sent();
                            _i = 0, _a = stack.negativeZIndex;
                            _p.label = 2;
                        case 2:
                            if (!(_i < _a.length)) return [3 /*break*/, 5];
                            child = _a[_i];
                            return [4 /*yield*/, this.renderStack(child)];
                        case 3:
                            _p.sent();
                            _p.label = 4;
                        case 4:
                            _i++;
                            return [3 /*break*/, 2];
                        case 5: 
                        // 3. For all its in-flow, non-positioned, block-level descendants in tree order:
                        return [4 /*yield*/, this.renderNodeContent(stack.element)];
                        case 6:
                            // 3. For all its in-flow, non-positioned, block-level descendants in tree order:
                            _p.sent();
                            _b = 0, _c = stack.nonInlineLevel;
                            _p.label = 7;
                        case 7:
                            if (!(_b < _c.length)) return [3 /*break*/, 10];
                            child = _c[_b];
                            return [4 /*yield*/, this.renderNode(child)];
                        case 8:
                            _p.sent();
                            _p.label = 9;
                        case 9:
                            _b++;
                            return [3 /*break*/, 7];
                        case 10:
                            _d = 0, _e = stack.nonPositionedFloats;
                            _p.label = 11;
                        case 11:
                            if (!(_d < _e.length)) return [3 /*break*/, 14];
                            child = _e[_d];
                            return [4 /*yield*/, this.renderStack(child)];
                        case 12:
                            _p.sent();
                            _p.label = 13;
                        case 13:
                            _d++;
                            return [3 /*break*/, 11];
                        case 14:
                            _f = 0, _g = stack.nonPositionedInlineLevel;
                            _p.label = 15;
                        case 15:
                            if (!(_f < _g.length)) return [3 /*break*/, 18];
                            child = _g[_f];
                            return [4 /*yield*/, this.renderStack(child)];
                        case 16:
                            _p.sent();
                            _p.label = 17;
                        case 17:
                            _f++;
                            return [3 /*break*/, 15];
                        case 18:
                            _h = 0, _j = stack.inlineLevel;
                            _p.label = 19;
                        case 19:
                            if (!(_h < _j.length)) return [3 /*break*/, 22];
                            child = _j[_h];
                            return [4 /*yield*/, this.renderNode(child)];
                        case 20:
                            _p.sent();
                            _p.label = 21;
                        case 21:
                            _h++;
                            return [3 /*break*/, 19];
                        case 22:
                            _k = 0, _l = stack.zeroOrAutoZIndexOrTransformedOrOpacity;
                            _p.label = 23;
                        case 23:
                            if (!(_k < _l.length)) return [3 /*break*/, 26];
                            child = _l[_k];
                            return [4 /*yield*/, this.renderStack(child)];
                        case 24:
                            _p.sent();
                            _p.label = 25;
                        case 25:
                            _k++;
                            return [3 /*break*/, 23];
                        case 26:
                            _m = 0, _o = stack.positiveZIndex;
                            _p.label = 27;
                        case 27:
                            if (!(_m < _o.length)) return [3 /*break*/, 30];
                            child = _o[_m];
                            return [4 /*yield*/, this.renderStack(child)];
                        case 28:
                            _p.sent();
                            _p.label = 29;
                        case 29:
                            _m++;
                            return [3 /*break*/, 27];
                        case 30: return [2 /*return*/];
                    }
                });
            });
        };
        CanvasRenderer.prototype.mask = function (paths) {
            this.ctx.beginPath();
            this.ctx.moveTo(0, 0);
            this.ctx.lineTo(this.canvas.width, 0);
            this.ctx.lineTo(this.canvas.width, this.canvas.height);
            this.ctx.lineTo(0, this.canvas.height);
            this.ctx.lineTo(0, 0);
            this.formatPath(paths.slice(0).reverse());
            this.ctx.closePath();
        };
        CanvasRenderer.prototype.path = function (paths) {
            this.ctx.beginPath();
            this.formatPath(paths);
            this.ctx.closePath();
        };
        CanvasRenderer.prototype.formatPath = function (paths) {
            var _this = this;
            paths.forEach(function (point, index) {
                var start = isBezierCurve(point) ? point.start : point;
                if (index === 0) {
                    _this.ctx.moveTo(start.x, start.y);
                }
                else {
                    _this.ctx.lineTo(start.x, start.y);
                }
                if (isBezierCurve(point)) {
                    _this.ctx.bezierCurveTo(point.startControl.x, point.startControl.y, point.endControl.x, point.endControl.y, point.end.x, point.end.y);
                }
            });
        };
        CanvasRenderer.prototype.renderRepeat = function (path, pattern, offsetX, offsetY) {
            this.path(path);
            this.ctx.fillStyle = pattern;
            this.ctx.translate(offsetX, offsetY);
            this.ctx.fill();
            this.ctx.translate(-offsetX, -offsetY);
        };
        CanvasRenderer.prototype.resizeImage = function (image, width, height) {
            var _a;
            if (image.width === width && image.height === height) {
                return image;
            }
            var ownerDocument = (_a = this.canvas.ownerDocument) !== null && _a !== void 0 ? _a : document;
            var canvas = ownerDocument.createElement('canvas');
            canvas.width = Math.max(1, width);
            canvas.height = Math.max(1, height);
            var ctx = canvas.getContext('2d');
            ctx.drawImage(image, 0, 0, image.width, image.height, 0, 0, width, height);
            return canvas;
        };
        CanvasRenderer.prototype.renderBackgroundImage = function (container) {
            return __awaiter(this, void 0, void 0, function () {
                var index, _loop_1, this_1, _i, _a, backgroundImage;
                return __generator(this, function (_b) {
                    switch (_b.label) {
                        case 0:
                            index = container.styles.backgroundImage.length - 1;
                            _loop_1 = function (backgroundImage) {
                                var image, url, _c, path, x, y, width, height, pattern, _d, path, x, y, width, height, _e, lineLength, x0, x1, y0, y1, canvas, ctx, gradient_1, pattern, _f, path, left, top_1, width, height, position, x, y, _g, rx, ry, radialGradient_1, midX, midY, f, invF;
                                return __generator(this, function (_h) {
                                    switch (_h.label) {
                                        case 0:
                                            if (!(backgroundImage.type === 0 /* URL */)) return [3 /*break*/, 5];
                                            image = void 0;
                                            url = backgroundImage.url;
                                            _h.label = 1;
                                        case 1:
                                            _h.trys.push([1, 3, , 4]);
                                            return [4 /*yield*/, this_1.context.cache.match(url)];
                                        case 2:
                                            image = _h.sent();
                                            return [3 /*break*/, 4];
                                        case 3:
                                            _h.sent();
                                            this_1.context.logger.error("Error loading background-image " + url);
                                            return [3 /*break*/, 4];
                                        case 4:
                                            if (image) {
                                                _c = calculateBackgroundRendering(container, index, [
                                                    image.width,
                                                    image.height,
                                                    image.width / image.height
                                                ]), path = _c[0], x = _c[1], y = _c[2], width = _c[3], height = _c[4];
                                                pattern = this_1.ctx.createPattern(this_1.resizeImage(image, width, height), 'repeat');
                                                this_1.renderRepeat(path, pattern, x, y);
                                            }
                                            return [3 /*break*/, 6];
                                        case 5:
                                            if (isLinearGradient(backgroundImage)) {
                                                _d = calculateBackgroundRendering(container, index, [null, null, null]), path = _d[0], x = _d[1], y = _d[2], width = _d[3], height = _d[4];
                                                _e = calculateGradientDirection(backgroundImage.angle, width, height), lineLength = _e[0], x0 = _e[1], x1 = _e[2], y0 = _e[3], y1 = _e[4];
                                                canvas = document.createElement('canvas');
                                                canvas.width = width;
                                                canvas.height = height;
                                                ctx = canvas.getContext('2d');
                                                gradient_1 = ctx.createLinearGradient(x0, y0, x1, y1);
                                                processColorStops(backgroundImage.stops, lineLength).forEach(function (colorStop) {
                                                    return gradient_1.addColorStop(colorStop.stop, asString(colorStop.color));
                                                });
                                                ctx.fillStyle = gradient_1;
                                                ctx.fillRect(0, 0, width, height);
                                                if (width > 0 && height > 0) {
                                                    pattern = this_1.ctx.createPattern(canvas, 'repeat');
                                                    this_1.renderRepeat(path, pattern, x, y);
                                                }
                                            }
                                            else if (isRadialGradient(backgroundImage)) {
                                                _f = calculateBackgroundRendering(container, index, [
                                                    null,
                                                    null,
                                                    null
                                                ]), path = _f[0], left = _f[1], top_1 = _f[2], width = _f[3], height = _f[4];
                                                position = backgroundImage.position.length === 0 ? [FIFTY_PERCENT] : backgroundImage.position;
                                                x = getAbsoluteValue(position[0], width);
                                                y = getAbsoluteValue(position[position.length - 1], height);
                                                _g = calculateRadius(backgroundImage, x, y, width, height), rx = _g[0], ry = _g[1];
                                                if (rx > 0 && ry > 0) {
                                                    radialGradient_1 = this_1.ctx.createRadialGradient(left + x, top_1 + y, 0, left + x, top_1 + y, rx);
                                                    processColorStops(backgroundImage.stops, rx * 2).forEach(function (colorStop) {
                                                        return radialGradient_1.addColorStop(colorStop.stop, asString(colorStop.color));
                                                    });
                                                    this_1.path(path);
                                                    this_1.ctx.fillStyle = radialGradient_1;
                                                    if (rx !== ry) {
                                                        midX = container.bounds.left + 0.5 * container.bounds.width;
                                                        midY = container.bounds.top + 0.5 * container.bounds.height;
                                                        f = ry / rx;
                                                        invF = 1 / f;
                                                        this_1.ctx.save();
                                                        this_1.ctx.translate(midX, midY);
                                                        this_1.ctx.transform(1, 0, 0, f, 0, 0);
                                                        this_1.ctx.translate(-midX, -midY);
                                                        this_1.ctx.fillRect(left, invF * (top_1 - midY) + midY, width, height * invF);
                                                        this_1.ctx.restore();
                                                    }
                                                    else {
                                                        this_1.ctx.fill();
                                                    }
                                                }
                                            }
                                            _h.label = 6;
                                        case 6:
                                            index--;
                                            return [2 /*return*/];
                                    }
                                });
                            };
                            this_1 = this;
                            _i = 0, _a = container.styles.backgroundImage.slice(0).reverse();
                            _b.label = 1;
                        case 1:
                            if (!(_i < _a.length)) return [3 /*break*/, 4];
                            backgroundImage = _a[_i];
                            return [5 /*yield**/, _loop_1(backgroundImage)];
                        case 2:
                            _b.sent();
                            _b.label = 3;
                        case 3:
                            _i++;
                            return [3 /*break*/, 1];
                        case 4: return [2 /*return*/];
                    }
                });
            });
        };
        CanvasRenderer.prototype.renderSolidBorder = function (color, side, curvePoints) {
            return __awaiter(this, void 0, void 0, function () {
                return __generator(this, function (_a) {
                    this.path(parsePathForBorder(curvePoints, side));
                    this.ctx.fillStyle = asString(color);
                    this.ctx.fill();
                    return [2 /*return*/];
                });
            });
        };
        CanvasRenderer.prototype.renderDoubleBorder = function (color, width, side, curvePoints) {
            return __awaiter(this, void 0, void 0, function () {
                var outerPaths, innerPaths;
                return __generator(this, function (_a) {
                    switch (_a.label) {
                        case 0:
                            if (!(width < 3)) return [3 /*break*/, 2];
                            return [4 /*yield*/, this.renderSolidBorder(color, side, curvePoints)];
                        case 1:
                            _a.sent();
                            return [2 /*return*/];
                        case 2:
                            outerPaths = parsePathForBorderDoubleOuter(curvePoints, side);
                            this.path(outerPaths);
                            this.ctx.fillStyle = asString(color);
                            this.ctx.fill();
                            innerPaths = parsePathForBorderDoubleInner(curvePoints, side);
                            this.path(innerPaths);
                            this.ctx.fill();
                            return [2 /*return*/];
                    }
                });
            });
        };
        CanvasRenderer.prototype.renderNodeBackgroundAndBorders = function (paint) {
            return __awaiter(this, void 0, void 0, function () {
                var styles, hasBackground, borders, backgroundPaintingArea, side, _i, borders_1, border;
                var _this = this;
                return __generator(this, function (_a) {
                    switch (_a.label) {
                        case 0:
                            this.applyEffects(paint.getEffects(2 /* BACKGROUND_BORDERS */));
                            styles = paint.container.styles;
                            hasBackground = !isTransparent(styles.backgroundColor) || styles.backgroundImage.length;
                            borders = [
                                { style: styles.borderTopStyle, color: styles.borderTopColor, width: styles.borderTopWidth },
                                { style: styles.borderRightStyle, color: styles.borderRightColor, width: styles.borderRightWidth },
                                { style: styles.borderBottomStyle, color: styles.borderBottomColor, width: styles.borderBottomWidth },
                                { style: styles.borderLeftStyle, color: styles.borderLeftColor, width: styles.borderLeftWidth }
                            ];
                            backgroundPaintingArea = calculateBackgroundCurvedPaintingArea(getBackgroundValueForIndex(styles.backgroundClip, 0), paint.curves);
                            if (!(hasBackground || styles.boxShadow.length)) return [3 /*break*/, 2];
                            this.ctx.save();
                            this.path(backgroundPaintingArea);
                            this.ctx.clip();
                            if (!isTransparent(styles.backgroundColor)) {
                                this.ctx.fillStyle = asString(styles.backgroundColor);
                                this.ctx.fill();
                            }
                            return [4 /*yield*/, this.renderBackgroundImage(paint.container)];
                        case 1:
                            _a.sent();
                            this.ctx.restore();
                            styles.boxShadow
                                .slice(0)
                                .reverse()
                                .forEach(function (shadow) {
                                _this.ctx.save();
                                var borderBoxArea = calculateBorderBoxPath(paint.curves);
                                var maskOffset = shadow.inset ? 0 : MASK_OFFSET;
                                var shadowPaintingArea = transformPath(borderBoxArea, -maskOffset + (shadow.inset ? 1 : -1) * shadow.spread.number, (shadow.inset ? 1 : -1) * shadow.spread.number, shadow.spread.number * (shadow.inset ? -2 : 2), shadow.spread.number * (shadow.inset ? -2 : 2));
                                if (shadow.inset) {
                                    _this.path(borderBoxArea);
                                    _this.ctx.clip();
                                    _this.mask(shadowPaintingArea);
                                }
                                else {
                                    _this.mask(borderBoxArea);
                                    _this.ctx.clip();
                                    _this.path(shadowPaintingArea);
                                }
                                _this.ctx.shadowOffsetX = shadow.offsetX.number + maskOffset;
                                _this.ctx.shadowOffsetY = shadow.offsetY.number;
                                _this.ctx.shadowColor = asString(shadow.color);
                                _this.ctx.shadowBlur = shadow.blur.number;
                                _this.ctx.fillStyle = shadow.inset ? asString(shadow.color) : 'rgba(0,0,0,1)';
                                _this.ctx.fill();
                                _this.ctx.restore();
                            });
                            _a.label = 2;
                        case 2:
                            side = 0;
                            _i = 0, borders_1 = borders;
                            _a.label = 3;
                        case 3:
                            if (!(_i < borders_1.length)) return [3 /*break*/, 13];
                            border = borders_1[_i];
                            if (!(border.style !== 0 /* NONE */ && !isTransparent(border.color) && border.width > 0)) return [3 /*break*/, 11];
                            if (!(border.style === 2 /* DASHED */)) return [3 /*break*/, 5];
                            return [4 /*yield*/, this.renderDashedDottedBorder(border.color, border.width, side, paint.curves, 2 /* DASHED */)];
                        case 4:
                            _a.sent();
                            return [3 /*break*/, 11];
                        case 5:
                            if (!(border.style === 3 /* DOTTED */)) return [3 /*break*/, 7];
                            return [4 /*yield*/, this.renderDashedDottedBorder(border.color, border.width, side, paint.curves, 3 /* DOTTED */)];
                        case 6:
                            _a.sent();
                            return [3 /*break*/, 11];
                        case 7:
                            if (!(border.style === 4 /* DOUBLE */)) return [3 /*break*/, 9];
                            return [4 /*yield*/, this.renderDoubleBorder(border.color, border.width, side, paint.curves)];
                        case 8:
                            _a.sent();
                            return [3 /*break*/, 11];
                        case 9: return [4 /*yield*/, this.renderSolidBorder(border.color, side, paint.curves)];
                        case 10:
                            _a.sent();
                            _a.label = 11;
                        case 11:
                            side++;
                            _a.label = 12;
                        case 12:
                            _i++;
                            return [3 /*break*/, 3];
                        case 13: return [2 /*return*/];
                    }
                });
            });
        };
        CanvasRenderer.prototype.renderDashedDottedBorder = function (color, width, side, curvePoints, style) {
            return __awaiter(this, void 0, void 0, function () {
                var strokePaths, boxPaths, startX, startY, endX, endY, length, dashLength, spaceLength, useLineDash, multiplier, numberOfDashes, minSpace, maxSpace, path1, path2, path1, path2;
                return __generator(this, function (_a) {
                    this.ctx.save();
                    strokePaths = parsePathForBorderStroke(curvePoints, side);
                    boxPaths = parsePathForBorder(curvePoints, side);
                    if (style === 2 /* DASHED */) {
                        this.path(boxPaths);
                        this.ctx.clip();
                    }
                    if (isBezierCurve(boxPaths[0])) {
                        startX = boxPaths[0].start.x;
                        startY = boxPaths[0].start.y;
                    }
                    else {
                        startX = boxPaths[0].x;
                        startY = boxPaths[0].y;
                    }
                    if (isBezierCurve(boxPaths[1])) {
                        endX = boxPaths[1].end.x;
                        endY = boxPaths[1].end.y;
                    }
                    else {
                        endX = boxPaths[1].x;
                        endY = boxPaths[1].y;
                    }
                    if (side === 0 || side === 2) {
                        length = Math.abs(startX - endX);
                    }
                    else {
                        length = Math.abs(startY - endY);
                    }
                    this.ctx.beginPath();
                    if (style === 3 /* DOTTED */) {
                        this.formatPath(strokePaths);
                    }
                    else {
                        this.formatPath(boxPaths.slice(0, 2));
                    }
                    dashLength = width < 3 ? width * 3 : width * 2;
                    spaceLength = width < 3 ? width * 2 : width;
                    if (style === 3 /* DOTTED */) {
                        dashLength = width;
                        spaceLength = width;
                    }
                    useLineDash = true;
                    if (length <= dashLength * 2) {
                        useLineDash = false;
                    }
                    else if (length <= dashLength * 2 + spaceLength) {
                        multiplier = length / (2 * dashLength + spaceLength);
                        dashLength *= multiplier;
                        spaceLength *= multiplier;
                    }
                    else {
                        numberOfDashes = Math.floor((length + spaceLength) / (dashLength + spaceLength));
                        minSpace = (length - numberOfDashes * dashLength) / (numberOfDashes - 1);
                        maxSpace = (length - (numberOfDashes + 1) * dashLength) / numberOfDashes;
                        spaceLength =
                            maxSpace <= 0 || Math.abs(spaceLength - minSpace) < Math.abs(spaceLength - maxSpace)
                                ? minSpace
                                : maxSpace;
                    }
                    if (useLineDash) {
                        if (style === 3 /* DOTTED */) {
                            this.ctx.setLineDash([0, dashLength + spaceLength]);
                        }
                        else {
                            this.ctx.setLineDash([dashLength, spaceLength]);
                        }
                    }
                    if (style === 3 /* DOTTED */) {
                        this.ctx.lineCap = 'round';
                        this.ctx.lineWidth = width;
                    }
                    else {
                        this.ctx.lineWidth = width * 2 + 1.1;
                    }
                    this.ctx.strokeStyle = asString(color);
                    this.ctx.stroke();
                    this.ctx.setLineDash([]);
                    // dashed round edge gap
                    if (style === 2 /* DASHED */) {
                        if (isBezierCurve(boxPaths[0])) {
                            path1 = boxPaths[3];
                            path2 = boxPaths[0];
                            this.ctx.beginPath();
                            this.formatPath([new Vector(path1.end.x, path1.end.y), new Vector(path2.start.x, path2.start.y)]);
                            this.ctx.stroke();
                        }
                        if (isBezierCurve(boxPaths[1])) {
                            path1 = boxPaths[1];
                            path2 = boxPaths[2];
                            this.ctx.beginPath();
                            this.formatPath([new Vector(path1.end.x, path1.end.y), new Vector(path2.start.x, path2.start.y)]);
                            this.ctx.stroke();
                        }
                    }
                    this.ctx.restore();
                    return [2 /*return*/];
                });
            });
        };
        CanvasRenderer.prototype.render = function (element) {
            return __awaiter(this, void 0, void 0, function () {
                var stack;
                return __generator(this, function (_a) {
                    switch (_a.label) {
                        case 0:
                            if (this.options.backgroundColor) {
                                this.ctx.fillStyle = asString(this.options.backgroundColor);
                                this.ctx.fillRect(this.options.x, this.options.y, this.options.width, this.options.height);
                            }
                            stack = parseStackingContexts(element);
                            return [4 /*yield*/, this.renderStack(stack)];
                        case 1:
                            _a.sent();
                            this.applyEffects([]);
                            return [2 /*return*/, this.canvas];
                    }
                });
            });
        };
        return CanvasRenderer;
    }(Renderer));
    var isTextInputElement = function (container) {
        if (container instanceof TextareaElementContainer) {
            return true;
        }
        else if (container instanceof SelectElementContainer) {
            return true;
        }
        else if (container instanceof InputElementContainer && container.type !== RADIO && container.type !== CHECKBOX) {
            return true;
        }
        return false;
    };
    var calculateBackgroundCurvedPaintingArea = function (clip, curves) {
        switch (clip) {
            case 0 /* BORDER_BOX */:
                return calculateBorderBoxPath(curves);
            case 2 /* CONTENT_BOX */:
                return calculateContentBoxPath(curves);
            case 1 /* PADDING_BOX */:
            default:
                return calculatePaddingBoxPath(curves);
        }
    };
    var canvasTextAlign = function (textAlign) {
        switch (textAlign) {
            case 1 /* CENTER */:
                return 'center';
            case 2 /* RIGHT */:
                return 'right';
            case 0 /* LEFT */:
            default:
                return 'left';
        }
    };
    // see https://github.com/niklasvh/html2canvas/pull/2645
    var iOSBrokenFonts = ['-apple-system', 'system-ui'];
    var fixIOSSystemFonts = function (fontFamilies) {
        return /iPhone OS 15_(0|1)/.test(window.navigator.userAgent)
            ? fontFamilies.filter(function (fontFamily) { return iOSBrokenFonts.indexOf(fontFamily) === -1; })
            : fontFamilies;
    };

    var ForeignObjectRenderer = /** @class */ (function (_super) {
        __extends(ForeignObjectRenderer, _super);
        function ForeignObjectRenderer(context, options) {
            var _this = _super.call(this, context, options) || this;
            _this.canvas = options.canvas ? options.canvas : document.createElement('canvas');
            _this.ctx = _this.canvas.getContext('2d');
            _this.options = options;
            _this.canvas.width = Math.floor(options.width * options.scale);
            _this.canvas.height = Math.floor(options.height * options.scale);
            _this.canvas.style.width = options.width + "px";
            _this.canvas.style.height = options.height + "px";
            _this.ctx.scale(_this.options.scale, _this.options.scale);
            _this.ctx.translate(-options.x, -options.y);
            _this.context.logger.debug("EXPERIMENTAL ForeignObject renderer initialized (" + options.width + "x" + options.height + " at " + options.x + "," + options.y + ") with scale " + options.scale);
            return _this;
        }
        ForeignObjectRenderer.prototype.render = function (element) {
            return __awaiter(this, void 0, void 0, function () {
                var svg, img;
                return __generator(this, function (_a) {
                    switch (_a.label) {
                        case 0:
                            svg = createForeignObjectSVG(this.options.width * this.options.scale, this.options.height * this.options.scale, this.options.scale, this.options.scale, element);
                            return [4 /*yield*/, loadSerializedSVG(svg)];
                        case 1:
                            img = _a.sent();
                            if (this.options.backgroundColor) {
                                this.ctx.fillStyle = asString(this.options.backgroundColor);
                                this.ctx.fillRect(0, 0, this.options.width * this.options.scale, this.options.height * this.options.scale);
                            }
                            this.ctx.drawImage(img, -this.options.x * this.options.scale, -this.options.y * this.options.scale);
                            return [2 /*return*/, this.canvas];
                    }
                });
            });
        };
        return ForeignObjectRenderer;
    }(Renderer));
    var loadSerializedSVG = function (svg) {
        return new Promise(function (resolve, reject) {
            var img = new Image();
            img.onload = function () {
                resolve(img);
            };
            img.onerror = reject;
            img.src = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(new XMLSerializer().serializeToString(svg));
        });
    };

    var Logger = /** @class */ (function () {
        function Logger(_a) {
            var id = _a.id, enabled = _a.enabled;
            this.id = id;
            this.enabled = enabled;
            this.start = Date.now();
        }
        // eslint-disable-next-line @typescript-eslint/no-explicit-any
        Logger.prototype.debug = function () {
            var args = [];
            for (var _i = 0; _i < arguments.length; _i++) {
                args[_i] = arguments[_i];
            }
            if (this.enabled) {
                // eslint-disable-next-line no-console
                if (typeof window !== 'undefined' && window.console && typeof console.debug === 'function') {
                    // eslint-disable-next-line no-console
                    console.debug.apply(console, __spreadArray([this.id, this.getTime() + "ms"], args));
                }
                else {
                    this.info.apply(this, args);
                }
            }
        };
        Logger.prototype.getTime = function () {
            return Date.now() - this.start;
        };
        // eslint-disable-next-line @typescript-eslint/no-explicit-any
        Logger.prototype.info = function () {
            var args = [];
            for (var _i = 0; _i < arguments.length; _i++) {
                args[_i] = arguments[_i];
            }
            if (this.enabled) {
                // eslint-disable-next-line no-console
                if (typeof window !== 'undefined' && window.console && typeof console.info === 'function') {
                    // eslint-disable-next-line no-console
                    console.info.apply(console, __spreadArray([this.id, this.getTime() + "ms"], args));
                }
            }
        };
        // eslint-disable-next-line @typescript-eslint/no-explicit-any
        Logger.prototype.warn = function () {
            var args = [];
            for (var _i = 0; _i < arguments.length; _i++) {
                args[_i] = arguments[_i];
            }
            if (this.enabled) {
                // eslint-disable-next-line no-console
                if (typeof window !== 'undefined' && window.console && typeof console.warn === 'function') {
                    // eslint-disable-next-line no-console
                    console.warn.apply(console, __spreadArray([this.id, this.getTime() + "ms"], args));
                }
                else {
                    this.info.apply(this, args);
                }
            }
        };
        // eslint-disable-next-line @typescript-eslint/no-explicit-any
        Logger.prototype.error = function () {
            var args = [];
            for (var _i = 0; _i < arguments.length; _i++) {
                args[_i] = arguments[_i];
            }
            if (this.enabled) {
                // eslint-disable-next-line no-console
                if (typeof window !== 'undefined' && window.console && typeof console.error === 'function') {
                    // eslint-disable-next-line no-console
                    console.error.apply(console, __spreadArray([this.id, this.getTime() + "ms"], args));
                }
                else {
                    this.info.apply(this, args);
                }
            }
        };
        Logger.instances = {};
        return Logger;
    }());

    var Context = /** @class */ (function () {
        function Context(options, windowBounds) {
            var _a;
            this.windowBounds = windowBounds;
            this.instanceName = "#" + Context.instanceCount++;
            this.logger = new Logger({ id: this.instanceName, enabled: options.logging });
            this.cache = (_a = options.cache) !== null && _a !== void 0 ? _a : new Cache(this, options);
        }
        Context.instanceCount = 1;
        return Context;
    }());

    var html2canvas = function (element, options) {
        if (options === void 0) { options = {}; }
        return renderElement(element, options);
    };
    if (typeof window !== 'undefined') {
        CacheStorage.setContext(window);
    }
    var renderElement = function (element, opts) { return __awaiter(void 0, void 0, void 0, function () {
        var ownerDocument, defaultView, resourceOptions, contextOptions, windowOptions, windowBounds, context, foreignObjectRendering, cloneOptions, documentCloner, clonedElement, container, _a, width, height, left, top, backgroundColor, renderOptions, canvas, renderer, root, renderer;
        var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
        return __generator(this, function (_u) {
            switch (_u.label) {
                case 0:
                    if (!element || typeof element !== 'object') {
                        return [2 /*return*/, Promise.reject('Invalid element provided as first argument')];
                    }
                    ownerDocument = element.ownerDocument;
                    if (!ownerDocument) {
                        throw new Error("Element is not attached to a Document");
                    }
                    defaultView = ownerDocument.defaultView;
                    if (!defaultView) {
                        throw new Error("Document is not attached to a Window");
                    }
                    resourceOptions = {
                        allowTaint: (_b = opts.allowTaint) !== null && _b !== void 0 ? _b : false,
                        imageTimeout: (_c = opts.imageTimeout) !== null && _c !== void 0 ? _c : 15000,
                        proxy: opts.proxy,
                        useCORS: (_d = opts.useCORS) !== null && _d !== void 0 ? _d : false
                    };
                    contextOptions = __assign({ logging: (_e = opts.logging) !== null && _e !== void 0 ? _e : true, cache: opts.cache }, resourceOptions);
                    windowOptions = {
                        windowWidth: (_f = opts.windowWidth) !== null && _f !== void 0 ? _f : defaultView.innerWidth,
                        windowHeight: (_g = opts.windowHeight) !== null && _g !== void 0 ? _g : defaultView.innerHeight,
                        scrollX: (_h = opts.scrollX) !== null && _h !== void 0 ? _h : defaultView.pageXOffset,
                        scrollY: (_j = opts.scrollY) !== null && _j !== void 0 ? _j : defaultView.pageYOffset
                    };
                    windowBounds = new Bounds(windowOptions.scrollX, windowOptions.scrollY, windowOptions.windowWidth, windowOptions.windowHeight);
                    context = new Context(contextOptions, windowBounds);
                    foreignObjectRendering = (_k = opts.foreignObjectRendering) !== null && _k !== void 0 ? _k : false;
                    cloneOptions = {
                        allowTaint: (_l = opts.allowTaint) !== null && _l !== void 0 ? _l : false,
                        onclone: opts.onclone,
                        ignoreElements: opts.ignoreElements,
                        inlineImages: foreignObjectRendering,
                        copyStyles: foreignObjectRendering
                    };
                    context.logger.debug("Starting document clone with size " + windowBounds.width + "x" + windowBounds.height + " scrolled to " + -windowBounds.left + "," + -windowBounds.top);
                    documentCloner = new DocumentCloner(context, element, cloneOptions);
                    clonedElement = documentCloner.clonedReferenceElement;
                    if (!clonedElement) {
                        return [2 /*return*/, Promise.reject("Unable to find element in cloned iframe")];
                    }
                    return [4 /*yield*/, documentCloner.toIFrame(ownerDocument, windowBounds)];
                case 1:
                    container = _u.sent();
                    _a = isBodyElement(clonedElement) || isHTMLElement(clonedElement)
                        ? parseDocumentSize(clonedElement.ownerDocument)
                        : parseBounds(context, clonedElement), width = _a.width, height = _a.height, left = _a.left, top = _a.top;
                    backgroundColor = parseBackgroundColor(context, clonedElement, opts.backgroundColor);
                    renderOptions = {
                        canvas: opts.canvas,
                        backgroundColor: backgroundColor,
                        scale: (_o = (_m = opts.scale) !== null && _m !== void 0 ? _m : defaultView.devicePixelRatio) !== null && _o !== void 0 ? _o : 1,
                        x: ((_p = opts.x) !== null && _p !== void 0 ? _p : 0) + left,
                        y: ((_q = opts.y) !== null && _q !== void 0 ? _q : 0) + top,
                        width: (_r = opts.width) !== null && _r !== void 0 ? _r : Math.ceil(width),
                        height: (_s = opts.height) !== null && _s !== void 0 ? _s : Math.ceil(height)
                    };
                    if (!foreignObjectRendering) return [3 /*break*/, 3];
                    context.logger.debug("Document cloned, using foreign object rendering");
                    renderer = new ForeignObjectRenderer(context, renderOptions);
                    return [4 /*yield*/, renderer.render(clonedElement)];
                case 2:
                    canvas = _u.sent();
                    return [3 /*break*/, 5];
                case 3:
                    context.logger.debug("Document cloned, element located at " + left + "," + top + " with size " + width + "x" + height + " using computed rendering");
                    context.logger.debug("Starting DOM parsing");
                    root = parseTree(context, clonedElement);
                    if (backgroundColor === root.styles.backgroundColor) {
                        root.styles.backgroundColor = COLORS.TRANSPARENT;
                    }
                    context.logger.debug("Starting renderer for element at " + renderOptions.x + "," + renderOptions.y + " with size " + renderOptions.width + "x" + renderOptions.height);
                    renderer = new CanvasRenderer(context, renderOptions);
                    return [4 /*yield*/, renderer.render(root)];
                case 4:
                    canvas = _u.sent();
                    _u.label = 5;
                case 5:
                    if ((_t = opts.removeContainer) !== null && _t !== void 0 ? _t : true) {
                        if (!DocumentCloner.destroy(container)) {
                            context.logger.error("Cannot detach cloned iframe as it is not in the DOM anymore");
                        }
                    }
                    context.logger.debug("Finished rendering");
                    return [2 /*return*/, canvas];
            }
        });
    }); };
    var parseBackgroundColor = function (context, element, backgroundColorOverride) {
        var ownerDocument = element.ownerDocument;
        // http://www.w3.org/TR/css3-background/#special-backgrounds
        var documentBackgroundColor = ownerDocument.documentElement
            ? parseColor(context, getComputedStyle(ownerDocument.documentElement).backgroundColor)
            : COLORS.TRANSPARENT;
        var bodyBackgroundColor = ownerDocument.body
            ? parseColor(context, getComputedStyle(ownerDocument.body).backgroundColor)
            : COLORS.TRANSPARENT;
        var defaultBackgroundColor = typeof backgroundColorOverride === 'string'
            ? parseColor(context, backgroundColorOverride)
            : backgroundColorOverride === null
                ? COLORS.TRANSPARENT
                : 0xffffffff;
        return element === ownerDocument.documentElement
            ? isTransparent(documentBackgroundColor)
                ? isTransparent(bodyBackgroundColor)
                    ? defaultBackgroundColor
                    : bodyBackgroundColor
                : documentBackgroundColor
            : defaultBackgroundColor;
    };

    return html2canvas;

})));
//# sourceMappingURL=html2canvas.js.map


/***/ }),

/***/ "./node_modules/imagesLoaded/imagesloaded.js":
/*!***************************************************!*\
  !*** ./node_modules/imagesLoaded/imagesloaded.js ***!
  \***************************************************/
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {

/*!
 * imagesLoaded v5.0.0
 * JavaScript is all like "You images are done yet or what?"
 * MIT License
 */

( function( window, factory ) {
  // universal module definition
  if (  true && module.exports ) {
    // CommonJS
    module.exports = factory( window, __webpack_require__(/*! ev-emitter */ "./node_modules/imagesLoaded/node_modules/ev-emitter/ev-emitter.js") );
  } else {
    // browser global
    window.imagesLoaded = factory( window, window.EvEmitter );
  }

} )( typeof window !== 'undefined' ? window : this,
    function factory( window, EvEmitter ) {

let $ = window.jQuery;
let console = window.console;

// -------------------------- helpers -------------------------- //

// turn element or nodeList into an array
function makeArray( obj ) {
  // use object if already an array
  if ( Array.isArray( obj ) ) return obj;

  let isArrayLike = typeof obj == 'object' && typeof obj.length == 'number';
  // convert nodeList to array
  if ( isArrayLike ) return [ ...obj ];

  // array of single index
  return [ obj ];
}

// -------------------------- imagesLoaded -------------------------- //

/**
 * @param {[Array, Element, NodeList, String]} elem
 * @param {[Object, Function]} options - if function, use as callback
 * @param {Function} onAlways - callback function
 * @returns {ImagesLoaded}
 */
function ImagesLoaded( elem, options, onAlways ) {
  // coerce ImagesLoaded() without new, to be new ImagesLoaded()
  if ( !( this instanceof ImagesLoaded ) ) {
    return new ImagesLoaded( elem, options, onAlways );
  }
  // use elem as selector string
  let queryElem = elem;
  if ( typeof elem == 'string' ) {
    queryElem = document.querySelectorAll( elem );
  }
  // bail if bad element
  if ( !queryElem ) {
    console.error(`Bad element for imagesLoaded ${queryElem || elem}`);
    return;
  }

  this.elements = makeArray( queryElem );
  this.options = {};
  // shift arguments if no options set
  if ( typeof options == 'function' ) {
    onAlways = options;
  } else {
    Object.assign( this.options, options );
  }

  if ( onAlways ) this.on( 'always', onAlways );

  this.getImages();
  // add jQuery Deferred object
  if ( $ ) this.jqDeferred = new $.Deferred();

  // HACK check async to allow time to bind listeners
  setTimeout( this.check.bind( this ) );
}

ImagesLoaded.prototype = Object.create( EvEmitter.prototype );

ImagesLoaded.prototype.getImages = function() {
  this.images = [];

  // filter & find items if we have an item selector
  this.elements.forEach( this.addElementImages, this );
};

const elementNodeTypes = [ 1, 9, 11 ];

/**
 * @param {Node} elem
 */
ImagesLoaded.prototype.addElementImages = function( elem ) {
  // filter siblings
  if ( elem.nodeName === 'IMG' ) {
    this.addImage( elem );
  }
  // get background image on element
  if ( this.options.background === true ) {
    this.addElementBackgroundImages( elem );
  }

  // find children
  // no non-element nodes, #143
  let { nodeType } = elem;
  if ( !nodeType || !elementNodeTypes.includes( nodeType ) ) return;

  let childImgs = elem.querySelectorAll('img');
  // concat childElems to filterFound array
  for ( let img of childImgs ) {
    this.addImage( img );
  }

  // get child background images
  if ( typeof this.options.background == 'string' ) {
    let children = elem.querySelectorAll( this.options.background );
    for ( let child of children ) {
      this.addElementBackgroundImages( child );
    }
  }
};

const reURL = /url\((['"])?(.*?)\1\)/gi;

ImagesLoaded.prototype.addElementBackgroundImages = function( elem ) {
  let style = getComputedStyle( elem );
  // Firefox returns null if in a hidden iframe https://bugzil.la/548397
  if ( !style ) return;

  // get url inside url("...")
  let matches = reURL.exec( style.backgroundImage );
  while ( matches !== null ) {
    let url = matches && matches[2];
    if ( url ) {
      this.addBackground( url, elem );
    }
    matches = reURL.exec( style.backgroundImage );
  }
};

/**
 * @param {Image} img
 */
ImagesLoaded.prototype.addImage = function( img ) {
  let loadingImage = new LoadingImage( img );
  this.images.push( loadingImage );
};

ImagesLoaded.prototype.addBackground = function( url, elem ) {
  let background = new Background( url, elem );
  this.images.push( background );
};

ImagesLoaded.prototype.check = function() {
  this.progressedCount = 0;
  this.hasAnyBroken = false;
  // complete if no images
  if ( !this.images.length ) {
    this.complete();
    return;
  }

  /* eslint-disable-next-line func-style */
  let onProgress = ( image, elem, message ) => {
    // HACK - Chrome triggers event before object properties have changed. #83
    setTimeout( () => {
      this.progress( image, elem, message );
    } );
  };

  this.images.forEach( function( loadingImage ) {
    loadingImage.once( 'progress', onProgress );
    loadingImage.check();
  } );
};

ImagesLoaded.prototype.progress = function( image, elem, message ) {
  this.progressedCount++;
  this.hasAnyBroken = this.hasAnyBroken || !image.isLoaded;
  // progress event
  this.emitEvent( 'progress', [ this, image, elem ] );
  if ( this.jqDeferred && this.jqDeferred.notify ) {
    this.jqDeferred.notify( this, image );
  }
  // check if completed
  if ( this.progressedCount === this.images.length ) {
    this.complete();
  }

  if ( this.options.debug && console ) {
    console.log( `progress: ${message}`, image, elem );
  }
};

ImagesLoaded.prototype.complete = function() {
  let eventName = this.hasAnyBroken ? 'fail' : 'done';
  this.isComplete = true;
  this.emitEvent( eventName, [ this ] );
  this.emitEvent( 'always', [ this ] );
  if ( this.jqDeferred ) {
    let jqMethod = this.hasAnyBroken ? 'reject' : 'resolve';
    this.jqDeferred[ jqMethod ]( this );
  }
};

// --------------------------  -------------------------- //

function LoadingImage( img ) {
  this.img = img;
}

LoadingImage.prototype = Object.create( EvEmitter.prototype );

LoadingImage.prototype.check = function() {
  // If complete is true and browser supports natural sizes,
  // try to check for image status manually.
  let isComplete = this.getIsImageComplete();
  if ( isComplete ) {
    // report based on naturalWidth
    this.confirm( this.img.naturalWidth !== 0, 'naturalWidth' );
    return;
  }

  // If none of the checks above matched, simulate loading on detached element.
  this.proxyImage = new Image();
  // add crossOrigin attribute. #204
  if ( this.img.crossOrigin ) {
    this.proxyImage.crossOrigin = this.img.crossOrigin;
  }
  this.proxyImage.addEventListener( 'load', this );
  this.proxyImage.addEventListener( 'error', this );
  // bind to image as well for Firefox. #191
  this.img.addEventListener( 'load', this );
  this.img.addEventListener( 'error', this );
  this.proxyImage.src = this.img.currentSrc || this.img.src;
};

LoadingImage.prototype.getIsImageComplete = function() {
  // check for non-zero, non-undefined naturalWidth
  // fixes Safari+InfiniteScroll+Masonry bug infinite-scroll#671
  return this.img.complete && this.img.naturalWidth;
};

LoadingImage.prototype.confirm = function( isLoaded, message ) {
  this.isLoaded = isLoaded;
  let { parentNode } = this.img;
  // emit progress with parent <picture> or self <img>
  let elem = parentNode.nodeName === 'PICTURE' ? parentNode : this.img;
  this.emitEvent( 'progress', [ this, elem, message ] );
};

// ----- events ----- //

// trigger specified handler for event type
LoadingImage.prototype.handleEvent = function( event ) {
  let method = 'on' + event.type;
  if ( this[ method ] ) {
    this[ method ]( event );
  }
};

LoadingImage.prototype.onload = function() {
  this.confirm( true, 'onload' );
  this.unbindEvents();
};

LoadingImage.prototype.onerror = function() {
  this.confirm( false, 'onerror' );
  this.unbindEvents();
};

LoadingImage.prototype.unbindEvents = function() {
  this.proxyImage.removeEventListener( 'load', this );
  this.proxyImage.removeEventListener( 'error', this );
  this.img.removeEventListener( 'load', this );
  this.img.removeEventListener( 'error', this );
};

// -------------------------- Background -------------------------- //

function Background( url, element ) {
  this.url = url;
  this.element = element;
  this.img = new Image();
}

// inherit LoadingImage prototype
Background.prototype = Object.create( LoadingImage.prototype );

Background.prototype.check = function() {
  this.img.addEventListener( 'load', this );
  this.img.addEventListener( 'error', this );
  this.img.src = this.url;
  // check if image is already complete
  let isComplete = this.getIsImageComplete();
  if ( isComplete ) {
    this.confirm( this.img.naturalWidth !== 0, 'naturalWidth' );
    this.unbindEvents();
  }
};

Background.prototype.unbindEvents = function() {
  this.img.removeEventListener( 'load', this );
  this.img.removeEventListener( 'error', this );
};

Background.prototype.confirm = function( isLoaded, message ) {
  this.isLoaded = isLoaded;
  this.emitEvent( 'progress', [ this, this.element, message ] );
};

// -------------------------- jQuery -------------------------- //

ImagesLoaded.makeJQueryPlugin = function( jQuery ) {
  jQuery = jQuery || window.jQuery;
  if ( !jQuery ) return;

  // set local variable
  $ = jQuery;
  // $().imagesLoaded()
  $.fn.imagesLoaded = function( options, onAlways ) {
    let instance = new ImagesLoaded( this, options, onAlways );
    return instance.jqDeferred.promise( $( this ) );
  };
};
// try making plugin
ImagesLoaded.makeJQueryPlugin();

// --------------------------  -------------------------- //

return ImagesLoaded;

} );


/***/ }),

/***/ "./node_modules/imagesLoaded/node_modules/ev-emitter/ev-emitter.js":
/*!*************************************************************************!*\
  !*** ./node_modules/imagesLoaded/node_modules/ev-emitter/ev-emitter.js ***!
  \*************************************************************************/
/***/ (function(module) {

/**
 * EvEmitter v2.1.1
 * Lil' event emitter
 * MIT License
 */

( function( global, factory ) {
  // universal module definition
  if (  true && module.exports ) {
    // CommonJS - Browserify, Webpack
    module.exports = factory();
  } else {
    // Browser globals
    global.EvEmitter = factory();
  }

}( typeof window != 'undefined' ? window : this, function() {

function EvEmitter() {}

let proto = EvEmitter.prototype;

proto.on = function( eventName, listener ) {
  if ( !eventName || !listener ) return this;

  // set events hash
  let events = this._events = this._events || {};
  // set listeners array
  let listeners = events[ eventName ] = events[ eventName ] || [];
  // only add once
  if ( !listeners.includes( listener ) ) {
    listeners.push( listener );
  }

  return this;
};

proto.once = function( eventName, listener ) {
  if ( !eventName || !listener ) return this;

  // add event
  this.on( eventName, listener );
  // set once flag
  // set onceEvents hash
  let onceEvents = this._onceEvents = this._onceEvents || {};
  // set onceListeners object
  let onceListeners = onceEvents[ eventName ] = onceEvents[ eventName ] || {};
  // set flag
  onceListeners[ listener ] = true;

  return this;
};

proto.off = function( eventName, listener ) {
  let listeners = this._events && this._events[ eventName ];
  if ( !listeners || !listeners.length ) return this;

  let index = listeners.indexOf( listener );
  if ( index != -1 ) {
    listeners.splice( index, 1 );
  }

  return this;
};

proto.emitEvent = function( eventName, args ) {
  let listeners = this._events && this._events[ eventName ];
  if ( !listeners || !listeners.length ) return this;

  // copy over to avoid interference if .off() in listener
  listeners = listeners.slice( 0 );
  args = args || [];
  // once stuff
  let onceListeners = this._onceEvents && this._onceEvents[ eventName ];

  for ( let listener of listeners ) {
    let isOnce = onceListeners && onceListeners[ listener ];
    if ( isOnce ) {
      // remove listener
      // remove before trigger to prevent recursion
      this.off( eventName, listener );
      // unset once flag
      delete onceListeners[ listener ];
    }
    // trigger listener
    listener.apply( this, args );
  }

  return this;
};

proto.allOff = function() {
  delete this._events;
  delete this._onceEvents;
  return this;
};

return EvEmitter;

} ) );


/***/ }),

/***/ "./node_modules/masonry-layout/masonry.js":
/*!************************************************!*\
  !*** ./node_modules/masonry-layout/masonry.js ***!
  \************************************************/
/***/ ((module, exports, __webpack_require__) => {

var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
 * Masonry v4.2.2
 * Cascading grid layout library
 * https://masonry.desandro.com
 * MIT License
 * by David DeSandro
 */

( function( window, factory ) {
  // universal module definition
  /* jshint strict: false */ /*globals define, module, require */
  if ( true ) {
    // AMD
    !(__WEBPACK_AMD_DEFINE_ARRAY__ = [
        __webpack_require__(/*! outlayer/outlayer */ "./node_modules/outlayer/outlayer.js"),
        __webpack_require__(/*! get-size/get-size */ "./node_modules/get-size/get-size.js")
      ], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
		__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
		(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),
		__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
  } else {}

}( window, function factory( Outlayer, getSize ) {

'use strict';

// -------------------------- masonryDefinition -------------------------- //

  // create an Outlayer layout class
  var Masonry = Outlayer.create('masonry');
  // isFitWidth -> fitWidth
  Masonry.compatOptions.fitWidth = 'isFitWidth';

  var proto = Masonry.prototype;

  proto._resetLayout = function() {
    this.getSize();
    this._getMeasurement( 'columnWidth', 'outerWidth' );
    this._getMeasurement( 'gutter', 'outerWidth' );
    this.measureColumns();

    // reset column Y
    this.colYs = [];
    for ( var i=0; i < this.cols; i++ ) {
      this.colYs.push( 0 );
    }

    this.maxY = 0;
    this.horizontalColIndex = 0;
  };

  proto.measureColumns = function() {
    this.getContainerWidth();
    // if columnWidth is 0, default to outerWidth of first item
    if ( !this.columnWidth ) {
      var firstItem = this.items[0];
      var firstItemElem = firstItem && firstItem.element;
      // columnWidth fall back to item of first element
      this.columnWidth = firstItemElem && getSize( firstItemElem ).outerWidth ||
        // if first elem has no width, default to size of container
        this.containerWidth;
    }

    var columnWidth = this.columnWidth += this.gutter;

    // calculate columns
    var containerWidth = this.containerWidth + this.gutter;
    var cols = containerWidth / columnWidth;
    // fix rounding errors, typically with gutters
    var excess = columnWidth - containerWidth % columnWidth;
    // if overshoot is less than a pixel, round up, otherwise floor it
    var mathMethod = excess && excess < 1 ? 'round' : 'floor';
    cols = Math[ mathMethod ]( cols );
    this.cols = Math.max( cols, 1 );
  };

  proto.getContainerWidth = function() {
    // container is parent if fit width
    var isFitWidth = this._getOption('fitWidth');
    var container = isFitWidth ? this.element.parentNode : this.element;
    // check that this.size and size are there
    // IE8 triggers resize on body size change, so they might not be
    var size = getSize( container );
    this.containerWidth = size && size.innerWidth;
  };

  proto._getItemLayoutPosition = function( item ) {
    item.getSize();
    // how many columns does this brick span
    var remainder = item.size.outerWidth % this.columnWidth;
    var mathMethod = remainder && remainder < 1 ? 'round' : 'ceil';
    // round if off by 1 pixel, otherwise use ceil
    var colSpan = Math[ mathMethod ]( item.size.outerWidth / this.columnWidth );
    colSpan = Math.min( colSpan, this.cols );
    // use horizontal or top column position
    var colPosMethod = this.options.horizontalOrder ?
      '_getHorizontalColPosition' : '_getTopColPosition';
    var colPosition = this[ colPosMethod ]( colSpan, item );
    // position the brick
    var position = {
      x: this.columnWidth * colPosition.col,
      y: colPosition.y
    };
    // apply setHeight to necessary columns
    var setHeight = colPosition.y + item.size.outerHeight;
    var setMax = colSpan + colPosition.col;
    for ( var i = colPosition.col; i < setMax; i++ ) {
      this.colYs[i] = setHeight;
    }

    return position;
  };

  proto._getTopColPosition = function( colSpan ) {
    var colGroup = this._getTopColGroup( colSpan );
    // get the minimum Y value from the columns
    var minimumY = Math.min.apply( Math, colGroup );

    return {
      col: colGroup.indexOf( minimumY ),
      y: minimumY,
    };
  };

  /**
   * @param {Number} colSpan - number of columns the element spans
   * @returns {Array} colGroup
   */
  proto._getTopColGroup = function( colSpan ) {
    if ( colSpan < 2 ) {
      // if brick spans only one column, use all the column Ys
      return this.colYs;
    }

    var colGroup = [];
    // how many different places could this brick fit horizontally
    var groupCount = this.cols + 1 - colSpan;
    // for each group potential horizontal position
    for ( var i = 0; i < groupCount; i++ ) {
      colGroup[i] = this._getColGroupY( i, colSpan );
    }
    return colGroup;
  };

  proto._getColGroupY = function( col, colSpan ) {
    if ( colSpan < 2 ) {
      return this.colYs[ col ];
    }
    // make an array of colY values for that one group
    var groupColYs = this.colYs.slice( col, col + colSpan );
    // and get the max value of the array
    return Math.max.apply( Math, groupColYs );
  };

  // get column position based on horizontal index. #873
  proto._getHorizontalColPosition = function( colSpan, item ) {
    var col = this.horizontalColIndex % this.cols;
    var isOver = colSpan > 1 && col + colSpan > this.cols;
    // shift to next row if item can't fit on current row
    col = isOver ? 0 : col;
    // don't let zero-size items take up space
    var hasSize = item.size.outerWidth && item.size.outerHeight;
    this.horizontalColIndex = hasSize ? col + colSpan : this.horizontalColIndex;

    return {
      col: col,
      y: this._getColGroupY( col, colSpan ),
    };
  };

  proto._manageStamp = function( stamp ) {
    var stampSize = getSize( stamp );
    var offset = this._getElementOffset( stamp );
    // get the columns that this stamp affects
    var isOriginLeft = this._getOption('originLeft');
    var firstX = isOriginLeft ? offset.left : offset.right;
    var lastX = firstX + stampSize.outerWidth;
    var firstCol = Math.floor( firstX / this.columnWidth );
    firstCol = Math.max( 0, firstCol );
    var lastCol = Math.floor( lastX / this.columnWidth );
    // lastCol should not go over if multiple of columnWidth #425
    lastCol -= lastX % this.columnWidth ? 0 : 1;
    lastCol = Math.min( this.cols - 1, lastCol );
    // set colYs to bottom of the stamp

    var isOriginTop = this._getOption('originTop');
    var stampMaxY = ( isOriginTop ? offset.top : offset.bottom ) +
      stampSize.outerHeight;
    for ( var i = firstCol; i <= lastCol; i++ ) {
      this.colYs[i] = Math.max( stampMaxY, this.colYs[i] );
    }
  };

  proto._getContainerSize = function() {
    this.maxY = Math.max.apply( Math, this.colYs );
    var size = {
      height: this.maxY
    };

    if ( this._getOption('fitWidth') ) {
      size.width = this._getContainerFitWidth();
    }

    return size;
  };

  proto._getContainerFitWidth = function() {
    var unusedCols = 0;
    // count unused columns
    var i = this.cols;
    while ( --i ) {
      if ( this.colYs[i] !== 0 ) {
        break;
      }
      unusedCols++;
    }
    // fit container to columns that have been used
    return ( this.cols - unusedCols ) * this.columnWidth - this.gutter;
  };

  proto.needsResizeLayout = function() {
    var previousWidth = this.containerWidth;
    this.getContainerWidth();
    return previousWidth != this.containerWidth;
  };

  return Masonry;

}));


/***/ }),

/***/ "./node_modules/@splidejs/splide/dist/css/splide-core.min.css":
/*!********************************************************************!*\
  !*** ./node_modules/@splidejs/splide/dist/css/splide-core.min.css ***!
  \********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin


/***/ }),

/***/ "./node_modules/animate.css/animate.css":
/*!**********************************************!*\
  !*** ./node_modules/animate.css/animate.css ***!
  \**********************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin


/***/ }),

/***/ "./node_modules/outlayer/item.js":
/*!***************************************!*\
  !*** ./node_modules/outlayer/item.js ***!
  \***************************************/
/***/ ((module, exports, __webpack_require__) => {

var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/**
 * Outlayer Item
 */

( function( window, factory ) {
  // universal module definition
  /* jshint strict: false */ /* globals define, module, require */
  if ( true ) {
    // AMD - RequireJS
    !(__WEBPACK_AMD_DEFINE_ARRAY__ = [
        __webpack_require__(/*! ev-emitter/ev-emitter */ "./node_modules/ev-emitter/ev-emitter.js"),
        __webpack_require__(/*! get-size/get-size */ "./node_modules/get-size/get-size.js")
      ], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
		__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
		(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),
		__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
  } else {}

}( window, function factory( EvEmitter, getSize ) {
'use strict';

// ----- helpers ----- //

function isEmptyObj( obj ) {
  for ( var prop in obj ) {
    return false;
  }
  prop = null;
  return true;
}

// -------------------------- CSS3 support -------------------------- //


var docElemStyle = document.documentElement.style;

var transitionProperty = typeof docElemStyle.transition == 'string' ?
  'transition' : 'WebkitTransition';
var transformProperty = typeof docElemStyle.transform == 'string' ?
  'transform' : 'WebkitTransform';

var transitionEndEvent = {
  WebkitTransition: 'webkitTransitionEnd',
  transition: 'transitionend'
}[ transitionProperty ];

// cache all vendor properties that could have vendor prefix
var vendorProperties = {
  transform: transformProperty,
  transition: transitionProperty,
  transitionDuration: transitionProperty + 'Duration',
  transitionProperty: transitionProperty + 'Property',
  transitionDelay: transitionProperty + 'Delay'
};

// -------------------------- Item -------------------------- //

function Item( element, layout ) {
  if ( !element ) {
    return;
  }

  this.element = element;
  // parent layout class, i.e. Masonry, Isotope, or Packery
  this.layout = layout;
  this.position = {
    x: 0,
    y: 0
  };

  this._create();
}

// inherit EvEmitter
var proto = Item.prototype = Object.create( EvEmitter.prototype );
proto.constructor = Item;

proto._create = function() {
  // transition objects
  this._transn = {
    ingProperties: {},
    clean: {},
    onEnd: {}
  };

  this.css({
    position: 'absolute'
  });
};

// trigger specified handler for event type
proto.handleEvent = function( event ) {
  var method = 'on' + event.type;
  if ( this[ method ] ) {
    this[ method ]( event );
  }
};

proto.getSize = function() {
  this.size = getSize( this.element );
};

/**
 * apply CSS styles to element
 * @param {Object} style
 */
proto.css = function( style ) {
  var elemStyle = this.element.style;

  for ( var prop in style ) {
    // use vendor property if available
    var supportedProp = vendorProperties[ prop ] || prop;
    elemStyle[ supportedProp ] = style[ prop ];
  }
};

 // measure position, and sets it
proto.getPosition = function() {
  var style = getComputedStyle( this.element );
  var isOriginLeft = this.layout._getOption('originLeft');
  var isOriginTop = this.layout._getOption('originTop');
  var xValue = style[ isOriginLeft ? 'left' : 'right' ];
  var yValue = style[ isOriginTop ? 'top' : 'bottom' ];
  var x = parseFloat( xValue );
  var y = parseFloat( yValue );
  // convert percent to pixels
  var layoutSize = this.layout.size;
  if ( xValue.indexOf('%') != -1 ) {
    x = ( x / 100 ) * layoutSize.width;
  }
  if ( yValue.indexOf('%') != -1 ) {
    y = ( y / 100 ) * layoutSize.height;
  }
  // clean up 'auto' or other non-integer values
  x = isNaN( x ) ? 0 : x;
  y = isNaN( y ) ? 0 : y;
  // remove padding from measurement
  x -= isOriginLeft ? layoutSize.paddingLeft : layoutSize.paddingRight;
  y -= isOriginTop ? layoutSize.paddingTop : layoutSize.paddingBottom;

  this.position.x = x;
  this.position.y = y;
};

// set settled position, apply padding
proto.layoutPosition = function() {
  var layoutSize = this.layout.size;
  var style = {};
  var isOriginLeft = this.layout._getOption('originLeft');
  var isOriginTop = this.layout._getOption('originTop');

  // x
  var xPadding = isOriginLeft ? 'paddingLeft' : 'paddingRight';
  var xProperty = isOriginLeft ? 'left' : 'right';
  var xResetProperty = isOriginLeft ? 'right' : 'left';

  var x = this.position.x + layoutSize[ xPadding ];
  // set in percentage or pixels
  style[ xProperty ] = this.getXValue( x );
  // reset other property
  style[ xResetProperty ] = '';

  // y
  var yPadding = isOriginTop ? 'paddingTop' : 'paddingBottom';
  var yProperty = isOriginTop ? 'top' : 'bottom';
  var yResetProperty = isOriginTop ? 'bottom' : 'top';

  var y = this.position.y + layoutSize[ yPadding ];
  // set in percentage or pixels
  style[ yProperty ] = this.getYValue( y );
  // reset other property
  style[ yResetProperty ] = '';

  this.css( style );
  this.emitEvent( 'layout', [ this ] );
};

proto.getXValue = function( x ) {
  var isHorizontal = this.layout._getOption('horizontal');
  return this.layout.options.percentPosition && !isHorizontal ?
    ( ( x / this.layout.size.width ) * 100 ) + '%' : x + 'px';
};

proto.getYValue = function( y ) {
  var isHorizontal = this.layout._getOption('horizontal');
  return this.layout.options.percentPosition && isHorizontal ?
    ( ( y / this.layout.size.height ) * 100 ) + '%' : y + 'px';
};

proto._transitionTo = function( x, y ) {
  this.getPosition();
  // get current x & y from top/left
  var curX = this.position.x;
  var curY = this.position.y;

  var didNotMove = x == this.position.x && y == this.position.y;

  // save end position
  this.setPosition( x, y );

  // if did not move and not transitioning, just go to layout
  if ( didNotMove && !this.isTransitioning ) {
    this.layoutPosition();
    return;
  }

  var transX = x - curX;
  var transY = y - curY;
  var transitionStyle = {};
  transitionStyle.transform = this.getTranslate( transX, transY );

  this.transition({
    to: transitionStyle,
    onTransitionEnd: {
      transform: this.layoutPosition
    },
    isCleaning: true
  });
};

proto.getTranslate = function( x, y ) {
  // flip cooridinates if origin on right or bottom
  var isOriginLeft = this.layout._getOption('originLeft');
  var isOriginTop = this.layout._getOption('originTop');
  x = isOriginLeft ? x : -x;
  y = isOriginTop ? y : -y;
  return 'translate3d(' + x + 'px, ' + y + 'px, 0)';
};

// non transition + transform support
proto.goTo = function( x, y ) {
  this.setPosition( x, y );
  this.layoutPosition();
};

proto.moveTo = proto._transitionTo;

proto.setPosition = function( x, y ) {
  this.position.x = parseFloat( x );
  this.position.y = parseFloat( y );
};

// ----- transition ----- //

/**
 * @param {Object} style - CSS
 * @param {Function} onTransitionEnd
 */

// non transition, just trigger callback
proto._nonTransition = function( args ) {
  this.css( args.to );
  if ( args.isCleaning ) {
    this._removeStyles( args.to );
  }
  for ( var prop in args.onTransitionEnd ) {
    args.onTransitionEnd[ prop ].call( this );
  }
};

/**
 * proper transition
 * @param {Object} args - arguments
 *   @param {Object} to - style to transition to
 *   @param {Object} from - style to start transition from
 *   @param {Boolean} isCleaning - removes transition styles after transition
 *   @param {Function} onTransitionEnd - callback
 */
proto.transition = function( args ) {
  // redirect to nonTransition if no transition duration
  if ( !parseFloat( this.layout.options.transitionDuration ) ) {
    this._nonTransition( args );
    return;
  }

  var _transition = this._transn;
  // keep track of onTransitionEnd callback by css property
  for ( var prop in args.onTransitionEnd ) {
    _transition.onEnd[ prop ] = args.onTransitionEnd[ prop ];
  }
  // keep track of properties that are transitioning
  for ( prop in args.to ) {
    _transition.ingProperties[ prop ] = true;
    // keep track of properties to clean up when transition is done
    if ( args.isCleaning ) {
      _transition.clean[ prop ] = true;
    }
  }

  // set from styles
  if ( args.from ) {
    this.css( args.from );
    // force redraw. http://blog.alexmaccaw.com/css-transitions
    var h = this.element.offsetHeight;
    // hack for JSHint to hush about unused var
    h = null;
  }
  // enable transition
  this.enableTransition( args.to );
  // set styles that are transitioning
  this.css( args.to );

  this.isTransitioning = true;

};

// dash before all cap letters, including first for
// WebkitTransform => -webkit-transform
function toDashedAll( str ) {
  return str.replace( /([A-Z])/g, function( $1 ) {
    return '-' + $1.toLowerCase();
  });
}

var transitionProps = 'opacity,' + toDashedAll( transformProperty );

proto.enableTransition = function(/* style */) {
  // HACK changing transitionProperty during a transition
  // will cause transition to jump
  if ( this.isTransitioning ) {
    return;
  }

  // make `transition: foo, bar, baz` from style object
  // HACK un-comment this when enableTransition can work
  // while a transition is happening
  // var transitionValues = [];
  // for ( var prop in style ) {
  //   // dash-ify camelCased properties like WebkitTransition
  //   prop = vendorProperties[ prop ] || prop;
  //   transitionValues.push( toDashedAll( prop ) );
  // }
  // munge number to millisecond, to match stagger
  var duration = this.layout.options.transitionDuration;
  duration = typeof duration == 'number' ? duration + 'ms' : duration;
  // enable transition styles
  this.css({
    transitionProperty: transitionProps,
    transitionDuration: duration,
    transitionDelay: this.staggerDelay || 0
  });
  // listen for transition end event
  this.element.addEventListener( transitionEndEvent, this, false );
};

// ----- events ----- //

proto.onwebkitTransitionEnd = function( event ) {
  this.ontransitionend( event );
};

proto.onotransitionend = function( event ) {
  this.ontransitionend( event );
};

// properties that I munge to make my life easier
var dashedVendorProperties = {
  '-webkit-transform': 'transform'
};

proto.ontransitionend = function( event ) {
  // disregard bubbled events from children
  if ( event.target !== this.element ) {
    return;
  }
  var _transition = this._transn;
  // get property name of transitioned property, convert to prefix-free
  var propertyName = dashedVendorProperties[ event.propertyName ] || event.propertyName;

  // remove property that has completed transitioning
  delete _transition.ingProperties[ propertyName ];
  // check if any properties are still transitioning
  if ( isEmptyObj( _transition.ingProperties ) ) {
    // all properties have completed transitioning
    this.disableTransition();
  }
  // clean style
  if ( propertyName in _transition.clean ) {
    // clean up style
    this.element.style[ event.propertyName ] = '';
    delete _transition.clean[ propertyName ];
  }
  // trigger onTransitionEnd callback
  if ( propertyName in _transition.onEnd ) {
    var onTransitionEnd = _transition.onEnd[ propertyName ];
    onTransitionEnd.call( this );
    delete _transition.onEnd[ propertyName ];
  }

  this.emitEvent( 'transitionEnd', [ this ] );
};

proto.disableTransition = function() {
  this.removeTransitionStyles();
  this.element.removeEventListener( transitionEndEvent, this, false );
  this.isTransitioning = false;
};

/**
 * removes style property from element
 * @param {Object} style
**/
proto._removeStyles = function( style ) {
  // clean up transition styles
  var cleanStyle = {};
  for ( var prop in style ) {
    cleanStyle[ prop ] = '';
  }
  this.css( cleanStyle );
};

var cleanTransitionStyle = {
  transitionProperty: '',
  transitionDuration: '',
  transitionDelay: ''
};

proto.removeTransitionStyles = function() {
  // remove transition
  this.css( cleanTransitionStyle );
};

// ----- stagger ----- //

proto.stagger = function( delay ) {
  delay = isNaN( delay ) ? 0 : delay;
  this.staggerDelay = delay + 'ms';
};

// ----- show/hide/remove ----- //

// remove element from DOM
proto.removeElem = function() {
  this.element.parentNode.removeChild( this.element );
  // remove display: none
  this.css({ display: '' });
  this.emitEvent( 'remove', [ this ] );
};

proto.remove = function() {
  // just remove element if no transition support or no transition
  if ( !transitionProperty || !parseFloat( this.layout.options.transitionDuration ) ) {
    this.removeElem();
    return;
  }

  // start transition
  this.once( 'transitionEnd', function() {
    this.removeElem();
  });
  this.hide();
};

proto.reveal = function() {
  delete this.isHidden;
  // remove display: none
  this.css({ display: '' });

  var options = this.layout.options;

  var onTransitionEnd = {};
  var transitionEndProperty = this.getHideRevealTransitionEndProperty('visibleStyle');
  onTransitionEnd[ transitionEndProperty ] = this.onRevealTransitionEnd;

  this.transition({
    from: options.hiddenStyle,
    to: options.visibleStyle,
    isCleaning: true,
    onTransitionEnd: onTransitionEnd
  });
};

proto.onRevealTransitionEnd = function() {
  // check if still visible
  // during transition, item may have been hidden
  if ( !this.isHidden ) {
    this.emitEvent('reveal');
  }
};

/**
 * get style property use for hide/reveal transition end
 * @param {String} styleProperty - hiddenStyle/visibleStyle
 * @returns {String}
 */
proto.getHideRevealTransitionEndProperty = function( styleProperty ) {
  var optionStyle = this.layout.options[ styleProperty ];
  // use opacity
  if ( optionStyle.opacity ) {
    return 'opacity';
  }
  // get first property
  for ( var prop in optionStyle ) {
    return prop;
  }
};

proto.hide = function() {
  // set flag
  this.isHidden = true;
  // remove display: none
  this.css({ display: '' });

  var options = this.layout.options;

  var onTransitionEnd = {};
  var transitionEndProperty = this.getHideRevealTransitionEndProperty('hiddenStyle');
  onTransitionEnd[ transitionEndProperty ] = this.onHideTransitionEnd;

  this.transition({
    from: options.visibleStyle,
    to: options.hiddenStyle,
    // keep hidden stuff hidden
    isCleaning: true,
    onTransitionEnd: onTransitionEnd
  });
};

proto.onHideTransitionEnd = function() {
  // check if still hidden
  // during transition, item may have been un-hidden
  if ( this.isHidden ) {
    this.css({ display: 'none' });
    this.emitEvent('hide');
  }
};

proto.destroy = function() {
  this.css({
    position: '',
    left: '',
    right: '',
    top: '',
    bottom: '',
    transition: '',
    transform: ''
  });
};

return Item;

}));


/***/ }),

/***/ "./node_modules/outlayer/outlayer.js":
/*!*******************************************!*\
  !*** ./node_modules/outlayer/outlayer.js ***!
  \*******************************************/
/***/ ((module, exports, __webpack_require__) => {

var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
 * Outlayer v2.1.1
 * the brains and guts of a layout library
 * MIT license
 */

( function( window, factory ) {
  'use strict';
  // universal module definition
  /* jshint strict: false */ /* globals define, module, require */
  if ( true ) {
    // AMD - RequireJS
    !(__WEBPACK_AMD_DEFINE_ARRAY__ = [
        __webpack_require__(/*! ev-emitter/ev-emitter */ "./node_modules/ev-emitter/ev-emitter.js"),
        __webpack_require__(/*! get-size/get-size */ "./node_modules/get-size/get-size.js"),
        __webpack_require__(/*! fizzy-ui-utils/utils */ "./node_modules/fizzy-ui-utils/utils.js"),
        __webpack_require__(/*! ./item */ "./node_modules/outlayer/item.js")
      ], __WEBPACK_AMD_DEFINE_RESULT__ = (function( EvEmitter, getSize, utils, Item ) {
        return factory( window, EvEmitter, getSize, utils, Item);
      }).apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__),
		__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
  } else {}

}( window, function factory( window, EvEmitter, getSize, utils, Item ) {
'use strict';

// ----- vars ----- //

var console = window.console;
var jQuery = window.jQuery;
var noop = function() {};

// -------------------------- Outlayer -------------------------- //

// globally unique identifiers
var GUID = 0;
// internal store of all Outlayer intances
var instances = {};


/**
 * @param {Element, String} element
 * @param {Object} options
 * @constructor
 */
function Outlayer( element, options ) {
  var queryElement = utils.getQueryElement( element );
  if ( !queryElement ) {
    if ( console ) {
      console.error( 'Bad element for ' + this.constructor.namespace +
        ': ' + ( queryElement || element ) );
    }
    return;
  }
  this.element = queryElement;
  // add jQuery
  if ( jQuery ) {
    this.$element = jQuery( this.element );
  }

  // options
  this.options = utils.extend( {}, this.constructor.defaults );
  this.option( options );

  // add id for Outlayer.getFromElement
  var id = ++GUID;
  this.element.outlayerGUID = id; // expando
  instances[ id ] = this; // associate via id

  // kick it off
  this._create();

  var isInitLayout = this._getOption('initLayout');
  if ( isInitLayout ) {
    this.layout();
  }
}

// settings are for internal use only
Outlayer.namespace = 'outlayer';
Outlayer.Item = Item;

// default options
Outlayer.defaults = {
  containerStyle: {
    position: 'relative'
  },
  initLayout: true,
  originLeft: true,
  originTop: true,
  resize: true,
  resizeContainer: true,
  // item options
  transitionDuration: '0.4s',
  hiddenStyle: {
    opacity: 0,
    transform: 'scale(0.001)'
  },
  visibleStyle: {
    opacity: 1,
    transform: 'scale(1)'
  }
};

var proto = Outlayer.prototype;
// inherit EvEmitter
utils.extend( proto, EvEmitter.prototype );

/**
 * set options
 * @param {Object} opts
 */
proto.option = function( opts ) {
  utils.extend( this.options, opts );
};

/**
 * get backwards compatible option value, check old name
 */
proto._getOption = function( option ) {
  var oldOption = this.constructor.compatOptions[ option ];
  return oldOption && this.options[ oldOption ] !== undefined ?
    this.options[ oldOption ] : this.options[ option ];
};

Outlayer.compatOptions = {
  // currentName: oldName
  initLayout: 'isInitLayout',
  horizontal: 'isHorizontal',
  layoutInstant: 'isLayoutInstant',
  originLeft: 'isOriginLeft',
  originTop: 'isOriginTop',
  resize: 'isResizeBound',
  resizeContainer: 'isResizingContainer'
};

proto._create = function() {
  // get items from children
  this.reloadItems();
  // elements that affect layout, but are not laid out
  this.stamps = [];
  this.stamp( this.options.stamp );
  // set container style
  utils.extend( this.element.style, this.options.containerStyle );

  // bind resize method
  var canBindResize = this._getOption('resize');
  if ( canBindResize ) {
    this.bindResize();
  }
};

// goes through all children again and gets bricks in proper order
proto.reloadItems = function() {
  // collection of item elements
  this.items = this._itemize( this.element.children );
};


/**
 * turn elements into Outlayer.Items to be used in layout
 * @param {Array or NodeList or HTMLElement} elems
 * @returns {Array} items - collection of new Outlayer Items
 */
proto._itemize = function( elems ) {

  var itemElems = this._filterFindItemElements( elems );
  var Item = this.constructor.Item;

  // create new Outlayer Items for collection
  var items = [];
  for ( var i=0; i < itemElems.length; i++ ) {
    var elem = itemElems[i];
    var item = new Item( elem, this );
    items.push( item );
  }

  return items;
};

/**
 * get item elements to be used in layout
 * @param {Array or NodeList or HTMLElement} elems
 * @returns {Array} items - item elements
 */
proto._filterFindItemElements = function( elems ) {
  return utils.filterFindElements( elems, this.options.itemSelector );
};

/**
 * getter method for getting item elements
 * @returns {Array} elems - collection of item elements
 */
proto.getItemElements = function() {
  return this.items.map( function( item ) {
    return item.element;
  });
};

// ----- init & layout ----- //

/**
 * lays out all items
 */
proto.layout = function() {
  this._resetLayout();
  this._manageStamps();

  // don't animate first layout
  var layoutInstant = this._getOption('layoutInstant');
  var isInstant = layoutInstant !== undefined ?
    layoutInstant : !this._isLayoutInited;
  this.layoutItems( this.items, isInstant );

  // flag for initalized
  this._isLayoutInited = true;
};

// _init is alias for layout
proto._init = proto.layout;

/**
 * logic before any new layout
 */
proto._resetLayout = function() {
  this.getSize();
};


proto.getSize = function() {
  this.size = getSize( this.element );
};

/**
 * get measurement from option, for columnWidth, rowHeight, gutter
 * if option is String -> get element from selector string, & get size of element
 * if option is Element -> get size of element
 * else use option as a number
 *
 * @param {String} measurement
 * @param {String} size - width or height
 * @private
 */
proto._getMeasurement = function( measurement, size ) {
  var option = this.options[ measurement ];
  var elem;
  if ( !option ) {
    // default to 0
    this[ measurement ] = 0;
  } else {
    // use option as an element
    if ( typeof option == 'string' ) {
      elem = this.element.querySelector( option );
    } else if ( option instanceof HTMLElement ) {
      elem = option;
    }
    // use size of element, if element
    this[ measurement ] = elem ? getSize( elem )[ size ] : option;
  }
};

/**
 * layout a collection of item elements
 * @api public
 */
proto.layoutItems = function( items, isInstant ) {
  items = this._getItemsForLayout( items );

  this._layoutItems( items, isInstant );

  this._postLayout();
};

/**
 * get the items to be laid out
 * you may want to skip over some items
 * @param {Array} items
 * @returns {Array} items
 */
proto._getItemsForLayout = function( items ) {
  return items.filter( function( item ) {
    return !item.isIgnored;
  });
};

/**
 * layout items
 * @param {Array} items
 * @param {Boolean} isInstant
 */
proto._layoutItems = function( items, isInstant ) {
  this._emitCompleteOnItems( 'layout', items );

  if ( !items || !items.length ) {
    // no items, emit event with empty array
    return;
  }

  var queue = [];

  items.forEach( function( item ) {
    // get x/y object from method
    var position = this._getItemLayoutPosition( item );
    // enqueue
    position.item = item;
    position.isInstant = isInstant || item.isLayoutInstant;
    queue.push( position );
  }, this );

  this._processLayoutQueue( queue );
};

/**
 * get item layout position
 * @param {Outlayer.Item} item
 * @returns {Object} x and y position
 */
proto._getItemLayoutPosition = function( /* item */ ) {
  return {
    x: 0,
    y: 0
  };
};

/**
 * iterate over array and position each item
 * Reason being - separating this logic prevents 'layout invalidation'
 * thx @paul_irish
 * @param {Array} queue
 */
proto._processLayoutQueue = function( queue ) {
  this.updateStagger();
  queue.forEach( function( obj, i ) {
    this._positionItem( obj.item, obj.x, obj.y, obj.isInstant, i );
  }, this );
};

// set stagger from option in milliseconds number
proto.updateStagger = function() {
  var stagger = this.options.stagger;
  if ( stagger === null || stagger === undefined ) {
    this.stagger = 0;
    return;
  }
  this.stagger = getMilliseconds( stagger );
  return this.stagger;
};

/**
 * Sets position of item in DOM
 * @param {Outlayer.Item} item
 * @param {Number} x - horizontal position
 * @param {Number} y - vertical position
 * @param {Boolean} isInstant - disables transitions
 */
proto._positionItem = function( item, x, y, isInstant, i ) {
  if ( isInstant ) {
    // if not transition, just set CSS
    item.goTo( x, y );
  } else {
    item.stagger( i * this.stagger );
    item.moveTo( x, y );
  }
};

/**
 * Any logic you want to do after each layout,
 * i.e. size the container
 */
proto._postLayout = function() {
  this.resizeContainer();
};

proto.resizeContainer = function() {
  var isResizingContainer = this._getOption('resizeContainer');
  if ( !isResizingContainer ) {
    return;
  }
  var size = this._getContainerSize();
  if ( size ) {
    this._setContainerMeasure( size.width, true );
    this._setContainerMeasure( size.height, false );
  }
};

/**
 * Sets width or height of container if returned
 * @returns {Object} size
 *   @param {Number} width
 *   @param {Number} height
 */
proto._getContainerSize = noop;

/**
 * @param {Number} measure - size of width or height
 * @param {Boolean} isWidth
 */
proto._setContainerMeasure = function( measure, isWidth ) {
  if ( measure === undefined ) {
    return;
  }

  var elemSize = this.size;
  // add padding and border width if border box
  if ( elemSize.isBorderBox ) {
    measure += isWidth ? elemSize.paddingLeft + elemSize.paddingRight +
      elemSize.borderLeftWidth + elemSize.borderRightWidth :
      elemSize.paddingBottom + elemSize.paddingTop +
      elemSize.borderTopWidth + elemSize.borderBottomWidth;
  }

  measure = Math.max( measure, 0 );
  this.element.style[ isWidth ? 'width' : 'height' ] = measure + 'px';
};

/**
 * emit eventComplete on a collection of items events
 * @param {String} eventName
 * @param {Array} items - Outlayer.Items
 */
proto._emitCompleteOnItems = function( eventName, items ) {
  var _this = this;
  function onComplete() {
    _this.dispatchEvent( eventName + 'Complete', null, [ items ] );
  }

  var count = items.length;
  if ( !items || !count ) {
    onComplete();
    return;
  }

  var doneCount = 0;
  function tick() {
    doneCount++;
    if ( doneCount == count ) {
      onComplete();
    }
  }

  // bind callback
  items.forEach( function( item ) {
    item.once( eventName, tick );
  });
};

/**
 * emits events via EvEmitter and jQuery events
 * @param {String} type - name of event
 * @param {Event} event - original event
 * @param {Array} args - extra arguments
 */
proto.dispatchEvent = function( type, event, args ) {
  // add original event to arguments
  var emitArgs = event ? [ event ].concat( args ) : args;
  this.emitEvent( type, emitArgs );

  if ( jQuery ) {
    // set this.$element
    this.$element = this.$element || jQuery( this.element );
    if ( event ) {
      // create jQuery event
      var $event = jQuery.Event( event );
      $event.type = type;
      this.$element.trigger( $event, args );
    } else {
      // just trigger with type if no event available
      this.$element.trigger( type, args );
    }
  }
};

// -------------------------- ignore & stamps -------------------------- //


/**
 * keep item in collection, but do not lay it out
 * ignored items do not get skipped in layout
 * @param {Element} elem
 */
proto.ignore = function( elem ) {
  var item = this.getItem( elem );
  if ( item ) {
    item.isIgnored = true;
  }
};

/**
 * return item to layout collection
 * @param {Element} elem
 */
proto.unignore = function( elem ) {
  var item = this.getItem( elem );
  if ( item ) {
    delete item.isIgnored;
  }
};

/**
 * adds elements to stamps
 * @param {NodeList, Array, Element, or String} elems
 */
proto.stamp = function( elems ) {
  elems = this._find( elems );
  if ( !elems ) {
    return;
  }

  this.stamps = this.stamps.concat( elems );
  // ignore
  elems.forEach( this.ignore, this );
};

/**
 * removes elements to stamps
 * @param {NodeList, Array, or Element} elems
 */
proto.unstamp = function( elems ) {
  elems = this._find( elems );
  if ( !elems ){
    return;
  }

  elems.forEach( function( elem ) {
    // filter out removed stamp elements
    utils.removeFrom( this.stamps, elem );
    this.unignore( elem );
  }, this );
};

/**
 * finds child elements
 * @param {NodeList, Array, Element, or String} elems
 * @returns {Array} elems
 */
proto._find = function( elems ) {
  if ( !elems ) {
    return;
  }
  // if string, use argument as selector string
  if ( typeof elems == 'string' ) {
    elems = this.element.querySelectorAll( elems );
  }
  elems = utils.makeArray( elems );
  return elems;
};

proto._manageStamps = function() {
  if ( !this.stamps || !this.stamps.length ) {
    return;
  }

  this._getBoundingRect();

  this.stamps.forEach( this._manageStamp, this );
};

// update boundingLeft / Top
proto._getBoundingRect = function() {
  // get bounding rect for container element
  var boundingRect = this.element.getBoundingClientRect();
  var size = this.size;
  this._boundingRect = {
    left: boundingRect.left + size.paddingLeft + size.borderLeftWidth,
    top: boundingRect.top + size.paddingTop + size.borderTopWidth,
    right: boundingRect.right - ( size.paddingRight + size.borderRightWidth ),
    bottom: boundingRect.bottom - ( size.paddingBottom + size.borderBottomWidth )
  };
};

/**
 * @param {Element} stamp
**/
proto._manageStamp = noop;

/**
 * get x/y position of element relative to container element
 * @param {Element} elem
 * @returns {Object} offset - has left, top, right, bottom
 */
proto._getElementOffset = function( elem ) {
  var boundingRect = elem.getBoundingClientRect();
  var thisRect = this._boundingRect;
  var size = getSize( elem );
  var offset = {
    left: boundingRect.left - thisRect.left - size.marginLeft,
    top: boundingRect.top - thisRect.top - size.marginTop,
    right: thisRect.right - boundingRect.right - size.marginRight,
    bottom: thisRect.bottom - boundingRect.bottom - size.marginBottom
  };
  return offset;
};

// -------------------------- resize -------------------------- //

// enable event handlers for listeners
// i.e. resize -> onresize
proto.handleEvent = utils.handleEvent;

/**
 * Bind layout to window resizing
 */
proto.bindResize = function() {
  window.addEventListener( 'resize', this );
  this.isResizeBound = true;
};

/**
 * Unbind layout to window resizing
 */
proto.unbindResize = function() {
  window.removeEventListener( 'resize', this );
  this.isResizeBound = false;
};

proto.onresize = function() {
  this.resize();
};

utils.debounceMethod( Outlayer, 'onresize', 100 );

proto.resize = function() {
  // don't trigger if size did not change
  // or if resize was unbound. See #9
  if ( !this.isResizeBound || !this.needsResizeLayout() ) {
    return;
  }

  this.layout();
};

/**
 * check if layout is needed post layout
 * @returns Boolean
 */
proto.needsResizeLayout = function() {
  var size = getSize( this.element );
  // check that this.size and size are there
  // IE8 triggers resize on body size change, so they might not be
  var hasSizes = this.size && size;
  return hasSizes && size.innerWidth !== this.size.innerWidth;
};

// -------------------------- methods -------------------------- //

/**
 * add items to Outlayer instance
 * @param {Array or NodeList or Element} elems
 * @returns {Array} items - Outlayer.Items
**/
proto.addItems = function( elems ) {
  var items = this._itemize( elems );
  // add items to collection
  if ( items.length ) {
    this.items = this.items.concat( items );
  }
  return items;
};

/**
 * Layout newly-appended item elements
 * @param {Array or NodeList or Element} elems
 */
proto.appended = function( elems ) {
  var items = this.addItems( elems );
  if ( !items.length ) {
    return;
  }
  // layout and reveal just the new items
  this.layoutItems( items, true );
  this.reveal( items );
};

/**
 * Layout prepended elements
 * @param {Array or NodeList or Element} elems
 */
proto.prepended = function( elems ) {
  var items = this._itemize( elems );
  if ( !items.length ) {
    return;
  }
  // add items to beginning of collection
  var previousItems = this.items.slice(0);
  this.items = items.concat( previousItems );
  // start new layout
  this._resetLayout();
  this._manageStamps();
  // layout new stuff without transition
  this.layoutItems( items, true );
  this.reveal( items );
  // layout previous items
  this.layoutItems( previousItems );
};

/**
 * reveal a collection of items
 * @param {Array of Outlayer.Items} items
 */
proto.reveal = function( items ) {
  this._emitCompleteOnItems( 'reveal', items );
  if ( !items || !items.length ) {
    return;
  }
  var stagger = this.updateStagger();
  items.forEach( function( item, i ) {
    item.stagger( i * stagger );
    item.reveal();
  });
};

/**
 * hide a collection of items
 * @param {Array of Outlayer.Items} items
 */
proto.hide = function( items ) {
  this._emitCompleteOnItems( 'hide', items );
  if ( !items || !items.length ) {
    return;
  }
  var stagger = this.updateStagger();
  items.forEach( function( item, i ) {
    item.stagger( i * stagger );
    item.hide();
  });
};

/**
 * reveal item elements
 * @param {Array}, {Element}, {NodeList} items
 */
proto.revealItemElements = function( elems ) {
  var items = this.getItems( elems );
  this.reveal( items );
};

/**
 * hide item elements
 * @param {Array}, {Element}, {NodeList} items
 */
proto.hideItemElements = function( elems ) {
  var items = this.getItems( elems );
  this.hide( items );
};

/**
 * get Outlayer.Item, given an Element
 * @param {Element} elem
 * @param {Function} callback
 * @returns {Outlayer.Item} item
 */
proto.getItem = function( elem ) {
  // loop through items to get the one that matches
  for ( var i=0; i < this.items.length; i++ ) {
    var item = this.items[i];
    if ( item.element == elem ) {
      // return item
      return item;
    }
  }
};

/**
 * get collection of Outlayer.Items, given Elements
 * @param {Array} elems
 * @returns {Array} items - Outlayer.Items
 */
proto.getItems = function( elems ) {
  elems = utils.makeArray( elems );
  var items = [];
  elems.forEach( function( elem ) {
    var item = this.getItem( elem );
    if ( item ) {
      items.push( item );
    }
  }, this );

  return items;
};

/**
 * remove element(s) from instance and DOM
 * @param {Array or NodeList or Element} elems
 */
proto.remove = function( elems ) {
  var removeItems = this.getItems( elems );

  this._emitCompleteOnItems( 'remove', removeItems );

  // bail if no items to remove
  if ( !removeItems || !removeItems.length ) {
    return;
  }

  removeItems.forEach( function( item ) {
    item.remove();
    // remove item from collection
    utils.removeFrom( this.items, item );
  }, this );
};

// ----- destroy ----- //

// remove and disable Outlayer instance
proto.destroy = function() {
  // clean up dynamic styles
  var style = this.element.style;
  style.height = '';
  style.position = '';
  style.width = '';
  // destroy items
  this.items.forEach( function( item ) {
    item.destroy();
  });

  this.unbindResize();

  var id = this.element.outlayerGUID;
  delete instances[ id ]; // remove reference to instance by id
  delete this.element.outlayerGUID;
  // remove data for jQuery
  if ( jQuery ) {
    jQuery.removeData( this.element, this.constructor.namespace );
  }

};

// -------------------------- data -------------------------- //

/**
 * get Outlayer instance from element
 * @param {Element} elem
 * @returns {Outlayer}
 */
Outlayer.data = function( elem ) {
  elem = utils.getQueryElement( elem );
  var id = elem && elem.outlayerGUID;
  return id && instances[ id ];
};


// -------------------------- create Outlayer class -------------------------- //

/**
 * create a layout class
 * @param {String} namespace
 */
Outlayer.create = function( namespace, options ) {
  // sub-class Outlayer
  var Layout = subclass( Outlayer );
  // apply new options and compatOptions
  Layout.defaults = utils.extend( {}, Outlayer.defaults );
  utils.extend( Layout.defaults, options );
  Layout.compatOptions = utils.extend( {}, Outlayer.compatOptions  );

  Layout.namespace = namespace;

  Layout.data = Outlayer.data;

  // sub-class Item
  Layout.Item = subclass( Item );

  // -------------------------- declarative -------------------------- //

  utils.htmlInit( Layout, namespace );

  // -------------------------- jQuery bridge -------------------------- //

  // make into jQuery plugin
  if ( jQuery && jQuery.bridget ) {
    jQuery.bridget( namespace, Layout );
  }

  return Layout;
};

function subclass( Parent ) {
  function SubClass() {
    Parent.apply( this, arguments );
  }

  SubClass.prototype = Object.create( Parent.prototype );
  SubClass.prototype.constructor = SubClass;

  return SubClass;
}

// ----- helpers ----- //

// how many milliseconds are in each unit
var msUnits = {
  ms: 1,
  s: 1000
};

// munge time-like parameter into millisecond number
// '0.4s' -> 40
function getMilliseconds( time ) {
  if ( typeof time == 'number' ) {
    return time;
  }
  var matches = time.match( /(^\d*\.?\d*)(\w*)/ );
  var num = matches && matches[1];
  var unit = matches && matches[2];
  if ( !num.length ) {
    return 0;
  }
  num = parseFloat( num );
  var mult = msUnits[ unit ] || 1;
  return num * mult;
}

// ----- fin ----- //

// back in global
Outlayer.Item = Item;

return Outlayer;

}));


/***/ }),

/***/ "./node_modules/react-sortablejs/dist/index.js":
/*!*****************************************************!*\
  !*** ./node_modules/react-sortablejs/dist/index.js ***!
  \*****************************************************/
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {

var $8zHUo$sortablejs = __webpack_require__(/*! sortablejs */ "./node_modules/sortablejs/modular/sortable.esm.js");
var $8zHUo$classnames = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
var $8zHUo$react = __webpack_require__(/*! react */ "react");
var $8zHUo$tinyinvariant = __webpack_require__(/*! tiny-invariant */ "./node_modules/tiny-invariant/dist/tiny-invariant.esm.js");

function $parcel$interopDefault(a) {
  return a && a.__esModule ? a.default : a;
}
function $parcel$export(e, n, v, s) {
  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
}
function $parcel$exportWildcard(dest, source) {
  Object.keys(source).forEach(function(key) {
    if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
      return;
    }

    Object.defineProperty(dest, key, {
      enumerable: true,
      get: function get() {
        return source[key];
      }
    });
  });

  return dest;
}

$parcel$export(module.exports, "Sortable", () => $882b6d93070905b3$re_export$Sortable);
$parcel$export(module.exports, "Direction", () => $882b6d93070905b3$re_export$Direction);
$parcel$export(module.exports, "DOMRect", () => $882b6d93070905b3$re_export$DOMRect);
$parcel$export(module.exports, "GroupOptions", () => $882b6d93070905b3$re_export$GroupOptions);
$parcel$export(module.exports, "MoveEvent", () => $882b6d93070905b3$re_export$MoveEvent);
$parcel$export(module.exports, "Options", () => $882b6d93070905b3$re_export$Options);
$parcel$export(module.exports, "PullResult", () => $882b6d93070905b3$re_export$PullResult);
$parcel$export(module.exports, "PutResult", () => $882b6d93070905b3$re_export$PutResult);
$parcel$export(module.exports, "SortableEvent", () => $882b6d93070905b3$re_export$SortableEvent);
$parcel$export(module.exports, "SortableOptions", () => $882b6d93070905b3$re_export$SortableOptions);
$parcel$export(module.exports, "Utils", () => $882b6d93070905b3$re_export$Utils);
$parcel$export(module.exports, "ReactSortable", () => $7fe8e3ea572bda7a$export$11bbed9ee0012c13);





function $eb03e74f8f7db1f3$export$1d0aa160432dfea5(node) {
    if (node.parentElement !== null) node.parentElement.removeChild(node);
}
function $eb03e74f8f7db1f3$export$6d240faa51aa562f(parent, newChild, index) {
    const refChild = parent.children[index] || null;
    parent.insertBefore(newChild, refChild);
}
function $eb03e74f8f7db1f3$export$d7d742816c28cf91(customs) {
    $eb03e74f8f7db1f3$export$77f49a256021c8de(customs);
    $eb03e74f8f7db1f3$export$a6177d5829f70ebc(customs);
}
function $eb03e74f8f7db1f3$export$77f49a256021c8de(customs) {
    customs.forEach((curr)=>$eb03e74f8f7db1f3$export$1d0aa160432dfea5(curr.element));
}
function $eb03e74f8f7db1f3$export$a6177d5829f70ebc(customs) {
    customs.forEach((curr)=>{
        $eb03e74f8f7db1f3$export$6d240faa51aa562f(curr.parentElement, curr.element, curr.oldIndex);
    });
}
function $eb03e74f8f7db1f3$export$4655efe700f887a(evt, list) {
    const mode = $eb03e74f8f7db1f3$export$1fc0f6205829e19c(evt);
    const parentElement = {
        parentElement: evt.from
    };
    let custom = [];
    switch(mode){
        case "normal":
            /* eslint-disable */ const item = {
                element: evt.item,
                newIndex: evt.newIndex,
                oldIndex: evt.oldIndex,
                parentElement: evt.from
            };
            custom = [
                item
            ];
            break;
        case "swap":
            const drag = {
                element: evt.item,
                oldIndex: evt.oldIndex,
                newIndex: evt.newIndex,
                ...parentElement
            };
            const swap = {
                element: evt.swapItem,
                oldIndex: evt.newIndex,
                newIndex: evt.oldIndex,
                ...parentElement
            };
            custom = [
                drag,
                swap
            ];
            break;
        case "multidrag":
            custom = evt.oldIndicies.map((curr, index)=>({
                    element: curr.multiDragElement,
                    oldIndex: curr.index,
                    newIndex: evt.newIndicies[index].index,
                    ...parentElement
                }));
            break;
    }
    /* eslint-enable */ const customs = $eb03e74f8f7db1f3$export$bc06a3af7dc65f53(custom, list);
    return customs;
}
function $eb03e74f8f7db1f3$export$c25cf8080bd305ec(normalized, list) {
    const a = $eb03e74f8f7db1f3$export$be2da95e6167b0bd(normalized, list);
    const b = $eb03e74f8f7db1f3$export$eca851ee65ae17e4(normalized, a);
    return b;
}
function $eb03e74f8f7db1f3$export$be2da95e6167b0bd(normalized, list) {
    const newList = [
        ...list
    ];
    normalized.concat().reverse().forEach((curr)=>newList.splice(curr.oldIndex, 1));
    return newList;
}
function $eb03e74f8f7db1f3$export$eca851ee65ae17e4(normalized, list, evt, clone) {
    const newList = [
        ...list
    ];
    normalized.forEach((curr)=>{
        const newItem = clone && evt && clone(curr.item, evt);
        newList.splice(curr.newIndex, 0, newItem || curr.item);
    });
    return newList;
}
function $eb03e74f8f7db1f3$export$1fc0f6205829e19c(evt) {
    if (evt.oldIndicies && evt.oldIndicies.length > 0) return "multidrag";
    if (evt.swapItem) return "swap";
    return "normal";
}
function $eb03e74f8f7db1f3$export$bc06a3af7dc65f53(inputs, list) {
    const normalized = inputs.map((curr)=>({
            ...curr,
            item: list[curr.oldIndex]
        })).sort((a, b)=>a.oldIndex - b.oldIndex);
    return normalized;
}
function $eb03e74f8f7db1f3$export$7553c81e62e31b7e(props) {
    /* eslint-disable */ const { list: // react sortable props
    list , setList: setList , children: children , tag: tag , style: style , className: className , clone: clone , onAdd: // sortable options that have methods we want to overwrite
    onAdd , onChange: onChange , onChoose: onChoose , onClone: onClone , onEnd: onEnd , onFilter: onFilter , onRemove: onRemove , onSort: onSort , onStart: onStart , onUnchoose: onUnchoose , onUpdate: onUpdate , onMove: onMove , onSpill: onSpill , onSelect: onSelect , onDeselect: onDeselect , ...options } = props;
    /* eslint-enable */ return options;
}


/** Holds a global reference for which react element is being dragged */ // @todo - use context to manage this. How does one use 2 different providers?
const $7fe8e3ea572bda7a$var$store = {
    dragging: null
};
class $7fe8e3ea572bda7a$export$11bbed9ee0012c13 extends (0, $8zHUo$react.Component) {
    /* eslint-disable-next-line */ static defaultProps = {
        clone: (item)=>item
    };
    constructor(props){
        super(props);
        // @todo forward ref this component
        this.ref = /*#__PURE__*/ (0, $8zHUo$react.createRef)();
        // make all state false because we can't change sortable unless a mouse gesture is made.
        const newList = [
            ...props.list
        ].map((item)=>Object.assign(item, {
                chosen: false,
                selected: false
            }));
        props.setList(newList, this.sortable, $7fe8e3ea572bda7a$var$store);
        (0, ($parcel$interopDefault($8zHUo$tinyinvariant)))(//@ts-expect-error: Doesn't exist. Will deprecate soon.
        !props.plugins, `
Plugins prop is no longer supported.
Instead, mount it with "Sortable.mount(new MultiDrag())"
Please read the updated README.md at https://github.com/SortableJS/react-sortablejs.
      `);
    }
    componentDidMount() {
        if (this.ref.current === null) return;
        const newOptions = this.makeOptions();
        (0, ($parcel$interopDefault($8zHUo$sortablejs))).create(this.ref.current, newOptions);
    }
    componentDidUpdate(prevProps) {
        if (prevProps.disabled !== this.props.disabled && this.sortable) this.sortable.option("disabled", this.props.disabled);
    }
    render() {
        const { tag: tag , style: style , className: className , id: id  } = this.props;
        const classicProps = {
            style: style,
            className: className,
            id: id
        };
        // if no tag, default to a `div` element.
        const newTag = !tag || tag === null ? "div" : tag;
        return /*#__PURE__*/ (0, $8zHUo$react.createElement)(newTag, {
            // @todo - find a way (perhaps with the callback) to allow AntD components to work
            ref: this.ref,
            ...classicProps
        }, this.getChildren());
    }
    getChildren() {
        const { children: children , dataIdAttr: dataIdAttr , selectedClass: selectedClass = "sortable-selected" , chosenClass: chosenClass = "sortable-chosen" , dragClass: /* eslint-disable */ dragClass = "sortable-drag" , fallbackClass: fallbackClass = "sortable-falback" , ghostClass: ghostClass = "sortable-ghost" , swapClass: swapClass = "sortable-swap-highlight" , filter: /* eslint-enable */ filter = "sortable-filter" , list: list ,  } = this.props;
        // if no children, don't do anything.
        if (!children || children == null) return null;
        const dataid = dataIdAttr || "data-id";
        /* eslint-disable-next-line */ return (0, $8zHUo$react.Children).map(children, (child, index)=>{
            if (child === undefined) return undefined;
            const item = list[index] || {};
            const { className: prevClassName  } = child.props;
            // @todo - handle the function if avalable. I don't think anyone will be doing this soon.
            const filtered = typeof filter === "string" && {
                [filter.replace(".", "")]: !!item.filtered
            };
            const className = (0, ($parcel$interopDefault($8zHUo$classnames)))(prevClassName, {
                [selectedClass]: item.selected,
                [chosenClass]: item.chosen,
                ...filtered
            });
            return /*#__PURE__*/ (0, $8zHUo$react.cloneElement)(child, {
                [dataid]: child.key,
                className: className
            });
        });
    }
    /** Appends the `sortable` property to this component */ get sortable() {
        const el = this.ref.current;
        if (el === null) return null;
        const key = Object.keys(el).find((k)=>k.includes("Sortable"));
        if (!key) return null;
        //@ts-expect-error: fix me.
        return el[key];
    }
    /** Converts all the props from `ReactSortable` into the `options` object that `Sortable.create(el, [options])` can use. */ makeOptions() {
        const DOMHandlers = [
            "onAdd",
            "onChoose",
            "onDeselect",
            "onEnd",
            "onRemove",
            "onSelect",
            "onSpill",
            "onStart",
            "onUnchoose",
            "onUpdate", 
        ];
        const NonDOMHandlers = [
            "onChange",
            "onClone",
            "onFilter",
            "onSort", 
        ];
        const newOptions = (0, $eb03e74f8f7db1f3$export$7553c81e62e31b7e)(this.props);
        DOMHandlers.forEach((name)=>newOptions[name] = this.prepareOnHandlerPropAndDOM(name));
        NonDOMHandlers.forEach((name)=>newOptions[name] = this.prepareOnHandlerProp(name));
        /** onMove has 2 arguments and needs to be handled seperately. */ const onMove1 = (evt, originalEvt)=>{
            const { onMove: onMove  } = this.props;
            const defaultValue = evt.willInsertAfter || -1;
            if (!onMove) return defaultValue;
            const result = onMove(evt, originalEvt, this.sortable, $7fe8e3ea572bda7a$var$store);
            if (typeof result === "undefined") return false;
            return result;
        };
        return {
            ...newOptions,
            onMove: onMove1
        };
    }
    /** Prepares a method that will be used in the sortable options to call an `on[Handler]` prop & an `on[Handler]` ReactSortable method.  */ prepareOnHandlerPropAndDOM(evtName) {
        return (evt)=>{
            // call the component prop
            this.callOnHandlerProp(evt, evtName);
            // calls state change
            //@ts-expect-error: until @types multidrag item is in
            this[evtName](evt);
        };
    }
    /** Prepares a method that will be used in the sortable options to call an `on[Handler]` prop */ prepareOnHandlerProp(evtName) {
        return (evt)=>{
            // call the component prop
            this.callOnHandlerProp(evt, evtName);
        };
    }
    /** Calls the `props.on[Handler]` function */ callOnHandlerProp(evt, evtName) {
        const propEvent = this.props[evtName];
        if (propEvent) propEvent(evt, this.sortable, $7fe8e3ea572bda7a$var$store);
    }
    // SORTABLE DOM HANDLING
    onAdd(evt) {
        const { list: list , setList: setList , clone: clone  } = this.props;
        /* eslint-disable-next-line */ const otherList = [
            ...$7fe8e3ea572bda7a$var$store.dragging.props.list
        ];
        const customs = (0, $eb03e74f8f7db1f3$export$4655efe700f887a)(evt, otherList);
        (0, $eb03e74f8f7db1f3$export$77f49a256021c8de)(customs);
        const newList = (0, $eb03e74f8f7db1f3$export$eca851ee65ae17e4)(customs, list, evt, clone).map((item)=>Object.assign(item, {
                selected: false
            }));
        setList(newList, this.sortable, $7fe8e3ea572bda7a$var$store);
    }
    onRemove(evt) {
        const { list: list , setList: setList  } = this.props;
        const mode = (0, $eb03e74f8f7db1f3$export$1fc0f6205829e19c)(evt);
        const customs = (0, $eb03e74f8f7db1f3$export$4655efe700f887a)(evt, list);
        (0, $eb03e74f8f7db1f3$export$a6177d5829f70ebc)(customs);
        let newList = [
            ...list
        ];
        // remove state if not in clone mode. otherwise, keep.
        if (evt.pullMode !== "clone") newList = (0, $eb03e74f8f7db1f3$export$be2da95e6167b0bd)(customs, newList);
        else {
            // switch used to get the clone
            let customClones = customs;
            switch(mode){
                case "multidrag":
                    customClones = customs.map((item, index)=>({
                            ...item,
                            element: evt.clones[index]
                        }));
                    break;
                case "normal":
                    customClones = customs.map((item)=>({
                            ...item,
                            element: evt.clone
                        }));
                    break;
                case "swap":
                default:
                    (0, ($parcel$interopDefault($8zHUo$tinyinvariant)))(true, `mode "${mode}" cannot clone. Please remove "props.clone" from <ReactSortable/> when using the "${mode}" plugin`);
            }
            (0, $eb03e74f8f7db1f3$export$77f49a256021c8de)(customClones);
            // replace selected items with cloned items
            customs.forEach((curr)=>{
                const index = curr.oldIndex;
                /* eslint-disable-next-line */ const newItem = this.props.clone(curr.item, evt);
                newList.splice(index, 1, newItem);
            });
        }
        // remove item.selected from list
        newList = newList.map((item)=>Object.assign(item, {
                selected: false
            }));
        setList(newList, this.sortable, $7fe8e3ea572bda7a$var$store);
    }
    onUpdate(evt) {
        const { list: list , setList: setList  } = this.props;
        const customs = (0, $eb03e74f8f7db1f3$export$4655efe700f887a)(evt, list);
        (0, $eb03e74f8f7db1f3$export$77f49a256021c8de)(customs);
        (0, $eb03e74f8f7db1f3$export$a6177d5829f70ebc)(customs);
        const newList = (0, $eb03e74f8f7db1f3$export$c25cf8080bd305ec)(customs, list);
        return setList(newList, this.sortable, $7fe8e3ea572bda7a$var$store);
    }
    onStart() {
        $7fe8e3ea572bda7a$var$store.dragging = this;
    }
    onEnd() {
        $7fe8e3ea572bda7a$var$store.dragging = null;
    }
    onChoose(evt) {
        const { list: list , setList: setList  } = this.props;
        const newList = list.map((item, index)=>{
            let newItem = item;
            if (index === evt.oldIndex) newItem = Object.assign(item, {
                chosen: true
            });
            return newItem;
        });
        setList(newList, this.sortable, $7fe8e3ea572bda7a$var$store);
    }
    onUnchoose(evt) {
        const { list: list , setList: setList  } = this.props;
        const newList = list.map((item, index)=>{
            let newItem = item;
            if (index === evt.oldIndex) newItem = Object.assign(newItem, {
                chosen: false
            });
            return newItem;
        });
        setList(newList, this.sortable, $7fe8e3ea572bda7a$var$store);
    }
    onSpill(evt) {
        const { removeOnSpill: removeOnSpill , revertOnSpill: revertOnSpill  } = this.props;
        if (removeOnSpill && !revertOnSpill) (0, $eb03e74f8f7db1f3$export$1d0aa160432dfea5)(evt.item);
    }
    onSelect(evt) {
        const { list: list , setList: setList  } = this.props;
        const newList = list.map((item)=>Object.assign(item, {
                selected: false
            }));
        evt.newIndicies.forEach((curr)=>{
            const index = curr.index;
            if (index === -1) {
                console.log(`"${evt.type}" had indice of "${curr.index}", which is probably -1 and doesn't usually happen here.`);
                console.log(evt);
                return;
            }
            newList[index].selected = true;
        });
        setList(newList, this.sortable, $7fe8e3ea572bda7a$var$store);
    }
    onDeselect(evt) {
        const { list: list , setList: setList  } = this.props;
        const newList = list.map((item)=>Object.assign(item, {
                selected: false
            }));
        evt.newIndicies.forEach((curr)=>{
            const index = curr.index;
            if (index === -1) return;
            newList[index].selected = true;
        });
        setList(newList, this.sortable, $7fe8e3ea572bda7a$var$store);
    }
}


var $faefaad95e5fcca0$exports = {};


$parcel$exportWildcard(module.exports, $faefaad95e5fcca0$exports);


//# sourceMappingURL=index.js.map


/***/ }),

/***/ "./node_modules/sortablejs/modular/sortable.esm.js":
/*!*********************************************************!*\
  !*** ./node_modules/sortablejs/modular/sortable.esm.js ***!
  \*********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "MultiDrag": () => (/* binding */ MultiDragPlugin),
/* harmony export */   "Sortable": () => (/* binding */ Sortable),
/* harmony export */   "Swap": () => (/* binding */ SwapPlugin),
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/**!
 * Sortable 1.15.0
 * @author	RubaXa   <trash@rubaxa.org>
 * @author	owenm    <owen23355@gmail.com>
 * @license MIT
 */
function ownKeys(object, enumerableOnly) {
  var keys = Object.keys(object);

  if (Object.getOwnPropertySymbols) {
    var symbols = Object.getOwnPropertySymbols(object);

    if (enumerableOnly) {
      symbols = symbols.filter(function (sym) {
        return Object.getOwnPropertyDescriptor(object, sym).enumerable;
      });
    }

    keys.push.apply(keys, symbols);
  }

  return keys;
}

function _objectSpread2(target) {
  for (var i = 1; i < arguments.length; i++) {
    var source = arguments[i] != null ? arguments[i] : {};

    if (i % 2) {
      ownKeys(Object(source), true).forEach(function (key) {
        _defineProperty(target, key, source[key]);
      });
    } else if (Object.getOwnPropertyDescriptors) {
      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
    } else {
      ownKeys(Object(source)).forEach(function (key) {
        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
      });
    }
  }

  return target;
}

function _typeof(obj) {
  "@babel/helpers - typeof";

  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
    _typeof = function (obj) {
      return typeof obj;
    };
  } else {
    _typeof = function (obj) {
      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
    };
  }

  return _typeof(obj);
}

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

function _extends() {
  _extends = Object.assign || function (target) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i];

      for (var key in source) {
        if (Object.prototype.hasOwnProperty.call(source, key)) {
          target[key] = source[key];
        }
      }
    }

    return target;
  };

  return _extends.apply(this, arguments);
}

function _objectWithoutPropertiesLoose(source, excluded) {
  if (source == null) return {};
  var target = {};
  var sourceKeys = Object.keys(source);
  var key, i;

  for (i = 0; i < sourceKeys.length; i++) {
    key = sourceKeys[i];
    if (excluded.indexOf(key) >= 0) continue;
    target[key] = source[key];
  }

  return target;
}

function _objectWithoutProperties(source, excluded) {
  if (source == null) return {};

  var target = _objectWithoutPropertiesLoose(source, excluded);

  var key, i;

  if (Object.getOwnPropertySymbols) {
    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);

    for (i = 0; i < sourceSymbolKeys.length; i++) {
      key = sourceSymbolKeys[i];
      if (excluded.indexOf(key) >= 0) continue;
      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
      target[key] = source[key];
    }
  }

  return target;
}

function _toConsumableArray(arr) {
  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
}

function _arrayWithoutHoles(arr) {
  if (Array.isArray(arr)) return _arrayLikeToArray(arr);
}

function _iterableToArray(iter) {
  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
}

function _unsupportedIterableToArray(o, minLen) {
  if (!o) return;
  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
  var n = Object.prototype.toString.call(o).slice(8, -1);
  if (n === "Object" && o.constructor) n = o.constructor.name;
  if (n === "Map" || n === "Set") return Array.from(o);
  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
}

function _arrayLikeToArray(arr, len) {
  if (len == null || len > arr.length) len = arr.length;

  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];

  return arr2;
}

function _nonIterableSpread() {
  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}

var version = "1.15.0";

function userAgent(pattern) {
  if (typeof window !== 'undefined' && window.navigator) {
    return !! /*@__PURE__*/navigator.userAgent.match(pattern);
  }
}

var IE11OrLess = userAgent(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i);
var Edge = userAgent(/Edge/i);
var FireFox = userAgent(/firefox/i);
var Safari = userAgent(/safari/i) && !userAgent(/chrome/i) && !userAgent(/android/i);
var IOS = userAgent(/iP(ad|od|hone)/i);
var ChromeForAndroid = userAgent(/chrome/i) && userAgent(/android/i);

var captureMode = {
  capture: false,
  passive: false
};

function on(el, event, fn) {
  el.addEventListener(event, fn, !IE11OrLess && captureMode);
}

function off(el, event, fn) {
  el.removeEventListener(event, fn, !IE11OrLess && captureMode);
}

function matches(
/**HTMLElement*/
el,
/**String*/
selector) {
  if (!selector) return;
  selector[0] === '>' && (selector = selector.substring(1));

  if (el) {
    try {
      if (el.matches) {
        return el.matches(selector);
      } else if (el.msMatchesSelector) {
        return el.msMatchesSelector(selector);
      } else if (el.webkitMatchesSelector) {
        return el.webkitMatchesSelector(selector);
      }
    } catch (_) {
      return false;
    }
  }

  return false;
}

function getParentOrHost(el) {
  return el.host && el !== document && el.host.nodeType ? el.host : el.parentNode;
}

function closest(
/**HTMLElement*/
el,
/**String*/
selector,
/**HTMLElement*/
ctx, includeCTX) {
  if (el) {
    ctx = ctx || document;

    do {
      if (selector != null && (selector[0] === '>' ? el.parentNode === ctx && matches(el, selector) : matches(el, selector)) || includeCTX && el === ctx) {
        return el;
      }

      if (el === ctx) break;
      /* jshint boss:true */
    } while (el = getParentOrHost(el));
  }

  return null;
}

var R_SPACE = /\s+/g;

function toggleClass(el, name, state) {
  if (el && name) {
    if (el.classList) {
      el.classList[state ? 'add' : 'remove'](name);
    } else {
      var className = (' ' + el.className + ' ').replace(R_SPACE, ' ').replace(' ' + name + ' ', ' ');
      el.className = (className + (state ? ' ' + name : '')).replace(R_SPACE, ' ');
    }
  }
}

function css(el, prop, val) {
  var style = el && el.style;

  if (style) {
    if (val === void 0) {
      if (document.defaultView && document.defaultView.getComputedStyle) {
        val = document.defaultView.getComputedStyle(el, '');
      } else if (el.currentStyle) {
        val = el.currentStyle;
      }

      return prop === void 0 ? val : val[prop];
    } else {
      if (!(prop in style) && prop.indexOf('webkit') === -1) {
        prop = '-webkit-' + prop;
      }

      style[prop] = val + (typeof val === 'string' ? '' : 'px');
    }
  }
}

function matrix(el, selfOnly) {
  var appliedTransforms = '';

  if (typeof el === 'string') {
    appliedTransforms = el;
  } else {
    do {
      var transform = css(el, 'transform');

      if (transform && transform !== 'none') {
        appliedTransforms = transform + ' ' + appliedTransforms;
      }
      /* jshint boss:true */

    } while (!selfOnly && (el = el.parentNode));
  }

  var matrixFn = window.DOMMatrix || window.WebKitCSSMatrix || window.CSSMatrix || window.MSCSSMatrix;
  /*jshint -W056 */

  return matrixFn && new matrixFn(appliedTransforms);
}

function find(ctx, tagName, iterator) {
  if (ctx) {
    var list = ctx.getElementsByTagName(tagName),
        i = 0,
        n = list.length;

    if (iterator) {
      for (; i < n; i++) {
        iterator(list[i], i);
      }
    }

    return list;
  }

  return [];
}

function getWindowScrollingElement() {
  var scrollingElement = document.scrollingElement;

  if (scrollingElement) {
    return scrollingElement;
  } else {
    return document.documentElement;
  }
}
/**
 * Returns the "bounding client rect" of given element
 * @param  {HTMLElement} el                       The element whose boundingClientRect is wanted
 * @param  {[Boolean]} relativeToContainingBlock  Whether the rect should be relative to the containing block of (including) the container
 * @param  {[Boolean]} relativeToNonStaticParent  Whether the rect should be relative to the relative parent of (including) the contaienr
 * @param  {[Boolean]} undoScale                  Whether the container's scale() should be undone
 * @param  {[HTMLElement]} container              The parent the element will be placed in
 * @return {Object}                               The boundingClientRect of el, with specified adjustments
 */


function getRect(el, relativeToContainingBlock, relativeToNonStaticParent, undoScale, container) {
  if (!el.getBoundingClientRect && el !== window) return;
  var elRect, top, left, bottom, right, height, width;

  if (el !== window && el.parentNode && el !== getWindowScrollingElement()) {
    elRect = el.getBoundingClientRect();
    top = elRect.top;
    left = elRect.left;
    bottom = elRect.bottom;
    right = elRect.right;
    height = elRect.height;
    width = elRect.width;
  } else {
    top = 0;
    left = 0;
    bottom = window.innerHeight;
    right = window.innerWidth;
    height = window.innerHeight;
    width = window.innerWidth;
  }

  if ((relativeToContainingBlock || relativeToNonStaticParent) && el !== window) {
    // Adjust for translate()
    container = container || el.parentNode; // solves #1123 (see: https://stackoverflow.com/a/37953806/6088312)
    // Not needed on <= IE11

    if (!IE11OrLess) {
      do {
        if (container && container.getBoundingClientRect && (css(container, 'transform') !== 'none' || relativeToNonStaticParent && css(container, 'position') !== 'static')) {
          var containerRect = container.getBoundingClientRect(); // Set relative to edges of padding box of container

          top -= containerRect.top + parseInt(css(container, 'border-top-width'));
          left -= containerRect.left + parseInt(css(container, 'border-left-width'));
          bottom = top + elRect.height;
          right = left + elRect.width;
          break;
        }
        /* jshint boss:true */

      } while (container = container.parentNode);
    }
  }

  if (undoScale && el !== window) {
    // Adjust for scale()
    var elMatrix = matrix(container || el),
        scaleX = elMatrix && elMatrix.a,
        scaleY = elMatrix && elMatrix.d;

    if (elMatrix) {
      top /= scaleY;
      left /= scaleX;
      width /= scaleX;
      height /= scaleY;
      bottom = top + height;
      right = left + width;
    }
  }

  return {
    top: top,
    left: left,
    bottom: bottom,
    right: right,
    width: width,
    height: height
  };
}
/**
 * Checks if a side of an element is scrolled past a side of its parents
 * @param  {HTMLElement}  el           The element who's side being scrolled out of view is in question
 * @param  {String}       elSide       Side of the element in question ('top', 'left', 'right', 'bottom')
 * @param  {String}       parentSide   Side of the parent in question ('top', 'left', 'right', 'bottom')
 * @return {HTMLElement}               The parent scroll element that the el's side is scrolled past, or null if there is no such element
 */


function isScrolledPast(el, elSide, parentSide) {
  var parent = getParentAutoScrollElement(el, true),
      elSideVal = getRect(el)[elSide];
  /* jshint boss:true */

  while (parent) {
    var parentSideVal = getRect(parent)[parentSide],
        visible = void 0;

    if (parentSide === 'top' || parentSide === 'left') {
      visible = elSideVal >= parentSideVal;
    } else {
      visible = elSideVal <= parentSideVal;
    }

    if (!visible) return parent;
    if (parent === getWindowScrollingElement()) break;
    parent = getParentAutoScrollElement(parent, false);
  }

  return false;
}
/**
 * Gets nth child of el, ignoring hidden children, sortable's elements (does not ignore clone if it's visible)
 * and non-draggable elements
 * @param  {HTMLElement} el       The parent element
 * @param  {Number} childNum      The index of the child
 * @param  {Object} options       Parent Sortable's options
 * @return {HTMLElement}          The child at index childNum, or null if not found
 */


function getChild(el, childNum, options, includeDragEl) {
  var currentChild = 0,
      i = 0,
      children = el.children;

  while (i < children.length) {
    if (children[i].style.display !== 'none' && children[i] !== Sortable.ghost && (includeDragEl || children[i] !== Sortable.dragged) && closest(children[i], options.draggable, el, false)) {
      if (currentChild === childNum) {
        return children[i];
      }

      currentChild++;
    }

    i++;
  }

  return null;
}
/**
 * Gets the last child in the el, ignoring ghostEl or invisible elements (clones)
 * @param  {HTMLElement} el       Parent element
 * @param  {selector} selector    Any other elements that should be ignored
 * @return {HTMLElement}          The last child, ignoring ghostEl
 */


function lastChild(el, selector) {
  var last = el.lastElementChild;

  while (last && (last === Sortable.ghost || css(last, 'display') === 'none' || selector && !matches(last, selector))) {
    last = last.previousElementSibling;
  }

  return last || null;
}
/**
 * Returns the index of an element within its parent for a selected set of
 * elements
 * @param  {HTMLElement} el
 * @param  {selector} selector
 * @return {number}
 */


function index(el, selector) {
  var index = 0;

  if (!el || !el.parentNode) {
    return -1;
  }
  /* jshint boss:true */


  while (el = el.previousElementSibling) {
    if (el.nodeName.toUpperCase() !== 'TEMPLATE' && el !== Sortable.clone && (!selector || matches(el, selector))) {
      index++;
    }
  }

  return index;
}
/**
 * Returns the scroll offset of the given element, added with all the scroll offsets of parent elements.
 * The value is returned in real pixels.
 * @param  {HTMLElement} el
 * @return {Array}             Offsets in the format of [left, top]
 */


function getRelativeScrollOffset(el) {
  var offsetLeft = 0,
      offsetTop = 0,
      winScroller = getWindowScrollingElement();

  if (el) {
    do {
      var elMatrix = matrix(el),
          scaleX = elMatrix.a,
          scaleY = elMatrix.d;
      offsetLeft += el.scrollLeft * scaleX;
      offsetTop += el.scrollTop * scaleY;
    } while (el !== winScroller && (el = el.parentNode));
  }

  return [offsetLeft, offsetTop];
}
/**
 * Returns the index of the object within the given array
 * @param  {Array} arr   Array that may or may not hold the object
 * @param  {Object} obj  An object that has a key-value pair unique to and identical to a key-value pair in the object you want to find
 * @return {Number}      The index of the object in the array, or -1
 */


function indexOfObject(arr, obj) {
  for (var i in arr) {
    if (!arr.hasOwnProperty(i)) continue;

    for (var key in obj) {
      if (obj.hasOwnProperty(key) && obj[key] === arr[i][key]) return Number(i);
    }
  }

  return -1;
}

function getParentAutoScrollElement(el, includeSelf) {
  // skip to window
  if (!el || !el.getBoundingClientRect) return getWindowScrollingElement();
  var elem = el;
  var gotSelf = false;

  do {
    // we don't need to get elem css if it isn't even overflowing in the first place (performance)
    if (elem.clientWidth < elem.scrollWidth || elem.clientHeight < elem.scrollHeight) {
      var elemCSS = css(elem);

      if (elem.clientWidth < elem.scrollWidth && (elemCSS.overflowX == 'auto' || elemCSS.overflowX == 'scroll') || elem.clientHeight < elem.scrollHeight && (elemCSS.overflowY == 'auto' || elemCSS.overflowY == 'scroll')) {
        if (!elem.getBoundingClientRect || elem === document.body) return getWindowScrollingElement();
        if (gotSelf || includeSelf) return elem;
        gotSelf = true;
      }
    }
    /* jshint boss:true */

  } while (elem = elem.parentNode);

  return getWindowScrollingElement();
}

function extend(dst, src) {
  if (dst && src) {
    for (var key in src) {
      if (src.hasOwnProperty(key)) {
        dst[key] = src[key];
      }
    }
  }

  return dst;
}

function isRectEqual(rect1, rect2) {
  return Math.round(rect1.top) === Math.round(rect2.top) && Math.round(rect1.left) === Math.round(rect2.left) && Math.round(rect1.height) === Math.round(rect2.height) && Math.round(rect1.width) === Math.round(rect2.width);
}

var _throttleTimeout;

function throttle(callback, ms) {
  return function () {
    if (!_throttleTimeout) {
      var args = arguments,
          _this = this;

      if (args.length === 1) {
        callback.call(_this, args[0]);
      } else {
        callback.apply(_this, args);
      }

      _throttleTimeout = setTimeout(function () {
        _throttleTimeout = void 0;
      }, ms);
    }
  };
}

function cancelThrottle() {
  clearTimeout(_throttleTimeout);
  _throttleTimeout = void 0;
}

function scrollBy(el, x, y) {
  el.scrollLeft += x;
  el.scrollTop += y;
}

function clone(el) {
  var Polymer = window.Polymer;
  var $ = window.jQuery || window.Zepto;

  if (Polymer && Polymer.dom) {
    return Polymer.dom(el).cloneNode(true);
  } else if ($) {
    return $(el).clone(true)[0];
  } else {
    return el.cloneNode(true);
  }
}

function setRect(el, rect) {
  css(el, 'position', 'absolute');
  css(el, 'top', rect.top);
  css(el, 'left', rect.left);
  css(el, 'width', rect.width);
  css(el, 'height', rect.height);
}

function unsetRect(el) {
  css(el, 'position', '');
  css(el, 'top', '');
  css(el, 'left', '');
  css(el, 'width', '');
  css(el, 'height', '');
}

var expando = 'Sortable' + new Date().getTime();

function AnimationStateManager() {
  var animationStates = [],
      animationCallbackId;
  return {
    captureAnimationState: function captureAnimationState() {
      animationStates = [];
      if (!this.options.animation) return;
      var children = [].slice.call(this.el.children);
      children.forEach(function (child) {
        if (css(child, 'display') === 'none' || child === Sortable.ghost) return;
        animationStates.push({
          target: child,
          rect: getRect(child)
        });

        var fromRect = _objectSpread2({}, animationStates[animationStates.length - 1].rect); // If animating: compensate for current animation


        if (child.thisAnimationDuration) {
          var childMatrix = matrix(child, true);

          if (childMatrix) {
            fromRect.top -= childMatrix.f;
            fromRect.left -= childMatrix.e;
          }
        }

        child.fromRect = fromRect;
      });
    },
    addAnimationState: function addAnimationState(state) {
      animationStates.push(state);
    },
    removeAnimationState: function removeAnimationState(target) {
      animationStates.splice(indexOfObject(animationStates, {
        target: target
      }), 1);
    },
    animateAll: function animateAll(callback) {
      var _this = this;

      if (!this.options.animation) {
        clearTimeout(animationCallbackId);
        if (typeof callback === 'function') callback();
        return;
      }

      var animating = false,
          animationTime = 0;
      animationStates.forEach(function (state) {
        var time = 0,
            target = state.target,
            fromRect = target.fromRect,
            toRect = getRect(target),
            prevFromRect = target.prevFromRect,
            prevToRect = target.prevToRect,
            animatingRect = state.rect,
            targetMatrix = matrix(target, true);

        if (targetMatrix) {
          // Compensate for current animation
          toRect.top -= targetMatrix.f;
          toRect.left -= targetMatrix.e;
        }

        target.toRect = toRect;

        if (target.thisAnimationDuration) {
          // Could also check if animatingRect is between fromRect and toRect
          if (isRectEqual(prevFromRect, toRect) && !isRectEqual(fromRect, toRect) && // Make sure animatingRect is on line between toRect & fromRect
          (animatingRect.top - toRect.top) / (animatingRect.left - toRect.left) === (fromRect.top - toRect.top) / (fromRect.left - toRect.left)) {
            // If returning to same place as started from animation and on same axis
            time = calculateRealTime(animatingRect, prevFromRect, prevToRect, _this.options);
          }
        } // if fromRect != toRect: animate


        if (!isRectEqual(toRect, fromRect)) {
          target.prevFromRect = fromRect;
          target.prevToRect = toRect;

          if (!time) {
            time = _this.options.animation;
          }

          _this.animate(target, animatingRect, toRect, time);
        }

        if (time) {
          animating = true;
          animationTime = Math.max(animationTime, time);
          clearTimeout(target.animationResetTimer);
          target.animationResetTimer = setTimeout(function () {
            target.animationTime = 0;
            target.prevFromRect = null;
            target.fromRect = null;
            target.prevToRect = null;
            target.thisAnimationDuration = null;
          }, time);
          target.thisAnimationDuration = time;
        }
      });
      clearTimeout(animationCallbackId);

      if (!animating) {
        if (typeof callback === 'function') callback();
      } else {
        animationCallbackId = setTimeout(function () {
          if (typeof callback === 'function') callback();
        }, animationTime);
      }

      animationStates = [];
    },
    animate: function animate(target, currentRect, toRect, duration) {
      if (duration) {
        css(target, 'transition', '');
        css(target, 'transform', '');
        var elMatrix = matrix(this.el),
            scaleX = elMatrix && elMatrix.a,
            scaleY = elMatrix && elMatrix.d,
            translateX = (currentRect.left - toRect.left) / (scaleX || 1),
            translateY = (currentRect.top - toRect.top) / (scaleY || 1);
        target.animatingX = !!translateX;
        target.animatingY = !!translateY;
        css(target, 'transform', 'translate3d(' + translateX + 'px,' + translateY + 'px,0)');
        this.forRepaintDummy = repaint(target); // repaint

        css(target, 'transition', 'transform ' + duration + 'ms' + (this.options.easing ? ' ' + this.options.easing : ''));
        css(target, 'transform', 'translate3d(0,0,0)');
        typeof target.animated === 'number' && clearTimeout(target.animated);
        target.animated = setTimeout(function () {
          css(target, 'transition', '');
          css(target, 'transform', '');
          target.animated = false;
          target.animatingX = false;
          target.animatingY = false;
        }, duration);
      }
    }
  };
}

function repaint(target) {
  return target.offsetWidth;
}

function calculateRealTime(animatingRect, fromRect, toRect, options) {
  return Math.sqrt(Math.pow(fromRect.top - animatingRect.top, 2) + Math.pow(fromRect.left - animatingRect.left, 2)) / Math.sqrt(Math.pow(fromRect.top - toRect.top, 2) + Math.pow(fromRect.left - toRect.left, 2)) * options.animation;
}

var plugins = [];
var defaults = {
  initializeByDefault: true
};
var PluginManager = {
  mount: function mount(plugin) {
    // Set default static properties
    for (var option in defaults) {
      if (defaults.hasOwnProperty(option) && !(option in plugin)) {
        plugin[option] = defaults[option];
      }
    }

    plugins.forEach(function (p) {
      if (p.pluginName === plugin.pluginName) {
        throw "Sortable: Cannot mount plugin ".concat(plugin.pluginName, " more than once");
      }
    });
    plugins.push(plugin);
  },
  pluginEvent: function pluginEvent(eventName, sortable, evt) {
    var _this = this;

    this.eventCanceled = false;

    evt.cancel = function () {
      _this.eventCanceled = true;
    };

    var eventNameGlobal = eventName + 'Global';
    plugins.forEach(function (plugin) {
      if (!sortable[plugin.pluginName]) return; // Fire global events if it exists in this sortable

      if (sortable[plugin.pluginName][eventNameGlobal]) {
        sortable[plugin.pluginName][eventNameGlobal](_objectSpread2({
          sortable: sortable
        }, evt));
      } // Only fire plugin event if plugin is enabled in this sortable,
      // and plugin has event defined


      if (sortable.options[plugin.pluginName] && sortable[plugin.pluginName][eventName]) {
        sortable[plugin.pluginName][eventName](_objectSpread2({
          sortable: sortable
        }, evt));
      }
    });
  },
  initializePlugins: function initializePlugins(sortable, el, defaults, options) {
    plugins.forEach(function (plugin) {
      var pluginName = plugin.pluginName;
      if (!sortable.options[pluginName] && !plugin.initializeByDefault) return;
      var initialized = new plugin(sortable, el, sortable.options);
      initialized.sortable = sortable;
      initialized.options = sortable.options;
      sortable[pluginName] = initialized; // Add default options from plugin

      _extends(defaults, initialized.defaults);
    });

    for (var option in sortable.options) {
      if (!sortable.options.hasOwnProperty(option)) continue;
      var modified = this.modifyOption(sortable, option, sortable.options[option]);

      if (typeof modified !== 'undefined') {
        sortable.options[option] = modified;
      }
    }
  },
  getEventProperties: function getEventProperties(name, sortable) {
    var eventProperties = {};
    plugins.forEach(function (plugin) {
      if (typeof plugin.eventProperties !== 'function') return;

      _extends(eventProperties, plugin.eventProperties.call(sortable[plugin.pluginName], name));
    });
    return eventProperties;
  },
  modifyOption: function modifyOption(sortable, name, value) {
    var modifiedValue;
    plugins.forEach(function (plugin) {
      // Plugin must exist on the Sortable
      if (!sortable[plugin.pluginName]) return; // If static option listener exists for this option, call in the context of the Sortable's instance of this plugin

      if (plugin.optionListeners && typeof plugin.optionListeners[name] === 'function') {
        modifiedValue = plugin.optionListeners[name].call(sortable[plugin.pluginName], value);
      }
    });
    return modifiedValue;
  }
};

function dispatchEvent(_ref) {
  var sortable = _ref.sortable,
      rootEl = _ref.rootEl,
      name = _ref.name,
      targetEl = _ref.targetEl,
      cloneEl = _ref.cloneEl,
      toEl = _ref.toEl,
      fromEl = _ref.fromEl,
      oldIndex = _ref.oldIndex,
      newIndex = _ref.newIndex,
      oldDraggableIndex = _ref.oldDraggableIndex,
      newDraggableIndex = _ref.newDraggableIndex,
      originalEvent = _ref.originalEvent,
      putSortable = _ref.putSortable,
      extraEventProperties = _ref.extraEventProperties;
  sortable = sortable || rootEl && rootEl[expando];
  if (!sortable) return;
  var evt,
      options = sortable.options,
      onName = 'on' + name.charAt(0).toUpperCase() + name.substr(1); // Support for new CustomEvent feature

  if (window.CustomEvent && !IE11OrLess && !Edge) {
    evt = new CustomEvent(name, {
      bubbles: true,
      cancelable: true
    });
  } else {
    evt = document.createEvent('Event');
    evt.initEvent(name, true, true);
  }

  evt.to = toEl || rootEl;
  evt.from = fromEl || rootEl;
  evt.item = targetEl || rootEl;
  evt.clone = cloneEl;
  evt.oldIndex = oldIndex;
  evt.newIndex = newIndex;
  evt.oldDraggableIndex = oldDraggableIndex;
  evt.newDraggableIndex = newDraggableIndex;
  evt.originalEvent = originalEvent;
  evt.pullMode = putSortable ? putSortable.lastPutMode : undefined;

  var allEventProperties = _objectSpread2(_objectSpread2({}, extraEventProperties), PluginManager.getEventProperties(name, sortable));

  for (var option in allEventProperties) {
    evt[option] = allEventProperties[option];
  }

  if (rootEl) {
    rootEl.dispatchEvent(evt);
  }

  if (options[onName]) {
    options[onName].call(sortable, evt);
  }
}

var _excluded = ["evt"];

var pluginEvent = function pluginEvent(eventName, sortable) {
  var _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
      originalEvent = _ref.evt,
      data = _objectWithoutProperties(_ref, _excluded);

  PluginManager.pluginEvent.bind(Sortable)(eventName, sortable, _objectSpread2({
    dragEl: dragEl,
    parentEl: parentEl,
    ghostEl: ghostEl,
    rootEl: rootEl,
    nextEl: nextEl,
    lastDownEl: lastDownEl,
    cloneEl: cloneEl,
    cloneHidden: cloneHidden,
    dragStarted: moved,
    putSortable: putSortable,
    activeSortable: Sortable.active,
    originalEvent: originalEvent,
    oldIndex: oldIndex,
    oldDraggableIndex: oldDraggableIndex,
    newIndex: newIndex,
    newDraggableIndex: newDraggableIndex,
    hideGhostForTarget: _hideGhostForTarget,
    unhideGhostForTarget: _unhideGhostForTarget,
    cloneNowHidden: function cloneNowHidden() {
      cloneHidden = true;
    },
    cloneNowShown: function cloneNowShown() {
      cloneHidden = false;
    },
    dispatchSortableEvent: function dispatchSortableEvent(name) {
      _dispatchEvent({
        sortable: sortable,
        name: name,
        originalEvent: originalEvent
      });
    }
  }, data));
};

function _dispatchEvent(info) {
  dispatchEvent(_objectSpread2({
    putSortable: putSortable,
    cloneEl: cloneEl,
    targetEl: dragEl,
    rootEl: rootEl,
    oldIndex: oldIndex,
    oldDraggableIndex: oldDraggableIndex,
    newIndex: newIndex,
    newDraggableIndex: newDraggableIndex
  }, info));
}

var dragEl,
    parentEl,
    ghostEl,
    rootEl,
    nextEl,
    lastDownEl,
    cloneEl,
    cloneHidden,
    oldIndex,
    newIndex,
    oldDraggableIndex,
    newDraggableIndex,
    activeGroup,
    putSortable,
    awaitingDragStarted = false,
    ignoreNextClick = false,
    sortables = [],
    tapEvt,
    touchEvt,
    lastDx,
    lastDy,
    tapDistanceLeft,
    tapDistanceTop,
    moved,
    lastTarget,
    lastDirection,
    pastFirstInvertThresh = false,
    isCircumstantialInvert = false,
    targetMoveDistance,
    // For positioning ghost absolutely
ghostRelativeParent,
    ghostRelativeParentInitialScroll = [],
    // (left, top)
_silent = false,
    savedInputChecked = [];
/** @const */

var documentExists = typeof document !== 'undefined',
    PositionGhostAbsolutely = IOS,
    CSSFloatProperty = Edge || IE11OrLess ? 'cssFloat' : 'float',
    // This will not pass for IE9, because IE9 DnD only works on anchors
supportDraggable = documentExists && !ChromeForAndroid && !IOS && 'draggable' in document.createElement('div'),
    supportCssPointerEvents = function () {
  if (!documentExists) return; // false when <= IE11

  if (IE11OrLess) {
    return false;
  }

  var el = document.createElement('x');
  el.style.cssText = 'pointer-events:auto';
  return el.style.pointerEvents === 'auto';
}(),
    _detectDirection = function _detectDirection(el, options) {
  var elCSS = css(el),
      elWidth = parseInt(elCSS.width) - parseInt(elCSS.paddingLeft) - parseInt(elCSS.paddingRight) - parseInt(elCSS.borderLeftWidth) - parseInt(elCSS.borderRightWidth),
      child1 = getChild(el, 0, options),
      child2 = getChild(el, 1, options),
      firstChildCSS = child1 && css(child1),
      secondChildCSS = child2 && css(child2),
      firstChildWidth = firstChildCSS && parseInt(firstChildCSS.marginLeft) + parseInt(firstChildCSS.marginRight) + getRect(child1).width,
      secondChildWidth = secondChildCSS && parseInt(secondChildCSS.marginLeft) + parseInt(secondChildCSS.marginRight) + getRect(child2).width;

  if (elCSS.display === 'flex') {
    return elCSS.flexDirection === 'column' || elCSS.flexDirection === 'column-reverse' ? 'vertical' : 'horizontal';
  }

  if (elCSS.display === 'grid') {
    return elCSS.gridTemplateColumns.split(' ').length <= 1 ? 'vertical' : 'horizontal';
  }

  if (child1 && firstChildCSS["float"] && firstChildCSS["float"] !== 'none') {
    var touchingSideChild2 = firstChildCSS["float"] === 'left' ? 'left' : 'right';
    return child2 && (secondChildCSS.clear === 'both' || secondChildCSS.clear === touchingSideChild2) ? 'vertical' : 'horizontal';
  }

  return child1 && (firstChildCSS.display === 'block' || firstChildCSS.display === 'flex' || firstChildCSS.display === 'table' || firstChildCSS.display === 'grid' || firstChildWidth >= elWidth && elCSS[CSSFloatProperty] === 'none' || child2 && elCSS[CSSFloatProperty] === 'none' && firstChildWidth + secondChildWidth > elWidth) ? 'vertical' : 'horizontal';
},
    _dragElInRowColumn = function _dragElInRowColumn(dragRect, targetRect, vertical) {
  var dragElS1Opp = vertical ? dragRect.left : dragRect.top,
      dragElS2Opp = vertical ? dragRect.right : dragRect.bottom,
      dragElOppLength = vertical ? dragRect.width : dragRect.height,
      targetS1Opp = vertical ? targetRect.left : targetRect.top,
      targetS2Opp = vertical ? targetRect.right : targetRect.bottom,
      targetOppLength = vertical ? targetRect.width : targetRect.height;
  return dragElS1Opp === targetS1Opp || dragElS2Opp === targetS2Opp || dragElS1Opp + dragElOppLength / 2 === targetS1Opp + targetOppLength / 2;
},

/**
 * Detects first nearest empty sortable to X and Y position using emptyInsertThreshold.
 * @param  {Number} x      X position
 * @param  {Number} y      Y position
 * @return {HTMLElement}   Element of the first found nearest Sortable
 */
_detectNearestEmptySortable = function _detectNearestEmptySortable(x, y) {
  var ret;
  sortables.some(function (sortable) {
    var threshold = sortable[expando].options.emptyInsertThreshold;
    if (!threshold || lastChild(sortable)) return;
    var rect = getRect(sortable),
        insideHorizontally = x >= rect.left - threshold && x <= rect.right + threshold,
        insideVertically = y >= rect.top - threshold && y <= rect.bottom + threshold;

    if (insideHorizontally && insideVertically) {
      return ret = sortable;
    }
  });
  return ret;
},
    _prepareGroup = function _prepareGroup(options) {
  function toFn(value, pull) {
    return function (to, from, dragEl, evt) {
      var sameGroup = to.options.group.name && from.options.group.name && to.options.group.name === from.options.group.name;

      if (value == null && (pull || sameGroup)) {
        // Default pull value
        // Default pull and put value if same group
        return true;
      } else if (value == null || value === false) {
        return false;
      } else if (pull && value === 'clone') {
        return value;
      } else if (typeof value === 'function') {
        return toFn(value(to, from, dragEl, evt), pull)(to, from, dragEl, evt);
      } else {
        var otherGroup = (pull ? to : from).options.group.name;
        return value === true || typeof value === 'string' && value === otherGroup || value.join && value.indexOf(otherGroup) > -1;
      }
    };
  }

  var group = {};
  var originalGroup = options.group;

  if (!originalGroup || _typeof(originalGroup) != 'object') {
    originalGroup = {
      name: originalGroup
    };
  }

  group.name = originalGroup.name;
  group.checkPull = toFn(originalGroup.pull, true);
  group.checkPut = toFn(originalGroup.put);
  group.revertClone = originalGroup.revertClone;
  options.group = group;
},
    _hideGhostForTarget = function _hideGhostForTarget() {
  if (!supportCssPointerEvents && ghostEl) {
    css(ghostEl, 'display', 'none');
  }
},
    _unhideGhostForTarget = function _unhideGhostForTarget() {
  if (!supportCssPointerEvents && ghostEl) {
    css(ghostEl, 'display', '');
  }
}; // #1184 fix - Prevent click event on fallback if dragged but item not changed position


if (documentExists && !ChromeForAndroid) {
  document.addEventListener('click', function (evt) {
    if (ignoreNextClick) {
      evt.preventDefault();
      evt.stopPropagation && evt.stopPropagation();
      evt.stopImmediatePropagation && evt.stopImmediatePropagation();
      ignoreNextClick = false;
      return false;
    }
  }, true);
}

var nearestEmptyInsertDetectEvent = function nearestEmptyInsertDetectEvent(evt) {
  if (dragEl) {
    evt = evt.touches ? evt.touches[0] : evt;

    var nearest = _detectNearestEmptySortable(evt.clientX, evt.clientY);

    if (nearest) {
      // Create imitation event
      var event = {};

      for (var i in evt) {
        if (evt.hasOwnProperty(i)) {
          event[i] = evt[i];
        }
      }

      event.target = event.rootEl = nearest;
      event.preventDefault = void 0;
      event.stopPropagation = void 0;

      nearest[expando]._onDragOver(event);
    }
  }
};

var _checkOutsideTargetEl = function _checkOutsideTargetEl(evt) {
  if (dragEl) {
    dragEl.parentNode[expando]._isOutsideThisEl(evt.target);
  }
};
/**
 * @class  Sortable
 * @param  {HTMLElement}  el
 * @param  {Object}       [options]
 */


function Sortable(el, options) {
  if (!(el && el.nodeType && el.nodeType === 1)) {
    throw "Sortable: `el` must be an HTMLElement, not ".concat({}.toString.call(el));
  }

  this.el = el; // root element

  this.options = options = _extends({}, options); // Export instance

  el[expando] = this;
  var defaults = {
    group: null,
    sort: true,
    disabled: false,
    store: null,
    handle: null,
    draggable: /^[uo]l$/i.test(el.nodeName) ? '>li' : '>*',
    swapThreshold: 1,
    // percentage; 0 <= x <= 1
    invertSwap: false,
    // invert always
    invertedSwapThreshold: null,
    // will be set to same as swapThreshold if default
    removeCloneOnHide: true,
    direction: function direction() {
      return _detectDirection(el, this.options);
    },
    ghostClass: 'sortable-ghost',
    chosenClass: 'sortable-chosen',
    dragClass: 'sortable-drag',
    ignore: 'a, img',
    filter: null,
    preventOnFilter: true,
    animation: 0,
    easing: null,
    setData: function setData(dataTransfer, dragEl) {
      dataTransfer.setData('Text', dragEl.textContent);
    },
    dropBubble: false,
    dragoverBubble: false,
    dataIdAttr: 'data-id',
    delay: 0,
    delayOnTouchOnly: false,
    touchStartThreshold: (Number.parseInt ? Number : window).parseInt(window.devicePixelRatio, 10) || 1,
    forceFallback: false,
    fallbackClass: 'sortable-fallback',
    fallbackOnBody: false,
    fallbackTolerance: 0,
    fallbackOffset: {
      x: 0,
      y: 0
    },
    supportPointer: Sortable.supportPointer !== false && 'PointerEvent' in window && !Safari,
    emptyInsertThreshold: 5
  };
  PluginManager.initializePlugins(this, el, defaults); // Set default options

  for (var name in defaults) {
    !(name in options) && (options[name] = defaults[name]);
  }

  _prepareGroup(options); // Bind all private methods


  for (var fn in this) {
    if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
      this[fn] = this[fn].bind(this);
    }
  } // Setup drag mode


  this.nativeDraggable = options.forceFallback ? false : supportDraggable;

  if (this.nativeDraggable) {
    // Touch start threshold cannot be greater than the native dragstart threshold
    this.options.touchStartThreshold = 1;
  } // Bind events


  if (options.supportPointer) {
    on(el, 'pointerdown', this._onTapStart);
  } else {
    on(el, 'mousedown', this._onTapStart);
    on(el, 'touchstart', this._onTapStart);
  }

  if (this.nativeDraggable) {
    on(el, 'dragover', this);
    on(el, 'dragenter', this);
  }

  sortables.push(this.el); // Restore sorting

  options.store && options.store.get && this.sort(options.store.get(this) || []); // Add animation state manager

  _extends(this, AnimationStateManager());
}

Sortable.prototype =
/** @lends Sortable.prototype */
{
  constructor: Sortable,
  _isOutsideThisEl: function _isOutsideThisEl(target) {
    if (!this.el.contains(target) && target !== this.el) {
      lastTarget = null;
    }
  },
  _getDirection: function _getDirection(evt, target) {
    return typeof this.options.direction === 'function' ? this.options.direction.call(this, evt, target, dragEl) : this.options.direction;
  },
  _onTapStart: function _onTapStart(
  /** Event|TouchEvent */
  evt) {
    if (!evt.cancelable) return;

    var _this = this,
        el = this.el,
        options = this.options,
        preventOnFilter = options.preventOnFilter,
        type = evt.type,
        touch = evt.touches && evt.touches[0] || evt.pointerType && evt.pointerType === 'touch' && evt,
        target = (touch || evt).target,
        originalTarget = evt.target.shadowRoot && (evt.path && evt.path[0] || evt.composedPath && evt.composedPath()[0]) || target,
        filter = options.filter;

    _saveInputCheckedState(el); // Don't trigger start event when an element is been dragged, otherwise the evt.oldindex always wrong when set option.group.


    if (dragEl) {
      return;
    }

    if (/mousedown|pointerdown/.test(type) && evt.button !== 0 || options.disabled) {
      return; // only left button and enabled
    } // cancel dnd if original target is content editable


    if (originalTarget.isContentEditable) {
      return;
    } // Safari ignores further event handling after mousedown


    if (!this.nativeDraggable && Safari && target && target.tagName.toUpperCase() === 'SELECT') {
      return;
    }

    target = closest(target, options.draggable, el, false);

    if (target && target.animated) {
      return;
    }

    if (lastDownEl === target) {
      // Ignoring duplicate `down`
      return;
    } // Get the index of the dragged element within its parent


    oldIndex = index(target);
    oldDraggableIndex = index(target, options.draggable); // Check filter

    if (typeof filter === 'function') {
      if (filter.call(this, evt, target, this)) {
        _dispatchEvent({
          sortable: _this,
          rootEl: originalTarget,
          name: 'filter',
          targetEl: target,
          toEl: el,
          fromEl: el
        });

        pluginEvent('filter', _this, {
          evt: evt
        });
        preventOnFilter && evt.cancelable && evt.preventDefault();
        return; // cancel dnd
      }
    } else if (filter) {
      filter = filter.split(',').some(function (criteria) {
        criteria = closest(originalTarget, criteria.trim(), el, false);

        if (criteria) {
          _dispatchEvent({
            sortable: _this,
            rootEl: criteria,
            name: 'filter',
            targetEl: target,
            fromEl: el,
            toEl: el
          });

          pluginEvent('filter', _this, {
            evt: evt
          });
          return true;
        }
      });

      if (filter) {
        preventOnFilter && evt.cancelable && evt.preventDefault();
        return; // cancel dnd
      }
    }

    if (options.handle && !closest(originalTarget, options.handle, el, false)) {
      return;
    } // Prepare `dragstart`


    this._prepareDragStart(evt, touch, target);
  },
  _prepareDragStart: function _prepareDragStart(
  /** Event */
  evt,
  /** Touch */
  touch,
  /** HTMLElement */
  target) {
    var _this = this,
        el = _this.el,
        options = _this.options,
        ownerDocument = el.ownerDocument,
        dragStartFn;

    if (target && !dragEl && target.parentNode === el) {
      var dragRect = getRect(target);
      rootEl = el;
      dragEl = target;
      parentEl = dragEl.parentNode;
      nextEl = dragEl.nextSibling;
      lastDownEl = target;
      activeGroup = options.group;
      Sortable.dragged = dragEl;
      tapEvt = {
        target: dragEl,
        clientX: (touch || evt).clientX,
        clientY: (touch || evt).clientY
      };
      tapDistanceLeft = tapEvt.clientX - dragRect.left;
      tapDistanceTop = tapEvt.clientY - dragRect.top;
      this._lastX = (touch || evt).clientX;
      this._lastY = (touch || evt).clientY;
      dragEl.style['will-change'] = 'all';

      dragStartFn = function dragStartFn() {
        pluginEvent('delayEnded', _this, {
          evt: evt
        });

        if (Sortable.eventCanceled) {
          _this._onDrop();

          return;
        } // Delayed drag has been triggered
        // we can re-enable the events: touchmove/mousemove


        _this._disableDelayedDragEvents();

        if (!FireFox && _this.nativeDraggable) {
          dragEl.draggable = true;
        } // Bind the events: dragstart/dragend


        _this._triggerDragStart(evt, touch); // Drag start event


        _dispatchEvent({
          sortable: _this,
          name: 'choose',
          originalEvent: evt
        }); // Chosen item


        toggleClass(dragEl, options.chosenClass, true);
      }; // Disable "draggable"


      options.ignore.split(',').forEach(function (criteria) {
        find(dragEl, criteria.trim(), _disableDraggable);
      });
      on(ownerDocument, 'dragover', nearestEmptyInsertDetectEvent);
      on(ownerDocument, 'mousemove', nearestEmptyInsertDetectEvent);
      on(ownerDocument, 'touchmove', nearestEmptyInsertDetectEvent);
      on(ownerDocument, 'mouseup', _this._onDrop);
      on(ownerDocument, 'touchend', _this._onDrop);
      on(ownerDocument, 'touchcancel', _this._onDrop); // Make dragEl draggable (must be before delay for FireFox)

      if (FireFox && this.nativeDraggable) {
        this.options.touchStartThreshold = 4;
        dragEl.draggable = true;
      }

      pluginEvent('delayStart', this, {
        evt: evt
      }); // Delay is impossible for native DnD in Edge or IE

      if (options.delay && (!options.delayOnTouchOnly || touch) && (!this.nativeDraggable || !(Edge || IE11OrLess))) {
        if (Sortable.eventCanceled) {
          this._onDrop();

          return;
        } // If the user moves the pointer or let go the click or touch
        // before the delay has been reached:
        // disable the delayed drag


        on(ownerDocument, 'mouseup', _this._disableDelayedDrag);
        on(ownerDocument, 'touchend', _this._disableDelayedDrag);
        on(ownerDocument, 'touchcancel', _this._disableDelayedDrag);
        on(ownerDocument, 'mousemove', _this._delayedDragTouchMoveHandler);
        on(ownerDocument, 'touchmove', _this._delayedDragTouchMoveHandler);
        options.supportPointer && on(ownerDocument, 'pointermove', _this._delayedDragTouchMoveHandler);
        _this._dragStartTimer = setTimeout(dragStartFn, options.delay);
      } else {
        dragStartFn();
      }
    }
  },
  _delayedDragTouchMoveHandler: function _delayedDragTouchMoveHandler(
  /** TouchEvent|PointerEvent **/
  e) {
    var touch = e.touches ? e.touches[0] : e;

    if (Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) >= Math.floor(this.options.touchStartThreshold / (this.nativeDraggable && window.devicePixelRatio || 1))) {
      this._disableDelayedDrag();
    }
  },
  _disableDelayedDrag: function _disableDelayedDrag() {
    dragEl && _disableDraggable(dragEl);
    clearTimeout(this._dragStartTimer);

    this._disableDelayedDragEvents();
  },
  _disableDelayedDragEvents: function _disableDelayedDragEvents() {
    var ownerDocument = this.el.ownerDocument;
    off(ownerDocument, 'mouseup', this._disableDelayedDrag);
    off(ownerDocument, 'touchend', this._disableDelayedDrag);
    off(ownerDocument, 'touchcancel', this._disableDelayedDrag);
    off(ownerDocument, 'mousemove', this._delayedDragTouchMoveHandler);
    off(ownerDocument, 'touchmove', this._delayedDragTouchMoveHandler);
    off(ownerDocument, 'pointermove', this._delayedDragTouchMoveHandler);
  },
  _triggerDragStart: function _triggerDragStart(
  /** Event */
  evt,
  /** Touch */
  touch) {
    touch = touch || evt.pointerType == 'touch' && evt;

    if (!this.nativeDraggable || touch) {
      if (this.options.supportPointer) {
        on(document, 'pointermove', this._onTouchMove);
      } else if (touch) {
        on(document, 'touchmove', this._onTouchMove);
      } else {
        on(document, 'mousemove', this._onTouchMove);
      }
    } else {
      on(dragEl, 'dragend', this);
      on(rootEl, 'dragstart', this._onDragStart);
    }

    try {
      if (document.selection) {
        // Timeout neccessary for IE9
        _nextTick(function () {
          document.selection.empty();
        });
      } else {
        window.getSelection().removeAllRanges();
      }
    } catch (err) {}
  },
  _dragStarted: function _dragStarted(fallback, evt) {

    awaitingDragStarted = false;

    if (rootEl && dragEl) {
      pluginEvent('dragStarted', this, {
        evt: evt
      });

      if (this.nativeDraggable) {
        on(document, 'dragover', _checkOutsideTargetEl);
      }

      var options = this.options; // Apply effect

      !fallback && toggleClass(dragEl, options.dragClass, false);
      toggleClass(dragEl, options.ghostClass, true);
      Sortable.active = this;
      fallback && this._appendGhost(); // Drag start event

      _dispatchEvent({
        sortable: this,
        name: 'start',
        originalEvent: evt
      });
    } else {
      this._nulling();
    }
  },
  _emulateDragOver: function _emulateDragOver() {
    if (touchEvt) {
      this._lastX = touchEvt.clientX;
      this._lastY = touchEvt.clientY;

      _hideGhostForTarget();

      var target = document.elementFromPoint(touchEvt.clientX, touchEvt.clientY);
      var parent = target;

      while (target && target.shadowRoot) {
        target = target.shadowRoot.elementFromPoint(touchEvt.clientX, touchEvt.clientY);
        if (target === parent) break;
        parent = target;
      }

      dragEl.parentNode[expando]._isOutsideThisEl(target);

      if (parent) {
        do {
          if (parent[expando]) {
            var inserted = void 0;
            inserted = parent[expando]._onDragOver({
              clientX: touchEvt.clientX,
              clientY: touchEvt.clientY,
              target: target,
              rootEl: parent
            });

            if (inserted && !this.options.dragoverBubble) {
              break;
            }
          }

          target = parent; // store last element
        }
        /* jshint boss:true */
        while (parent = parent.parentNode);
      }

      _unhideGhostForTarget();
    }
  },
  _onTouchMove: function _onTouchMove(
  /**TouchEvent*/
  evt) {
    if (tapEvt) {
      var options = this.options,
          fallbackTolerance = options.fallbackTolerance,
          fallbackOffset = options.fallbackOffset,
          touch = evt.touches ? evt.touches[0] : evt,
          ghostMatrix = ghostEl && matrix(ghostEl, true),
          scaleX = ghostEl && ghostMatrix && ghostMatrix.a,
          scaleY = ghostEl && ghostMatrix && ghostMatrix.d,
          relativeScrollOffset = PositionGhostAbsolutely && ghostRelativeParent && getRelativeScrollOffset(ghostRelativeParent),
          dx = (touch.clientX - tapEvt.clientX + fallbackOffset.x) / (scaleX || 1) + (relativeScrollOffset ? relativeScrollOffset[0] - ghostRelativeParentInitialScroll[0] : 0) / (scaleX || 1),
          dy = (touch.clientY - tapEvt.clientY + fallbackOffset.y) / (scaleY || 1) + (relativeScrollOffset ? relativeScrollOffset[1] - ghostRelativeParentInitialScroll[1] : 0) / (scaleY || 1); // only set the status to dragging, when we are actually dragging

      if (!Sortable.active && !awaitingDragStarted) {
        if (fallbackTolerance && Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) < fallbackTolerance) {
          return;
        }

        this._onDragStart(evt, true);
      }

      if (ghostEl) {
        if (ghostMatrix) {
          ghostMatrix.e += dx - (lastDx || 0);
          ghostMatrix.f += dy - (lastDy || 0);
        } else {
          ghostMatrix = {
            a: 1,
            b: 0,
            c: 0,
            d: 1,
            e: dx,
            f: dy
          };
        }

        var cssMatrix = "matrix(".concat(ghostMatrix.a, ",").concat(ghostMatrix.b, ",").concat(ghostMatrix.c, ",").concat(ghostMatrix.d, ",").concat(ghostMatrix.e, ",").concat(ghostMatrix.f, ")");
        css(ghostEl, 'webkitTransform', cssMatrix);
        css(ghostEl, 'mozTransform', cssMatrix);
        css(ghostEl, 'msTransform', cssMatrix);
        css(ghostEl, 'transform', cssMatrix);
        lastDx = dx;
        lastDy = dy;
        touchEvt = touch;
      }

      evt.cancelable && evt.preventDefault();
    }
  },
  _appendGhost: function _appendGhost() {
    // Bug if using scale(): https://stackoverflow.com/questions/2637058
    // Not being adjusted for
    if (!ghostEl) {
      var container = this.options.fallbackOnBody ? document.body : rootEl,
          rect = getRect(dragEl, true, PositionGhostAbsolutely, true, container),
          options = this.options; // Position absolutely

      if (PositionGhostAbsolutely) {
        // Get relatively positioned parent
        ghostRelativeParent = container;

        while (css(ghostRelativeParent, 'position') === 'static' && css(ghostRelativeParent, 'transform') === 'none' && ghostRelativeParent !== document) {
          ghostRelativeParent = ghostRelativeParent.parentNode;
        }

        if (ghostRelativeParent !== document.body && ghostRelativeParent !== document.documentElement) {
          if (ghostRelativeParent === document) ghostRelativeParent = getWindowScrollingElement();
          rect.top += ghostRelativeParent.scrollTop;
          rect.left += ghostRelativeParent.scrollLeft;
        } else {
          ghostRelativeParent = getWindowScrollingElement();
        }

        ghostRelativeParentInitialScroll = getRelativeScrollOffset(ghostRelativeParent);
      }

      ghostEl = dragEl.cloneNode(true);
      toggleClass(ghostEl, options.ghostClass, false);
      toggleClass(ghostEl, options.fallbackClass, true);
      toggleClass(ghostEl, options.dragClass, true);
      css(ghostEl, 'transition', '');
      css(ghostEl, 'transform', '');
      css(ghostEl, 'box-sizing', 'border-box');
      css(ghostEl, 'margin', 0);
      css(ghostEl, 'top', rect.top);
      css(ghostEl, 'left', rect.left);
      css(ghostEl, 'width', rect.width);
      css(ghostEl, 'height', rect.height);
      css(ghostEl, 'opacity', '0.8');
      css(ghostEl, 'position', PositionGhostAbsolutely ? 'absolute' : 'fixed');
      css(ghostEl, 'zIndex', '100000');
      css(ghostEl, 'pointerEvents', 'none');
      Sortable.ghost = ghostEl;
      container.appendChild(ghostEl); // Set transform-origin

      css(ghostEl, 'transform-origin', tapDistanceLeft / parseInt(ghostEl.style.width) * 100 + '% ' + tapDistanceTop / parseInt(ghostEl.style.height) * 100 + '%');
    }
  },
  _onDragStart: function _onDragStart(
  /**Event*/
  evt,
  /**boolean*/
  fallback) {
    var _this = this;

    var dataTransfer = evt.dataTransfer;
    var options = _this.options;
    pluginEvent('dragStart', this, {
      evt: evt
    });

    if (Sortable.eventCanceled) {
      this._onDrop();

      return;
    }

    pluginEvent('setupClone', this);

    if (!Sortable.eventCanceled) {
      cloneEl = clone(dragEl);
      cloneEl.removeAttribute("id");
      cloneEl.draggable = false;
      cloneEl.style['will-change'] = '';

      this._hideClone();

      toggleClass(cloneEl, this.options.chosenClass, false);
      Sortable.clone = cloneEl;
    } // #1143: IFrame support workaround


    _this.cloneId = _nextTick(function () {
      pluginEvent('clone', _this);
      if (Sortable.eventCanceled) return;

      if (!_this.options.removeCloneOnHide) {
        rootEl.insertBefore(cloneEl, dragEl);
      }

      _this._hideClone();

      _dispatchEvent({
        sortable: _this,
        name: 'clone'
      });
    });
    !fallback && toggleClass(dragEl, options.dragClass, true); // Set proper drop events

    if (fallback) {
      ignoreNextClick = true;
      _this._loopId = setInterval(_this._emulateDragOver, 50);
    } else {
      // Undo what was set in _prepareDragStart before drag started
      off(document, 'mouseup', _this._onDrop);
      off(document, 'touchend', _this._onDrop);
      off(document, 'touchcancel', _this._onDrop);

      if (dataTransfer) {
        dataTransfer.effectAllowed = 'move';
        options.setData && options.setData.call(_this, dataTransfer, dragEl);
      }

      on(document, 'drop', _this); // #1276 fix:

      css(dragEl, 'transform', 'translateZ(0)');
    }

    awaitingDragStarted = true;
    _this._dragStartId = _nextTick(_this._dragStarted.bind(_this, fallback, evt));
    on(document, 'selectstart', _this);
    moved = true;

    if (Safari) {
      css(document.body, 'user-select', 'none');
    }
  },
  // Returns true - if no further action is needed (either inserted or another condition)
  _onDragOver: function _onDragOver(
  /**Event*/
  evt) {
    var el = this.el,
        target = evt.target,
        dragRect,
        targetRect,
        revert,
        options = this.options,
        group = options.group,
        activeSortable = Sortable.active,
        isOwner = activeGroup === group,
        canSort = options.sort,
        fromSortable = putSortable || activeSortable,
        vertical,
        _this = this,
        completedFired = false;

    if (_silent) return;

    function dragOverEvent(name, extra) {
      pluginEvent(name, _this, _objectSpread2({
        evt: evt,
        isOwner: isOwner,
        axis: vertical ? 'vertical' : 'horizontal',
        revert: revert,
        dragRect: dragRect,
        targetRect: targetRect,
        canSort: canSort,
        fromSortable: fromSortable,
        target: target,
        completed: completed,
        onMove: function onMove(target, after) {
          return _onMove(rootEl, el, dragEl, dragRect, target, getRect(target), evt, after);
        },
        changed: changed
      }, extra));
    } // Capture animation state


    function capture() {
      dragOverEvent('dragOverAnimationCapture');

      _this.captureAnimationState();

      if (_this !== fromSortable) {
        fromSortable.captureAnimationState();
      }
    } // Return invocation when dragEl is inserted (or completed)


    function completed(insertion) {
      dragOverEvent('dragOverCompleted', {
        insertion: insertion
      });

      if (insertion) {
        // Clones must be hidden before folding animation to capture dragRectAbsolute properly
        if (isOwner) {
          activeSortable._hideClone();
        } else {
          activeSortable._showClone(_this);
        }

        if (_this !== fromSortable) {
          // Set ghost class to new sortable's ghost class
          toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : activeSortable.options.ghostClass, false);
          toggleClass(dragEl, options.ghostClass, true);
        }

        if (putSortable !== _this && _this !== Sortable.active) {
          putSortable = _this;
        } else if (_this === Sortable.active && putSortable) {
          putSortable = null;
        } // Animation


        if (fromSortable === _this) {
          _this._ignoreWhileAnimating = target;
        }

        _this.animateAll(function () {
          dragOverEvent('dragOverAnimationComplete');
          _this._ignoreWhileAnimating = null;
        });

        if (_this !== fromSortable) {
          fromSortable.animateAll();
          fromSortable._ignoreWhileAnimating = null;
        }
      } // Null lastTarget if it is not inside a previously swapped element


      if (target === dragEl && !dragEl.animated || target === el && !target.animated) {
        lastTarget = null;
      } // no bubbling and not fallback


      if (!options.dragoverBubble && !evt.rootEl && target !== document) {
        dragEl.parentNode[expando]._isOutsideThisEl(evt.target); // Do not detect for empty insert if already inserted


        !insertion && nearestEmptyInsertDetectEvent(evt);
      }

      !options.dragoverBubble && evt.stopPropagation && evt.stopPropagation();
      return completedFired = true;
    } // Call when dragEl has been inserted


    function changed() {
      newIndex = index(dragEl);
      newDraggableIndex = index(dragEl, options.draggable);

      _dispatchEvent({
        sortable: _this,
        name: 'change',
        toEl: el,
        newIndex: newIndex,
        newDraggableIndex: newDraggableIndex,
        originalEvent: evt
      });
    }

    if (evt.preventDefault !== void 0) {
      evt.cancelable && evt.preventDefault();
    }

    target = closest(target, options.draggable, el, true);
    dragOverEvent('dragOver');
    if (Sortable.eventCanceled) return completedFired;

    if (dragEl.contains(evt.target) || target.animated && target.animatingX && target.animatingY || _this._ignoreWhileAnimating === target) {
      return completed(false);
    }

    ignoreNextClick = false;

    if (activeSortable && !options.disabled && (isOwner ? canSort || (revert = parentEl !== rootEl) // Reverting item into the original list
    : putSortable === this || (this.lastPutMode = activeGroup.checkPull(this, activeSortable, dragEl, evt)) && group.checkPut(this, activeSortable, dragEl, evt))) {
      vertical = this._getDirection(evt, target) === 'vertical';
      dragRect = getRect(dragEl);
      dragOverEvent('dragOverValid');
      if (Sortable.eventCanceled) return completedFired;

      if (revert) {
        parentEl = rootEl; // actualization

        capture();

        this._hideClone();

        dragOverEvent('revert');

        if (!Sortable.eventCanceled) {
          if (nextEl) {
            rootEl.insertBefore(dragEl, nextEl);
          } else {
            rootEl.appendChild(dragEl);
          }
        }

        return completed(true);
      }

      var elLastChild = lastChild(el, options.draggable);

      if (!elLastChild || _ghostIsLast(evt, vertical, this) && !elLastChild.animated) {
        // Insert to end of list
        // If already at end of list: Do not insert
        if (elLastChild === dragEl) {
          return completed(false);
        } // if there is a last element, it is the target


        if (elLastChild && el === evt.target) {
          target = elLastChild;
        }

        if (target) {
          targetRect = getRect(target);
        }

        if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, !!target) !== false) {
          capture();

          if (elLastChild && elLastChild.nextSibling) {
            // the last draggable element is not the last node
            el.insertBefore(dragEl, elLastChild.nextSibling);
          } else {
            el.appendChild(dragEl);
          }

          parentEl = el; // actualization

          changed();
          return completed(true);
        }
      } else if (elLastChild && _ghostIsFirst(evt, vertical, this)) {
        // Insert to start of list
        var firstChild = getChild(el, 0, options, true);

        if (firstChild === dragEl) {
          return completed(false);
        }

        target = firstChild;
        targetRect = getRect(target);

        if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, false) !== false) {
          capture();
          el.insertBefore(dragEl, firstChild);
          parentEl = el; // actualization

          changed();
          return completed(true);
        }
      } else if (target.parentNode === el) {
        targetRect = getRect(target);
        var direction = 0,
            targetBeforeFirstSwap,
            differentLevel = dragEl.parentNode !== el,
            differentRowCol = !_dragElInRowColumn(dragEl.animated && dragEl.toRect || dragRect, target.animated && target.toRect || targetRect, vertical),
            side1 = vertical ? 'top' : 'left',
            scrolledPastTop = isScrolledPast(target, 'top', 'top') || isScrolledPast(dragEl, 'top', 'top'),
            scrollBefore = scrolledPastTop ? scrolledPastTop.scrollTop : void 0;

        if (lastTarget !== target) {
          targetBeforeFirstSwap = targetRect[side1];
          pastFirstInvertThresh = false;
          isCircumstantialInvert = !differentRowCol && options.invertSwap || differentLevel;
        }

        direction = _getSwapDirection(evt, target, targetRect, vertical, differentRowCol ? 1 : options.swapThreshold, options.invertedSwapThreshold == null ? options.swapThreshold : options.invertedSwapThreshold, isCircumstantialInvert, lastTarget === target);
        var sibling;

        if (direction !== 0) {
          // Check if target is beside dragEl in respective direction (ignoring hidden elements)
          var dragIndex = index(dragEl);

          do {
            dragIndex -= direction;
            sibling = parentEl.children[dragIndex];
          } while (sibling && (css(sibling, 'display') === 'none' || sibling === ghostEl));
        } // If dragEl is already beside target: Do not insert


        if (direction === 0 || sibling === target) {
          return completed(false);
        }

        lastTarget = target;
        lastDirection = direction;
        var nextSibling = target.nextElementSibling,
            after = false;
        after = direction === 1;

        var moveVector = _onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, after);

        if (moveVector !== false) {
          if (moveVector === 1 || moveVector === -1) {
            after = moveVector === 1;
          }

          _silent = true;
          setTimeout(_unsilent, 30);
          capture();

          if (after && !nextSibling) {
            el.appendChild(dragEl);
          } else {
            target.parentNode.insertBefore(dragEl, after ? nextSibling : target);
          } // Undo chrome's scroll adjustment (has no effect on other browsers)


          if (scrolledPastTop) {
            scrollBy(scrolledPastTop, 0, scrollBefore - scrolledPastTop.scrollTop);
          }

          parentEl = dragEl.parentNode; // actualization
          // must be done before animation

          if (targetBeforeFirstSwap !== undefined && !isCircumstantialInvert) {
            targetMoveDistance = Math.abs(targetBeforeFirstSwap - getRect(target)[side1]);
          }

          changed();
          return completed(true);
        }
      }

      if (el.contains(dragEl)) {
        return completed(false);
      }
    }

    return false;
  },
  _ignoreWhileAnimating: null,
  _offMoveEvents: function _offMoveEvents() {
    off(document, 'mousemove', this._onTouchMove);
    off(document, 'touchmove', this._onTouchMove);
    off(document, 'pointermove', this._onTouchMove);
    off(document, 'dragover', nearestEmptyInsertDetectEvent);
    off(document, 'mousemove', nearestEmptyInsertDetectEvent);
    off(document, 'touchmove', nearestEmptyInsertDetectEvent);
  },
  _offUpEvents: function _offUpEvents() {
    var ownerDocument = this.el.ownerDocument;
    off(ownerDocument, 'mouseup', this._onDrop);
    off(ownerDocument, 'touchend', this._onDrop);
    off(ownerDocument, 'pointerup', this._onDrop);
    off(ownerDocument, 'touchcancel', this._onDrop);
    off(document, 'selectstart', this);
  },
  _onDrop: function _onDrop(
  /**Event*/
  evt) {
    var el = this.el,
        options = this.options; // Get the index of the dragged element within its parent

    newIndex = index(dragEl);
    newDraggableIndex = index(dragEl, options.draggable);
    pluginEvent('drop', this, {
      evt: evt
    });
    parentEl = dragEl && dragEl.parentNode; // Get again after plugin event

    newIndex = index(dragEl);
    newDraggableIndex = index(dragEl, options.draggable);

    if (Sortable.eventCanceled) {
      this._nulling();

      return;
    }

    awaitingDragStarted = false;
    isCircumstantialInvert = false;
    pastFirstInvertThresh = false;
    clearInterval(this._loopId);
    clearTimeout(this._dragStartTimer);

    _cancelNextTick(this.cloneId);

    _cancelNextTick(this._dragStartId); // Unbind events


    if (this.nativeDraggable) {
      off(document, 'drop', this);
      off(el, 'dragstart', this._onDragStart);
    }

    this._offMoveEvents();

    this._offUpEvents();

    if (Safari) {
      css(document.body, 'user-select', '');
    }

    css(dragEl, 'transform', '');

    if (evt) {
      if (moved) {
        evt.cancelable && evt.preventDefault();
        !options.dropBubble && evt.stopPropagation();
      }

      ghostEl && ghostEl.parentNode && ghostEl.parentNode.removeChild(ghostEl);

      if (rootEl === parentEl || putSortable && putSortable.lastPutMode !== 'clone') {
        // Remove clone(s)
        cloneEl && cloneEl.parentNode && cloneEl.parentNode.removeChild(cloneEl);
      }

      if (dragEl) {
        if (this.nativeDraggable) {
          off(dragEl, 'dragend', this);
        }

        _disableDraggable(dragEl);

        dragEl.style['will-change'] = ''; // Remove classes
        // ghostClass is added in dragStarted

        if (moved && !awaitingDragStarted) {
          toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : this.options.ghostClass, false);
        }

        toggleClass(dragEl, this.options.chosenClass, false); // Drag stop event

        _dispatchEvent({
          sortable: this,
          name: 'unchoose',
          toEl: parentEl,
          newIndex: null,
          newDraggableIndex: null,
          originalEvent: evt
        });

        if (rootEl !== parentEl) {
          if (newIndex >= 0) {
            // Add event
            _dispatchEvent({
              rootEl: parentEl,
              name: 'add',
              toEl: parentEl,
              fromEl: rootEl,
              originalEvent: evt
            }); // Remove event


            _dispatchEvent({
              sortable: this,
              name: 'remove',
              toEl: parentEl,
              originalEvent: evt
            }); // drag from one list and drop into another


            _dispatchEvent({
              rootEl: parentEl,
              name: 'sort',
              toEl: parentEl,
              fromEl: rootEl,
              originalEvent: evt
            });

            _dispatchEvent({
              sortable: this,
              name: 'sort',
              toEl: parentEl,
              originalEvent: evt
            });
          }

          putSortable && putSortable.save();
        } else {
          if (newIndex !== oldIndex) {
            if (newIndex >= 0) {
              // drag & drop within the same list
              _dispatchEvent({
                sortable: this,
                name: 'update',
                toEl: parentEl,
                originalEvent: evt
              });

              _dispatchEvent({
                sortable: this,
                name: 'sort',
                toEl: parentEl,
                originalEvent: evt
              });
            }
          }
        }

        if (Sortable.active) {
          /* jshint eqnull:true */
          if (newIndex == null || newIndex === -1) {
            newIndex = oldIndex;
            newDraggableIndex = oldDraggableIndex;
          }

          _dispatchEvent({
            sortable: this,
            name: 'end',
            toEl: parentEl,
            originalEvent: evt
          }); // Save sorting


          this.save();
        }
      }
    }

    this._nulling();
  },
  _nulling: function _nulling() {
    pluginEvent('nulling', this);
    rootEl = dragEl = parentEl = ghostEl = nextEl = cloneEl = lastDownEl = cloneHidden = tapEvt = touchEvt = moved = newIndex = newDraggableIndex = oldIndex = oldDraggableIndex = lastTarget = lastDirection = putSortable = activeGroup = Sortable.dragged = Sortable.ghost = Sortable.clone = Sortable.active = null;
    savedInputChecked.forEach(function (el) {
      el.checked = true;
    });
    savedInputChecked.length = lastDx = lastDy = 0;
  },
  handleEvent: function handleEvent(
  /**Event*/
  evt) {
    switch (evt.type) {
      case 'drop':
      case 'dragend':
        this._onDrop(evt);

        break;

      case 'dragenter':
      case 'dragover':
        if (dragEl) {
          this._onDragOver(evt);

          _globalDragOver(evt);
        }

        break;

      case 'selectstart':
        evt.preventDefault();
        break;
    }
  },

  /**
   * Serializes the item into an array of string.
   * @returns {String[]}
   */
  toArray: function toArray() {
    var order = [],
        el,
        children = this.el.children,
        i = 0,
        n = children.length,
        options = this.options;

    for (; i < n; i++) {
      el = children[i];

      if (closest(el, options.draggable, this.el, false)) {
        order.push(el.getAttribute(options.dataIdAttr) || _generateId(el));
      }
    }

    return order;
  },

  /**
   * Sorts the elements according to the array.
   * @param  {String[]}  order  order of the items
   */
  sort: function sort(order, useAnimation) {
    var items = {},
        rootEl = this.el;
    this.toArray().forEach(function (id, i) {
      var el = rootEl.children[i];

      if (closest(el, this.options.draggable, rootEl, false)) {
        items[id] = el;
      }
    }, this);
    useAnimation && this.captureAnimationState();
    order.forEach(function (id) {
      if (items[id]) {
        rootEl.removeChild(items[id]);
        rootEl.appendChild(items[id]);
      }
    });
    useAnimation && this.animateAll();
  },

  /**
   * Save the current sorting
   */
  save: function save() {
    var store = this.options.store;
    store && store.set && store.set(this);
  },

  /**
   * For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
   * @param   {HTMLElement}  el
   * @param   {String}       [selector]  default: `options.draggable`
   * @returns {HTMLElement|null}
   */
  closest: function closest$1(el, selector) {
    return closest(el, selector || this.options.draggable, this.el, false);
  },

  /**
   * Set/get option
   * @param   {string} name
   * @param   {*}      [value]
   * @returns {*}
   */
  option: function option(name, value) {
    var options = this.options;

    if (value === void 0) {
      return options[name];
    } else {
      var modifiedValue = PluginManager.modifyOption(this, name, value);

      if (typeof modifiedValue !== 'undefined') {
        options[name] = modifiedValue;
      } else {
        options[name] = value;
      }

      if (name === 'group') {
        _prepareGroup(options);
      }
    }
  },

  /**
   * Destroy
   */
  destroy: function destroy() {
    pluginEvent('destroy', this);
    var el = this.el;
    el[expando] = null;
    off(el, 'mousedown', this._onTapStart);
    off(el, 'touchstart', this._onTapStart);
    off(el, 'pointerdown', this._onTapStart);

    if (this.nativeDraggable) {
      off(el, 'dragover', this);
      off(el, 'dragenter', this);
    } // Remove draggable attributes


    Array.prototype.forEach.call(el.querySelectorAll('[draggable]'), function (el) {
      el.removeAttribute('draggable');
    });

    this._onDrop();

    this._disableDelayedDragEvents();

    sortables.splice(sortables.indexOf(this.el), 1);
    this.el = el = null;
  },
  _hideClone: function _hideClone() {
    if (!cloneHidden) {
      pluginEvent('hideClone', this);
      if (Sortable.eventCanceled) return;
      css(cloneEl, 'display', 'none');

      if (this.options.removeCloneOnHide && cloneEl.parentNode) {
        cloneEl.parentNode.removeChild(cloneEl);
      }

      cloneHidden = true;
    }
  },
  _showClone: function _showClone(putSortable) {
    if (putSortable.lastPutMode !== 'clone') {
      this._hideClone();

      return;
    }

    if (cloneHidden) {
      pluginEvent('showClone', this);
      if (Sortable.eventCanceled) return; // show clone at dragEl or original position

      if (dragEl.parentNode == rootEl && !this.options.group.revertClone) {
        rootEl.insertBefore(cloneEl, dragEl);
      } else if (nextEl) {
        rootEl.insertBefore(cloneEl, nextEl);
      } else {
        rootEl.appendChild(cloneEl);
      }

      if (this.options.group.revertClone) {
        this.animate(dragEl, cloneEl);
      }

      css(cloneEl, 'display', '');
      cloneHidden = false;
    }
  }
};

function _globalDragOver(
/**Event*/
evt) {
  if (evt.dataTransfer) {
    evt.dataTransfer.dropEffect = 'move';
  }

  evt.cancelable && evt.preventDefault();
}

function _onMove(fromEl, toEl, dragEl, dragRect, targetEl, targetRect, originalEvent, willInsertAfter) {
  var evt,
      sortable = fromEl[expando],
      onMoveFn = sortable.options.onMove,
      retVal; // Support for new CustomEvent feature

  if (window.CustomEvent && !IE11OrLess && !Edge) {
    evt = new CustomEvent('move', {
      bubbles: true,
      cancelable: true
    });
  } else {
    evt = document.createEvent('Event');
    evt.initEvent('move', true, true);
  }

  evt.to = toEl;
  evt.from = fromEl;
  evt.dragged = dragEl;
  evt.draggedRect = dragRect;
  evt.related = targetEl || toEl;
  evt.relatedRect = targetRect || getRect(toEl);
  evt.willInsertAfter = willInsertAfter;
  evt.originalEvent = originalEvent;
  fromEl.dispatchEvent(evt);

  if (onMoveFn) {
    retVal = onMoveFn.call(sortable, evt, originalEvent);
  }

  return retVal;
}

function _disableDraggable(el) {
  el.draggable = false;
}

function _unsilent() {
  _silent = false;
}

function _ghostIsFirst(evt, vertical, sortable) {
  var rect = getRect(getChild(sortable.el, 0, sortable.options, true));
  var spacer = 10;
  return vertical ? evt.clientX < rect.left - spacer || evt.clientY < rect.top && evt.clientX < rect.right : evt.clientY < rect.top - spacer || evt.clientY < rect.bottom && evt.clientX < rect.left;
}

function _ghostIsLast(evt, vertical, sortable) {
  var rect = getRect(lastChild(sortable.el, sortable.options.draggable));
  var spacer = 10;
  return vertical ? evt.clientX > rect.right + spacer || evt.clientX <= rect.right && evt.clientY > rect.bottom && evt.clientX >= rect.left : evt.clientX > rect.right && evt.clientY > rect.top || evt.clientX <= rect.right && evt.clientY > rect.bottom + spacer;
}

function _getSwapDirection(evt, target, targetRect, vertical, swapThreshold, invertedSwapThreshold, invertSwap, isLastTarget) {
  var mouseOnAxis = vertical ? evt.clientY : evt.clientX,
      targetLength = vertical ? targetRect.height : targetRect.width,
      targetS1 = vertical ? targetRect.top : targetRect.left,
      targetS2 = vertical ? targetRect.bottom : targetRect.right,
      invert = false;

  if (!invertSwap) {
    // Never invert or create dragEl shadow when target movemenet causes mouse to move past the end of regular swapThreshold
    if (isLastTarget && targetMoveDistance < targetLength * swapThreshold) {
      // multiplied only by swapThreshold because mouse will already be inside target by (1 - threshold) * targetLength / 2
      // check if past first invert threshold on side opposite of lastDirection
      if (!pastFirstInvertThresh && (lastDirection === 1 ? mouseOnAxis > targetS1 + targetLength * invertedSwapThreshold / 2 : mouseOnAxis < targetS2 - targetLength * invertedSwapThreshold / 2)) {
        // past first invert threshold, do not restrict inverted threshold to dragEl shadow
        pastFirstInvertThresh = true;
      }

      if (!pastFirstInvertThresh) {
        // dragEl shadow (target move distance shadow)
        if (lastDirection === 1 ? mouseOnAxis < targetS1 + targetMoveDistance // over dragEl shadow
        : mouseOnAxis > targetS2 - targetMoveDistance) {
          return -lastDirection;
        }
      } else {
        invert = true;
      }
    } else {
      // Regular
      if (mouseOnAxis > targetS1 + targetLength * (1 - swapThreshold) / 2 && mouseOnAxis < targetS2 - targetLength * (1 - swapThreshold) / 2) {
        return _getInsertDirection(target);
      }
    }
  }

  invert = invert || invertSwap;

  if (invert) {
    // Invert of regular
    if (mouseOnAxis < targetS1 + targetLength * invertedSwapThreshold / 2 || mouseOnAxis > targetS2 - targetLength * invertedSwapThreshold / 2) {
      return mouseOnAxis > targetS1 + targetLength / 2 ? 1 : -1;
    }
  }

  return 0;
}
/**
 * Gets the direction dragEl must be swapped relative to target in order to make it
 * seem that dragEl has been "inserted" into that element's position
 * @param  {HTMLElement} target       The target whose position dragEl is being inserted at
 * @return {Number}                   Direction dragEl must be swapped
 */


function _getInsertDirection(target) {
  if (index(dragEl) < index(target)) {
    return 1;
  } else {
    return -1;
  }
}
/**
 * Generate id
 * @param   {HTMLElement} el
 * @returns {String}
 * @private
 */


function _generateId(el) {
  var str = el.tagName + el.className + el.src + el.href + el.textContent,
      i = str.length,
      sum = 0;

  while (i--) {
    sum += str.charCodeAt(i);
  }

  return sum.toString(36);
}

function _saveInputCheckedState(root) {
  savedInputChecked.length = 0;
  var inputs = root.getElementsByTagName('input');
  var idx = inputs.length;

  while (idx--) {
    var el = inputs[idx];
    el.checked && savedInputChecked.push(el);
  }
}

function _nextTick(fn) {
  return setTimeout(fn, 0);
}

function _cancelNextTick(id) {
  return clearTimeout(id);
} // Fixed #973:


if (documentExists) {
  on(document, 'touchmove', function (evt) {
    if ((Sortable.active || awaitingDragStarted) && evt.cancelable) {
      evt.preventDefault();
    }
  });
} // Export utils


Sortable.utils = {
  on: on,
  off: off,
  css: css,
  find: find,
  is: function is(el, selector) {
    return !!closest(el, selector, el, false);
  },
  extend: extend,
  throttle: throttle,
  closest: closest,
  toggleClass: toggleClass,
  clone: clone,
  index: index,
  nextTick: _nextTick,
  cancelNextTick: _cancelNextTick,
  detectDirection: _detectDirection,
  getChild: getChild
};
/**
 * Get the Sortable instance of an element
 * @param  {HTMLElement} element The element
 * @return {Sortable|undefined}         The instance of Sortable
 */

Sortable.get = function (element) {
  return element[expando];
};
/**
 * Mount a plugin to Sortable
 * @param  {...SortablePlugin|SortablePlugin[]} plugins       Plugins being mounted
 */


Sortable.mount = function () {
  for (var _len = arguments.length, plugins = new Array(_len), _key = 0; _key < _len; _key++) {
    plugins[_key] = arguments[_key];
  }

  if (plugins[0].constructor === Array) plugins = plugins[0];
  plugins.forEach(function (plugin) {
    if (!plugin.prototype || !plugin.prototype.constructor) {
      throw "Sortable: Mounted plugin must be a constructor function, not ".concat({}.toString.call(plugin));
    }

    if (plugin.utils) Sortable.utils = _objectSpread2(_objectSpread2({}, Sortable.utils), plugin.utils);
    PluginManager.mount(plugin);
  });
};
/**
 * Create sortable instance
 * @param {HTMLElement}  el
 * @param {Object}      [options]
 */


Sortable.create = function (el, options) {
  return new Sortable(el, options);
}; // Export


Sortable.version = version;

var autoScrolls = [],
    scrollEl,
    scrollRootEl,
    scrolling = false,
    lastAutoScrollX,
    lastAutoScrollY,
    touchEvt$1,
    pointerElemChangedInterval;

function AutoScrollPlugin() {
  function AutoScroll() {
    this.defaults = {
      scroll: true,
      forceAutoScrollFallback: false,
      scrollSensitivity: 30,
      scrollSpeed: 10,
      bubbleScroll: true
    }; // Bind all private methods

    for (var fn in this) {
      if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
        this[fn] = this[fn].bind(this);
      }
    }
  }

  AutoScroll.prototype = {
    dragStarted: function dragStarted(_ref) {
      var originalEvent = _ref.originalEvent;

      if (this.sortable.nativeDraggable) {
        on(document, 'dragover', this._handleAutoScroll);
      } else {
        if (this.options.supportPointer) {
          on(document, 'pointermove', this._handleFallbackAutoScroll);
        } else if (originalEvent.touches) {
          on(document, 'touchmove', this._handleFallbackAutoScroll);
        } else {
          on(document, 'mousemove', this._handleFallbackAutoScroll);
        }
      }
    },
    dragOverCompleted: function dragOverCompleted(_ref2) {
      var originalEvent = _ref2.originalEvent;

      // For when bubbling is canceled and using fallback (fallback 'touchmove' always reached)
      if (!this.options.dragOverBubble && !originalEvent.rootEl) {
        this._handleAutoScroll(originalEvent);
      }
    },
    drop: function drop() {
      if (this.sortable.nativeDraggable) {
        off(document, 'dragover', this._handleAutoScroll);
      } else {
        off(document, 'pointermove', this._handleFallbackAutoScroll);
        off(document, 'touchmove', this._handleFallbackAutoScroll);
        off(document, 'mousemove', this._handleFallbackAutoScroll);
      }

      clearPointerElemChangedInterval();
      clearAutoScrolls();
      cancelThrottle();
    },
    nulling: function nulling() {
      touchEvt$1 = scrollRootEl = scrollEl = scrolling = pointerElemChangedInterval = lastAutoScrollX = lastAutoScrollY = null;
      autoScrolls.length = 0;
    },
    _handleFallbackAutoScroll: function _handleFallbackAutoScroll(evt) {
      this._handleAutoScroll(evt, true);
    },
    _handleAutoScroll: function _handleAutoScroll(evt, fallback) {
      var _this = this;

      var x = (evt.touches ? evt.touches[0] : evt).clientX,
          y = (evt.touches ? evt.touches[0] : evt).clientY,
          elem = document.elementFromPoint(x, y);
      touchEvt$1 = evt; // IE does not seem to have native autoscroll,
      // Edge's autoscroll seems too conditional,
      // MACOS Safari does not have autoscroll,
      // Firefox and Chrome are good

      if (fallback || this.options.forceAutoScrollFallback || Edge || IE11OrLess || Safari) {
        autoScroll(evt, this.options, elem, fallback); // Listener for pointer element change

        var ogElemScroller = getParentAutoScrollElement(elem, true);

        if (scrolling && (!pointerElemChangedInterval || x !== lastAutoScrollX || y !== lastAutoScrollY)) {
          pointerElemChangedInterval && clearPointerElemChangedInterval(); // Detect for pointer elem change, emulating native DnD behaviour

          pointerElemChangedInterval = setInterval(function () {
            var newElem = getParentAutoScrollElement(document.elementFromPoint(x, y), true);

            if (newElem !== ogElemScroller) {
              ogElemScroller = newElem;
              clearAutoScrolls();
            }

            autoScroll(evt, _this.options, newElem, fallback);
          }, 10);
          lastAutoScrollX = x;
          lastAutoScrollY = y;
        }
      } else {
        // if DnD is enabled (and browser has good autoscrolling), first autoscroll will already scroll, so get parent autoscroll of first autoscroll
        if (!this.options.bubbleScroll || getParentAutoScrollElement(elem, true) === getWindowScrollingElement()) {
          clearAutoScrolls();
          return;
        }

        autoScroll(evt, this.options, getParentAutoScrollElement(elem, false), false);
      }
    }
  };
  return _extends(AutoScroll, {
    pluginName: 'scroll',
    initializeByDefault: true
  });
}

function clearAutoScrolls() {
  autoScrolls.forEach(function (autoScroll) {
    clearInterval(autoScroll.pid);
  });
  autoScrolls = [];
}

function clearPointerElemChangedInterval() {
  clearInterval(pointerElemChangedInterval);
}

var autoScroll = throttle(function (evt, options, rootEl, isFallback) {
  // Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=505521
  if (!options.scroll) return;
  var x = (evt.touches ? evt.touches[0] : evt).clientX,
      y = (evt.touches ? evt.touches[0] : evt).clientY,
      sens = options.scrollSensitivity,
      speed = options.scrollSpeed,
      winScroller = getWindowScrollingElement();
  var scrollThisInstance = false,
      scrollCustomFn; // New scroll root, set scrollEl

  if (scrollRootEl !== rootEl) {
    scrollRootEl = rootEl;
    clearAutoScrolls();
    scrollEl = options.scroll;
    scrollCustomFn = options.scrollFn;

    if (scrollEl === true) {
      scrollEl = getParentAutoScrollElement(rootEl, true);
    }
  }

  var layersOut = 0;
  var currentParent = scrollEl;

  do {
    var el = currentParent,
        rect = getRect(el),
        top = rect.top,
        bottom = rect.bottom,
        left = rect.left,
        right = rect.right,
        width = rect.width,
        height = rect.height,
        canScrollX = void 0,
        canScrollY = void 0,
        scrollWidth = el.scrollWidth,
        scrollHeight = el.scrollHeight,
        elCSS = css(el),
        scrollPosX = el.scrollLeft,
        scrollPosY = el.scrollTop;

    if (el === winScroller) {
      canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll' || elCSS.overflowX === 'visible');
      canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll' || elCSS.overflowY === 'visible');
    } else {
      canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll');
      canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll');
    }

    var vx = canScrollX && (Math.abs(right - x) <= sens && scrollPosX + width < scrollWidth) - (Math.abs(left - x) <= sens && !!scrollPosX);
    var vy = canScrollY && (Math.abs(bottom - y) <= sens && scrollPosY + height < scrollHeight) - (Math.abs(top - y) <= sens && !!scrollPosY);

    if (!autoScrolls[layersOut]) {
      for (var i = 0; i <= layersOut; i++) {
        if (!autoScrolls[i]) {
          autoScrolls[i] = {};
        }
      }
    }

    if (autoScrolls[layersOut].vx != vx || autoScrolls[layersOut].vy != vy || autoScrolls[layersOut].el !== el) {
      autoScrolls[layersOut].el = el;
      autoScrolls[layersOut].vx = vx;
      autoScrolls[layersOut].vy = vy;
      clearInterval(autoScrolls[layersOut].pid);

      if (vx != 0 || vy != 0) {
        scrollThisInstance = true;
        /* jshint loopfunc:true */

        autoScrolls[layersOut].pid = setInterval(function () {
          // emulate drag over during autoscroll (fallback), emulating native DnD behaviour
          if (isFallback && this.layer === 0) {
            Sortable.active._onTouchMove(touchEvt$1); // To move ghost if it is positioned absolutely

          }

          var scrollOffsetY = autoScrolls[this.layer].vy ? autoScrolls[this.layer].vy * speed : 0;
          var scrollOffsetX = autoScrolls[this.layer].vx ? autoScrolls[this.layer].vx * speed : 0;

          if (typeof scrollCustomFn === 'function') {
            if (scrollCustomFn.call(Sortable.dragged.parentNode[expando], scrollOffsetX, scrollOffsetY, evt, touchEvt$1, autoScrolls[this.layer].el) !== 'continue') {
              return;
            }
          }

          scrollBy(autoScrolls[this.layer].el, scrollOffsetX, scrollOffsetY);
        }.bind({
          layer: layersOut
        }), 24);
      }
    }

    layersOut++;
  } while (options.bubbleScroll && currentParent !== winScroller && (currentParent = getParentAutoScrollElement(currentParent, false)));

  scrolling = scrollThisInstance; // in case another function catches scrolling as false in between when it is not
}, 30);

var drop = function drop(_ref) {
  var originalEvent = _ref.originalEvent,
      putSortable = _ref.putSortable,
      dragEl = _ref.dragEl,
      activeSortable = _ref.activeSortable,
      dispatchSortableEvent = _ref.dispatchSortableEvent,
      hideGhostForTarget = _ref.hideGhostForTarget,
      unhideGhostForTarget = _ref.unhideGhostForTarget;
  if (!originalEvent) return;
  var toSortable = putSortable || activeSortable;
  hideGhostForTarget();
  var touch = originalEvent.changedTouches && originalEvent.changedTouches.length ? originalEvent.changedTouches[0] : originalEvent;
  var target = document.elementFromPoint(touch.clientX, touch.clientY);
  unhideGhostForTarget();

  if (toSortable && !toSortable.el.contains(target)) {
    dispatchSortableEvent('spill');
    this.onSpill({
      dragEl: dragEl,
      putSortable: putSortable
    });
  }
};

function Revert() {}

Revert.prototype = {
  startIndex: null,
  dragStart: function dragStart(_ref2) {
    var oldDraggableIndex = _ref2.oldDraggableIndex;
    this.startIndex = oldDraggableIndex;
  },
  onSpill: function onSpill(_ref3) {
    var dragEl = _ref3.dragEl,
        putSortable = _ref3.putSortable;
    this.sortable.captureAnimationState();

    if (putSortable) {
      putSortable.captureAnimationState();
    }

    var nextSibling = getChild(this.sortable.el, this.startIndex, this.options);

    if (nextSibling) {
      this.sortable.el.insertBefore(dragEl, nextSibling);
    } else {
      this.sortable.el.appendChild(dragEl);
    }

    this.sortable.animateAll();

    if (putSortable) {
      putSortable.animateAll();
    }
  },
  drop: drop
};

_extends(Revert, {
  pluginName: 'revertOnSpill'
});

function Remove() {}

Remove.prototype = {
  onSpill: function onSpill(_ref4) {
    var dragEl = _ref4.dragEl,
        putSortable = _ref4.putSortable;
    var parentSortable = putSortable || this.sortable;
    parentSortable.captureAnimationState();
    dragEl.parentNode && dragEl.parentNode.removeChild(dragEl);
    parentSortable.animateAll();
  },
  drop: drop
};

_extends(Remove, {
  pluginName: 'removeOnSpill'
});

var lastSwapEl;

function SwapPlugin() {
  function Swap() {
    this.defaults = {
      swapClass: 'sortable-swap-highlight'
    };
  }

  Swap.prototype = {
    dragStart: function dragStart(_ref) {
      var dragEl = _ref.dragEl;
      lastSwapEl = dragEl;
    },
    dragOverValid: function dragOverValid(_ref2) {
      var completed = _ref2.completed,
          target = _ref2.target,
          onMove = _ref2.onMove,
          activeSortable = _ref2.activeSortable,
          changed = _ref2.changed,
          cancel = _ref2.cancel;
      if (!activeSortable.options.swap) return;
      var el = this.sortable.el,
          options = this.options;

      if (target && target !== el) {
        var prevSwapEl = lastSwapEl;

        if (onMove(target) !== false) {
          toggleClass(target, options.swapClass, true);
          lastSwapEl = target;
        } else {
          lastSwapEl = null;
        }

        if (prevSwapEl && prevSwapEl !== lastSwapEl) {
          toggleClass(prevSwapEl, options.swapClass, false);
        }
      }

      changed();
      completed(true);
      cancel();
    },
    drop: function drop(_ref3) {
      var activeSortable = _ref3.activeSortable,
          putSortable = _ref3.putSortable,
          dragEl = _ref3.dragEl;
      var toSortable = putSortable || this.sortable;
      var options = this.options;
      lastSwapEl && toggleClass(lastSwapEl, options.swapClass, false);

      if (lastSwapEl && (options.swap || putSortable && putSortable.options.swap)) {
        if (dragEl !== lastSwapEl) {
          toSortable.captureAnimationState();
          if (toSortable !== activeSortable) activeSortable.captureAnimationState();
          swapNodes(dragEl, lastSwapEl);
          toSortable.animateAll();
          if (toSortable !== activeSortable) activeSortable.animateAll();
        }
      }
    },
    nulling: function nulling() {
      lastSwapEl = null;
    }
  };
  return _extends(Swap, {
    pluginName: 'swap',
    eventProperties: function eventProperties() {
      return {
        swapItem: lastSwapEl
      };
    }
  });
}

function swapNodes(n1, n2) {
  var p1 = n1.parentNode,
      p2 = n2.parentNode,
      i1,
      i2;
  if (!p1 || !p2 || p1.isEqualNode(n2) || p2.isEqualNode(n1)) return;
  i1 = index(n1);
  i2 = index(n2);

  if (p1.isEqualNode(p2) && i1 < i2) {
    i2++;
  }

  p1.insertBefore(n2, p1.children[i1]);
  p2.insertBefore(n1, p2.children[i2]);
}

var multiDragElements = [],
    multiDragClones = [],
    lastMultiDragSelect,
    // for selection with modifier key down (SHIFT)
multiDragSortable,
    initialFolding = false,
    // Initial multi-drag fold when drag started
folding = false,
    // Folding any other time
dragStarted = false,
    dragEl$1,
    clonesFromRect,
    clonesHidden;

function MultiDragPlugin() {
  function MultiDrag(sortable) {
    // Bind all private methods
    for (var fn in this) {
      if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
        this[fn] = this[fn].bind(this);
      }
    }

    if (!sortable.options.avoidImplicitDeselect) {
      if (sortable.options.supportPointer) {
        on(document, 'pointerup', this._deselectMultiDrag);
      } else {
        on(document, 'mouseup', this._deselectMultiDrag);
        on(document, 'touchend', this._deselectMultiDrag);
      }
    }

    on(document, 'keydown', this._checkKeyDown);
    on(document, 'keyup', this._checkKeyUp);
    this.defaults = {
      selectedClass: 'sortable-selected',
      multiDragKey: null,
      avoidImplicitDeselect: false,
      setData: function setData(dataTransfer, dragEl) {
        var data = '';

        if (multiDragElements.length && multiDragSortable === sortable) {
          multiDragElements.forEach(function (multiDragElement, i) {
            data += (!i ? '' : ', ') + multiDragElement.textContent;
          });
        } else {
          data = dragEl.textContent;
        }

        dataTransfer.setData('Text', data);
      }
    };
  }

  MultiDrag.prototype = {
    multiDragKeyDown: false,
    isMultiDrag: false,
    delayStartGlobal: function delayStartGlobal(_ref) {
      var dragged = _ref.dragEl;
      dragEl$1 = dragged;
    },
    delayEnded: function delayEnded() {
      this.isMultiDrag = ~multiDragElements.indexOf(dragEl$1);
    },
    setupClone: function setupClone(_ref2) {
      var sortable = _ref2.sortable,
          cancel = _ref2.cancel;
      if (!this.isMultiDrag) return;

      for (var i = 0; i < multiDragElements.length; i++) {
        multiDragClones.push(clone(multiDragElements[i]));
        multiDragClones[i].sortableIndex = multiDragElements[i].sortableIndex;
        multiDragClones[i].draggable = false;
        multiDragClones[i].style['will-change'] = '';
        toggleClass(multiDragClones[i], this.options.selectedClass, false);
        multiDragElements[i] === dragEl$1 && toggleClass(multiDragClones[i], this.options.chosenClass, false);
      }

      sortable._hideClone();

      cancel();
    },
    clone: function clone(_ref3) {
      var sortable = _ref3.sortable,
          rootEl = _ref3.rootEl,
          dispatchSortableEvent = _ref3.dispatchSortableEvent,
          cancel = _ref3.cancel;
      if (!this.isMultiDrag) return;

      if (!this.options.removeCloneOnHide) {
        if (multiDragElements.length && multiDragSortable === sortable) {
          insertMultiDragClones(true, rootEl);
          dispatchSortableEvent('clone');
          cancel();
        }
      }
    },
    showClone: function showClone(_ref4) {
      var cloneNowShown = _ref4.cloneNowShown,
          rootEl = _ref4.rootEl,
          cancel = _ref4.cancel;
      if (!this.isMultiDrag) return;
      insertMultiDragClones(false, rootEl);
      multiDragClones.forEach(function (clone) {
        css(clone, 'display', '');
      });
      cloneNowShown();
      clonesHidden = false;
      cancel();
    },
    hideClone: function hideClone(_ref5) {
      var _this = this;

      var sortable = _ref5.sortable,
          cloneNowHidden = _ref5.cloneNowHidden,
          cancel = _ref5.cancel;
      if (!this.isMultiDrag) return;
      multiDragClones.forEach(function (clone) {
        css(clone, 'display', 'none');

        if (_this.options.removeCloneOnHide && clone.parentNode) {
          clone.parentNode.removeChild(clone);
        }
      });
      cloneNowHidden();
      clonesHidden = true;
      cancel();
    },
    dragStartGlobal: function dragStartGlobal(_ref6) {
      var sortable = _ref6.sortable;

      if (!this.isMultiDrag && multiDragSortable) {
        multiDragSortable.multiDrag._deselectMultiDrag();
      }

      multiDragElements.forEach(function (multiDragElement) {
        multiDragElement.sortableIndex = index(multiDragElement);
      }); // Sort multi-drag elements

      multiDragElements = multiDragElements.sort(function (a, b) {
        return a.sortableIndex - b.sortableIndex;
      });
      dragStarted = true;
    },
    dragStarted: function dragStarted(_ref7) {
      var _this2 = this;

      var sortable = _ref7.sortable;
      if (!this.isMultiDrag) return;

      if (this.options.sort) {
        // Capture rects,
        // hide multi drag elements (by positioning them absolute),
        // set multi drag elements rects to dragRect,
        // show multi drag elements,
        // animate to rects,
        // unset rects & remove from DOM
        sortable.captureAnimationState();

        if (this.options.animation) {
          multiDragElements.forEach(function (multiDragElement) {
            if (multiDragElement === dragEl$1) return;
            css(multiDragElement, 'position', 'absolute');
          });
          var dragRect = getRect(dragEl$1, false, true, true);
          multiDragElements.forEach(function (multiDragElement) {
            if (multiDragElement === dragEl$1) return;
            setRect(multiDragElement, dragRect);
          });
          folding = true;
          initialFolding = true;
        }
      }

      sortable.animateAll(function () {
        folding = false;
        initialFolding = false;

        if (_this2.options.animation) {
          multiDragElements.forEach(function (multiDragElement) {
            unsetRect(multiDragElement);
          });
        } // Remove all auxiliary multidrag items from el, if sorting enabled


        if (_this2.options.sort) {
          removeMultiDragElements();
        }
      });
    },
    dragOver: function dragOver(_ref8) {
      var target = _ref8.target,
          completed = _ref8.completed,
          cancel = _ref8.cancel;

      if (folding && ~multiDragElements.indexOf(target)) {
        completed(false);
        cancel();
      }
    },
    revert: function revert(_ref9) {
      var fromSortable = _ref9.fromSortable,
          rootEl = _ref9.rootEl,
          sortable = _ref9.sortable,
          dragRect = _ref9.dragRect;

      if (multiDragElements.length > 1) {
        // Setup unfold animation
        multiDragElements.forEach(function (multiDragElement) {
          sortable.addAnimationState({
            target: multiDragElement,
            rect: folding ? getRect(multiDragElement) : dragRect
          });
          unsetRect(multiDragElement);
          multiDragElement.fromRect = dragRect;
          fromSortable.removeAnimationState(multiDragElement);
        });
        folding = false;
        insertMultiDragElements(!this.options.removeCloneOnHide, rootEl);
      }
    },
    dragOverCompleted: function dragOverCompleted(_ref10) {
      var sortable = _ref10.sortable,
          isOwner = _ref10.isOwner,
          insertion = _ref10.insertion,
          activeSortable = _ref10.activeSortable,
          parentEl = _ref10.parentEl,
          putSortable = _ref10.putSortable;
      var options = this.options;

      if (insertion) {
        // Clones must be hidden before folding animation to capture dragRectAbsolute properly
        if (isOwner) {
          activeSortable._hideClone();
        }

        initialFolding = false; // If leaving sort:false root, or already folding - Fold to new location

        if (options.animation && multiDragElements.length > 1 && (folding || !isOwner && !activeSortable.options.sort && !putSortable)) {
          // Fold: Set all multi drag elements's rects to dragEl's rect when multi-drag elements are invisible
          var dragRectAbsolute = getRect(dragEl$1, false, true, true);
          multiDragElements.forEach(function (multiDragElement) {
            if (multiDragElement === dragEl$1) return;
            setRect(multiDragElement, dragRectAbsolute); // Move element(s) to end of parentEl so that it does not interfere with multi-drag clones insertion if they are inserted
            // while folding, and so that we can capture them again because old sortable will no longer be fromSortable

            parentEl.appendChild(multiDragElement);
          });
          folding = true;
        } // Clones must be shown (and check to remove multi drags) after folding when interfering multiDragElements are moved out


        if (!isOwner) {
          // Only remove if not folding (folding will remove them anyways)
          if (!folding) {
            removeMultiDragElements();
          }

          if (multiDragElements.length > 1) {
            var clonesHiddenBefore = clonesHidden;

            activeSortable._showClone(sortable); // Unfold animation for clones if showing from hidden


            if (activeSortable.options.animation && !clonesHidden && clonesHiddenBefore) {
              multiDragClones.forEach(function (clone) {
                activeSortable.addAnimationState({
                  target: clone,
                  rect: clonesFromRect
                });
                clone.fromRect = clonesFromRect;
                clone.thisAnimationDuration = null;
              });
            }
          } else {
            activeSortable._showClone(sortable);
          }
        }
      }
    },
    dragOverAnimationCapture: function dragOverAnimationCapture(_ref11) {
      var dragRect = _ref11.dragRect,
          isOwner = _ref11.isOwner,
          activeSortable = _ref11.activeSortable;
      multiDragElements.forEach(function (multiDragElement) {
        multiDragElement.thisAnimationDuration = null;
      });

      if (activeSortable.options.animation && !isOwner && activeSortable.multiDrag.isMultiDrag) {
        clonesFromRect = _extends({}, dragRect);
        var dragMatrix = matrix(dragEl$1, true);
        clonesFromRect.top -= dragMatrix.f;
        clonesFromRect.left -= dragMatrix.e;
      }
    },
    dragOverAnimationComplete: function dragOverAnimationComplete() {
      if (folding) {
        folding = false;
        removeMultiDragElements();
      }
    },
    drop: function drop(_ref12) {
      var evt = _ref12.originalEvent,
          rootEl = _ref12.rootEl,
          parentEl = _ref12.parentEl,
          sortable = _ref12.sortable,
          dispatchSortableEvent = _ref12.dispatchSortableEvent,
          oldIndex = _ref12.oldIndex,
          putSortable = _ref12.putSortable;
      var toSortable = putSortable || this.sortable;
      if (!evt) return;
      var options = this.options,
          children = parentEl.children; // Multi-drag selection

      if (!dragStarted) {
        if (options.multiDragKey && !this.multiDragKeyDown) {
          this._deselectMultiDrag();
        }

        toggleClass(dragEl$1, options.selectedClass, !~multiDragElements.indexOf(dragEl$1));

        if (!~multiDragElements.indexOf(dragEl$1)) {
          multiDragElements.push(dragEl$1);
          dispatchEvent({
            sortable: sortable,
            rootEl: rootEl,
            name: 'select',
            targetEl: dragEl$1,
            originalEvent: evt
          }); // Modifier activated, select from last to dragEl

          if (evt.shiftKey && lastMultiDragSelect && sortable.el.contains(lastMultiDragSelect)) {
            var lastIndex = index(lastMultiDragSelect),
                currentIndex = index(dragEl$1);

            if (~lastIndex && ~currentIndex && lastIndex !== currentIndex) {
              // Must include lastMultiDragSelect (select it), in case modified selection from no selection
              // (but previous selection existed)
              var n, i;

              if (currentIndex > lastIndex) {
                i = lastIndex;
                n = currentIndex;
              } else {
                i = currentIndex;
                n = lastIndex + 1;
              }

              for (; i < n; i++) {
                if (~multiDragElements.indexOf(children[i])) continue;
                toggleClass(children[i], options.selectedClass, true);
                multiDragElements.push(children[i]);
                dispatchEvent({
                  sortable: sortable,
                  rootEl: rootEl,
                  name: 'select',
                  targetEl: children[i],
                  originalEvent: evt
                });
              }
            }
          } else {
            lastMultiDragSelect = dragEl$1;
          }

          multiDragSortable = toSortable;
        } else {
          multiDragElements.splice(multiDragElements.indexOf(dragEl$1), 1);
          lastMultiDragSelect = null;
          dispatchEvent({
            sortable: sortable,
            rootEl: rootEl,
            name: 'deselect',
            targetEl: dragEl$1,
            originalEvent: evt
          });
        }
      } // Multi-drag drop


      if (dragStarted && this.isMultiDrag) {
        folding = false; // Do not "unfold" after around dragEl if reverted

        if ((parentEl[expando].options.sort || parentEl !== rootEl) && multiDragElements.length > 1) {
          var dragRect = getRect(dragEl$1),
              multiDragIndex = index(dragEl$1, ':not(.' + this.options.selectedClass + ')');
          if (!initialFolding && options.animation) dragEl$1.thisAnimationDuration = null;
          toSortable.captureAnimationState();

          if (!initialFolding) {
            if (options.animation) {
              dragEl$1.fromRect = dragRect;
              multiDragElements.forEach(function (multiDragElement) {
                multiDragElement.thisAnimationDuration = null;

                if (multiDragElement !== dragEl$1) {
                  var rect = folding ? getRect(multiDragElement) : dragRect;
                  multiDragElement.fromRect = rect; // Prepare unfold animation

                  toSortable.addAnimationState({
                    target: multiDragElement,
                    rect: rect
                  });
                }
              });
            } // Multi drag elements are not necessarily removed from the DOM on drop, so to reinsert
            // properly they must all be removed


            removeMultiDragElements();
            multiDragElements.forEach(function (multiDragElement) {
              if (children[multiDragIndex]) {
                parentEl.insertBefore(multiDragElement, children[multiDragIndex]);
              } else {
                parentEl.appendChild(multiDragElement);
              }

              multiDragIndex++;
            }); // If initial folding is done, the elements may have changed position because they are now
            // unfolding around dragEl, even though dragEl may not have his index changed, so update event
            // must be fired here as Sortable will not.

            if (oldIndex === index(dragEl$1)) {
              var update = false;
              multiDragElements.forEach(function (multiDragElement) {
                if (multiDragElement.sortableIndex !== index(multiDragElement)) {
                  update = true;
                  return;
                }
              });

              if (update) {
                dispatchSortableEvent('update');
              }
            }
          } // Must be done after capturing individual rects (scroll bar)


          multiDragElements.forEach(function (multiDragElement) {
            unsetRect(multiDragElement);
          });
          toSortable.animateAll();
        }

        multiDragSortable = toSortable;
      } // Remove clones if necessary


      if (rootEl === parentEl || putSortable && putSortable.lastPutMode !== 'clone') {
        multiDragClones.forEach(function (clone) {
          clone.parentNode && clone.parentNode.removeChild(clone);
        });
      }
    },
    nullingGlobal: function nullingGlobal() {
      this.isMultiDrag = dragStarted = false;
      multiDragClones.length = 0;
    },
    destroyGlobal: function destroyGlobal() {
      this._deselectMultiDrag();

      off(document, 'pointerup', this._deselectMultiDrag);
      off(document, 'mouseup', this._deselectMultiDrag);
      off(document, 'touchend', this._deselectMultiDrag);
      off(document, 'keydown', this._checkKeyDown);
      off(document, 'keyup', this._checkKeyUp);
    },
    _deselectMultiDrag: function _deselectMultiDrag(evt) {
      if (typeof dragStarted !== "undefined" && dragStarted) return; // Only deselect if selection is in this sortable

      if (multiDragSortable !== this.sortable) return; // Only deselect if target is not item in this sortable

      if (evt && closest(evt.target, this.options.draggable, this.sortable.el, false)) return; // Only deselect if left click

      if (evt && evt.button !== 0) return;

      while (multiDragElements.length) {
        var el = multiDragElements[0];
        toggleClass(el, this.options.selectedClass, false);
        multiDragElements.shift();
        dispatchEvent({
          sortable: this.sortable,
          rootEl: this.sortable.el,
          name: 'deselect',
          targetEl: el,
          originalEvent: evt
        });
      }
    },
    _checkKeyDown: function _checkKeyDown(evt) {
      if (evt.key === this.options.multiDragKey) {
        this.multiDragKeyDown = true;
      }
    },
    _checkKeyUp: function _checkKeyUp(evt) {
      if (evt.key === this.options.multiDragKey) {
        this.multiDragKeyDown = false;
      }
    }
  };
  return _extends(MultiDrag, {
    // Static methods & properties
    pluginName: 'multiDrag',
    utils: {
      /**
       * Selects the provided multi-drag item
       * @param  {HTMLElement} el    The element to be selected
       */
      select: function select(el) {
        var sortable = el.parentNode[expando];
        if (!sortable || !sortable.options.multiDrag || ~multiDragElements.indexOf(el)) return;

        if (multiDragSortable && multiDragSortable !== sortable) {
          multiDragSortable.multiDrag._deselectMultiDrag();

          multiDragSortable = sortable;
        }

        toggleClass(el, sortable.options.selectedClass, true);
        multiDragElements.push(el);
      },

      /**
       * Deselects the provided multi-drag item
       * @param  {HTMLElement} el    The element to be deselected
       */
      deselect: function deselect(el) {
        var sortable = el.parentNode[expando],
            index = multiDragElements.indexOf(el);
        if (!sortable || !sortable.options.multiDrag || !~index) return;
        toggleClass(el, sortable.options.selectedClass, false);
        multiDragElements.splice(index, 1);
      }
    },
    eventProperties: function eventProperties() {
      var _this3 = this;

      var oldIndicies = [],
          newIndicies = [];
      multiDragElements.forEach(function (multiDragElement) {
        oldIndicies.push({
          multiDragElement: multiDragElement,
          index: multiDragElement.sortableIndex
        }); // multiDragElements will already be sorted if folding

        var newIndex;

        if (folding && multiDragElement !== dragEl$1) {
          newIndex = -1;
        } else if (folding) {
          newIndex = index(multiDragElement, ':not(.' + _this3.options.selectedClass + ')');
        } else {
          newIndex = index(multiDragElement);
        }

        newIndicies.push({
          multiDragElement: multiDragElement,
          index: newIndex
        });
      });
      return {
        items: _toConsumableArray(multiDragElements),
        clones: [].concat(multiDragClones),
        oldIndicies: oldIndicies,
        newIndicies: newIndicies
      };
    },
    optionListeners: {
      multiDragKey: function multiDragKey(key) {
        key = key.toLowerCase();

        if (key === 'ctrl') {
          key = 'Control';
        } else if (key.length > 1) {
          key = key.charAt(0).toUpperCase() + key.substr(1);
        }

        return key;
      }
    }
  });
}

function insertMultiDragElements(clonesInserted, rootEl) {
  multiDragElements.forEach(function (multiDragElement, i) {
    var target = rootEl.children[multiDragElement.sortableIndex + (clonesInserted ? Number(i) : 0)];

    if (target) {
      rootEl.insertBefore(multiDragElement, target);
    } else {
      rootEl.appendChild(multiDragElement);
    }
  });
}
/**
 * Insert multi-drag clones
 * @param  {[Boolean]} elementsInserted  Whether the multi-drag elements are inserted
 * @param  {HTMLElement} rootEl
 */


function insertMultiDragClones(elementsInserted, rootEl) {
  multiDragClones.forEach(function (clone, i) {
    var target = rootEl.children[clone.sortableIndex + (elementsInserted ? Number(i) : 0)];

    if (target) {
      rootEl.insertBefore(clone, target);
    } else {
      rootEl.appendChild(clone);
    }
  });
}

function removeMultiDragElements() {
  multiDragElements.forEach(function (multiDragElement) {
    if (multiDragElement === dragEl$1) return;
    multiDragElement.parentNode && multiDragElement.parentNode.removeChild(multiDragElement);
  });
}

Sortable.mount(new AutoScrollPlugin());
Sortable.mount(Remove, Revert);

/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Sortable);



/***/ }),

/***/ "./node_modules/tiny-invariant/dist/tiny-invariant.esm.js":
/*!****************************************************************!*\
  !*** ./node_modules/tiny-invariant/dist/tiny-invariant.esm.js ***!
  \****************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (/* binding */ invariant)
/* harmony export */ });
var isProduction = "development" === 'production';
var prefix = 'Invariant failed';
function invariant(condition, message) {
    if (condition) {
        return;
    }
    if (isProduction) {
        throw new Error(prefix);
    }
    var provided = typeof message === 'function' ? message() : message;
    var value = provided ? prefix + ": " + provided : prefix;
    throw new Error(value);
}




/***/ }),

/***/ "./src/blocks/image/placeholder.jpg":
/*!******************************************!*\
  !*** ./src/blocks/image/placeholder.jpg ***!
  \******************************************/
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {

"use strict";
module.exports = __webpack_require__.p + "images/placeholder.da204f5f.jpg";

/***/ }),

/***/ "./src/blocks/post-featured-image/placeholder.jpg":
/*!********************************************************!*\
  !*** ./src/blocks/post-featured-image/placeholder.jpg ***!
  \********************************************************/
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {

"use strict";
module.exports = __webpack_require__.p + "images/placeholder.da204f5f.jpg";

/***/ }),

/***/ "react":
/*!************************!*\
  !*** external "React" ***!
  \************************/
/***/ ((module) => {

"use strict";
module.exports = window["React"];

/***/ }),

/***/ "@wordpress/api-fetch":
/*!**********************************!*\
  !*** external ["wp","apiFetch"] ***!
  \**********************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["apiFetch"];

/***/ }),

/***/ "@wordpress/block-editor":
/*!*************************************!*\
  !*** external ["wp","blockEditor"] ***!
  \*************************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["blockEditor"];

/***/ }),

/***/ "@wordpress/blocks":
/*!********************************!*\
  !*** external ["wp","blocks"] ***!
  \********************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["blocks"];

/***/ }),

/***/ "@wordpress/components":
/*!************************************!*\
  !*** external ["wp","components"] ***!
  \************************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["components"];

/***/ }),

/***/ "@wordpress/compose":
/*!*********************************!*\
  !*** external ["wp","compose"] ***!
  \*********************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["compose"];

/***/ }),

/***/ "@wordpress/core-data":
/*!**********************************!*\
  !*** external ["wp","coreData"] ***!
  \**********************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["coreData"];

/***/ }),

/***/ "@wordpress/data":
/*!******************************!*\
  !*** external ["wp","data"] ***!
  \******************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["data"];

/***/ }),

/***/ "@wordpress/edit-post":
/*!**********************************!*\
  !*** external ["wp","editPost"] ***!
  \**********************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["editPost"];

/***/ }),

/***/ "@wordpress/element":
/*!*********************************!*\
  !*** external ["wp","element"] ***!
  \*********************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["element"];

/***/ }),

/***/ "@wordpress/hooks":
/*!*******************************!*\
  !*** external ["wp","hooks"] ***!
  \*******************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["hooks"];

/***/ }),

/***/ "@wordpress/i18n":
/*!******************************!*\
  !*** external ["wp","i18n"] ***!
  \******************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["i18n"];

/***/ }),

/***/ "@wordpress/plugins":
/*!*********************************!*\
  !*** external ["wp","plugins"] ***!
  \*********************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["plugins"];

/***/ }),

/***/ "@wordpress/primitives":
/*!************************************!*\
  !*** external ["wp","primitives"] ***!
  \************************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["primitives"];

/***/ }),

/***/ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js":
/*!*******************************************************************!*\
  !*** ./node_modules/@babel/runtime/helpers/esm/defineProperty.js ***!
  \*******************************************************************/
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (/* binding */ _defineProperty)
/* harmony export */ });
function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

/***/ }),

/***/ "./node_modules/@babel/runtime/helpers/esm/extends.js":
/*!************************************************************!*\
  !*** ./node_modules/@babel/runtime/helpers/esm/extends.js ***!
  \************************************************************/
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (/* binding */ _extends)
/* harmony export */ });
function _extends() {
  _extends = Object.assign ? Object.assign.bind() : function (target) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i];

      for (var key in source) {
        if (Object.prototype.hasOwnProperty.call(source, key)) {
          target[key] = source[key];
        }
      }
    }

    return target;
  };
  return _extends.apply(this, arguments);
}

/***/ })

/******/ 	});
/************************************************************************/
/******/ 	// The module cache
/******/ 	var __webpack_module_cache__ = {};
/******/ 	
/******/ 	// The require function
/******/ 	function __webpack_require__(moduleId) {
/******/ 		// Check if module is in cache
/******/ 		var cachedModule = __webpack_module_cache__[moduleId];
/******/ 		if (cachedModule !== undefined) {
/******/ 			return cachedModule.exports;
/******/ 		}
/******/ 		// Create a new module (and put it into the cache)
/******/ 		var module = __webpack_module_cache__[moduleId] = {
/******/ 			// no module.id needed
/******/ 			// no module.loaded needed
/******/ 			exports: {}
/******/ 		};
/******/ 	
/******/ 		// Execute the module function
/******/ 		__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/ 	
/******/ 		// Return the exports of the module
/******/ 		return module.exports;
/******/ 	}
/******/ 	
/************************************************************************/
/******/ 	/* webpack/runtime/compat get default export */
/******/ 	(() => {
/******/ 		// getDefaultExport function for compatibility with non-harmony modules
/******/ 		__webpack_require__.n = (module) => {
/******/ 			var getter = module && module.__esModule ?
/******/ 				() => (module['default']) :
/******/ 				() => (module);
/******/ 			__webpack_require__.d(getter, { a: getter });
/******/ 			return getter;
/******/ 		};
/******/ 	})();
/******/ 	
/******/ 	/* webpack/runtime/define property getters */
/******/ 	(() => {
/******/ 		// define getter functions for harmony exports
/******/ 		__webpack_require__.d = (exports, definition) => {
/******/ 			for(var key in definition) {
/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ 				}
/******/ 			}
/******/ 		};
/******/ 	})();
/******/ 	
/******/ 	/* webpack/runtime/global */
/******/ 	(() => {
/******/ 		__webpack_require__.g = (function() {
/******/ 			if (typeof globalThis === 'object') return globalThis;
/******/ 			try {
/******/ 				return this || new Function('return this')();
/******/ 			} catch (e) {
/******/ 				if (typeof window === 'object') return window;
/******/ 			}
/******/ 		})();
/******/ 	})();
/******/ 	
/******/ 	/* webpack/runtime/hasOwnProperty shorthand */
/******/ 	(() => {
/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ 	})();
/******/ 	
/******/ 	/* webpack/runtime/make namespace object */
/******/ 	(() => {
/******/ 		// define __esModule on exports
/******/ 		__webpack_require__.r = (exports) => {
/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ 			}
/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
/******/ 		};
/******/ 	})();
/******/ 	
/******/ 	/* webpack/runtime/publicPath */
/******/ 	(() => {
/******/ 		var scriptUrl;
/******/ 		if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
/******/ 		var document = __webpack_require__.g.document;
/******/ 		if (!scriptUrl && document) {
/******/ 			if (document.currentScript)
/******/ 				scriptUrl = document.currentScript.src
/******/ 			if (!scriptUrl) {
/******/ 				var scripts = document.getElementsByTagName("script");
/******/ 				if(scripts.length) scriptUrl = scripts[scripts.length - 1].src
/******/ 			}
/******/ 		}
/******/ 		// When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration
/******/ 		// or pass an empty string ("") and set the __webpack_public_path__ variable from your code to use your own logic.
/******/ 		if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");
/******/ 		scriptUrl = scriptUrl.replace(/#.*$/, "").replace(/\?.*$/, "").replace(/\/[^\/]+$/, "/");
/******/ 		__webpack_require__.p = scriptUrl;
/******/ 	})();
/******/ 	
/************************************************************************/
var __webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it need to be in strict mode.
(() => {
"use strict";
/*!**********************!*\
  !*** ./src/index.js ***!
  \**********************/
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_compose__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/compose */ "@wordpress/compose");
/* harmony import */ var _wordpress_compose__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_compose__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./store */ "./src/store.js");
/* harmony import */ var _templates__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./templates */ "./src/templates.js");
/* harmony import */ var _sidebars__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./sidebars */ "./src/sidebars.js");
/* harmony import */ var _blocks_post_grid__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./blocks/post-grid */ "./src/blocks/post-grid/index.js");
/* harmony import */ var _blocks_post_grid_filterable__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./blocks/post-grid-filterable */ "./src/blocks/post-grid-filterable/index.js");
/* harmony import */ var _blocks_content_slider__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./blocks/content-slider */ "./src/blocks/content-slider/index.js");
/* harmony import */ var _blocks_content_slider_item__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./blocks/content-slider-item */ "./src/blocks/content-slider-item/index.js");
/* harmony import */ var _blocks_popup__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./blocks/popup */ "./src/blocks/popup/index.js");
/* harmony import */ var _blocks_post_title__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./blocks/post-title */ "./src/blocks/post-title/index.js");
/* harmony import */ var _blocks_post_excerpt__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./blocks/post-excerpt */ "./src/blocks/post-excerpt/index.js");
/* harmony import */ var _blocks_post_featured_image__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./blocks/post-featured-image */ "./src/blocks/post-featured-image/index.js");
/* harmony import */ var _blocks_image__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./blocks/image */ "./src/blocks/image/index.js");
/* harmony import */ var _blocks_post_author__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./blocks/post-author */ "./src/blocks/post-author/index.js");
/* harmony import */ var _blocks_post_author_fields__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./blocks/post-author-fields */ "./src/blocks/post-author-fields/index.js");
/* harmony import */ var _blocks_post_categories__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./blocks/post-categories */ "./src/blocks/post-categories/index.js");
/* harmony import */ var _blocks_post_tags__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./blocks/post-tags */ "./src/blocks/post-tags/index.js");
/* harmony import */ var _blocks_post_taxonomies__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./blocks/post-taxonomies */ "./src/blocks/post-taxonomies/index.js");
/* harmony import */ var _blocks_post_date__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./blocks/post-date */ "./src/blocks/post-date/index.js");
/* harmony import */ var _blocks_post_meta__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./blocks/post-meta */ "./src/blocks/post-meta/index.js");
/* harmony import */ var _blocks_read_more__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./blocks/read-more */ "./src/blocks/read-more/index.js");
/* harmony import */ var _blocks_post_comment_count__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./blocks/post-comment-count */ "./src/blocks/post-comment-count/index.js");
/* harmony import */ var _blocks_menu_wrap__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./blocks/menu-wrap */ "./src/blocks/menu-wrap/index.js");
/* harmony import */ var _blocks_menu_wrap_item__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./blocks/menu-wrap-item */ "./src/blocks/menu-wrap-item/index.js");
/* harmony import */ var _blocks_progress_bar__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ./blocks/progress-bar */ "./src/blocks/progress-bar/index.js");
/* harmony import */ var _blocks_form_wrap__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ./blocks/form-wrap */ "./src/blocks/form-wrap/index.js");
/* harmony import */ var _blocks_form_field_input__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ./blocks/form-field-input */ "./src/blocks/form-field-input/index.js");
/* harmony import */ var _blocks_form_field_submit__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ./blocks/form-field-submit */ "./src/blocks/form-field-submit/index.js");
/* harmony import */ var _blocks_form_field_select__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ./blocks/form-field-select */ "./src/blocks/form-field-select/index.js");
/* harmony import */ var _blocks_form_field_checkbox__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ./blocks/form-field-checkbox */ "./src/blocks/form-field-checkbox/index.js");
/* harmony import */ var _blocks_form_field_radio__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ./blocks/form-field-radio */ "./src/blocks/form-field-radio/index.js");
/* harmony import */ var _blocks_form_field_textarea__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ./blocks/form-field-textarea */ "./src/blocks/form-field-textarea/index.js");
/* harmony import */ var _blocks_form_field_file_multi__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ./blocks/form-field-file-multi */ "./src/blocks/form-field-file-multi/index.js");
/* harmony import */ var _blocks_form_field_file__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! ./blocks/form-field-file */ "./src/blocks/form-field-file/index.js");
/* harmony import */ var _blocks_number_counter__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! ./blocks/number-counter */ "./src/blocks/number-counter/index.js");
/* harmony import */ var _blocks_list__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! ./blocks/list */ "./src/blocks/list/index.js");
/* harmony import */ var _blocks_list_nested__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! ./blocks/list-nested */ "./src/blocks/list-nested/index.js");
/* harmony import */ var _blocks_list_nested_item__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! ./blocks/list-nested-item */ "./src/blocks/list-nested-item/index.js");
/* harmony import */ var _blocks_icon__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! ./blocks/icon */ "./src/blocks/icon/index.js");
/* harmony import */ var _blocks_text__WEBPACK_IMPORTED_MODULE_41__ = __webpack_require__(/*! ./blocks/text */ "./src/blocks/text/index.js");
/* harmony import */ var _blocks_star_rate__WEBPACK_IMPORTED_MODULE_42__ = __webpack_require__(/*! ./blocks/star-rate */ "./src/blocks/star-rate/index.js");
/* harmony import */ var _blocks_breadcrumb__WEBPACK_IMPORTED_MODULE_43__ = __webpack_require__(/*! ./blocks/breadcrumb */ "./src/blocks/breadcrumb/index.js");
/* harmony import */ var _blocks_shortcode__WEBPACK_IMPORTED_MODULE_44__ = __webpack_require__(/*! ./blocks/shortcode */ "./src/blocks/shortcode/index.js");
/* harmony import */ var _blocks_social_share__WEBPACK_IMPORTED_MODULE_45__ = __webpack_require__(/*! ./blocks/social-share */ "./src/blocks/social-share/index.js");
/* harmony import */ var _blocks_terms_list__WEBPACK_IMPORTED_MODULE_46__ = __webpack_require__(/*! ./blocks/terms-list */ "./src/blocks/terms-list/index.js");
/* harmony import */ var _blocks_archive_title__WEBPACK_IMPORTED_MODULE_47__ = __webpack_require__(/*! ./blocks/archive-title */ "./src/blocks/archive-title/index.js");
/* harmony import */ var _blocks_archive_description__WEBPACK_IMPORTED_MODULE_48__ = __webpack_require__(/*! ./blocks/archive-description */ "./src/blocks/archive-description/index.js");
/* harmony import */ var _blocks_layers__WEBPACK_IMPORTED_MODULE_49__ = __webpack_require__(/*! ./blocks/layers */ "./src/blocks/layers/index.js");
/* harmony import */ var _blocks_layer__WEBPACK_IMPORTED_MODULE_50__ = __webpack_require__(/*! ./blocks/layer */ "./src/blocks/layer/index.js");
/* harmony import */ var _blocks_flex_wrap__WEBPACK_IMPORTED_MODULE_51__ = __webpack_require__(/*! ./blocks/flex-wrap */ "./src/blocks/flex-wrap/index.js");
/* harmony import */ var _blocks_flex_wrap_item__WEBPACK_IMPORTED_MODULE_52__ = __webpack_require__(/*! ./blocks/flex-wrap-item */ "./src/blocks/flex-wrap-item/index.js");
/* harmony import */ var _blocks_grid_wrap__WEBPACK_IMPORTED_MODULE_53__ = __webpack_require__(/*! ./blocks/grid-wrap */ "./src/blocks/grid-wrap/index.js");
/* harmony import */ var _blocks_grid_wrap_item__WEBPACK_IMPORTED_MODULE_54__ = __webpack_require__(/*! ./blocks/grid-wrap-item */ "./src/blocks/grid-wrap-item/index.js");
/* harmony import */ var _blocks_image_gallery__WEBPACK_IMPORTED_MODULE_55__ = __webpack_require__(/*! ./blocks/image-gallery */ "./src/blocks/image-gallery/index.js");
/* harmony import */ var _blocks_image_gallery_item__WEBPACK_IMPORTED_MODULE_56__ = __webpack_require__(/*! ./blocks/image-gallery-item */ "./src/blocks/image-gallery-item/index.js");
/* harmony import */ var _blocks_accordion__WEBPACK_IMPORTED_MODULE_57__ = __webpack_require__(/*! ./blocks/accordion */ "./src/blocks/accordion/index.js");
/* harmony import */ var _blocks_accordion_nested__WEBPACK_IMPORTED_MODULE_58__ = __webpack_require__(/*! ./blocks/accordion-nested */ "./src/blocks/accordion-nested/index.js");
/* harmony import */ var _blocks_accordion_nested_item__WEBPACK_IMPORTED_MODULE_59__ = __webpack_require__(/*! ./blocks/accordion-nested-item */ "./src/blocks/accordion-nested-item/index.js");
/* harmony import */ var _blocks_tabs__WEBPACK_IMPORTED_MODULE_60__ = __webpack_require__(/*! ./blocks/tabs */ "./src/blocks/tabs/index.js");
/* harmony import */ var _blocks_tabs_nested__WEBPACK_IMPORTED_MODULE_61__ = __webpack_require__(/*! ./blocks/tabs-nested */ "./src/blocks/tabs-nested/index.js");
/* harmony import */ var _blocks_tabs_nested_item__WEBPACK_IMPORTED_MODULE_62__ = __webpack_require__(/*! ./blocks/tabs-nested-item */ "./src/blocks/tabs-nested-item/index.js");
/* harmony import */ var _blocks_wordpress_org__WEBPACK_IMPORTED_MODULE_63__ = __webpack_require__(/*! ./blocks/wordpress-org */ "./src/blocks/wordpress-org/index.js");



window.PostGridPluginData = {
  freeUrl: "https://wordpress.org/plugins/post-grid/",
  proUrl: "https://pickplugins.com/post-grid/",
  websiteUrl: "https://pickplugins.com/",
  demoUrl: "http://getpostgrid.com/",
  wpReviewUrl: "https://wordpress.org/support/plugin/post-grid/reviews/#new-post",
  reviewUrl: "http://getpostgrid.com/submit-review",
  renewLicense: "https://pickplugins.com/renew-license/?licenseKey=",
  hasSubscribed: false,
  utm: {
    utm_source: "",
    utm_medium: "",
    utm_campaign: "",
    utm_content: "",
    utm_term: "",
    utm_id: ""
  }
};
_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
  path: '/post-grid/v2/get_plugin_data',
  method: 'POST',
  data: {}
}).then(res => {
  //console.log(res);
  window.PostGridPluginData = res;
});
wp.domReady(function () {
  postGridDisabledBlocks.forEach(function (blockName) {
    if (blockName && wp.blocks.getBlockType(blockName) !== undefined) {
      wp.blocks.unregisterBlockType(blockName);
    }
  });
});




















 //import './blocks/view-count'












 //import './blocks/table-of-contents'




 // import './blocks/steps-wrap'
// import './blocks/steps-wrap-item'






 // import './blocks/divider'

















 // import './blocks/woo-product-excerpt'

 // const addBlockEditAttributes = createHigherOrderComponent((BlockEdit) => {
//     return (props) => {
//         const { attributes, setAttributes, clientId } = props;
//         const {
//             blockId,
//         } = attributes;
//         console.log(props);
//         //props.attributes.blockId = 'pg' + clientId.split('-').pop();
//         return <BlockEdit {...props} />;
//     };
// }, 'addBlockEditAttributes');
// addFilter(
//     'editor.BlockEdit',
//     'post-grid/text',
//     addBlockEditAttributes
// );
// addFilter(
//     'editor.BlockEdit',
//     'post-grid/layers',
//     addBlockEditAttributes
// );
})();

/******/ })()
;
//# sourceMappingURL=index.js.map