/******/ (() => { // 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/@splidejs/splide-extension-auto-scroll/dist/js/splide-extension-auto-scroll.esm.js":
/*!*********************************************************************************************************!*\
  !*** ./node_modules/@splidejs/splide-extension-auto-scroll/dist/js/splide-extension-auto-scroll.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 */   AutoScroll: () => (/* binding */ AutoScroll)
/* harmony export */ });
/*!
 * @splidejs/splide-extension-auto-scroll
 * Version  : 0.5.3
 * License  : MIT
 * Copyright: 2022 Naotoshi Fujita
 */
function empty(array) {
  array.length = 0;
}

function slice$1(arrayLike, start, end) {
  return Array.prototype.slice.call(arrayLike, start, end);
}

function apply$1(func) {
  return func.bind.apply(func, [null].concat(slice$1(arguments, 1)));
}

function raf(func) {
  return requestAnimationFrame(func);
}

function typeOf$1(type, subject) {
  return typeof subject === type;
}

var isArray$1 = Array.isArray;
apply$1(typeOf$1, "function");
apply$1(typeOf$1, "string");
apply$1(typeOf$1, "undefined");

function toArray$1(value) {
  return isArray$1(value) ? value : [value];
}

function forEach$1(values, iteratee) {
  toArray$1(values).forEach(iteratee);
}

var ownKeys$1 = Object.keys;

function forOwn$1(object, iteratee, right) {
  if (object) {
    var keys = ownKeys$1(object);
    keys = right ? keys.reverse() : keys;

    for (var i = 0; i < keys.length; i++) {
      var key = keys[i];

      if (key !== "__proto__") {
        if (iteratee(object[key], key) === false) {
          break;
        }
      }
    }
  }

  return object;
}

function assign$1(object) {
  slice$1(arguments, 1).forEach(function (source) {
    forOwn$1(source, function (value, key) {
      object[key] = source[key];
    });
  });
  return object;
}

var min$1 = Math.min;

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: bubbles,
        detail: detail
      });
    } else {
      e = document.createEvent("CustomEvent");
      e.initCustomEvent(type, bubbles, false, detail);
    }

    target.dispatchEvent(e);
    return e;
  }

  function forEachEvent(targets, events, iteratee) {
    forEach$1(targets, function (target) {
      target && forEach$1(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: bind,
    unbind: unbind,
    dispatch: dispatch,
    destroy: destroy
  };
}
var EVENT_MOVE = "move";
var EVENT_MOVED = "moved";
var EVENT_UPDATED = "updated";
var EVENT_DRAG = "drag";
var EVENT_DRAGGED = "dragged";
var EVENT_SCROLL = "scroll";
var EVENT_SCROLLED = "scrolled";
var EVENT_DESTROY = "destroy";

function EventInterface(Splide2) {
  var bus = Splide2 ? Splide2.event.bus : document.createDocumentFragment();
  var binder = EventBinder();

  function on(events, callback) {
    binder.bind(bus, toArray$1(events).join(" "), function (e) {
      callback.apply(callback, isArray$1(e.detail) ? e.detail : []);
    });
  }

  function emit(event) {
    binder.dispatch(bus, event, slice$1(arguments, 1));
  }

  if (Splide2) {
    Splide2.event.on(EVENT_DESTROY, binder.destroy);
  }

  return assign$1(binder, {
    bus: bus,
    on: on,
    off: apply$1(binder.unbind, bus),
    emit: 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$1((now() - startTime) / interval, 1) : 1;
      onUpdate && onUpdate(rate);

      if (rate >= 1) {
        onInterval();
        startTime = now();

        if (limit && ++count >= limit) {
          return pause();
        }
      }

      raf(update);
    }
  }

  function start(resume) {
    !resume && cancel();
    startTime = now() - (resume ? rate * interval : 0);
    paused = false;
    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: start,
    rewind: rewind,
    pause: pause,
    cancel: cancel,
    set: set,
    isPaused: isPaused
  };
}

function Throttle(func, duration) {
  var interval;

  function throttled() {
    if (!interval) {
      interval = RequestInterval(duration || 0, function () {
        func();
        interval = null;
      }, null, 1);
      interval.start();
    }
  }

  return throttled;
}
var CLASS_ACTIVE = "is-active";

var SLIDE = "slide";
var FADE = "fade";

function slice(arrayLike, start, end) {
  return Array.prototype.slice.call(arrayLike, start, end);
}

function apply(func) {
  return func.bind(null, ...slice(arguments, 1));
}

function typeOf(type, subject) {
  return typeof subject === type;
}
function isObject(subject) {
  return !isNull(subject) && typeOf("object", subject);
}
const isArray = Array.isArray;
apply(typeOf, "function");
apply(typeOf, "string");
const isUndefined = apply(typeOf, "undefined");
function isNull(subject) {
  return subject === null;
}

function toArray(value) {
  return isArray(value) ? value : [value];
}

function forEach(values, iteratee) {
  toArray(values).forEach(iteratee);
}

function toggleClass(elm, classes, add) {
  if (elm) {
    forEach(classes, (name) => {
      if (name) {
        elm.classList[add ? "add" : "remove"](name);
      }
    });
  }
}

const ownKeys = Object.keys;

function forOwn(object, iteratee, right) {
  if (object) {
    let keys = ownKeys(object);
    keys = right ? keys.reverse() : keys;
    for (let i = 0; i < keys.length; i++) {
      const key = keys[i];
      if (key !== "__proto__") {
        if (iteratee(object[key], key) === false) {
          break;
        }
      }
    }
  }
  return object;
}

function assign(object) {
  slice(arguments, 1).forEach((source) => {
    forOwn(source, (value, key) => {
      object[key] = source[key];
    });
  });
  return object;
}

function removeAttribute(elms, attrs) {
  forEach(elms, (elm) => {
    forEach(attrs, (attr) => {
      elm && elm.removeAttribute(attr);
    });
  });
}

function setAttribute(elms, attrs, value) {
  if (isObject(attrs)) {
    forOwn(attrs, (value2, name) => {
      setAttribute(elms, name, value2);
    });
  } else {
    forEach(elms, (elm) => {
      isNull(value) || value === "" ? removeAttribute(elm, attrs) : elm.setAttribute(attrs, String(value));
    });
  }
}

const { min, max, floor, ceil, abs } = Math;

function clamp(number, x, y) {
  const minimum = min(x, y);
  const maximum = max(x, y);
  return min(max(minimum, number), maximum);
}

const DEFAULTS = {
  speed: 1,
  autoStart: true,
  pauseOnHover: true,
  pauseOnFocus: true
};

const I18N = {
  startScroll: "Start auto scroll",
  pauseScroll: "Pause auto scroll"
};

function AutoScroll(Splide2, Components2, options) {
  const { on, off, bind, unbind } = EventInterface(Splide2);
  const { translate, getPosition, toIndex, getLimit } = Components2.Move;
  const { setIndex, getIndex } = Components2.Controller;
  const { orient } = Components2.Direction;
  const { toggle } = Components2.Elements;
  const { Live } = Components2;
  const { root } = Splide2;
  const throttledUpdateArrows = Throttle(Components2.Arrows.update, 500);
  let autoScrollOptions = {};
  let interval;
  let stopped;
  let hovered;
  let focused;
  let busy;
  let currPosition;
  function setup() {
    const { autoScroll } = options;
    autoScrollOptions = assign({}, DEFAULTS, isObject(autoScroll) ? autoScroll : {});
  }
  function mount() {
    if (!Splide2.is(FADE)) {
      if (!interval && options.autoScroll !== false) {
        interval = RequestInterval(0, move);
        listen();
        autoStart();
      }
    }
  }
  function destroy() {
    if (interval) {
      interval.cancel();
      interval = null;
      currPosition = void 0;
      off([EVENT_MOVE, EVENT_DRAG, EVENT_SCROLL, EVENT_MOVED, EVENT_SCROLLED]);
      unbind(root, "mouseenter mouseleave focusin focusout");
      unbind(toggle, "click");
    }
  }
  function listen() {
    if (autoScrollOptions.pauseOnHover) {
      bind(root, "mouseenter mouseleave", (e) => {
        hovered = e.type === "mouseenter";
        autoToggle();
      });
    }
    if (autoScrollOptions.pauseOnFocus) {
      bind(root, "focusin focusout", (e) => {
        focused = e.type === "focusin";
        autoToggle();
      });
    }
    if (autoScrollOptions.useToggleButton) {
      bind(toggle, "click", () => {
        stopped ? play() : pause();
      });
    }
    on(EVENT_UPDATED, update);
    on([EVENT_MOVE, EVENT_DRAG, EVENT_SCROLL], () => {
      busy = true;
      pause(false);
    });
    on([EVENT_MOVED, EVENT_DRAGGED, EVENT_SCROLLED], () => {
      busy = false;
      autoToggle();
    });
  }
  function update() {
    const { autoScroll } = options;
    if (autoScroll !== false) {
      autoScrollOptions = assign({}, autoScrollOptions, isObject(autoScroll) ? autoScroll : {});
      mount();
    } else {
      destroy();
    }
    if (interval && !isUndefined(currPosition)) {
      translate(currPosition);
    }
  }
  function autoStart() {
    if (autoScrollOptions.autoStart) {
      if (document.readyState === "complete") {
        play();
      } else {
        bind(window, "load", play);
      }
    }
  }
  function play() {
    if (isPaused()) {
      interval.start(true);
      Live.disable(true);
      focused = hovered = stopped = false;
      updateButton();
    }
  }
  function pause(stop = true) {
    if (!stopped) {
      stopped = stop;
      updateButton();
      if (!isPaused()) {
        interval.pause();
        Live.disable(false);
      }
    }
  }
  function autoToggle() {
    if (!stopped) {
      hovered || focused || busy ? pause(false) : play();
    }
  }
  function move() {
    const position = getPosition();
    const destination = computeDestination(position);
    if (position !== destination) {
      translate(destination);
      updateIndex(currPosition = getPosition());
    } else {
      pause(false);
      if (autoScrollOptions.rewind) {
        Splide2.go(autoScrollOptions.speed > 0 ? 0 : Components2.Controller.getEnd());
      }
    }
    throttledUpdateArrows();
  }
  function computeDestination(position) {
    const speed = autoScrollOptions.speed || 1;
    position += orient(speed);
    if (Splide2.is(SLIDE)) {
      position = clamp(position, getLimit(false), getLimit(true));
    }
    return position;
  }
  function updateIndex(position) {
    const { length } = Splide2;
    const index = (toIndex(position) + length) % length;
    if (index !== getIndex()) {
      setIndex(index);
      Components2.Slides.update();
      Components2.Pagination.update();
      options.lazyLoad === "nearby" && Components2.LazyLoad.check();
    }
  }
  function updateButton() {
    if (toggle) {
      const key = stopped ? "startScroll" : "pauseScroll";
      toggleClass(toggle, CLASS_ACTIVE, !stopped);
      setAttribute(toggle, "aria-label", options.i18n[key] || I18N[key]);
    }
  }
  function isPaused() {
    return !interval || interval.isPaused();
  }
  return {
    setup,
    mount,
    destroy,
    play,
    pause,
    isPaused
  };
}




/***/ }),

/***/ "./node_modules/@splidejs/splide-extension-grid/dist/js/splide-extension-grid.esm.js":
/*!*******************************************************************************************!*\
  !*** ./node_modules/@splidejs/splide-extension-grid/dist/js/splide-extension-grid.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 */   Grid: () => (/* binding */ Grid)
/* harmony export */ });
/*!
 * @splidejs/splide-extension-grid
 * Version  : 0.4.1
 * License  : MIT
 * Copyright: 2022 Naotoshi Fujita
 */
function empty$1(array) {
  array.length = 0;
}

function slice$1(arrayLike, start, end) {
  return Array.prototype.slice.call(arrayLike, start, end);
}

function apply$1(func) {
  return func.bind.apply(func, [null].concat(slice$1(arguments, 1)));
}

function typeOf$1(type, subject) {
  return typeof subject === type;
}

var isArray$1 = Array.isArray;
apply$1(typeOf$1, "function");
apply$1(typeOf$1, "string");
apply$1(typeOf$1, "undefined");

function toArray$1(value) {
  return isArray$1(value) ? value : [value];
}

function forEach$1(values, iteratee) {
  toArray$1(values).forEach(iteratee);
}

var ownKeys$1 = Object.keys;

function forOwn$1(object, iteratee, right) {
  if (object) {
    var keys = ownKeys$1(object);
    keys = right ? keys.reverse() : keys;

    for (var i = 0; i < keys.length; i++) {
      var key = keys[i];

      if (key !== "__proto__") {
        if (iteratee(object[key], key) === false) {
          break;
        }
      }
    }
  }

  return object;
}

function assign$1(object) {
  slice$1(arguments, 1).forEach(function (source) {
    forOwn$1(source, function (value, key) {
      object[key] = source[key];
    });
  });
  return object;
}

var PROJECT_CODE$1 = "splide";

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: bubbles,
        detail: detail
      });
    } else {
      e = document.createEvent("CustomEvent");
      e.initCustomEvent(type, bubbles, false, detail);
    }

    target.dispatchEvent(e);
    return e;
  }

  function forEachEvent(targets, events, iteratee) {
    forEach$1(targets, function (target) {
      target && forEach$1(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$1(listeners);
  }

  return {
    bind: bind,
    unbind: unbind,
    dispatch: dispatch,
    destroy: destroy
  };
}
var EVENT_VISIBLE = "visible";
var EVENT_HIDDEN = "hidden";
var EVENT_REFRESH = "refresh";
var EVENT_UPDATED = "updated";
var EVENT_DESTROY = "destroy";

function EventInterface(Splide2) {
  var bus = Splide2 ? Splide2.event.bus : document.createDocumentFragment();
  var binder = EventBinder();

  function on(events, callback) {
    binder.bind(bus, toArray$1(events).join(" "), function (e) {
      callback.apply(callback, isArray$1(e.detail) ? e.detail : []);
    });
  }

  function emit(event) {
    binder.dispatch(bus, event, slice$1(arguments, 1));
  }

  if (Splide2) {
    Splide2.event.on(EVENT_DESTROY, binder.destroy);
  }

  return assign$1(binder, {
    bus: bus,
    on: on,
    off: apply$1(binder.unbind, bus),
    emit: emit
  });
}
var CLASS_ROOT = PROJECT_CODE$1;
var CLASS_SLIDE = PROJECT_CODE$1 + "__slide";
var CLASS_CONTAINER = CLASS_SLIDE + "__container";

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(null, ...slice(arguments, 1));
}

function typeOf(type, subject) {
  return typeof subject === type;
}
function isObject(subject) {
  return !isNull(subject) && typeOf("object", subject);
}
const isArray = Array.isArray;
apply(typeOf, "function");
const isString = apply(typeOf, "string");
const isUndefined = apply(typeOf, "undefined");
function isNull(subject) {
  return subject === null;
}
function isHTMLElement(subject) {
  return subject instanceof HTMLElement;
}

function toArray(value) {
  return isArray(value) ? value : [value];
}

function forEach(values, iteratee) {
  toArray(values).forEach(iteratee);
}

function push(array, items) {
  array.push(...toArray(items));
  return array;
}

function toggleClass(elm, classes, add) {
  if (elm) {
    forEach(classes, (name) => {
      if (name) {
        elm.classList[add ? "add" : "remove"](name);
      }
    });
  }
}

function addClass(elm, classes) {
  toggleClass(elm, isString(classes) ? classes.split(" ") : classes, true);
}

function append(parent, children) {
  forEach(children, parent.appendChild.bind(parent));
}

function matches(elm, selector) {
  return isHTMLElement(elm) && (elm["msMatchesSelector"] || elm.matches).call(elm, selector);
}

function children(parent, selector) {
  const children2 = parent ? slice(parent.children) : [];
  return selector ? children2.filter((child) => matches(child, selector)) : children2;
}

function child(parent, selector) {
  return selector ? children(parent, selector)[0] : parent.firstElementChild;
}

const ownKeys = Object.keys;

function forOwn(object, iteratee, right) {
  if (object) {
    let keys = ownKeys(object);
    keys = right ? keys.reverse() : keys;
    for (let i = 0; i < keys.length; i++) {
      const key = keys[i];
      if (key !== "__proto__") {
        if (iteratee(object[key], key) === false) {
          break;
        }
      }
    }
  }
  return object;
}

function assign(object) {
  slice(arguments, 1).forEach((source) => {
    forOwn(source, (value, key) => {
      object[key] = source[key];
    });
  });
  return object;
}

function omit(object, keys) {
  toArray(keys || ownKeys(object)).forEach((key) => {
    delete object[key];
  });
}

function removeAttribute(elms, attrs) {
  forEach(elms, (elm) => {
    forEach(attrs, (attr) => {
      elm && elm.removeAttribute(attr);
    });
  });
}

function setAttribute(elms, attrs, value) {
  if (isObject(attrs)) {
    forOwn(attrs, (value2, name) => {
      setAttribute(elms, name, value2);
    });
  } else {
    forEach(elms, (elm) => {
      isNull(value) || value === "" ? removeAttribute(elm, attrs) : elm.setAttribute(attrs, String(value));
    });
  }
}

function create(tag, attrs, parent) {
  const 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 hasClass(elm, className) {
  return elm && elm.classList.contains(className);
}

function remove(nodes) {
  forEach(nodes, (node) => {
    if (node && node.parentNode) {
      node.parentNode.removeChild(node);
    }
  });
}

function queryAll(parent, selector) {
  return selector ? slice(parent.querySelectorAll(selector)) : [];
}

function removeClass(elm, classes) {
  toggleClass(elm, classes, false);
}

function unit(value) {
  return isString(value) ? value : value ? `${value}px` : "";
}

const PROJECT_CODE = "splide";

function assert(condition, message) {
  if (!condition) {
    throw new Error(`[${PROJECT_CODE}] ${message || ""}`);
  }
}

const { min, max, floor, ceil, abs } = Math;

function pad(number) {
  return number < 10 ? `0${number}` : `${number}`;
}

const CLASS_SLIDE_ROW = `${CLASS_SLIDE}__row`;
const CLASS_SLIDE_COL = `${CLASS_SLIDE}--col`;

const DEFAULTS = {
  rows: 1,
  cols: 1,
  dimensions: [],
  gap: {}
};

function Dimension(options) {
  function normalize() {
    const { rows, cols, dimensions } = options;
    return isArray(dimensions) && dimensions.length ? dimensions : [[rows, cols]];
  }
  function get(index) {
    const dimensions = normalize();
    return dimensions[min(index, dimensions.length - 1)];
  }
  function getAt(index) {
    const dimensions = normalize();
    let rows, cols, aggregator = 0;
    for (let i = 0; i < dimensions.length; i++) {
      const dimension = dimensions[i];
      rows = dimension[0] || 1;
      cols = dimension[1] || 1;
      aggregator += rows * cols;
      if (index < aggregator) {
        break;
      }
    }
    assert(rows && cols, "Invalid dimension");
    return [rows, cols];
  }
  return {
    get,
    getAt
  };
}

function Layout(Splide2, gridOptions, Dimension) {
  const { on, destroy: destroyEvent } = EventInterface(Splide2);
  const { Components, options } = Splide2;
  const { resolve } = Components.Direction;
  const { forEach } = Components.Slides;
  function mount() {
    layout();
    if (options.slideFocus) {
      on(EVENT_VISIBLE, onVisible);
      on(EVENT_HIDDEN, onHidden);
    }
  }
  function destroy() {
    forEach((Slide) => {
      const { slide } = Slide;
      toggleTabIndex(slide, false);
      getRowsIn(slide).forEach((cell) => {
        removeAttribute(cell, "style");
      });
      getColsIn(slide).forEach((colSlide) => {
        cover(colSlide, true);
        removeAttribute(colSlide, "style");
      });
    });
    destroyEvent();
  }
  function layout() {
    forEach((Slide) => {
      const { slide } = Slide;
      const [rows, cols] = Dimension.get(Slide.isClone ? Slide.slideIndex : Slide.index);
      layoutRow(rows, slide);
      layoutCol(cols, slide);
      getColsIn(Slide.slide).forEach((colSlide, index) => {
        colSlide.id = `${Slide.slide.id}-col${pad(index + 1)}`;
        if (Splide2.options.cover) {
          cover(colSlide);
        }
      });
    });
  }
  function layoutRow(rows, slide) {
    const { row: rowGap } = gridOptions.gap;
    const height = `calc(${100 / rows}%${rowGap ? ` - ${unit(rowGap)} * ${(rows - 1) / rows}` : ""})`;
    getRowsIn(slide).forEach((rowElm, index, rowElms) => {
      style(rowElm, "height", height);
      style(rowElm, "display", "flex");
      style(rowElm, "margin", `0 0 ${unit(rowGap)} 0`);
      style(rowElm, "padding", 0);
      if (index === rowElms.length - 1) {
        style(rowElm, "marginBottom", 0);
      }
    });
  }
  function layoutCol(cols, slide) {
    const { col: colGap } = gridOptions.gap;
    const width = `calc(${100 / cols}%${colGap ? ` - ${unit(colGap)} * ${(cols - 1) / cols}` : ""})`;
    getColsIn(slide).forEach((colElm, index, colElms) => {
      style(colElm, "width", width);
      if (index !== colElms.length - 1) {
        style(colElm, resolve("marginRight"), unit(colGap));
      }
    });
  }
  function cover(colSlide, uncover) {
    const container = child(colSlide, `.${CLASS_CONTAINER}`);
    const img = child(container || colSlide, "img");
    if (img && img.src) {
      style(container || colSlide, "background", uncover ? "" : `center/cover no-repeat url("${img.src}")`);
      style(img, "display", uncover ? "" : "none");
    }
  }
  function getRowsIn(slide) {
    return queryAll(slide, `.${CLASS_SLIDE_ROW}`);
  }
  function getColsIn(slide) {
    return queryAll(slide, `.${CLASS_SLIDE_COL}`);
  }
  function toggleTabIndex(slide, add) {
    getColsIn(slide).forEach((colSlide) => {
      setAttribute(colSlide, "tabindex", add ? 0 : null);
    });
  }
  function onVisible(Slide) {
    toggleTabIndex(Slide.slide, true);
  }
  function onHidden(Slide) {
    toggleTabIndex(Slide.slide, false);
  }
  return {
    mount,
    destroy
  };
}

function Grid(Splide2, Components2, options) {
  const { on, off } = EventInterface(Splide2);
  const { Elements } = Components2;
  const gridOptions = {};
  const Dimension$1 = Dimension(gridOptions);
  const Layout$1 = Layout(Splide2, gridOptions, Dimension$1);
  const modifier = `${CLASS_ROOT}--grid`;
  const originalSlides = [];
  function mount() {
    init();
    on(EVENT_UPDATED, init);
  }
  function init() {
    omit(gridOptions);
    assign(gridOptions, DEFAULTS, options.grid || {});
    if (shouldBuild()) {
      destroy();
      push(originalSlides, Elements.slides);
      addClass(Splide2.root, modifier);
      append(Elements.list, build());
      off(EVENT_REFRESH);
      on(EVENT_REFRESH, layout);
      refresh();
    } else if (isActive()) {
      destroy();
      refresh();
    }
  }
  function destroy() {
    if (isActive()) {
      const { slides } = Elements;
      Layout$1.destroy();
      originalSlides.forEach((slide) => {
        removeClass(slide, CLASS_SLIDE_COL);
        append(Elements.list, slide);
      });
      remove(slides);
      removeClass(Splide2.root, modifier);
      empty(slides);
      push(slides, originalSlides);
      empty(originalSlides);
      off(EVENT_REFRESH);
    }
  }
  function refresh() {
    Splide2.refresh();
  }
  function layout() {
    if (isActive()) {
      Layout$1.mount();
    }
  }
  function build() {
    const outerSlides = [];
    let row = 0, col = 0;
    let outerSlide, rowSlide;
    originalSlides.forEach((slide, index) => {
      const [rows, cols] = Dimension$1.getAt(index);
      if (!col) {
        if (!row) {
          outerSlide = create(slide.tagName, CLASS_SLIDE);
          outerSlides.push(outerSlide);
        }
        rowSlide = buildRow(rows, slide, outerSlide);
      }
      buildCol(cols, slide, rowSlide);
      if (++col >= cols) {
        col = 0;
        row = ++row >= rows ? 0 : row;
      }
    });
    return outerSlides;
  }
  function buildRow(rows, slide, outerSlide) {
    const tag = slide.tagName.toLowerCase() === "li" ? "ul" : "div";
    return create(tag, CLASS_SLIDE_ROW, outerSlide);
  }
  function buildCol(cols, slide, rowSlide) {
    addClass(slide, CLASS_SLIDE_COL);
    append(rowSlide, slide);
    return slide;
  }
  function shouldBuild() {
    if (options.grid) {
      const { rows, cols, dimensions } = gridOptions;
      return rows > 1 || cols > 1 || isArray(dimensions) && dimensions.length > 0;
    }
    return false;
  }
  function isActive() {
    return hasClass(Splide2.root, modifier);
  }
  return {
    mount,
    destroy
  };
}




/***/ }),

/***/ "./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
 * @param {import('react').ForwardedRef<HTMLElement>} ref   The forwarded ref to the SVG element.
 *
 * @return {JSX.Element}  Icon component
 */
function Icon({
  icon,
  size = 24,
  ...props
}, ref) {
  return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.cloneElement)(icon, {
    width: size,
    height: size,
    ...props,
    ref
  });
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ((0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(Icon));
//# sourceMappingURL=index.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/add-card.js":
/*!************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/add-card.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 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__);
/* 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 addCard = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M18.5 5.5V8H20V5.5h2.5V4H20V1.5h-1.5V4H16v1.5h2.5zM12 4H6a2 2 0 00-2 2v12a2 2 0 002 2h12a2 2 0 002-2v-6h-1.5v6a.5.5 0 01-.5.5H6a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5h6V4z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (addCard);
//# sourceMappingURL=add-card.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 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__);
/* 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,react__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,react__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/brush.js":
/*!*********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/brush.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 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__);
/* 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 brush = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M4 20h8v-1.5H4V20zM18.9 3.5c-.6-.6-1.5-.6-2.1 0l-7.2 7.2c-.4-.1-.7 0-1.1.1-.5.2-1.5.7-1.9 2.2-.4 1.7-.8 2.2-1.1 2.7-.1.1-.2.3-.3.4l-.6 1.1H6c2 0 3.4-.4 4.7-1.4.8-.6 1.2-1.4 1.3-2.3 0-.3 0-.5-.1-.7L19 5.7c.5-.6.5-1.6-.1-2.2zM9.7 14.7c-.7.5-1.5.8-2.4 1 .2-.5.5-1.2.8-2.3.2-.6.4-1 .8-1.1.5-.1 1 .1 1.3.3.2.2.3.5.2.8 0 .3-.1.9-.7 1.3z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (brush);
//# sourceMappingURL=brush.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/calendar.js":
/*!************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/calendar.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 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__);
/* 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 calendar = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm.5 16c0 .3-.2.5-.5.5H5c-.3 0-.5-.2-.5-.5V7h15v12zM9 10H7v2h2v-2zm0 4H7v2h2v-2zm4-4h-2v2h2v-2zm4 0h-2v2h2v-2zm-4 4h-2v2h2v-2zm4 0h-2v2h2v-2z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (calendar);
//# sourceMappingURL=calendar.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/category.js":
/*!************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/category.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 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__);
/* 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 category = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M6 5.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5H6a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5zM4 6a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2H6a2 2 0 01-2-2V6zm11-.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5zM13 6a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2h-3a2 2 0 01-2-2V6zm5 8.5h-3a.5.5 0 00-.5.5v3a.5.5 0 00.5.5h3a.5.5 0 00.5-.5v-3a.5.5 0 00-.5-.5zM15 13a2 2 0 00-2 2v3a2 2 0 002 2h3a2 2 0 002-2v-3a2 2 0 00-2-2h-3zm-9 1.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5H6a.5.5 0 01-.5-.5v-3a.5.5 0 01.5-.5zM4 15a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2H6a2 2 0 01-2-2v-3z",
  fillRule: "evenodd",
  clipRule: "evenodd"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (category);
//# sourceMappingURL=category.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/check.js":
/*!*********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/check.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 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__);
/* 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 check = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (check);
//# sourceMappingURL=check.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 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__);
/* 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,react__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,react__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 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__);
/* 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,react__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,react__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-small.js":
/*!***************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/close-small.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 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__);
/* 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 closeSmall = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M12 13.06l3.712 3.713 1.061-1.06L13.061 12l3.712-3.712-1.06-1.06L12 10.938 8.288 7.227l-1.061 1.06L10.939 12l-3.712 3.712 1.06 1.061L12 13.061z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (closeSmall);
//# sourceMappingURL=close-small.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 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__);
/* 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,react__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,react__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/cog.js":
/*!*******************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/cog.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 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__);
/* 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 cog = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  fillRule: "evenodd",
  d: "M10.289 4.836A1 1 0 0111.275 4h1.306a1 1 0 01.987.836l.244 1.466c.787.26 1.503.679 2.108 1.218l1.393-.522a1 1 0 011.216.437l.653 1.13a1 1 0 01-.23 1.273l-1.148.944a6.025 6.025 0 010 2.435l1.149.946a1 1 0 01.23 1.272l-.653 1.13a1 1 0 01-1.216.437l-1.394-.522c-.605.54-1.32.958-2.108 1.218l-.244 1.466a1 1 0 01-.987.836h-1.306a1 1 0 01-.986-.836l-.244-1.466a5.995 5.995 0 01-2.108-1.218l-1.394.522a1 1 0 01-1.217-.436l-.653-1.131a1 1 0 01.23-1.272l1.149-.946a6.026 6.026 0 010-2.435l-1.148-.944a1 1 0 01-.23-1.272l.653-1.131a1 1 0 011.217-.437l1.393.522a5.994 5.994 0 012.108-1.218l.244-1.466zM14.929 12a3 3 0 11-6 0 3 3 0 016 0z",
  clipRule: "evenodd"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (cog);
//# sourceMappingURL=cog.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/columns.js":
/*!***********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/columns.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 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__);
/* 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 columns = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  fillRule: "evenodd",
  clipRule: "evenodd",
  d: "M15 7.5h-5v10h5v-10Zm1.5 0v10H19a.5.5 0 0 0 .5-.5V8a.5.5 0 0 0-.5-.5h-2.5ZM6 7.5h2.5v10H6a.5.5 0 0 1-.5-.5V8a.5.5 0 0 1 .5-.5ZM6 6h13a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2Z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (columns);
//# sourceMappingURL=columns.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/copy-small.js":
/*!**************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/copy-small.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 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__);
/* 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 copySmall = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  fillRule: "evenodd",
  clipRule: "evenodd",
  d: "M5.625 5.5h9.75c.069 0 .125.056.125.125v9.75a.125.125 0 0 1-.125.125h-9.75a.125.125 0 0 1-.125-.125v-9.75c0-.069.056-.125.125-.125ZM4 5.625C4 4.728 4.728 4 5.625 4h9.75C16.273 4 17 4.728 17 5.625v9.75c0 .898-.727 1.625-1.625 1.625h-9.75A1.625 1.625 0 0 1 4 15.375v-9.75Zm14.5 11.656v-9H20v9C20 18.8 18.77 20 17.251 20H6.25v-1.5h11.001c.69 0 1.249-.528 1.249-1.219Z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (copySmall);
//# sourceMappingURL=copy-small.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/copy.js":
/*!********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/copy.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 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__);
/* 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 copy = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  fillRule: "evenodd",
  clipRule: "evenodd",
  d: "M5 4.5h11a.5.5 0 0 1 .5.5v11a.5.5 0 0 1-.5.5H5a.5.5 0 0 1-.5-.5V5a.5.5 0 0 1 .5-.5ZM3 5a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5Zm17 3v10.75c0 .69-.56 1.25-1.25 1.25H6v1.5h12.75a2.75 2.75 0 0 0 2.75-2.75V8H20Z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (copy);
//# sourceMappingURL=copy.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/format-capitalize.js":
/*!*********************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/format-capitalize.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 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__);
/* 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 formatCapitalize = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M7.1 6.8L3.1 18h1.6l1.1-3h4.3l1.1 3h1.6l-4-11.2H7.1zm-.8 6.8L8 8.9l1.7 4.7H6.3zm14.5-1.5c-.3-.6-.7-1.1-1.2-1.5-.6-.4-1.2-.6-1.9-.6-.5 0-.9.1-1.4.3-.4.2-.8.5-1.1.8V6h-1.4v12h1.3l.2-1c.2.4.6.6 1 .8.4.2.9.3 1.4.3.7 0 1.2-.2 1.8-.5.5-.4 1-.9 1.3-1.5.3-.6.5-1.3.5-2.1-.1-.6-.2-1.3-.5-1.9zm-1.7 4c-.4.5-.9.8-1.6.8s-1.2-.2-1.7-.7c-.4-.5-.7-1.2-.7-2.1 0-.9.2-1.6.7-2.1.4-.5 1-.7 1.7-.7s1.2.3 1.6.8c.4.5.6 1.2.6 2 .1.8-.2 1.4-.6 2z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (formatCapitalize);
//# sourceMappingURL=format-capitalize.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/format-lowercase.js":
/*!********************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/format-lowercase.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 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__);
/* 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 formatLowercase = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M11 16.8c-.1-.1-.2-.3-.3-.5v-2.6c0-.9-.1-1.7-.3-2.2-.2-.5-.5-.9-.9-1.2-.4-.2-.9-.3-1.6-.3-.5 0-1 .1-1.5.2s-.9.3-1.2.6l.2 1.2c.4-.3.7-.4 1.1-.5.3-.1.7-.2 1-.2.6 0 1 .1 1.3.4.3.2.4.7.4 1.4-1.2 0-2.3.2-3.3.7s-1.4 1.1-1.4 2.1c0 .7.2 1.2.7 1.6.4.4 1 .6 1.8.6.9 0 1.7-.4 2.4-1.2.1.3.2.5.4.7.1.2.3.3.6.4.3.1.6.1 1.1.1h.1l.2-1.2h-.1c-.4.1-.6 0-.7-.1zM9.2 16c-.2.3-.5.6-.9.8-.3.1-.7.2-1.1.2-.4 0-.7-.1-.9-.3-.2-.2-.3-.5-.3-.9 0-.6.2-1 .7-1.3.5-.3 1.3-.4 2.5-.5v2zm10.6-3.9c-.3-.6-.7-1.1-1.2-1.5-.6-.4-1.2-.6-1.9-.6-.5 0-.9.1-1.4.3-.4.2-.8.5-1.1.8V6h-1.4v12h1.3l.2-1c.2.4.6.6 1 .8.4.2.9.3 1.4.3.7 0 1.2-.2 1.8-.5.5-.4 1-.9 1.3-1.5.3-.6.5-1.3.5-2.1-.1-.6-.2-1.3-.5-1.9zm-1.7 4c-.4.5-.9.8-1.6.8s-1.2-.2-1.7-.7c-.4-.5-.7-1.2-.7-2.1 0-.9.2-1.6.7-2.1.4-.5 1-.7 1.7-.7s1.2.3 1.6.8c.4.5.6 1.2.6 2s-.2 1.4-.6 2z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (formatLowercase);
//# sourceMappingURL=format-lowercase.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/format-uppercase.js":
/*!********************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/format-uppercase.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 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__);
/* 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 formatUppercase = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M6.1 6.8L2.1 18h1.6l1.1-3h4.3l1.1 3h1.6l-4-11.2H6.1zm-.8 6.8L7 8.9l1.7 4.7H5.3zm15.1-.7c-.4-.5-.9-.8-1.6-1 .4-.2.7-.5.8-.9.2-.4.3-.9.3-1.4 0-.9-.3-1.6-.8-2-.6-.5-1.3-.7-2.4-.7h-3.5V18h4.2c1.1 0 2-.3 2.6-.8.6-.6 1-1.4 1-2.4-.1-.8-.3-1.4-.6-1.9zm-5.7-4.7h1.8c.6 0 1.1.1 1.4.4.3.2.5.7.5 1.3 0 .6-.2 1.1-.5 1.3-.3.2-.8.4-1.4.4h-1.8V8.2zm4 8c-.4.3-.9.5-1.5.5h-2.6v-3.8h2.6c1.4 0 2 .6 2 1.9.1.6-.1 1-.5 1.4z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (formatUppercase);
//# sourceMappingURL=format-uppercase.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/help.js":
/*!********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/help.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 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__);
/* 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 help = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M12 4.75a7.25 7.25 0 100 14.5 7.25 7.25 0 000-14.5zM3.25 12a8.75 8.75 0 1117.5 0 8.75 8.75 0 01-17.5 0zM12 8.75a1.5 1.5 0 01.167 2.99c-.465.052-.917.44-.917 1.01V14h1.5v-.845A3 3 0 109 10.25h1.5a1.5 1.5 0 011.5-1.5zM11.25 15v1.5h1.5V15h-1.5z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (help);
//# sourceMappingURL=help.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 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__);
/* 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,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M10 17.389H8.444A5.194 5.194 0 1 1 8.444 7H10v1.5H8.444a3.694 3.694 0 0 0 0 7.389H10v1.5ZM14 7h1.556a5.194 5.194 0 0 1 0 10.39H14v-1.5h1.556a3.694 3.694 0 0 0 0-7.39H14V7Zm-4.5 6h5v-1.5h-5V13Z"
}));
/* 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 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__);
/* 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,react__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,react__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/page.js":
/*!********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/page.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 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__);
/* 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 page = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M15.5 7.5h-7V9h7V7.5Zm-7 3.5h7v1.5h-7V11Zm7 3.5h-7V16h7v-1.5Z"
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M17 4H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2ZM7 5.5h10a.5.5 0 0 1 .5.5v12a.5.5 0 0 1-.5.5H7a.5.5 0 0 1-.5-.5V6a.5.5 0 0 1 .5-.5Z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (page);
//# sourceMappingURL=page.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/pages.js":
/*!*********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/pages.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 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__);
/* 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 pages = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M14.5 5.5h-7V7h7V5.5ZM7.5 9h7v1.5h-7V9Zm7 3.5h-7V14h7v-1.5Z"
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M16 2H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2ZM6 3.5h10a.5.5 0 0 1 .5.5v12a.5.5 0 0 1-.5.5H6a.5.5 0 0 1-.5-.5V4a.5.5 0 0 1 .5-.5Z"
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M20 8v11c0 .69-.31 1-.999 1H6v1.5h13.001c1.52 0 2.499-.982 2.499-2.5V8H20Z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (pages);
//# sourceMappingURL=pages.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 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__);
/* 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,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "m19 7-3-3-8.5 8.5-1 4 4-1L19 7Zm-7 11.5H5V20h7v-1.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 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__);
/* 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,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M11 12.5V17.5H12.5V12.5H17.5V11H12.5V6H11V11H6V12.5H11Z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (plus);
//# sourceMappingURL=plus.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/post-comments.js":
/*!*****************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/post-comments.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 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__);
/* 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 postComments = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M14 10.1V4c0-.6-.4-1-1-1H5c-.6 0-1 .4-1 1v8.3c0 .3.2.7.6.8.1.1.2.1.3.1.2 0 .5-.1.6-.3l1.8-1.8H13c.6 0 1-.4 1-1zm-1.5-.5H6.7l-1.2 1.2V4.5h7v5.1zM19 12h-8c-.6 0-1 .4-1 1v6.1c0 .6.4 1 1 1h5.7l1.8 1.8c.1.2.4.3.6.3.1 0 .2 0 .3-.1.4-.1.6-.5.6-.8V13c0-.6-.4-1-1-1zm-.5 7.8l-1.2-1.2h-5.8v-5.1h7v6.3z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (postComments);
//# sourceMappingURL=post-comments.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 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__);
/* 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,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "m19 7.5h-7.628c-.3089-.87389-1.1423-1.5-2.122-1.5-.97966 0-1.81309.62611-2.12197 1.5h-2.12803v1.5h2.12803c.30888.87389 1.14231 1.5 2.12197 1.5.9797 0 1.8131-.62611 2.122-1.5h7.628z"
}), (0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "m19 15h-2.128c-.3089-.8739-1.1423-1.5-2.122-1.5s-1.8131.6261-2.122 1.5h-7.628v1.5h7.628c.3089.8739 1.1423 1.5 2.122 1.5s1.8131-.6261 2.122-1.5h2.128z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (settings);
//# sourceMappingURL=settings.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/star-empty.js":
/*!**************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/star-empty.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 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__);
/* 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 starEmpty = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  fillRule: "evenodd",
  d: "M9.706 8.646a.25.25 0 01-.188.137l-4.626.672a.25.25 0 00-.139.427l3.348 3.262a.25.25 0 01.072.222l-.79 4.607a.25.25 0 00.362.264l4.138-2.176a.25.25 0 01.233 0l4.137 2.175a.25.25 0 00.363-.263l-.79-4.607a.25.25 0 01.072-.222l3.347-3.262a.25.25 0 00-.139-.427l-4.626-.672a.25.25 0 01-.188-.137l-2.069-4.192a.25.25 0 00-.448 0L9.706 8.646zM12 7.39l-.948 1.921a1.75 1.75 0 01-1.317.957l-2.12.308 1.534 1.495c.412.402.6.982.503 1.55l-.362 2.11 1.896-.997a1.75 1.75 0 011.629 0l1.895.997-.362-2.11a1.75 1.75 0 01.504-1.55l1.533-1.495-2.12-.308a1.75 1.75 0 01-1.317-.957L12 7.39z",
  clipRule: "evenodd"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (starEmpty);
//# sourceMappingURL=star-empty.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/star-filled.js":
/*!***************************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/star-filled.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 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__);
/* 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 starFilled = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  d: "M11.776 4.454a.25.25 0 01.448 0l2.069 4.192a.25.25 0 00.188.137l4.626.672a.25.25 0 01.139.426l-3.348 3.263a.25.25 0 00-.072.222l.79 4.607a.25.25 0 01-.362.263l-4.138-2.175a.25.25 0 00-.232 0l-4.138 2.175a.25.25 0 01-.363-.263l.79-4.607a.25.25 0 00-.071-.222L4.754 9.881a.25.25 0 01.139-.426l4.626-.672a.25.25 0 00.188-.137l2.069-4.192z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (starFilled);
//# sourceMappingURL=star-filled.js.map

/***/ }),

/***/ "./node_modules/@wordpress/icons/build-module/library/store.js":
/*!*********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/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 */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* 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__);
/* 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 store = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  fillRule: "evenodd",
  d: "M19.75 11H21V8.667L19.875 4H4.125L3 8.667V11h1.25v8.75h15.5V11zm-1.5 0H5.75v7.25H10V13h4v5.25h4.25V11zm-5.5-5.5h2.067l.486 3.24.028.76H12.75v-4zm-3.567 0h2.067v4H8.669l.028-.76.486-3.24zm7.615 3.1l-.464-3.1h2.36l.806 3.345V9.5h-2.668l-.034-.9zM7.666 5.5h-2.36L4.5 8.845V9.5h2.668l.034-.9.464-3.1z",
  clipRule: "evenodd"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (store);
//# sourceMappingURL=store.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 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__);
/* 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,react__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,react__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/@wordpress/icons/build-module/library/trash.js":
/*!*********************************************************************!*\
  !*** ./node_modules/@wordpress/icons/build-module/library/trash.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 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__);
/* 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 trash = (0,react__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,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.Path, {
  fillRule: "evenodd",
  clipRule: "evenodd",
  d: "M12 5.5A2.25 2.25 0 0 0 9.878 7h4.244A2.251 2.251 0 0 0 12 5.5ZM12 4a3.751 3.751 0 0 0-3.675 3H5v1.5h1.27l.818 8.997a2.75 2.75 0 0 0 2.739 2.501h4.347a2.75 2.75 0 0 0 2.738-2.5L17.73 8.5H19V7h-3.325A3.751 3.751 0 0 0 12 4Zm4.224 4.5H7.776l.806 8.861a1.25 1.25 0 0 0 1.245 1.137h4.347a1.25 1.25 0 0 0 1.245-1.137l.805-8.861Z"
}));
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (trash);
//# sourceMappingURL=trash.js.map

/***/ }),

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

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _components_Builder__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./components/Builder */ "./src/components/Builder/index.js");
/* 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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__);



document.addEventListener("DOMContentLoaded", DOMContentLoadedImport);
function DOMContentLoadedImport() {
  var appData = {
    name: "Post Grid",
    version: "1.0.0",
    demoUrl: "https://demo.pickplugins.com/post-grid/",
    reviewsUrl: "https://wordpress.org/support/plugin/post-grid/reviews/#new-post/"
  };
  const url = new URL(window.location.href);
  const path = url.pathname.substring(0, url.pathname.lastIndexOf('/'));
  const baseUrl = `${url.origin}${path}/`;
  window.PostGrid = {};
  window.PostGrid = appData;
  window.PostGrid.baseUrl = baseUrl;
  _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1___default()({
    path: "/post-grid/v2/get_options",
    method: "POST",
    data: {
      option: "post_grid_settings"
    }
  }).then(res => {
    if (res.length != 0) {
      var resX = {
        ...res
      };
      var license_key = resX?.license_key;
      window.PostGrid = {
        ...appData,
        license_key: license_key
      };
    }
  });

  // console.log(window.PostGrid)

  setTimeout(() => {
    var builderWrap = document.querySelector('#builder');
    if (builderWrap != null) {
      wp.element.render(/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_components_Builder__WEBPACK_IMPORTED_MODULE_0__["default"], {
        appData: appData
      }), builderWrap);
    }
  }, 2000);
}

/***/ }),

/***/ "./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 = {
  Mobile: {
    name: "Mobile",
    id: "Mobile",
    icon: '<span class="dashicons dashicons-smartphone">',
    min: 0,
    max: 767
  },
  Tablet: {
    name: "Tablet",
    id: "Tablet",
    icon: '<span class="dashicons dashicons-tablet"></span>',
    min: 768,
    max: 991
  },
  Desktop: {
    name: "Desktop",
    id: "Desktop",
    icon: '<span class="dashicons dashicons-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: '#6923F7'
}, {
  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/BuilderView/LoopItems.js":
/*!*************************************************!*\
  !*** ./src/components/BuilderView/LoopItems.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__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }
  var loopLayout = props.loopLayout;
  var itemData = props.itemData;
  const LoopItemsNode = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    if (nodeType == "root" || nodeType == "container" || nodeType == "layer") {
      var animateOn = node?.options?.animateOn;
      var animateOnRules = animateOn?.rules;
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        id: `element-${node.id}`,
        className: `${node.type}`,
        "data-animateon": animateOnRules?.length > 0 ? JSON.stringify(animateOnRules) : null,
        children: node.children && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
          children: node.children.map(child => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(LoopItemsNode, {
            node: child,
            itemData: itemData
          }, child?.id))
        })
      });
    } else {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(GenerateNodeHtml, {
        node: node,
        itemData: itemData
      });
    }
  };
  const GenerateNodeHtml = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    var html = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)("PostGridElementHtml" + nodeType, '', itemData, node);
    return html;
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
    children: loopLayout.map(node => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(LoopItemsNode, {
        node: node,
        itemData: itemData
      }, node.id)
    }))
  });
}
class LoopItems 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 {
      loopLayout,
      itemData
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      loopLayout: loopLayout,
      itemData: itemData,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (LoopItems);

/***/ }),

/***/ "./src/components/BuilderView/dummy-posts.js":
/*!***************************************************!*\
  !*** ./src/components/BuilderView/dummy-posts.js ***!
  \***************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   dummyPosts: () => (/* binding */ dummyPosts)
/* harmony export */ });
const dummyPosts = [{
  "postTitle": {
    "titleText": "Top 10 Hidden Gems to Visit in Europe"
  },
  "postId": {
    "id": 201
  },
  "postDate": {
    "date": "03/04/2025"
  },
  "postAuthor": {
    "authorName": "Haris"
  },
  "commentsCount": {
    "count": 87
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/LDxT0SD1/post-thumb-1.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Discover breathtaking but lesser-known destinations across Europe that offer unique experiences without the crowds."
  }
}, {
  "postTitle": {
    "titleText": "A Backpacker’s Guide to Southeast Asia"
  },
  "postId": {
    "id": 202
  },
  "postDate": {
    "date": "18/02/2025"
  },
  "postAuthor": {
    "authorName": "Amina"
  },
  "commentsCount": {
    "count": 104
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/XZbKK1Z6/post-thumb-6.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Explore budget-friendly tips and must-see destinations for traveling through Thailand, Vietnam, Cambodia, and beyond."
  }
}, {
  "postTitle": {
    "titleText": "The Ultimate Road Trip Across the USA"
  },
  "postId": {
    "id": 203
  },
  "postDate": {
    "date": "25/01/2025"
  },
  "postAuthor": {
    "authorName": "Zara"
  },
  "commentsCount": {
    "count": 76
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/KjFQ62ZC/post-thumb-2.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Take a journey through America's most iconic highways and national parks with this cross-country itinerary."
  }
}, {
  "postTitle": {
    "titleText": "Exploring Morocco: A Cultural Adventure"
  },
  "postId": {
    "id": 204
  },
  "postDate": {
    "date": "07/03/2025"
  },
  "postAuthor": {
    "authorName": "Yusuf"
  },
  "commentsCount": {
    "count": 65
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/1tpXJpb8/post-thumb-3.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "From bustling souks to the majestic Sahara Desert, Morocco offers an unforgettable travel experience."
  }
}, {
  "postTitle": {
    "titleText": "Island Hopping in the Philippines"
  },
  "postId": {
    "id": 205
  },
  "postDate": {
    "date": "28/02/2025"
  },
  "postAuthor": {
    "authorName": "Sana"
  },
  "commentsCount": {
    "count": 91
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/qYBxwSRd/post-thumb-4.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Hop across turquoise waters and explore the tropical paradise of over 7,000 islands in the Philippines."
  }
}, {
  "postTitle": {
    "titleText": "A Winter Escape to the Swiss Alps"
  },
  "postId": {
    "id": 206
  },
  "postDate": {
    "date": "14/01/2025"
  },
  "postAuthor": {
    "authorName": "Omar"
  },
  "commentsCount": {
    "count": 112
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/nNcqKzhy/post-thumb-5.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Ski resorts, cozy chalets, and snow-covered peaks — explore why Switzerland is the ultimate winter destination."
  }
}, {
  "postTitle": {
    "titleText": "Safari Adventures in Kenya"
  },
  "postId": {
    "id": 207
  },
  "postDate": {
    "date": "19/03/2025"
  },
  "postAuthor": {
    "authorName": "Fatima"
  },
  "commentsCount": {
    "count": 130
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/7dQJMQt0/post-thumb-7.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Witness the Big Five and breathtaking savannah landscapes in this guide to Kenya's best safari experiences."
  }
}, {
  "postTitle": {
    "titleText": "A Culinary Journey Through Italy"
  },
  "postId": {
    "id": 208
  },
  "postDate": {
    "date": "10/02/2025"
  },
  "postAuthor": {
    "authorName": "Nadia"
  },
  "commentsCount": {
    "count": 88
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/RTmJfQWC/post-thumb-9.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "From pasta in Rome to gelato in Florence — indulge in Italy’s rich culinary delights city by city."
  }
}, {
  "postTitle": {
    "titleText": "Weekend Getaways Near Dubai"
  },
  "postId": {
    "id": 209
  },
  "postDate": {
    "date": "04/04/2025"
  },
  "postAuthor": {
    "authorName": "Ahmed"
  },
  "commentsCount": {
    "count": 73
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/dsGMxFGq/post-thumb-8.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Escape the city hustle with these top short-trip destinations just hours from Dubai."
  }
}, {
  "postTitle": {
    "titleText": "Japan in Spring: The Beauty of Cherry Blossoms"
  },
  "postId": {
    "id": 210
  },
  "postDate": {
    "date": "30/03/2025"
  },
  "postAuthor": {
    "authorName": "Layla"
  },
  "commentsCount": {
    "count": 147
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/6ccT3PxS/post-thumb-10.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Plan your spring trip to Japan to catch the magical sakura season with our tips on the best viewing spots."
  }
}];

/***/ }),

/***/ "./src/components/BuilderView/dummy-products.js":
/*!******************************************************!*\
  !*** ./src/components/BuilderView/dummy-products.js ***!
  \******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   dummyProducts: () => (/* binding */ dummyProducts)
/* harmony export */ });
const dummyProducts = [{
  "postTitle": {
    "titleText": "Luxury Sofa in Italian Leather"
  },
  "postId": {
    "id": 101
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 123
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/PsCPp7Hd/sofa-4.png"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Experience unmatched comfort with this handcrafted Italian leather luxury sofa, built to impress and last..."
  }
}, {
  "postTitle": {
    "titleText": "Modern Velvet Sectional Sofa"
  },
  "postId": {
    "id": 102
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 87
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/xqmSrLQy/sofa-3.png"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "A chic and spacious velvet sectional designed for both elegance and everyday relaxation..."
  }
}, {
  "postTitle": {
    "titleText": "Contemporary L-Shaped Sofa"
  },
  "postId": {
    "id": 103
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 142
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/k2XqG8cf/sofa-1.png"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Transform your living space with this contemporary L-shaped sofa, combining comfort and sleek style..."
  }
}, {
  "postTitle": {
    "titleText": "Scandinavian Minimalist Sofa"
  },
  "postId": {
    "id": 104
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 65
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/B5CCfTt2/sofa-10.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Inspired by Nordic design, this minimalist sofa brings timeless sophistication to any room..."
  }
}, {
  "postTitle": {
    "titleText": "Vintage Tufted Chesterfield Sofa"
  },
  "postId": {
    "id": 105
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 199
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/sdWRcVFB/sofa-9.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Classic design meets modern comfort in this vintage-style Chesterfield, featuring deep button tufting and rolled arms..."
  }
}, {
  "postTitle": {
    "titleText": "Reclining Luxury Sofa with USB Ports"
  },
  "postId": {
    "id": 106
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 134
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/7NvXfYsj/sofa-8.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Stay connected and relaxed with this reclining sofa that includes built-in USB ports and plush padding..."
  }
}, {
  "postTitle": {
    "titleText": "Eco-Friendly Rattan Sofa Set"
  },
  "postId": {
    "id": 107
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 78
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/dsRcFX0D/sofa-5.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Go green with this sustainable rattan sofa, ideal for eco-conscious interiors and patios alike..."
  }
}, {
  "postTitle": {
    "titleText": "Convertible Sofa Bed for Guest Rooms"
  },
  "postId": {
    "id": 108
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 111
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/kgfhmktL/sofa-7.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Maximize space with this multifunctional sofa bed — perfect for small apartments and guest rooms..."
  }
}, {
  "postTitle": {
    "titleText": "Customizable Modular Sofa Set"
  },
  "postId": {
    "id": 109
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 90
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/pjYtvxwb/sofa-6.jpg"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Rearrange your comfort with this modular sofa system, offering endless combinations and layouts..."
  }
}, {
  "postTitle": {
    "titleText": "Compact Sofa for Small Living Spaces"
  },
  "postId": {
    "id": 110
  },
  "postDate": {
    "date": "12/05/2025"
  },
  "postAuthor": {
    "authorName": "PickPlugins"
  },
  "commentsCount": {
    "count": 67
  },
  "postThumbnail": {
    "srcUrl": "https://i.ibb.co/gbgf15Kx/sofa-4.png"
  },
  "postAuthorAvatar": {
    "srcUrl": "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018"
  },
  "postExcerpt": {
    "excerptText": "Ideal for apartments and studios, this compact sofa delivers style and comfort without taking up much room..."
  }
}];

/***/ }),

/***/ "./src/components/BuilderView/elements-view.js":
/*!*****************************************************!*\
  !*** ./src/components/BuilderView/elements-view.js ***!
  \*****************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* 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__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





/*postTitle*/

(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostTitle', 'post-grid/element', PostGridElementHtmlpostTitle, 10);
function PostGridElementHtmlpostTitle(html, itemData, element) {
  var options = element?.options;
  var linkTo = options?.linkTo;
  var target = options?.target;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [linkTo?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      href: "#",
      target: target,
      onClick: ev => {
        ev.preventDefault();
      },
      children: itemData.postTitle.titleText
    }), linkTo?.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
      children: itemData.postTitle.titleText
    })]
  });
}

/*postId*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostId', 'post-grid/element', PostGridElementHtmlpostId, 10);
function PostGridElementHtmlpostId(html, itemData, element) {
  var options = element?.options;
  var linkTo = options?.linkTo;
  var target = options?.target;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [linkTo?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("a", {
      href: "#",
      target: target,
      onClick: ev => {
        ev.preventDefault();
      },
      children: [itemData.ID, itemData.postId.id]
    }), linkTo?.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
      children: [itemData.ID, itemData.postId.id]
    })]
  });
}

/*readMore*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlreadMore', 'post-grid/element', PostGridElementHtmlreadMore, 10);
function PostGridElementHtmlreadMore(html, itemData, element) {
  var options = element.options;
  var target = options?.target;
  var readMoreText = options?.readMoreText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    target: target,
    href: "#",
    onClick: ev => {
      ev.preventDefault();
    },
    children: readMoreText
  });
}
/*customText*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlcustomText', 'post-grid/element', PostGridElementHtmlcustomText, 10);
function PostGridElementHtmlcustomText(html, itemData, element) {
  var options = element.options;
  var content = options?.content;
  var customTag = options?.customTag;
  const CustomTagWrapper = `${customTag}`;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(CustomTagWrapper, {
    id: `element-${element.id}`,
    className: `${element.type}`,
    onClick: ev => {
      ev.preventDefault();
    },
    children: content
  });
}

/*postExcerpt*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostExcerpt', 'post-grid/element', PostGridElementHtmlpostExcerpt, 10);
function PostGridElementHtmlpostExcerpt(html, itemData, element) {
  var options = element.options;
  var limitBy = options?.limitBy;
  var limitCount = options?.limitCount;
  var target = options?.target;
  var readMoreText = options?.readMoreText;
  var excerptText = itemData.postExcerpt.excerptText;
  var count = limitCount > 0 ? limitCount : 999;
  if (limitBy == "character") {
    excerptText = excerptText.substring(0, count);
  } else if (limitBy == "word") {
    setPostExcerptEdited(excerptText = excerptText.split(" ").splice(0, count).join(" "));
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("p", {
      className: "excerpt-text",
      children: excerptText
    }), readMoreText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      href: "#",
      target: target,
      className: "redmore",
      onClick: ev => {
        ev.preventDefault();
      },
      children: readMoreText
    })]
  });
}

/*postDate*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostDate', 'post-grid/element', PostGridElementHtmlpostDate, 10);
function PostGridElementHtmlpostDate(html, itemData, element) {
  var options = element.options;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  var linkTo = options?.linkTo;
  var target = options?.target;
  var format = options?.format;
  var icon = options.icon;
  var iconSrc = icon?.iconSrc;
  var iconHtml = `<span class="${iconSrc}"></span>`;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [prefixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), linkTo?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      href: "#",
      target: target,
      className: "post-date-label",
      onClick: ev => {
        ev.preventDefault();
      },
      children: itemData.postDate.date
    }), linkTo?.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "post-date-label",
      children: itemData.postDate.date
    }), postfixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: postfixText
    })]
  });
}

/*postAuthor*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostAuthor', 'post-grid/element', PostGridElementHtmlpostAuthor, 10);
function PostGridElementHtmlpostAuthor(html, itemData, element) {
  var options = element.options;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  var linkTo = options?.linkTo;
  var target = options?.target;
  var icon = options.icon;
  var iconSrc = icon?.iconSrc;
  var iconHtml = `<span class="${iconSrc}"></span>`;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), linkTo?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      href: "#",
      target: target,
      className: "author-name",
      onClick: ev => {
        ev.preventDefault();
      },
      children: itemData.postAuthor.authorName
    }), linkTo?.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "author-name",
      children: itemData.postAuthor.authorName
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*postAuthorAvatar*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostAuthorAvatar', 'post-grid/element', PostGridElementHtmlpostAuthorAvatar, 10);
function PostGridElementHtmlpostAuthorAvatar(html, itemData, element) {
  var options = element.options;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var linkTo = options.linkTo;
  var target = options.target;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), linkTo.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      href: "#",
      target: target,
      className: "author-link",
      onClick: ev => {
        ev.preventDefault();
      },
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("img", {
        className: "avatar",
        src: itemData.postAuthorAvatar.srcUrl,
        alt: ""
      })
    }), linkTo.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("img", {
      className: "avatar",
      src: itemData.postAuthorAvatar.srcUrl,
      alt: ""
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*postCategories*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostCategories', 'post-grid/element', PostGridElementHtmlpostCategories, 10);
function PostGridElementHtmlpostCategories(html, itemData, element) {
  var options = element.options;
  var maxCount = options?.maxCount;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  var target = options?.target;
  var postCount = options?.postCount;
  var separator = options?.separator;
  var categories = [{
    title: 'Category 1',
    count: 123
  }, {
    title: 'Category 2',
    count: 124
  }, {
    title: 'Category 3',
    count: 125
  }, {
    title: 'Category 4',
    count: 126
  }, {
    title: 'Category 5',
    count: 127
  }];
  var MaxCategories = categories.slice(0, maxCount);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "terms-items",
      children: MaxCategories.map((category, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "term-item",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("a", {
            className: "term-link",
            href: "#",
            target: target,
            onClick: ev => {
              ev.preventDefault();
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "term-title",
              children: category.title
            }), postCount && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "post-count",
              children: `(${category.count})`
            })]
          }), MaxCategories.length > index + 1 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: "separator",
            children: separator
          })]
        });
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*postTags*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostTags', 'post-grid/element', PostGridElementHtmlpostTags, 10);
function PostGridElementHtmlpostTags(html, itemData, element) {
  var options = element.options;
  var maxCount = options?.maxCount;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  var target = options?.target;
  var postCount = options?.postCount;
  var separator = options?.separator;
  var tags = [{
    title: 'Tag 1',
    count: 123
  }, {
    title: 'Tag 2',
    count: 124
  }, {
    title: 'Tag 3',
    count: 125
  }, {
    title: 'Tag 4',
    count: 126
  }, {
    title: 'Tag 5',
    count: 127
  }];
  var MaxTags = tags.slice(0, maxCount);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "terms-items",
      children: MaxTags.map((tag, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "item",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("a", {
            className: "term-link",
            href: "#",
            target: target,
            onClick: ev => {
              ev.preventDefault();
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "term-title",
              children: tag.title
            }), postCount && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "post-count",
              children: `(${tag.count})`
            })]
          }), MaxTags.length > index + 1 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: "separator",
            children: separator
          })]
        });
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}
/*postMeta*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostMeta', 'post-grid/element', PostGridElementHtmlpostMeta, 10);
function PostGridElementHtmlpostMeta(html, itemData, element) {
  var options = element.options;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "meta-value",
      children: "Post Meta"
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*commentsCount*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlcommentsCount', 'post-grid/element', PostGridElementHtmlcommentsCount, 10);
function PostGridElementHtmlcommentsCount(html, itemData, element) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: itemData.commentsCount.count
  });
}

/*shareButton*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlshareButton', 'post-grid/element', PostGridElementHtmlshareButton, 10);
function PostGridElementHtmlshareButton(html, itemData, element) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: "shareButton"
  });
}

/*postContent*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostContent', 'post-grid/element', PostGridElementHtmlpostContent, 10);
function PostGridElementHtmlpostContent(html, itemData, element) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: "Affiliate marketers depend heavily on email marketing to drive sales and connect with leads. However, when email lists are not verified, they can lead to higher bounce rates, spam complaints, and even blacklisting by email providers. This section will introduce\u2026"
  });
}

/*postThumbnail*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlpostThumbnail', 'post-grid/element', PostGridElementHtmlpostThumbnail, 10);
function PostGridElementHtmlpostThumbnail(html, itemData, element) {
  var elementOptions = element.options;
  var srcUrl = itemData?.postThumbnail?.srcUrl;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("img", {
      src: srcUrl.length == 0 ? elementOptions.defaultSrcUrl : srcUrl,
      alt: ""
    })
  });
}

/*wooPrice*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlwooPrice', 'post-grid/element', PostGridElementHtmlwooPrice, 10);
function PostGridElementHtmlwooPrice(html, itemData, element) {
  var options = element?.options;
  var currencySymbole = options.currencySymbole;
  var currencyPosition = options.currencyPosition;
  var separatorText = options.separatorText;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [prefixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "regular",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "currency",
        children: currencySymbole
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "price-value",
        children: "123"
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "separator",
      children: separatorText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "sale-price",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "currency",
        children: currencySymbole
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "price-value",
        children: "250"
      })]
    }), postfixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooSaleBadge*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlwooSaleBadge', 'post-grid/element', PostGridElementHtmlwooSaleBadge, 10);
function PostGridElementHtmlwooSaleBadge(html, itemData, element) {
  var options = element?.options;
  var onSaleText = options.onSaleText;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [prefixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "on-sale-badge",
      children: onSaleText
    }), postfixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooSKU*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlwooSKU', 'post-grid/element', PostGridElementHtmlwooSKU, 10);
function PostGridElementHtmlwooSKU(html, itemData, element) {
  var options = element?.options;
  var dafaultSKUText = options.dafaultSKUText;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [prefixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "sku",
      children: dafaultSKUText
    }), postfixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooStockQuantity*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlwooStockQuantity', 'post-grid/element', PostGridElementHtmlwooStockQuantity, 10);
function PostGridElementHtmlwooStockQuantity(html, itemData, element) {
  var options = element?.options;
  var dafultQuantity = options.dafultQuantity;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [prefixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "stock-quantity",
      children: dafultQuantity
    }), postfixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooInStock*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlwooInStock', 'post-grid/element', PostGridElementHtmlwooInStock, 10);
function PostGridElementHtmlwooInStock(html, itemData, element) {
  var options = element?.options;
  var inStockText = options.inStockText;
  var outOfStockText = options.outOfStockText;
  var backOrderText = options.backOrderText;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var previewFor = options.previewFor;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [prefixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), previewFor == 'inStockText' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "instock",
      children: inStockText
    }), previewFor == 'outOfStockText' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "outofstock",
      children: outOfStockText
    }), previewFor == 'backOrderText' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "onbackorder",
      children: backOrderText
    }), postfixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooTotalSales*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlwooTotalSales', 'post-grid/element', PostGridElementHtmlwooTotalSales, 10);
function PostGridElementHtmlwooTotalSales(html, itemData, element) {
  var options = element?.options;
  var defaultSaleCount = options.defaultSaleCount;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [prefixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "sale-count",
      children: defaultSaleCount
    }), postfixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooProductRatings*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlwooProductRatings', 'post-grid/element', PostGridElementHtmlwooProductRatings, 10);
function PostGridElementHtmlwooProductRatings(html, itemData, element) {
  var options = element?.options;
  var iconsIdle = options.iconsIdle;
  var iconsFilled = options.iconsFilled;
  var defaultRating = options.defaultRating;
  var summaryType = options.summaryType;
  var summaryTypeCustom = options.summaryTypeCustom;
  var summaryLinkTo = options.summaryLinkTo;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var iconsIdleHtml = `<span class="${iconsIdle.iconSrc}"></span>`;
  var iconsFilledHtml = `<span class="${iconsFilled.iconSrc}"></span>`;
  function replaceAll(str, correction) {
    Object.keys(correction).forEach(key => {
      str = str.replaceAll(key, correction[key]);
    });
    return str;
  }
  var map = {
    "{rating_count}": "",
    "{review_count}": "",
    "{average_rating}": "",
    "{product_title}": ""
  };
  const [ratingMap, setratingMap] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(map);
  var filledStyles = {
    width: "60%"
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [prefixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "icons-wrap",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "icons-idle",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "icons-filled",
          style: filledStyles,
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          })]
        })]
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "summary",
      children: [summaryType !== "custom" && summaryType !== null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
        children: replaceAll(summaryType, ratingMap)
      }), summaryType == "custom" && summaryTypeCustom.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
        children: replaceAll(summaryTypeCustom, ratingMap)
      })]
    }), postfixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooAddToCart*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlwooAddToCart', 'post-grid/element', PostGridElementHtmlwooAddToCart, 10);
function PostGridElementHtmlwooAddToCart(html, itemData, element) {
  var options = element?.options;
  var addToCartText = options.addToCartText;
  var quantityEnable = options.quantityEnable;
  var icon = options.icon;
  var iconPosition = options.iconPosition;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var iconSrc = icon?.iconSrc;
  var iconHtml = `<span class="${iconSrc}"></span>`;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${element.id}`,
    className: `${element.type}`,
    children: [iconPosition == "beforePrefix" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), prefixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), iconPosition == "afterPrefix" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("a", {
      className: "cartBtn",
      onClick: ev => {
        ev.preventDefault();
      },
      href: "?add-to-cart=1399",
      "data-quantity": "1",
      "data-product_id": "1399",
      "data-product_sku": "woo-polo",
      "aria-label": "Add \u201CPolo\u201D to your cart",
      "aria-describedby": "",
      rel: "nofollow",
      children: [iconPosition == "beforeCartText" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "icon-wrap",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), addToCartText, iconPosition == "afterCartText" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "icon-wrap",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })]
    }), quantityEnable && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "quantityWrap",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "quantityIncrease",
        children: "+"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", {
        size: "3",
        type: "text",
        inputMode: "numeric",
        className: "quantityInput",
        placeholder: "1",
        value: '3'
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "quantityDecrease",
        children: "-"
      })]
    }), iconPosition == "beforePostfix" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), postfixText?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    }), iconPosition == "afterPostfix" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })]
  });
}

/***/ }),

/***/ "./src/components/BuilderView/index.js":
/*!*********************************************!*\
  !*** ./src/components/BuilderView/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_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_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_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_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/help.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _input_select__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _preview_grid__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./preview-grid */ "./src/components/BuilderView/preview-grid.js");
/* harmony import */ var _preview_carousel__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./preview-carousel */ "./src/components/BuilderView/preview-carousel.js");
/* harmony import */ var _preview_masonry__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./preview-masonry */ "./src/components/BuilderView/preview-masonry.js");
/* harmony import */ var _preview_filterable__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./preview-filterable */ "./src/components/BuilderView/preview-filterable.js");
/* harmony import */ var _elements_view__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./elements-view */ "./src/components/BuilderView/elements-view.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;













var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var id = props.id;
  var customerData = props.customerData;
  var onChangePostGrid = props.onChangePostGrid;
  var addNotifications = props.addNotifications;
  var settoggleSettings = props.settoggleSettings;
  var setHelp = props.setHelp;
  var isLoading = props.isLoading;
  var onSavePostGrid = props.onSavePostGrid;
  var pleaseUpdate = props.pleaseUpdate;
  if (props.postData.post_content == null) {
    return null;
  }
  var [loading, setloading] = useState(false);
  var [pleaseUpdateX, setpleaseUpdateX] = useState(props.pleaseUpdate);
  var [postData, setpostData] = useState(props.postData);
  var [PostGridData, setPostGridData] = useState(postData.post_content);
  var [globalOptions, setglobalOptions] = useState(PostGridData.globalOptions);
  const copyData = data => {
    navigator.clipboard.writeText(data).then(() => {
      addNotifications({
        title: "Copied to clipboard!",
        content: "Use the shortcode in page or post content where you want to display.",
        type: "success"
      });
    }).catch(err => {});
  };
  useEffect(() => {
    setpostData(props.postData);
  }, [props.postData]);
  useEffect(() => {
    setPostGridData(postData.post_content);
  }, [postData]);
  useEffect(() => {
    setglobalOptions(PostGridData.globalOptions);
  }, [PostGridData]);
  useEffect(() => {
    setpleaseUpdateX(pleaseUpdate);
  }, [pleaseUpdate]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    className: "ml-5",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
      className: "flex items-center justify-between align-middle bg-white py-2 px-5  mb-5",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
        className: "flex items-center gap-5",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
          className: "",
          children: [postData?.post_title && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
            className: "flex items-center gap-3 text-base font-bold",
            children: ["You are editing:", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("span", {
              children: [" ", postData.post_title]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("span", {
              className: "text-gray-300",
              children: [`(#${postData.ID})`, " "]
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
            className: "flex gap-4 items-center my-3",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
              className: "cursor-pointer",
              onClick: ev => {
                settoggleSettings('overview');
              },
              children: "Overview"
            }), !customerData.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
                className: "cursor-pointer",
                onClick: ev => {
                  settoggleSettings('freeVsPro');
                },
                children: "Free Vs Pro"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("a", {
                href: "https://pickplugins.com/post-grid/",
                target: "_blank",
                className: "cursor-pointer px-3 py-1 bg-amber-600 rounded text-white",
                children: "Buy Now"
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
              className: "cursor-pointer",
              onClick: ev => {
                settoggleSettings('sendFeedback');
              },
              children: "Send Feedbacks"
            })]
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
        className: "flex items-center align-middle gap-3",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
          className: "flex items-center align-middle gap-2",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("span", {
            className: "cursor-pointer",
            title: "Click to know more",
            onClick: () => {
              setHelp({
                id: "useShortcodes",
                enable: true
              });
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_12__["default"], {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_13__["default"]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("input", {
            type: "text",
            className: "w-72 !bg-slate-200 !rounded-none !border-2 !border-solid border-slate-400 text-sm !py-1 !px-2 font-mono",
            value: `[post_grid_builder id="${id}"]`,
            onClick: () => {
              var str = `[post_grid_builder id="${id}"]`;
              copyData(str);
            }
          })]
        }), pleaseUpdateX && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
          className: "bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
          onClick: ev => {
            onSavePostGrid(true);
          },
          children: "Save"
        })]
      })]
    }), globalOptions?.viewType == "viewGrid" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_preview_grid__WEBPACK_IMPORTED_MODULE_6__["default"], {
      postData: postData,
      id: id
    }), globalOptions?.viewType == "viewSlider" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_preview_carousel__WEBPACK_IMPORTED_MODULE_7__["default"], {
      postData: postData,
      id: id
    }), globalOptions?.viewType == "viewMasonry" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_preview_masonry__WEBPACK_IMPORTED_MODULE_8__["default"], {
      postData: postData,
      id: id
    }), globalOptions?.viewType == "viewFilterable" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_preview_filterable__WEBPACK_IMPORTED_MODULE_9__["default"], {
      postData: postData,
      id: id
    })]
  });
}
class BuilderView 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 {
      postData,
      id,
      isLoading,
      onChangePostGrid,
      pleaseUpdate,
      onSavePostGrid,
      addNotifications,
      settoggleSettings,
      customerData,
      setHelp
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(Html, {
      isLoading: isLoading,
      postData: postData,
      id: id,
      onSavePostGrid: onSavePostGrid,
      pleaseUpdate: pleaseUpdate,
      onChangePostGrid: onChangePostGrid,
      addNotifications: addNotifications,
      settoggleSettings: settoggleSettings,
      customerData: customerData,
      setHelp: setHelp,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BuilderView);

/***/ }),

/***/ "./src/components/BuilderView/preview-carousel.js":
/*!********************************************************!*\
  !*** ./src/components/BuilderView/preview-carousel.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_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_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_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 react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _input_select__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _splidejs_react_splide__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @splidejs/react-splide */ "./node_modules/@splidejs/react-splide/dist/js/react-splide.esm.js");
/* harmony import */ var _splidejs_splide_extension_auto_scroll__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @splidejs/splide-extension-auto-scroll */ "./node_modules/@splidejs/splide-extension-auto-scroll/dist/js/splide-extension-auto-scroll.esm.js");
/* harmony import */ var _splidejs_splide_extension_grid__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @splidejs/splide-extension-grid */ "./node_modules/@splidejs/splide-extension-grid/dist/js/splide-extension-grid.esm.js");
/* harmony import */ var _LoopItems__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./LoopItems */ "./src/components/BuilderView/LoopItems.js");
/* harmony import */ var _dummy_posts__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./dummy-posts */ "./src/components/BuilderView/dummy-posts.js");
/* harmony import */ var _dummy_products__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./dummy-products */ "./src/components/BuilderView/dummy-products.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;














var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var id = props.id;
  if (props.postData.post_content == null) {
    return null;
  }
  var [postData, setpostData] = useState(props.postData);
  var [PostGridData, setPostGridData] = useState(postData.post_content);
  var [globalOptions, setglobalOptions] = useState(PostGridData.globalOptions);
  var [loopLayout, setloopLayout] = useState(PostGridData.loopLayout);
  var [wrapper, setwrapper] = useState(PostGridData.wrapper);
  var [items, setitems] = useState(PostGridData.items);
  var [navsWrap, setnavsWrap] = useState(PostGridData?.navsWrap);
  var [navItem, setnavItem] = useState(PostGridData?.navItem);
  var [postsData, setpostsData] = useState([]);
  useEffect(() => {
    setpostData(props.postData);
  }, [props.postData]);
  useEffect(() => {
    setPostGridData(postData.post_content);
    //setitems(postData.post_content.items);
  }, [postData]);
  useEffect(() => {
    setglobalOptions(PostGridData.globalOptions);
    setwrapper(PostGridData.wrapper);
    setloopLayout(PostGridData.loopLayout);
    setitems(PostGridData.items);
    setnavsWrap(PostGridData.navsWrap);
    setnavItem(PostGridData.navItem);
  }, [PostGridData]);
  function unescapeHTML(str) {
    const map = {
      '&amp;': '&',
      '&lt;': '<',
      '&gt;': '>',
      '&quot;': '"',
      '&#039;': "'"
    };
    return str.replace(/&amp;|&lt;|&gt;|&quot;|&#039;/g, function (match) {
      return map[match];
    });
  }
  var loopLayout = PostGridData.loopLayout;
  var itemWrap = PostGridData?.itemWrap;
  var sliderOptions = PostGridData?.sliderOptions;
  var prev = PostGridData?.prev;
  var next = PostGridData?.next;
  var prevIcon = PostGridData?.prevIcon;
  var nextIcon = PostGridData?.nextIcon;
  const [prevIconHtml, setPrevIconHtml] = useState("");
  const [nextIconHtml, setNextIconHtml] = useState("");
  useEffect(() => {
    var iconSrc = nextIcon?.options?.iconSrc;
    var iconHtml = `<span class="${iconSrc}"></span>`;
    setNextIconHtml(iconHtml);
  }, [nextIcon?.options]);
  useEffect(() => {
    var iconSrc = prevIcon?.options?.iconSrc;
    var iconHtml = `<span class="${iconSrc}"></span>`;
    setPrevIconHtml(iconHtml);
  }, [prevIcon?.options]);
  useEffect(() => {
    var postType = PostGridData?.itemQueryArgs.postType.value;
    if (postType.includes("product")) {
      postsData = _dummy_products__WEBPACK_IMPORTED_MODULE_11__.dummyProducts;
    } else {
      postsData = _dummy_posts__WEBPACK_IMPORTED_MODULE_10__.dummyPosts;
    }
    var count = parseInt(PostGridData?.itemQueryArgs?.postsPerPage?.value);
    var result = postsData.slice(0, count); // Returns the first 3 elements
    setpostsData(result);
  }, [PostGridData.itemQueryArgs]);
  const GenerateNodeHtml = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    var nodeId = node.id;
    var html = applyFilters("PostGridElementHtml" + nodeType, '', itemData, node);
    return html;
  };
  const TreeNode = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    if (nodeType == "root" || nodeType == "container") {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)("div", {
        id: `element-${node.id}`,
        className: `${node.type}`,
        children: node.children && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.Fragment, {
          children: node.children.map(child => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(TreeNode, {
            node: child,
            itemData: itemData
          }, child?.id))
        })
      });
    } else {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(GenerateNodeHtml, {
        node: node,
        itemData: itemData
      });
    }
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)("div", {
    className: "p-5",
    children: [JSON.stringify(postsData), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)("div", {
      id: `post-grid-${id}`,
      className: `${wrapper?.options?.class} `,
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)("div", {
        className: `my-5 ${wrapper?.options?.class} `,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)(_splidejs_react_splide__WEBPACK_IMPORTED_MODULE_6__.Splide, {
          hasTrack: false,
          options: sliderOptions,
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_splidejs_react_splide__WEBPACK_IMPORTED_MODULE_6__.SplideTrack, {
            className: "items",
            children: postsData?.map((item, loopIndex) => {
              var children = PostGridData.loopLayout[0]?.children ? PostGridData.loopLayout[0]?.children : [];
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)("div", {
                className: `${itemWrap?.options?.class} splide__slide item`,
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_LoopItems__WEBPACK_IMPORTED_MODULE_9__["default"], {
                  loopLayout: children,
                  itemData: item
                })
              }, loopIndex);
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)("div", {
            className: "splide__arrows ",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)("div", {
              className: "prev nav-item splide__arrow splide__arrow--prev",
              children: [prevIcon?.options.position == "before" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)("span", {
                className: "icon",
                dangerouslySetInnerHTML: {
                  __html: prevIconHtml
                }
              }), prev?.options.text.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)("span", {
                children: [" ", prev.options.text, " "]
              }), prevIcon?.options.position == "after" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)("span", {
                className: "icon",
                dangerouslySetInnerHTML: {
                  __html: prevIconHtml
                }
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)("div", {
              className: "next nav-item splide__arrow splide__arrow--next",
              children: [nextIcon?.options.position == "before" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)("span", {
                className: "icon",
                dangerouslySetInnerHTML: {
                  __html: nextIconHtml
                }
              }), next?.options.text.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)("span", {
                children: [" ", next.options.text, " "]
              }), nextIcon?.options.position == "after" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)("span", {
                className: "icon",
                dangerouslySetInnerHTML: {
                  __html: nextIconHtml
                }
              })]
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)("ul", {
            className: "splide__pagination "
          })]
        })
      })
    })]
  });
}
class PreviewCarousel 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 {
      postData,
      id,
      onChangeStyleObj
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(Html, {
      postData: postData,
      id: id,
      onChangeStyleObj: onChangeStyleObj,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PreviewCarousel);

/***/ }),

/***/ "./src/components/BuilderView/preview-filterable.js":
/*!**********************************************************!*\
  !*** ./src/components/BuilderView/preview-filterable.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__);
/* harmony import */ var _LoopItems__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./LoopItems */ "./src/components/BuilderView/LoopItems.js");
/* harmony import */ var _dummy_posts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./dummy-posts */ "./src/components/BuilderView/dummy-posts.js");
/* harmony import */ var _dummy_products__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./dummy-products */ "./src/components/BuilderView/dummy-products.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;





var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var id = props.id;
  if (props.postData.post_content == null) {
    return null;
  }
  var [postData, setpostData] = useState(props.postData);
  var [PostGridData, setPostGridData] = useState(postData.post_content);

  /*Selectors*/
  var [globalOptions, setglobalOptions] = useState(PostGridData.globalOptions);
  var [wrapper, setwrapper] = useState(PostGridData.wrapper);
  var [items, setitems] = useState([{}, {}, {}]);
  var [itemsWrap, setitemsWrap] = useState(PostGridData.itemsWrap);
  var [itemWrap, setitemWrap] = useState(PostGridData.itemWrap);
  var [loopLayout, setloopLayout] = useState(PostGridData.loopLayout);
  var [activeFilter, setactiveFilter] = useState(PostGridData.activeFilter);
  var [pagination, setpagination] = useState(PostGridData.pagination);
  var [postsData, setpostsData] = useState([]);
  const [previousIconHtml, setpreviousIconHtml] = useState("");
  const [nextIconHtml, setnextIconHtml] = useState("");
  var dummyFilters = [{
    "groupTitle": "News",
    "type": "",
    "logic": "",
    "showPostCount": "",
    "items": [{
      "id": 0,
      "slug": "email-marketing",
      "title": "Email Marketing",
      "count": "123"
    }, {
      "id": 0,
      "slug": "email-verification",
      "title": "Email Verification",
      "count": "124"
    }, {
      "id": 0,
      "slug": "email-list",
      "title": "Email List",
      "count": "125"
    }]
  }];
  useEffect(() => {
    var iconSrc = PostGridData.pagination?.previousIcon?.iconSrc;
    var previousIconHtml = `<span class="${iconSrc}"></span>`;
    setpreviousIconHtml(previousIconHtml);
    var iconSrc = PostGridData.pagination?.nextIcon?.iconSrc;
    var nextIconHtml = `<span class="${iconSrc}"></span>`;
    setnextIconHtml(nextIconHtml);
    setpagination(PostGridData.globalOptions.pagination);
  }, [PostGridData.globalOptions.pagination]);
  useEffect(() => {
    setpostData(props.postData);
  }, [props.postData]);
  useEffect(() => {
    setglobalOptions(PostGridData.globalOptions);
  }, [PostGridData]);
  useEffect(() => {}, [loopLayout, PostGridData.loopLayout]);
  useEffect(() => {
    setPostGridData(postData.post_content);
  }, [postData]);
  useEffect(() => {
    var postType = PostGridData?.itemQueryArgs.postType.value;
    if (postType.includes("product")) {
      postsData = _dummy_products__WEBPACK_IMPORTED_MODULE_3__.dummyProducts;
    } else {
      postsData = _dummy_posts__WEBPACK_IMPORTED_MODULE_2__.dummyPosts;
    }
    var count = parseInt(PostGridData?.itemQueryArgs?.postsPerPage?.value);
    var result = postsData.slice(0, count); // Returns the first 3 elements
    setpostsData(result);
  }, [PostGridData.itemQueryArgs]);
  const GenerateNodeHtml = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    var nodeId = node.id;
    var html = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__.applyFilters)("PostGridElementHtml" + nodeType, '', itemData, node);
    return html;
  };
  const TreeNode = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    if (nodeType == "root" || nodeType == "container") {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        id: `element-${node.id}`,
        className: `${node.type}`,
        children: node.children && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: node.children.map(child => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(TreeNode, {
            node: child,
            itemData: itemData
          }, child?.id))
        })
      });
    } else {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(GenerateNodeHtml, {
        node: node,
        itemData: itemData
      });
    }
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
    className: "p-5",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      id: `post-grid-${id}`,
      className: `${wrapper?.options?.class} `,
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
        className: "filterable-group-wrap",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
          className: "filterable-group",
          children: globalOptions?.showAll == "yes" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
              className: "pg-filter mixitup-control-active    filter-34534",
              "data-filter": "all",
              children: "All"
            })
          })
        }), globalOptions.filters?.length > 0 && globalOptions.filters.map(x => {
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
            className: "filterable-group ",
            "data-logic": x.logic,
            children: [globalOptions.multifilter && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
              children: x.groupTitle && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
                className: "filterable-group-title ",
                children: x.groupTitle
              })
            }), x.items.map(y => {
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("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,
                children: [y.title, x.showPostCount == "yes" ? "(" + y.count + ")" : ""]
              });
            })]
          });
        }), globalOptions.filters?.length == 0 && dummyFilters.map(x => {
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
            className: "filterable-group ",
            "data-logic": x.logic,
            children: [globalOptions.multifilter && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
              children: x.groupTitle && globalOptions.multifilter && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
                className: "filterable-group-title ",
                children: x.groupTitle
              })
            }), x.items.map(y => {
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("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,
                children: [y.title, x.showPostCount == "yes" ? "(" + y.count + ")" : ""]
              });
            })]
          });
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
          className: "filterable-group",
          children: [globalOptions?.showSort == "yes" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
              className: "pg-filter mixitup-control-active   filter-34534",
              "data-filter": "",
              children: "ASC"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
              className: "pg-filter    filter-34534",
              "data-filter": "",
              children: "DESC"
            })]
          }), globalOptions?.showRandom == "yes" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
              className: "pg-filter   filter-34534",
              "data-filter": "",
              children: "Random"
            })
          }), globalOptions?.showClear == "yes" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
              className: "pg-filter  filter-34534",
              "data-filter": "",
              children: "Clear"
            })
          })]
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: `${itemsWrap?.options?.class} `,
        children: postsData?.map((item, loopIndex) => {
          var children = PostGridData.loopLayout[0]?.children ? PostGridData.loopLayout[0]?.children : [];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
            className: `${itemWrap?.options?.class} `,
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_LoopItems__WEBPACK_IMPORTED_MODULE_1__["default"], {
              loopLayout: children,
              itemData: item
            })
          }, loopIndex);
        })
      }), PostGridData.globalOptions.itemSource == "posts" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        class: "pagination ",
        children: PostGridData.globalOptions?.pagination?.type == 'filterable' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "prev page-numbers",
            href: "#1",
            onClick: ev => {
              ev.preventDefault();
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
              class: "previous ",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
                className: "",
                dangerouslySetInnerHTML: {
                  __html: previousIconHtml
                }
              }), pagination?.previousText]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#1",
            onClick: ev => {
              ev.preventDefault();
            },
            children: "1"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            "aria-current": "page",
            class: "page-numbers mixitup-control-active",
            children: "2"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#3",
            onClick: ev => {
              ev.preventDefault();
            },
            children: "3"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#4",
            onClick: ev => {
              ev.preventDefault();
            },
            children: "4"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            class: "page-numbers dots",
            children: "\u2026"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#6",
            children: "6"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "next page-numbers",
            href: "#3",
            onClick: ev => {
              ev.preventDefault();
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
              class: "next ",
              children: [pagination?.nextText, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
                className: "",
                dangerouslySetInnerHTML: {
                  __html: nextIconHtml
                }
              })]
            })
          })]
        })
      })]
    })
  });
}
class PreviewGrid 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 {
      postData,
      id
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
      postData: postData,
      id: id,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PreviewGrid);

/***/ }),

/***/ "./src/components/BuilderView/preview-grid.js":
/*!****************************************************!*\
  !*** ./src/components/BuilderView/preview-grid.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__);
/* harmony import */ var _LoopItems__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./LoopItems */ "./src/components/BuilderView/LoopItems.js");
/* harmony import */ var _dummy_posts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./dummy-posts */ "./src/components/BuilderView/dummy-posts.js");
/* harmony import */ var _dummy_products__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./dummy-products */ "./src/components/BuilderView/dummy-products.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;





var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var id = props.id;
  if (props.postData.post_content == null) {
    return null;
  }
  var [postData, setpostData] = useState(props.postData);
  var [PostGridData, setPostGridData] = useState(postData.post_content);

  /*Selectors*/
  var [wrapper, setwrapper] = useState(PostGridData.wrapper);
  var [items, setitems] = useState([{}, {}, {}]);
  var [itemsWrap, setitemsWrap] = useState(PostGridData.itemsWrap);
  var [itemWrap, setitemWrap] = useState(PostGridData.itemWrap);
  var [loopLayout, setloopLayout] = useState(PostGridData.loopLayout);
  var [pagination, setpagination] = useState(PostGridData.pagination);
  var [postsData, setpostsData] = useState([]);
  const [loadingIconHtml, setloadingIconHtml] = useState("");
  const [loadMoreIconHtml, setloadMoreIconHtml] = useState("");
  const [previousIconHtml, setpreviousIconHtml] = useState("");
  const [nextIconHtml, setnextIconHtml] = useState("");
  useEffect(() => {
    var iconSrc = PostGridData.pagination?.loadingIcon?.iconSrc;
    var loadingIconHtml = `<span class="${iconSrc}"></span>`;
    setloadingIconHtml(loadingIconHtml);
    var iconSrc = PostGridData.pagination?.loadMoreIcon?.iconSrc;
    var loadMoreIconHtml = `<span class="${iconSrc}"></span>`;
    setloadMoreIconHtml(loadMoreIconHtml);
    var iconSrc = PostGridData.pagination?.previousIcon?.iconSrc;
    var previousIconHtml = `<span class="${iconSrc}"></span>`;
    setpreviousIconHtml(previousIconHtml);
    var iconSrc = PostGridData.pagination?.nextIcon?.iconSrc;
    var nextIconHtml = `<span class="${iconSrc}"></span>`;
    setnextIconHtml(nextIconHtml);
    setpagination(PostGridData.globalOptions.pagination);
  }, [PostGridData.globalOptions.pagination]);
  useEffect(() => {
    setpostData(props.postData);
  }, [props.postData]);
  useEffect(() => {}, [loopLayout, PostGridData.loopLayout]);
  useEffect(() => {
    setPostGridData(postData.post_content);
  }, [postData]);
  useEffect(() => {
    var postType = PostGridData?.itemQueryArgs.postType.value;
    if (postType.includes("product")) {
      postsData = _dummy_products__WEBPACK_IMPORTED_MODULE_3__.dummyProducts;
    } else {
      postsData = _dummy_posts__WEBPACK_IMPORTED_MODULE_2__.dummyPosts;
    }
    var count = parseInt(PostGridData?.itemQueryArgs?.postsPerPage?.value);
    var result = postsData.slice(0, count); // Returns the first 3 elements
    setpostsData(result);
  }, [PostGridData.itemQueryArgs]);
  const GenerateNodeHtml = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    var nodeId = node.id;
    var html = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__.applyFilters)("PostGridElementHtml" + nodeType, '', itemData, node);
    return html;
  };
  const TreeNode = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    if (nodeType == "root" || nodeType == "container") {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        id: `element-${node.id}`,
        className: `${node.type}`,
        children: node.children && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: node.children.map(child => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(TreeNode, {
            node: child,
            itemData: itemData
          }, child?.id))
        })
      });
    } else {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(GenerateNodeHtml, {
        node: node,
        itemData: itemData
      });
    }
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
    className: "p-5",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      id: `post-grid-${id}`,
      className: `${wrapper?.options?.class} `,
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: `${itemsWrap?.options?.class} `,
        children: postsData?.map((item, loopIndex) => {
          var children = PostGridData.loopLayout[0]?.children ? PostGridData.loopLayout[0]?.children : [];

          // console.log(children)

          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
            className: `${itemWrap?.options?.class} loop-item-${loopIndex}`,
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_LoopItems__WEBPACK_IMPORTED_MODULE_1__["default"], {
              loopLayout: children,
              itemData: item
            })
          }, loopIndex);
        })
      }), PostGridData.globalOptions.itemSource == "posts" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
        class: "pagination ",
        children: [PostGridData.globalOptions?.pagination?.type == "next_previous" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
            className: "page-numbers prev",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              className: "",
              dangerouslySetInnerHTML: {
                __html: previousIconHtml
              }
            }), pagination?.previousText]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
            className: "page-numbers next",
            children: [pagination?.nextText, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              className: "",
              dangerouslySetInnerHTML: {
                __html: nextIconHtml
              }
            })]
          })]
        }), PostGridData.globalOptions?.pagination?.type == "loadmore" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
            className: "page-numbers",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              dangerouslySetInnerHTML: {
                __html: loadMoreIconHtml
              }
            }), pagination?.loadMoreText]
          })
        }), PostGridData.globalOptions?.pagination?.type == "infinite" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
          className: "page-numbers",
          children: [pagination.loadMoreText, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            dangerouslySetInnerHTML: {
              __html: loadingIconHtml
            }
          })]
        }), (PostGridData.globalOptions?.pagination?.type == 'normal' || PostGridData.globalOptions?.pagination?.type == 'ajax') && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "prev page-numbers",
            href: "#1",
            onClick: ev => {
              ev.preventDefault();
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
              class: "previous ",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
                className: "",
                dangerouslySetInnerHTML: {
                  __html: previousIconHtml
                }
              }), pagination?.previousText]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#1",
            onClick: ev => {
              ev.preventDefault();
            },
            children: "1"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            "aria-current": "page",
            class: "page-numbers current",
            children: "2"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#3",
            onClick: ev => {
              ev.preventDefault();
            },
            children: "3"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#4",
            onClick: ev => {
              ev.preventDefault();
            },
            children: "4"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            class: "page-numbers dots",
            children: "\u2026"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#6",
            children: "6"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "next page-numbers",
            href: "#3",
            onClick: ev => {
              ev.preventDefault();
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
              class: "next ",
              children: [pagination?.nextText, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
                className: "",
                dangerouslySetInnerHTML: {
                  __html: nextIconHtml
                }
              })]
            })
          })]
        })]
      })]
    })
  });
}
class PreviewGrid 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 {
      postData,
      id
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
      postData: postData,
      id: id,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PreviewGrid);

/***/ }),

/***/ "./src/components/BuilderView/preview-masonry.js":
/*!*******************************************************!*\
  !*** ./src/components/BuilderView/preview-masonry.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 masonry_layout__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! masonry-layout */ "./node_modules/masonry-layout/masonry.js");
/* harmony import */ var masonry_layout__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(masonry_layout__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _LoopItems__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./LoopItems */ "./src/components/BuilderView/LoopItems.js");
/* harmony import */ var _dummy_posts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./dummy-posts */ "./src/components/BuilderView/dummy-posts.js");
/* harmony import */ var _dummy_products__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./dummy-products */ "./src/components/BuilderView/dummy-products.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;





var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var id = props.id;
  if (props.postData.post_content == null) {
    return null;
  }
  var [postData, setpostData] = useState(props.postData);
  var [PostGridData, setPostGridData] = useState(postData.post_content);
  var [globalOptions, setglobalOptions] = useState(PostGridData.globalOptions);
  var [wrapper, setwrapper] = useState(PostGridData.wrapper);
  var [itemsWrap, setitemsWrap] = useState(PostGridData.itemsWrap);
  var [itemWrap, setitemWrap] = useState(PostGridData.itemWrap);
  var [items, setitems] = useState(PostGridData.items);
  var [loopLayout, setloopLayout] = useState(PostGridData.loopLayout);
  var [masonryOptions, setmasonryOptions] = useState(PostGridData.masonryOptions);
  var [pagination, setpagination] = useState(PostGridData.pagination);
  var [postsData, setpostsData] = useState([]);
  const [loadingIconHtml, setloadingIconHtml] = useState("");
  const [loadMoreIconHtml, setloadMoreIconHtml] = useState("");
  const [previousIconHtml, setpreviousIconHtml] = useState("");
  const [nextIconHtml, setnextIconHtml] = useState("");
  useEffect(() => {
    var iconSrc = PostGridData.pagination?.loadingIcon?.iconSrc;
    var loadingIconHtml = `<span class="${iconSrc}"></span>`;
    setloadingIconHtml(loadingIconHtml);
    var iconSrc = PostGridData.pagination?.loadMoreIcon?.iconSrc;
    var loadMoreIconHtml = `<span class="${iconSrc}"></span>`;
    setloadMoreIconHtml(loadMoreIconHtml);
    var iconSrc = PostGridData.pagination?.previousIcon?.iconSrc;
    console.log(iconSrc);
    var previousIconHtml = `<span class="${iconSrc}"></span>`;
    setpreviousIconHtml(previousIconHtml);
    var iconSrc = PostGridData.pagination?.nextIcon?.iconSrc;
    var nextIconHtml = `<span class="${iconSrc}"></span>`;
    setnextIconHtml(nextIconHtml);
    setpagination(PostGridData.globalOptions.pagination);
  }, [PostGridData.globalOptions.pagination]);
  useEffect(() => {
    setpostData(props.postData);
  }, [props.postData]);
  useEffect(() => {
    setPostGridData(postData.post_content);
    //setitems(postData.post_content.items);
  }, [postData]);
  useEffect(() => {
    setglobalOptions(PostGridData.globalOptions);
    setwrapper(PostGridData.wrapper);
    setitemsWrap(PostGridData.itemsWrap);
    setitemWrap(PostGridData.itemWrap);
    setitems(PostGridData.items);
    setloopLayout(PostGridData.loopLayout);
    setmasonryOptions(PostGridData.masonryOptions);
    setTimeout(() => {
      loadMasonry();
    }, 2000);
  }, [PostGridData]);
  useEffect(() => {
    var postType = PostGridData?.itemQueryArgs.postType.value;
    if (postType.includes("product")) {
      postsData = _dummy_products__WEBPACK_IMPORTED_MODULE_3__.dummyProducts;
    } else {
      postsData = _dummy_posts__WEBPACK_IMPORTED_MODULE_2__.dummyPosts;
    }
    var count = parseInt(PostGridData?.itemQueryArgs?.postsPerPage?.value);
    var result = postsData.slice(0, count); // Returns the first 3 elements
    setpostsData(result);
  }, [PostGridData.itemQueryArgs]);
  function unescapeHTML(str) {
    const map = {
      "&amp;": "&",
      "&lt;": "<",
      "&gt;": ">",
      "&quot;": '"',
      "&#039;": "'"
    };
    return str.replace(/&amp;|&lt;|&gt;|&quot;|&#039;/g, function (match) {
      return map[match];
    });
  }
  var blockClass = "#post-grid-" + postData.ID;
  function loadMasonry() {
    // var elemX = document.querySelectorAll("." + blockId);
    var elemX = document.querySelector(blockClass + " > .items");
    console.log(elemX);
    if (elemX != null) {
      // elemX.forEach((arg) => {
      // imagesLoaded(elemX, function () {
      var msnry = new (masonry_layout__WEBPACK_IMPORTED_MODULE_0___default())(elemX, masonryOptions);
      // });
      // });
    }
  }
  useEffect(() => {
    setTimeout(() => {
      loadMasonry();
    }, 2000);
  }, [masonryOptions]);
  const Tree = ({
    loopLayout,
    itemData
  }) => {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
      children: loopLayout.map(node => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(TreeNode, {
        node: node,
        itemData: itemData
      }, node.id))
    });
  };
  const GenerateNodeHtml = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    var nodeId = node.id;
    var html = applyFilters("PostGridElementHtml" + nodeType, '', itemData, node);
    return html;
  };
  const TreeNode = ({
    node,
    itemData
  }) => {
    var nodeType = node.type;
    if (nodeType == "root" || nodeType == "container") {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        id: `element-${node.id}`,
        className: `${node.type}`,
        children: node.children && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: node.children.map(child => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(TreeNode, {
            node: child,
            itemData: itemData
          }, child?.id))
        })
      });
    } else {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(GenerateNodeHtml, {
        node: node,
        itemData: itemData
      });
    }
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
    className: "p-5",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      id: `post-grid-${id}`,
      className: `${wrapper?.options?.class} `,
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: `items ${itemsWrap?.options?.class} `,
        children: postsData?.map((item, loopIndex) => {
          var children = PostGridData.loopLayout[0]?.children ? PostGridData.loopLayout[0]?.children : [];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
            className: `${itemWrap?.options?.class} item`,
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_LoopItems__WEBPACK_IMPORTED_MODULE_1__["default"], {
              loopLayout: children,
              itemData: item
            })
          }, loopIndex);
        })
      }), PostGridData.globalOptions.itemSource == "posts" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
        class: "pagination ",
        children: [PostGridData.globalOptions?.pagination?.type == "next_previous" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
            className: "page-numbers prev",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              className: "",
              dangerouslySetInnerHTML: {
                __html: previousIconHtml
              }
            }), pagination?.previousText]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
            className: "page-numbers next",
            children: [pagination?.nextText, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              className: "",
              dangerouslySetInnerHTML: {
                __html: nextIconHtml
              }
            })]
          })]
        }), PostGridData.globalOptions?.pagination?.type == "loadmore" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
            className: "page-numbers",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              dangerouslySetInnerHTML: {
                __html: loadMoreIconHtml
              }
            }), pagination?.loadMoreText]
          })
        }), PostGridData.globalOptions?.pagination?.type == "infinite" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
          className: "page-numbers",
          children: [pagination.loadMoreText, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            dangerouslySetInnerHTML: {
              __html: loadingIconHtml
            }
          })]
        }), (PostGridData.globalOptions?.pagination?.type == 'normal' || PostGridData.globalOptions?.pagination?.type == 'ajax') && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "prev page-numbers",
            href: "#1",
            onClick: ev => {
              ev.preventDefault();
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
              class: "previous ",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
                className: "",
                dangerouslySetInnerHTML: {
                  __html: previousIconHtml
                }
              }), pagination?.previousText]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#1",
            onClick: ev => {
              ev.preventDefault();
            },
            children: "1"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            "aria-current": "page",
            class: "page-numbers current",
            children: "2"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#3",
            onClick: ev => {
              ev.preventDefault();
            },
            children: "3"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#4",
            onClick: ev => {
              ev.preventDefault();
            },
            children: "4"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            class: "page-numbers dots",
            children: "\u2026"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "page-numbers",
            href: "#6",
            children: "6"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
            class: "next page-numbers",
            href: "#3",
            onClick: ev => {
              ev.preventDefault();
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
              class: "next ",
              children: [pagination?.nextText, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
                className: "",
                dangerouslySetInnerHTML: {
                  __html: nextIconHtml
                }
              })]
            })
          })]
        })]
      })]
    })
  });
}
class PreviewMasonry 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 {
      postData,
      id
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
      postData: postData,
      id: id,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PreviewMasonry);

/***/ }),

/***/ "./src/components/BuilderWelcome/PricingTable.js":
/*!*******************************************************!*\
  !*** ./src/components/BuilderWelcome/PricingTable.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 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__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__);


const PricingTable = ({
  data
}) => {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("div", {
    className: "bg-white rounded-md",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("div", {
      className: "flex items-center justify-center gap-2 py-5",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
        className: "text-gray-700 line-through text-xl font-medium",
        children: data.price
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
        className: "text-gray-700 text-3xl font-bold",
        children: data.salePrice
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
      className: "bg-blue-700 py-4 text-center text-white text-xl font-bold",
      children: data.title
    }), data.features.map((item, i) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
      className: "py-4 text-center font-medium ",
      children: item
    })), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
      className: "flex  items-center justify-center p-4",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("a", {
        href: data.link,
        target: "_blank",
        className: "px-8 py-3 no-underline bg-blue-700 text-white cursor-pointer rounded-md",
        children: ["Buy Now ", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("i", {
          className: "fas fa-cart-plus"
        })]
      })
    })]
  });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PricingTable);

/***/ }),

/***/ "./src/components/BuilderWelcome/index.js":
/*!************************************************!*\
  !*** ./src/components/BuilderWelcome/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_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/columns.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/library/store.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/post-comments.js");
/* harmony import */ var _components_support_ticket__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../components/support-ticket */ "./src/components/support-ticket/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _pricingData__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./pricingData */ "./src/components/BuilderWelcome/pricingData.js");
/* harmony import */ var _PricingTable__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./PricingTable */ "./src/components/BuilderWelcome/PricingTable.js");
/* harmony import */ var _plugin_reviews__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./plugin-reviews */ "./src/components/BuilderWelcome/plugin-reviews.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;








var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var [postData, setpostData] = useState(props.postData);
  var addNotifications = props.addNotifications;
  var customerData = props.customerData;
  var appData = props.appData;
  const freeVsProArgs = [{
    feature: "View Type - Grid",
    free: true,
    pro: true
  }, {
    feature: "View Type - Slider",
    free: true,
    pro: true
  }, {
    feature: "View Type - Masonry",
    free: false,
    pro: true
  }, {
    feature: "View Type - Filterable",
    free: false,
    pro: true
  }, {
    feature: "Preloader - Hide Post Grid until page load",
    free: true,
    pro: true
  }, {
    feature: "Item Source",
    isHeading: true
  }, {
    feature: "Item Source - Posts",
    free: false,
    pro: true,
    new: true
  }, {
    feature: "Layout Editor",
    isHeading: true
  }, {
    feature: "Tree View",
    free: true,
    pro: true
  }, {
    feature: "Live Preview",
    free: true,
    pro: true
  }, {
    feature: "Advanced Style Component",
    free: true,
    pro: true
  }, {
    feature: "Copy-Paste Layout",
    free: true,
    pro: true
  }, {
    feature: "Duplicate Elements",
    free: true,
    pro: true
  }, {
    feature: "Remove All Elements",
    free: true,
    pro: true
  }, {
    feature: "Element - Post Title",
    free: true,
    pro: true
  }, {
    feature: "Element - Post Excerpt",
    free: true,
    pro: true
  }, {
    feature: "Element - Post Date",
    free: true,
    pro: true
  }, {
    feature: "Element - Post Author",
    free: true,
    pro: true
  }, {
    feature: "Element - Post Author Avatar",
    free: true,
    pro: true
  }, {
    feature: "Element - Post Categories",
    free: true,
    pro: true
  }, {
    feature: "Element - Post Tags",
    free: true,
    pro: true
  }, {
    feature: "Element - Read More",
    free: false,
    pro: true
  }, {
    feature: "Element - Post Thumbnail",
    free: true,
    pro: true
  }, {
    feature: "Element - Custom Text",
    free: false,
    pro: true
  }, {
    feature: "Element - Container",
    free: true,
    pro: true
  }, {
    feature: "Element - Product Price",
    free: false,
    pro: true
  }, {
    feature: "Element - Add To Cart Button",
    free: false,
    pro: true
  }, {
    feature: "Element - Product Sale Badge",
    free: false,
    pro: true
  }, {
    feature: "Element - Total Sales",
    free: false,
    pro: true
  }, {
    feature: "Element - Product SKU",
    free: false,
    pro: true
  }, {
    feature: "Element - Product Stock Quantity",
    free: false,
    pro: true
  }, {
    feature: "Element - Product In Stock",
    free: false,
    pro: true
  }, {
    feature: "Element - Product Ratings",
    free: false,
    pro: true
  }, {
    feature: "Element - Product",
    free: false,
    pro: true
  }];
  const ourPlugins = [];
  const copyData = data => {
    navigator.clipboard.writeText(data).then(() => {
      addNotifications({
        title: "Coupon Code Copied!",
        content: "Please use coupon code on checkout page.",
        type: "success"
      });
    }).catch(err => {});
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
    className: "ml-5",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
      className: "flex justify-between items-center p-5 pb-20 bg-white ",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
          className: "flex justify-between items-center gap-3",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
            className: "text-4xl font-extrabold",
            children: appData.name
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
            className: "text-base",
            children: "By PickPlugins"
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
          className: "my-3 flex items-center gap-3",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", {
            className: " ",
            href: appData.demoUrl,
            target: "_blank",
            children: "Live Demo"
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
        className: "",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
          className: "my-4 max-w-52",
          children: "Help us by providing your feedbacks and five star reviews on wordpress.org \uD83C\uDF1F\uD83C\uDF1F\uD83C\uDF1F\uD83C\uDF1F\uD83C\uDF1F"
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", {
          className: " bg-amber-500 text-white no-underline font-medium px-[16px] py-[8px]  hover:bg-amber-700 hover:text-white rounded-md w-max transition-colors duration-300",
          href: appData.reviewsUrl,
          target: "_blank",
          children: "Submit Reviews"
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_components_tabs__WEBPACK_IMPORTED_MODULE_2__["default"], {
      activeTab: "overview",
      orientation: "",
      tabsWrapperClass: "mt-[-50px] ",
      contentClass: " w-full",
      navItemsWrapClass: "gap-3 px-10",
      navItemClass: " px-5 py-3 gap-2 rounded-t-md",
      navItemSelectedClass: "!bg-white border-2  border-b-0 border-solid  border-blue-700",
      activeClass: "active-tab",
      onSelect: tabName => {},
      tabs: [{
        name: "overview",
        title: "Overview",
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"],
        className: "tab-disable-blocks"
      }, {
        name: "edit",
        title: "Free Vs Pro",
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"],
        className: "tab-disable-blocks"
      },
      // {
      // 	name: "templates",
      // 	title: "About Us",
      // 	icon: postAuthor,
      // 	className: "tab-disable-blocks",
      // },
      {
        name: "buyNow",
        title: "Buy Now",
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"],
        className: "tab-disable-blocks"
      }, {
        name: "supportTicket",
        title: "Send Feedbacks",
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__["default"],
        className: "tab-disable-blocks"
      }],
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_tab__WEBPACK_IMPORTED_MODULE_1__["default"], {
        name: "overview",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
          className: "flex gap-4 items-start flex-wrap mt-10 px-10",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
            className: "flex-1 flex flex-col gap-3 p-[40px] max-w-[70%] bg-white rounded-md shadow-md",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("h2", {
              className: "text-[32px] font-semibold text-gray-800",
              children: "Super Excited to See you!"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("p", {
              className: "text-gray-500 text-[14px]",
              children: "Thanks for installing Post Grid plugin! Watch this video to get started."
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("iframe", {
              width: "100%",
              height: "400",
              src: "https://www.youtube.com/embed/GMCnyCbc9Mc?si=j6ioIYBOT6DiWpjR",
              title: "YouTube video player",
              className: "rounded-md overflow-hidden",
              frameborder: "0",
              allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",
              referrerpolicy: "strict-origin-when-cross-origin",
              allowfullscreen: true
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
            className: "grid md:grid-cols-1 grid-cols-3 content-between md:max-w-[30%] max-w-full gap-3 text-gray-800",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
              className: "flex flex-col gap-3 bg-white p-[20px] rounded-md shadow-md",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
                className: "text-[18px] font-semibold flex items-center gap-2",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                  children: "\uD83C\uDF1F"
                }), "Videos"]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("p", {
                children: "Watch our videos to see how the Post Grid works in real-world projects!"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", {
                target: "_blank",
                href: "https://www.youtube.com/watch?v=GMCnyCbc9Mc&list=PL0QP7T2SN94Yut5Y0MSVg1wqmqWz0UYpt&index=2",
                className: "inline-block no-underline font-medium px-[16px] py-[8px] border border-solid border-gray-700 text-gray-700 hover:bg-gray-700 hover:text-white rounded-md w-max transition-colors duration-300",
                children: "Watch on YouTube"
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
              className: "flex flex-col gap-3 bg-white p-[20px] rounded-md shadow-md",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
                className: "text-[18px] font-semibold flex items-center gap-2",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                  children: "\uD83C\uDF1F"
                }), "Documentation"]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("p", {
                children: "Check out our detailed documentation to learn what the Post Grid plugin can do!"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", {
                target: "_blank",
                href: "#",
                className: "inline-block no-underline font-medium px-[16px] py-[8px] border border-solid border-gray-700 text-gray-700 hover:bg-gray-700 hover:text-white rounded-md w-max transition-colors duration-300",
                children: "Check Documentation"
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
              className: "flex flex-col gap-3 bg-white p-[20px] rounded-md shadow-md",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
                className: "text-[18px] font-semibold flex items-center gap-2",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                  children: "\uD83C\uDF1F"
                }), "Need Help?"]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("p", {
                children: "Contact our friendly support team for quick and personalized help!"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", {
                target: "_blank",
                href: "https://pickplugins.com/create-support-ticket/",
                className: "inline-block no-underline font-medium px-[16px] py-[8px] border border-solid border-gray-700 text-gray-700 hover:bg-gray-700 hover:text-white rounded-md w-max transition-colors duration-300",
                children: "Create Support Ticket"
              })]
            })]
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_tab__WEBPACK_IMPORTED_MODULE_1__["default"], {
        name: "edit",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
          className: " rounded-md   mt-10 px-10",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("table", {
            className: "table-auto w-full text-left",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("thead", {
              className: "bg-gray-700 text-white",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("tr", {
                className: "",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("th", {
                  className: "min-w-[550px] py-4 px-8",
                  children: "FEATURES"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("th", {
                  className: "min-w-[100px] py-4 px-8 text-center",
                  children: "Free"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("th", {
                  className: "min-w-[100px] py-4 px-8 text-center",
                  children: "\uD83D\uDC51PRO"
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("tbody", {
              className: "bg-gray-100 text-gray-800",
              children: freeVsProArgs.map((item, index) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.Fragment, {
                children: [item.isHeading && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("tr", {
                  className: "bg-gray-400 last:rounded-b-md last:overflow-hidden",
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("td", {
                    className: "py-3 px-8",
                    colSpan: "3",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
                      className: "flex gap-2 items-center ",
                      children: [item.feature && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                        className: "text-base",
                        children: item.feature
                      }), item.new && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                        className: "text-emerald-100 inline-block text-[12px] leading-none px-2 py-1 bg-emerald-500 rounded-full",
                        children: "NEW"
                      }), item.hot && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                        className: "text-red-100 inline-block text-[12px] leading-none px-2 py-1 bg-orange-400 rounded-full",
                        children: "HOT"
                      })]
                    })
                  })
                }, index), !item?.isHeading && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("tr", {
                  className: "even:bg-gray-200 last:rounded-b-md last:overflow-hidden",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("td", {
                    className: "py-3 px-8",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
                      className: "flex gap-2 items-center",
                      children: [item.feature && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                        children: item.feature
                      }), item.new && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                        className: "text-emerald-100 inline-block text-[12px] leading-none px-2 py-1 bg-emerald-500 rounded-full",
                        children: "NEW"
                      }), item.hot && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                        className: "text-red-100 inline-block text-[12px] leading-none px-2 py-1 bg-orange-400 rounded-full",
                        children: "HOT"
                      })]
                    })
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("td", {
                    className: "py-3 px-8  text-center",
                    children: [item.free && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                      children: "\u2714\uFE0F"
                    }), !item.free && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                      children: "\u274C"
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("td", {
                    className: "py-3 px-8 text-center",
                    children: [item.pro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                      children: "\u2714\uFE0F"
                    }), !item.pro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                      children: "\u274C"
                    })]
                  })]
                }, index)]
              }))
            })]
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_components_tab__WEBPACK_IMPORTED_MODULE_1__["default"], {
        name: "templates",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
          className: "grid grid-cols-2 gap-4 w-full p-7 bg-white mt-10",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
            className: "self-center",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("figure", {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("img", {
                src: "https://images.pexels.com/photos/1595385/pexels-photo-1595385.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1",
                alt: "",
                className: "w-full rounded-lg shadow-sm object-contain"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("figcaption", {
                className: "text-sm text-center mt-2",
                children: "Team"
              })]
            })
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("h3", {
            className: "text-2xl font-medium my-8",
            children: "Improve your website with our top-notch plugins!"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
            className: "grid grid-cols-3 gap-4",
            children: ourPlugins.map(plugin => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
              className: "bg-gray-200 hover:bg-gray-300 shadow-sm p-8 rounded-lg relative",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("h4", {
                className: "font-medium text-lg mb-4",
                children: plugin.name
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("p", {
                className: "text-[14px]",
                children: plugin.description
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", {
                target: "_blank",
                href: plugin.link,
                className: "absolute inset-0 "
              })]
            }))
          })]
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_tab__WEBPACK_IMPORTED_MODULE_1__["default"], {
        name: "supportTicket",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
          className: " mx-10 p-5 my-10 bg-white rounded-sm",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_support_ticket__WEBPACK_IMPORTED_MODULE_0__["default"], {})
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_components_tab__WEBPACK_IMPORTED_MODULE_1__["default"], {
        name: "buyNow",
        children: [customerData.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
          className: "mx-10 p-5 my-10  rounded-sm text-center bg-orange-200",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("h3", {
            className: "text-2xl ",
            children: "You already purchased, Want to Buy Again!"
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
          className: "flex items-center justify-between mx-10 p-5 my-10 bg-white rounded-sm",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("h3", {
              className: "text-2xl ",
              children: "Unlock Pro Features"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("p", {
              className: "text-base",
              children: "Get 25% off today by using our exclusive coupon code!"
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
              className: "p-2 px-4 border-2 border-blue-600 border-dashed cursor-pointer text-xl",
              onClick: () => {
                var str = `BUILDER25`;
                copyData(str);
              },
              children: "BUILDER25"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
              className: "text-center p-3",
              children: "Click To Copy"
            })]
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_components_tabs__WEBPACK_IMPORTED_MODULE_2__["default"], {
          activeTab: "yearly",
          orientation: "",
          tabsWrapperClass: "mt-[50px] ",
          contentClass: " w-full",
          navItemsWrapClass: "gap-3 px-10 justify-center",
          navItemClass: " px-5 py-3 gap-2 rounded-md",
          navItemSelectedClass: "!bg-white border-2  border-solid  border-blue-700",
          activeClass: "active-tab",
          onSelect: tabName => {},
          tabs: [{
            name: "yearly",
            title: "Yearly",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"],
            className: "tab-yearly"
          }, {
            name: "lifetime",
            title: "Lifetime",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"],
            className: "tab-lifetime"
          }
          // {
          // 	name: "freeTrail",
          // 	title: "Free Trail",
          // 	icon: columns,
          // 	className: "tab-yearly",
          // },
          ],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_tab__WEBPACK_IMPORTED_MODULE_1__["default"], {
            name: "yearly",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
              className: "grid grid-cols-3 gap-6 mt-10 px-10",
              children: _pricingData__WEBPACK_IMPORTED_MODULE_3__.pricingData.yearly.map((item, i) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_PricingTable__WEBPACK_IMPORTED_MODULE_4__["default"], {
                data: item
              }, i))
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_tab__WEBPACK_IMPORTED_MODULE_1__["default"], {
            name: "lifetime",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
              className: "grid grid-cols-3 gap-6 mt-10 px-10",
              children: _pricingData__WEBPACK_IMPORTED_MODULE_3__.pricingData.lifetime.map((item, i) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_PricingTable__WEBPACK_IMPORTED_MODULE_4__["default"], {
                data: item
              }, i))
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_tab__WEBPACK_IMPORTED_MODULE_1__["default"], {
            name: "freeTrail",
            children: "freeTrail"
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
          className: "flex items-center justify-between mx-10 p-5 my-10 bg-white rounded-sm",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("h3", {
              className: "text-2xl ",
              children: "Enjoy a 14-Day Money-Back Guarantee\u2014No Questions Asked!"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("p", {
              className: "text-base",
              children: "We are committed to ensuring 100% satisfaction with our plugin and support. If, for any reason, our plugin doesn't meet your expectations, simply let us know. We'll provide a full refund within 14 days of your purchase\u2014no questions asked. Learn more in our refund policy."
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
              className: "p-2 px-4 ",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("svg", {
                width: "212",
                height: "28",
                viewBox: "0 0 212 28",
                fill: "none",
                xmlns: "http://www.w3.org/2000/svg",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M42.5847 13.8542H48.8882C48.4685 12.2528 47.3185 11.6035 45.9179 11.6035C44.3778 11.6035 43.1437 12.4429 42.5847 13.8542M52.5864 16.5927H42.3611C42.7808 18.6553 44.517 19.4153 46.0296 19.4153C47.9346 19.4153 48.749 18.2756 48.749 18.2756H52.2783C51.213 20.9877 48.6646 22.4787 45.9179 22.4787C42.1353 22.4787 38.8297 19.6848 38.8297 15.4551C38.8297 11.25 42.1078 8.646 45.8059 8.646C49.3924 8.646 53.0358 11.0598 52.5864 16.5927",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M87.3226 15.5633C87.3226 13.4474 86.0337 11.7932 83.905 11.7932C81.7745 11.7932 80.346 13.4474 80.346 15.5633C80.346 17.6792 81.7745 19.3333 83.905 19.3333C86.0337 19.3333 87.3226 17.6792 87.3226 15.5633M76.6754 15.5896C76.6754 11.25 80.1499 8.646 83.905 8.646C87.6876 8.646 90.9932 11.2764 90.9932 15.5345C90.9932 19.848 87.5735 22.4784 83.7912 22.4784C79.9811 22.4784 76.6754 19.848 76.6754 15.5896",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M105.991 14.9937V22.3439H102.263V15.8064C102.263 15.3449 102.601 11.9279 99.9113 11.7935C98.5927 11.7117 96.2403 12.416 96.2403 15.9699V22.3439H92.5425V8.78076H95.9372L95.9482 10.6636C95.9482 10.6636 97.4788 8.646 100.333 8.646C103.947 8.646 105.991 11.25 105.991 14.9937",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M119.618 11.5216C118.441 11.5216 117.936 12.0914 117.936 12.6613C117.936 13.5824 119.198 13.854 120.038 14.0175C122.533 14.5319 125.054 15.2653 125.054 18.1385C125.054 20.9326 122.673 22.4787 119.787 22.4787C116.565 22.4787 114.072 20.5814 113.903 17.7058H117.348C117.432 18.5185 117.993 19.5764 119.702 19.5764C121.13 19.5764 121.468 18.8455 121.468 18.2756C121.468 17.2707 120.487 16.9724 119.533 16.7559C117.882 16.4026 114.323 15.7534 114.323 12.6613C114.323 10.0022 116.958 8.646 119.675 8.646C122.812 8.646 124.885 10.4903 125.054 12.7694H121.607C121.495 12.3079 121.048 11.5216 119.618 11.5216",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M136.381 15.5633C136.381 13.3106 135.12 11.9831 133.299 11.9831C131.59 11.9831 129.879 13.1758 129.879 15.5633C129.879 17.9487 131.59 19.1435 133.299 19.1435C135.12 19.1435 136.381 17.814 136.381 15.5633V15.5633ZM139.883 8.78076V27.7681H136.381V21.0141C135.485 21.9903 134.223 22.4784 132.765 22.4784C129.209 22.4784 126.238 19.6582 126.238 15.5632C126.238 11.4662 129.209 8.646 132.765 8.646C135.561 8.646 136.608 10.4625 136.608 10.4625L136.603 8.78076H139.883Z",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M159.905 13.8542H166.208C165.788 12.2528 164.638 11.6035 163.238 11.6035C161.698 11.6035 160.464 12.4429 159.905 13.8542M169.906 16.5927H159.679C160.101 18.6553 161.837 19.4153 163.349 19.4153C165.254 19.4153 166.069 18.2756 166.069 18.2756H169.598C168.533 20.9877 165.984 22.4787 163.238 22.4787C159.455 22.4787 156.15 19.6848 156.15 15.4551C156.15 11.25 159.428 8.646 163.126 8.646C166.712 8.646 170.356 11.0598 169.906 16.5927",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M174.791 13.8542H181.094C180.674 12.2528 179.524 11.6035 178.124 11.6035C176.584 11.6035 175.35 12.4429 174.791 13.8542M184.792 16.5927H174.567C174.987 18.6553 176.723 19.4153 178.235 19.4153C180.141 19.4153 180.955 18.2756 180.955 18.2756H184.484C183.419 20.9877 180.87 22.4787 178.124 22.4787C174.341 22.4787 171.036 19.6848 171.036 15.4551C171.036 11.25 174.314 8.646 178.012 8.646C181.598 8.646 185.242 11.0598 184.792 16.5927",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M197.267 19.3069V22.3436H185.36V20.5527L192.113 11.8198H185.641V8.78076H196.988V10.5717L190.235 19.3069H197.267Z",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M211.845 8.78076V20.7161V20.9877C211.845 24.6497 209.91 27.9053 205.119 27.9053C200.636 27.9053 198.2 25.056 198.2 22.9138H201.702C201.702 22.9138 202.233 24.7314 205.007 24.7314C207.362 24.7314 208.343 23.4282 208.343 21.5309V20.9611C207.724 21.6393 206.55 22.4787 204.448 22.4787C200.778 22.4787 198.48 19.9034 198.48 16.1331L198.451 8.78076H202.094V15.3183C202.094 17.1623 202.767 19.3336 205.092 19.3336C206.296 19.3336 208.286 18.7637 208.286 15.1548V8.78076H211.845Z",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M36.1626 18.2723C36.1626 19.1181 36.4958 19.467 37.1141 19.467C37.5497 19.467 37.8327 19.4164 38.2454 19.2926L38.4761 22.0799C37.7048 22.3272 36.959 22.4774 36.0075 22.4774C33.8244 22.4774 32.4874 21.7817 32.4874 18.7693V3.35645H36.1626V18.2723Z",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M75.0944 14.9937V22.3439H71.3665V15.8064C71.3665 13.9357 71.563 11.5749 68.9848 11.7935C68.3142 11.8465 66.4639 12.1444 66.4639 15.9699V22.3439H62.7658V15.8064C62.7658 13.9357 62.9619 11.5749 60.3841 11.7935C59.711 11.8465 57.8632 12.1444 57.8632 15.9699V22.3439H54.165V8.78075H57.56L57.5631 10.6636C57.5631 10.6636 58.8605 8.64599 61.2805 8.64599C64.1966 8.64599 65.3412 10.8424 65.3412 10.8424C65.3412 10.8424 66.5967 8.61963 69.7992 8.61963C73.4405 8.61963 75.0944 11.2236 75.0944 14.9937",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M141.455 16.131V8.78076H145.183V15.3183C145.183 15.7797 144.845 19.1967 147.535 19.3312C148.853 19.413 151.205 18.7086 151.205 15.1548V8.78076H154.904V22.3439H151.513L151.498 20.4611C151.498 20.4611 149.967 22.4787 147.113 22.4787C143.499 22.4787 141.455 19.8747 141.455 16.131",
                  fill: "#121217"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M6.92836 17.1856L14.4397 20.6583C15.3706 21.0889 16.0278 21.8116 16.3827 22.6406C17.2803 24.7399 16.0535 26.8869 14.1276 27.6591C12.2015 28.4309 10.1486 27.9342 9.21523 25.7511L5.94631 18.0866C5.693 17.4925 6.32934 16.9087 6.92836 17.1856",
                  fill: "#FFC233"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M7.37953 14.9376L15.1332 12.0066C17.71 11.0325 20.525 12.8756 20.487 15.5536C20.4864 15.5886 20.4858 15.6235 20.4849 15.6588C20.4292 18.2666 17.6926 20.0194 15.1723 19.0968L7.38688 16.2473C6.76583 16.0201 6.76124 15.1713 7.37953 14.9376",
                  fill: "#FFC233"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M6.9449 13.9224L14.567 10.6837C17.0998 9.60736 17.7426 6.37695 15.7589 4.51043C15.7329 4.48585 15.7069 4.46156 15.6806 4.43728C13.7357 2.63207 10.5207 3.26767 9.41349 5.64539L5.99314 12.9915C5.72024 13.5773 6.33701 14.1806 6.9449 13.9224",
                  fill: "#FFC233"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("path", {
                  "fill-rule": "evenodd",
                  "clip-rule": "evenodd",
                  d: "M4.98349 12.6426L7.75465 5.04415C8.09822 4.102 8.03458 3.1412 7.67939 2.3122C6.77994 0.21378 4.34409 -0.463579 2.41853 0.309741C0.493284 1.08336 -0.594621 2.84029 0.340622 5.02253L3.63095 12.6787C3.8861 13.272 4.76261 13.2486 4.98349 12.6426",
                  fill: "#FFC233"
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
              className: "text-center p-3",
              children: ["Secure Payment by", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                className: "font-bold",
                children: "Lemon Squeezy"
              })]
            })]
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
          className: "grid grid-cols-3 gap-5 mx-10",
          children: _plugin_reviews__WEBPACK_IMPORTED_MODULE_5__.pluginReviews.map((item, i) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
            className: " flex flex-col text-center",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("p", {
              className: "bg-white shadow-lg rounded-lg p-6 text-left text-gray-600",
              children: item.comment
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
              className: "flex items-center gap-6",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("img", {
                src: item.profileImage,
                alt: `${name}'s profile`,
                className: "w-12 h-12 rounded-full border border-gray-300"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", {
                  href: item.profileLink,
                  target: "_blank",
                  rel: "noopener noreferrer",
                  className: "flex flex-col",
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("p", {
                    className: "font-bold text-gray-700 text-xl my-2 mb-1",
                    children: item.name
                  })
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
                  className: "flex items-center text-2xl",
                  children: [...Array(item.stars)].map((_, i) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                    className: "text-yellow-500",
                    children: "\u2605"
                  }, i))
                })]
              })]
            })]
          }, i))
        })]
      })]
    })]
  });
}
class BuilderWelcome 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 {
      postData,
      appData,
      addNotifications,
      customerData
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(Html, {
      postData: postData,
      addNotifications: addNotifications,
      customerData: customerData,
      appData: appData,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BuilderWelcome);

/***/ }),

/***/ "./src/components/BuilderWelcome/plugin-reviews.js":
/*!*********************************************************!*\
  !*** ./src/components/BuilderWelcome/plugin-reviews.js ***!
  \*********************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   pluginReviews: () => (/* binding */ pluginReviews)
/* harmony export */ });
const pluginReviews = [{
  title: "This Plugin Is Excellent for making Posts display by category on a page",
  comment: "This is the best way I know of to make Posts display by category on different pages. Frequently posts have different categories and people want to display the posts of a particular category on one page. This is how to do it. This really should be built into WordPress.",
  name: "Ianerickson",
  profileLink: "https://wordpress.org/support/users/ianerickson/",
  profileImage: "https://secure.gravatar.com/avatar/6d8ed1beb4bba5167a922105d5d43903da5add1cf44e4434c4f6402ea6eb9c18?s=100&d=retro&r=g",
  link: "https://wordpress.org/support/topic/this-plugin-is-excellent-for-making-posts-display-by-category-on-a-page/",
  stars: 5
}, {
  title: "The best support – EVER",
  comment: "WordPress was reporting an occasional fatal error in the Post Grid plugin.I reported on the support forum and got very quick replies resulting in a custom build to replace the plugin, fixing the issue.Really very impressed, I couldn’t ask for more.Thank you PickPlugins",
  name: "Jomega",
  profileLink: "https://wordpress.org/support/users/jomega/",
  profileImage: "https://secure.gravatar.com/avatar/3f01420af9932315e202f971a324a38b345869a0ccb625ffa6fc75520c3a6559?s=100&d=retro&r=g",
  link: "https://wordpress.org/support/topic/the-best-support-ever-33/",
  stars: 5
}, {
  title: "Really useful plugin",
  comment: "Easy to configure and just works really well.Kudos & thanks to the Developers.I used it with the Divi theme without a problem.",
  name: "Positivit",
  profileLink: "https://wordpress.org/support/users/positivit/",
  profileImage: "https://secure.gravatar.com/avatar/e696d623a0f9574d89a7bf2b49c4c9ff7a51ad3c8823d294762baac2d312ad13?s=100&d=retro&r=g",
  link: "https://wordpress.org/support/topic/really-useful-plugin-108/",
  stars: 5
}, {
  title: "nice plugin",
  comment: "Easy to configure and just works really well.Kudos & thanks to the Developers.I used it with the Divi theme without a problem.",
  name: "Reichsolutions",
  profileLink: "https://wordpress.org/support/users/reichsolutions/",
  profileImage: "https://secure.gravatar.com/avatar/5497b38211f39e99b662a7561f67e68a70a2adb2f566db88dbe3b817c6f7ad13?s=100&d=retro&r=g",
  link: "https://wordpress.org/support/topic/nice-plugin-3821/",
  stars: 5
}, {
  title: "Fantastic plugin",
  comment: "Seriously impressed with how flexible this is",
  name: "Perryrylance",
  profileLink: "https://wordpress.org/support/users/perryrylance/",
  profileImage: "https://secure.gravatar.com/avatar/69e635ca5fd9e764e767cce444200d3b982a905cae72edd18295968720affd4c?s=100&d=retro&r=g",
  link: "https://wordpress.org/support/topic/fantastic-plugin-1542/",
  stars: 5
}, {
  title: "Great plugin! gets the job done",
  comment: "Great plugin! gets the job done",
  name: "Spuri123",
  profileLink: "https://wordpress.org/support/users/spuri123/",
  profileImage: "https://secure.gravatar.com/avatar/6877dcf974aa48436675923570cfc4384083788062e39733df81031f539cf1ad?s=100&d=retro&r=g",
  link: "https://wordpress.org/support/topic/great-plugin-gets-the-job-done-7/",
  stars: 5
}, {
  title: "Love this plugin",
  comment: "This plugin does exactly what it says it does—it helps you to create an attractive grid of posts that can be filtered by categories, taxonomies, post types, and more. I had a problem because I recently switched recipe plugins on my site and I either had to pay an annual fee to convert the old ones to the new plugin or find a way to put the recipes from the two different plugins on a single page. Post Grid helped me accomplish that. The process was easy and fast. In fact, after I got going and saw how easy it was to create the grids, I made different grids for all the subcategories.",
  name: "Islandwriter",
  profileLink: "https://wordpress.org/support/users/islandwriter/",
  profileImage: "https://secure.gravatar.com/avatar/0390dc0739e75bff157acb1dc87ae000a85f23158c0ae916a51605d7f9b91a1e?s=100&d=retro&r=g",
  link: "https://wordpress.org/support/topic/love-this-plugin-980/",
  stars: 5
}];

/***/ }),

/***/ "./src/components/BuilderWelcome/pricingData.js":
/*!******************************************************!*\
  !*** ./src/components/BuilderWelcome/pricingData.js ***!
  \******************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   pricingData: () => (/* binding */ pricingData)
/* harmony export */ });
const pricingData = {
  yearly: [{
    title: "Personal",
    features: ["Up to 3 Sites", "1 Year of Updates", "1 Year Free Support", "Access to All PRO Features"],
    price: "$29",
    salePrice: "$19",
    link: "https://pickplugins.lemonsqueezy.com/buy/78b79f17-1fc4-4e07-9138-1036ee56e269?enabled=248236&checkout%5Bcustom%5D%5Bproduct_id%5D=3815"
  }, {
    title: "Plus",
    features: ["Up to 10 Sites", "1 Year of Updates", "1 Year Free Support", "Access to All PRO Features"],
    price: "$75",
    salePrice: "$49",
    link: "https://pickplugins.lemonsqueezy.com/buy/e08a8f55-1a83-46e0-bacb-32cbae536181?enabled=248244&checkout%5Bcustom%5D%5Bproduct_id%5D=93971"
  }, {
    title: "Agency",
    features: ["Up to 500 Sites", "1 Year of Updates", "1 Year Free Support", "Access to All PRO Features"],
    price: "$149",
    salePrice: "$99",
    link: "https://pickplugins.lemonsqueezy.com/buy/5c3cdb62-3095-4c15-96e0-00a8776ca58a?enabled=248245&checkout%5Bcustom%5D%5Bproduct_id%5D=93970"
  }],
  lifetime: [{
    title: "Personal",
    features: ["Up to 3 Sites", "Lifetime Free Updates", "Lifetime Support", "Access to All PRO Features"],
    price: "$99",
    salePrice: "$49",
    link: "https://pickplugins.lemonsqueezy.com/buy/b6c0aa0f-4793-4ac8-a27a-51c00a9b14cf?enabled=248286&checkout%5Bcustom%5D%5Bproduct_id%5D=37943"
  }, {
    title: "Plus",
    features: ["Up to 10 Sites", "Lifetime Free Updates", "Lifetime Support", "Access to All PRO Features"],
    price: "$149",
    salePrice: "$99",
    link: "https://pickplugins.lemonsqueezy.com/buy/54e20160-98ae-4cf6-bd7e-6910c1b8e716?enabled=248291&checkout%5Bcustom%5D%5Bproduct_id%5D=3817"
  }, {
    title: "Agency",
    features: ["Up to 500 Sites", "Lifetime Free Updates", "Lifetime Support", "Access to All PRO Features"],
    price: "$199",
    salePrice: "$149",
    link: "https://pickplugins.lemonsqueezy.com/buy/d0041fa6-9c9b-4843-99af-9c213a36c0a6?enabled=248246&checkout%5Bcustom%5D%5Bproduct_id%5D=37944"
  }]
};

/***/ }),

/***/ "./src/components/Builder/default-data-carousel.js":
/*!*********************************************************!*\
  !*** ./src/components/Builder/default-data-carousel.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 SliderDefaultData = {
  globalOptions: {
    viewType: "viewSlider",
    itemSource: "posts",
    search: true
  },
  itemQueryArgs: {
    "postType": {
      "id": "postType",
      "value": ["post"]
    },
    "order": {
      "id": "order",
      "value": "DESC"
    },
    "orderby": {
      "id": "orderby",
      "value": ["date"]
    },
    "postStatus": {
      "id": "postStatus",
      "value": ["publish"]
    },
    "postsPerPage": {
      "id": "postsPerPage",
      "value": "5"
    }
  },
  items: [],
  loopLayout: [{
    "id": 1,
    "type": "root",
    "children": [{
      "id": 2,
      "type": "layer",
      "children": [{
        "id": 5,
        "type": "postThumbnail",
        "content": "",
        "parent_id": 2,
        "options": {
          "thumbnailSize": "full",
          "srcId": "",
          "srcUrl": "",
          "defaultSrcUrl": "https://comboblocks.com/server/wp-content/uploads/2024/11/da41bd7c-7420-3c0a-b169-d2d87acba187.jpg",
          "linkTo": "postUrl"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Featured Image Wrapper",
            "styles": {}
          },
          "img": {
            "handle": "img",
            "label": "Image",
            "styles": {
              "width": {
                "Desktop": "100%"
              }
            }
          },
          "a": {
            "handle": "a",
            "label": "Link",
            "styles": {}
          }
        },
        "chosen": false,
        "selected": false
      }, {
        "id": 3,
        "type": "postTitle",
        "content": "Dummy Title",
        "parent_id": 2,
        "options": {
          "linkTo": "postUrl",
          "target": "_blank"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Post Title Wrapper",
            "styles": {
              "fontSize": {
                "Desktop": "16px"
              }
            }
          },
          "a": {
            "handle": "a",
            "label": "Post Title Link",
            "styles": {}
          }
        },
        "chosen": false,
        "selected": false
      }, {
        "id": 4,
        "type": "postExcerpt",
        "parent_id": 2,
        "options": {
          "limitBy": "",
          "limitCount": 20,
          "readMoreText": "Read More"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Excerpt Wrapper",
            "styles": {}
          },
          "excerpt-text": {
            "handle": ".excerpt-text",
            "label": "Excerpt Text",
            "styles": {
              "fontSize": {
                "Desktop": "16px"
              }
            }
          },
          "redmore": {
            "handle": ".redmore",
            "label": "Redmore Text",
            "styles": {
              "fontSize": {
                "Desktop": "18px"
              }
            }
          }
        },
        "chosen": false,
        "selected": false
      }],
      "parent_id": 1,
      "styles": {},
      "options": {
        "animateOn": ""
      },
      "chosen": false,
      "selected": false
    }],
    "parent_id": null,
    "styles": {},
    "chosen": false,
    "selected": false
  }],
  wrapper: {
    options: {
      content: "",
      tag: "div",
      class: "post-grid-wrapper"
    },
    styles: {}
  },
  itemsWrap: {
    options: {
      class: "items"
    },
    styles: {}
  },
  itemWrap: {
    options: {
      class: "item"
    },
    styles: {}
  },
  navsWrap: {
    options: {
      class: "nav-wrap"
    },
    styles: {
      "display": {
        "Desktop": "flex"
      },
      "width": {
        "Desktop": "100%"
      },
      "alignItems": {
        "Desktop": "center"
      },
      "position": {
        "Desktop": "absolute !important"
      },
      "top": {
        "Desktop": "-50px"
      },
      "left": {
        "Desktop": "20px"
      },
      "gap": {
        "Desktop": "20px"
      },
      "justifyContent": {
        "Desktop": "right"
      }
    }
  },
  navItem: {
    options: {
      class: "nav-item"
    },
    styles: {
      "fontSize": {
        "Desktop": "18px"
      },
      "fontStyle": {
        "Desktop": "normal"
      },
      "fontWeight": {
        "Desktop": "400"
      },
      "textAlign": {
        "Desktop": "left"
      },
      "color": {
        "Desktop": "#ffffff"
      },
      "backgroundColor": {
        "Desktop": "#1F2E45"
      },
      "borderRadius": {
        "Desktop": "50px"
      },
      "padding": {
        "Desktop": "5px 20px 5px 20px"
      }
    }
  },
  prev: {
    options: {
      text: "Prev",
      class: ""
    },
    styles: {}
  },
  prevIcon: {
    options: {
      position: "before",
      class: "",
      library: "fontAwesome",
      srcType: "class",
      iconSrc: "fas fa-chevron-left"
    },
    styles: {}
  },
  next: {
    options: {
      text: "Next",
      class: ""
    },
    styles: {}
  },
  nextIcon: {
    options: {
      position: "after",
      class: "",
      library: "fontAwesome",
      srcType: "class",
      iconSrc: "fas fa-chevron-right"
    },
    styles: {}
  },
  paginationWrap: {
    options: {
      type: "",
      tag: "",
      class: ""
    },
    styles: {
      "display": {
        "Desktop": "flex"
      },
      "justifyContent": {
        "Desktop": "center"
      },
      "paddingTop": {
        "Desktop": "30px"
      }
    }
  },
  paginationItem: {
    options: {
      tag: "",
      class: ""
    },
    styles: {
      "backgroundColor": {
        "Desktop": "#f1f7f9"
      },
      "width": {
        "Desktop": "15px"
      },
      "height": {
        "Desktop": "15px"
      },
      "margin": {
        "Desktop": "0px 10px 0px 0px"
      },
      "borderRadius": {
        "Desktop": " 20px 20px 20px 20px"
      },
      "border": {
        "Desktop": "1px solid #1f2937"
      }
    }
  },
  paginationItemActive: {
    options: {
      class: ""
    },
    styles: {
      "backgroundColor": {
        "Desktop": "#1f2e45"
      }
    }
  },
  sliderOptions: {
    perPage: "3",
    perMove: "1",
    autoplay: "1",
    gap: "1em",
    pagination: "1",
    drag: "1",
    arrows: "1",
    pauseOnHover: "1",
    speed: "400"
  },
  sliderOptionsRes: {}
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SliderDefaultData);

/***/ }),

/***/ "./src/components/Builder/default-data-fliterable.js":
/*!***********************************************************!*\
  !*** ./src/components/Builder/default-data-fliterable.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 FilterableDefaultData = {
  globalOptions: {
    viewType: "viewFilterable",
    itemSource: "posts",
    search: true,
    allText: "All",
    logicWithinGroup: "",
    logicBetweenGroups: "",
    multifilter: false,
    showSort: "",
    filterToggle: "no",
    showRandom: "",
    showAll: "yes",
    showClear: "",
    activeFilter: "",
    perPage: 6,
    filters: [],
    pagination: {
      type: 'filterable',
      nextText: "Next",
      previousText: "Previous",
      loadMoreText: "Load More",
      loadingText: "Loading...",
      noPostText: "No More Posts",
      "nextIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      },
      "previousIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      },
      "loadingIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      },
      "loadMoreIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      }
    }
  },
  itemQueryArgs: {
    "postType": {
      "id": "postType",
      "value": ["post"]
    },
    "order": {
      "id": "order",
      "value": "DESC"
    },
    "orderby": {
      "id": "orderby",
      "value": ["date"]
    },
    "postStatus": {
      "id": "postStatus",
      "value": ["publish"]
    },
    "postsPerPage": {
      "id": "postsPerPage",
      "value": "-1"
    }
  },
  items: [],
  loopLayout: [{
    "id": 1,
    "type": "root",
    "children": [{
      "id": 2,
      "type": "layer",
      "children": [{
        "id": 5,
        "type": "postThumbnail",
        "content": "",
        "parent_id": 2,
        "options": {
          "thumbnailSize": "full",
          "srcId": "",
          "srcUrl": "",
          "defaultSrcUrl": "https://comboblocks.com/server/wp-content/uploads/2024/11/da41bd7c-7420-3c0a-b169-d2d87acba187.jpg",
          "linkTo": "postUrl"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Featured Image Wrapper",
            "styles": {}
          },
          "img": {
            "handle": "img",
            "label": "Image",
            "styles": {
              "width": {
                "Desktop": "100%"
              }
            }
          },
          "a": {
            "handle": "a",
            "label": "Link",
            "styles": {}
          }
        },
        "chosen": false,
        "selected": false
      }, {
        "id": 3,
        "type": "postTitle",
        "content": "Dummy Title",
        "parent_id": 2,
        "options": {
          "linkTo": "postUrl",
          "target": "_blank"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Post Title Wrapper",
            "styles": {
              "fontSize": {
                "Desktop": "16px"
              }
            }
          },
          "a": {
            "handle": "a",
            "label": "Post Title Link",
            "styles": {}
          }
        },
        "chosen": false,
        "selected": false
      }, {
        "id": 4,
        "type": "postExcerpt",
        "parent_id": 2,
        "options": {
          "limitBy": "",
          "limitCount": 20,
          "readMoreText": "Read More"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Excerpt Wrapper",
            "styles": {}
          },
          "excerpt-text": {
            "handle": ".excerpt-text",
            "label": "Excerpt Text",
            "styles": {
              "fontSize": {
                "Desktop": "16px"
              }
            }
          },
          "redmore": {
            "handle": ".redmore",
            "label": "Redmore Text",
            "styles": {
              "fontSize": {
                "Desktop": "18px"
              }
            }
          }
        },
        "chosen": false,
        "selected": false
      }],
      "parent_id": 1,
      "styles": {},
      "options": {
        "animateOn": ""
      },
      "chosen": false,
      "selected": false
    }],
    "parent_id": null,
    "styles": {},
    "chosen": false,
    "selected": false
  }],
  wrapper: {
    options: {
      content: "",
      tag: "div",
      class: "post-grid-wrapper"
    },
    styles: {}
  },
  itemsWrap: {
    "options": {
      "class": "items"
    },
    "styles": {
      "display": {
        "Desktop": "grid"
      },
      "gap": {
        "Desktop": "1em"
      },
      "gridTemplateColumns": {
        "Desktop": "1fr 1fr 1fr"
      }
    }
  },
  itemWrap: {
    options: {
      class: "item"
    },
    styles: {}
  },
  filterItem: {
    "styles": {
      "backgroundColor": {
        "Desktop": "#6923F7"
      },
      "padding": {
        "Desktop": "5px 15px 5px 15px"
      },
      "borderRadius": {
        "Desktop": "3px 3px 3px 3px"
      },
      "color": {
        "Desktop": "#ffffff"
      },
      "fontSize": {
        "Desktop": "16px"
      },
      "textDecoration": {
        "Desktop": "none #000000 wavy 1px !important"
      }
    }
  },
  activeFilter: {
    "options": {
      "slug": "all"
    },
    "styles": {
      "backgroundColor": {
        "Desktop": "#6923F7"
      }
    }
  },
  filterGroupWrap: {
    "options": [],
    "styles": {
      "display": {
        "Desktop": "flex"
      },
      "gap": {
        "Desktop": "1em"
      },
      "justifyContent": {
        "Desktop": "center"
      },
      "margin": {
        "Desktop": "50px 0px 0px 0px"
      },
      "alignItems": {
        "Desktop": "center"
      },
      "marginBottom": {
        "Desktop": "30px"
      }
    }
  },
  filterGroup: {
    "options": [],
    "styles": {
      "display": {
        "Desktop": "flex"
      },
      "gap": {
        "Desktop": "1em"
      },
      "justifyContent": {
        "Desktop": "center"
      },
      "alignItems": {
        "Desktop": "center"
      }
    }
  },
  filterGroupTitle: {
    options: {},
    styles: {}
  },
  paginationWrap: {
    "options": {
      "tag": "ul",
      "class": ""
    },
    "styles": {
      "display": {
        "Desktop": "flex"
      },
      "gap": {
        "Desktop": "1em"
      },
      "justifyContent": {
        "Desktop": "center"
      },
      "margin": {
        "Desktop": "50px 0px 0px 0px"
      }
    }
  },
  paginationItem: {
    "options": {
      "tag": "span",
      "class": ""
    },
    "styles": {
      "backgroundColor": {
        "Desktop": "#6923F7"
      },
      "padding": {
        "Desktop": "5px 15px 5px 15px"
      },
      "borderRadius": {
        "Desktop": "3px 3px 3px 3px"
      },
      "color": {
        "Desktop": "#ffffff"
      },
      "fontSize": {
        "Desktop": "16px"
      },
      "textDecoration": {
        "Desktop": "none #000000 wavy 1px !important"
      }
    }
  },
  paginationItemActive: {
    "options": {
      "class": ""
    },
    "styles": {
      "backgroundColor": {
        "Desktop": "#0d5a55"
      }
    }
  }
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FilterableDefaultData);

/***/ }),

/***/ "./src/components/Builder/default-data-grid.js":
/*!*****************************************************!*\
  !*** ./src/components/Builder/default-data-grid.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 GridDefaultData = {
  globalOptions: {
    viewType: "viewGrid",
    itemSource: "posts",
    search: true,
    pagination: {
      type: 'normal',
      nextText: "Next",
      previousText: "Previous",
      loadMoreText: "Load More",
      loadingText: "Loading...",
      noPostText: "No More Posts",
      "nextIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      },
      "previousIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      },
      "loadingIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      },
      "loadMoreIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      }
    }
  },
  reponsiveCss: "",
  itemQueryArgs: {
    "postType": {
      "id": "postType",
      "value": ["post"]
    },
    "order": {
      "id": "order",
      "value": "DESC"
    },
    "orderby": {
      "id": "orderby",
      "value": ["date"]
    },
    "postStatus": {
      "id": "postStatus",
      "value": ["publish"]
    },
    "postsPerPage": {
      "id": "postsPerPage",
      "value": "5"
    }
  },
  items: [],
  nthItemStyle: [],
  loopLayout: [{
    "id": 1,
    "type": "root",
    "children": [{
      "id": 2,
      "type": "layer",
      "children": [{
        "id": 5,
        "type": "postThumbnail",
        "content": "",
        "parent_id": 2,
        "options": {
          "thumbnailSize": "full",
          "srcId": "",
          "srcUrl": "",
          "defaultSrcUrl": "https://comboblocks.com/server/wp-content/uploads/2024/11/da41bd7c-7420-3c0a-b169-d2d87acba187.jpg",
          "linkTo": "postUrl"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Featured Image Wrapper",
            "styles": {}
          },
          "img": {
            "handle": "img",
            "label": "Image",
            "styles": {
              "width": {
                "Desktop": "100%"
              }
            }
          },
          "a": {
            "handle": "a",
            "label": "Link",
            "styles": {}
          }
        },
        "chosen": false,
        "selected": false
      }, {
        "id": 3,
        "type": "postTitle",
        "content": "Dummy Title",
        "parent_id": 2,
        "options": {
          "linkTo": "postUrl",
          "target": "_blank"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Post Title Wrapper",
            "styles": {
              "fontSize": {
                "Desktop": "16px"
              }
            }
          },
          "a": {
            "handle": "a",
            "label": "Post Title Link",
            "styles": {}
          }
        },
        "chosen": false,
        "selected": false
      }, {
        "id": 4,
        "type": "postExcerpt",
        "parent_id": 2,
        "options": {
          "limitBy": "",
          "limitCount": 20,
          "readMoreText": "Read More"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Excerpt Wrapper",
            "styles": {}
          },
          "excerpt-text": {
            "handle": ".excerpt-text",
            "label": "Excerpt Text",
            "styles": {
              "fontSize": {
                "Desktop": "16px"
              }
            }
          },
          "redmore": {
            "handle": ".redmore",
            "label": "Redmore Text",
            "styles": {
              "fontSize": {
                "Desktop": "18px"
              }
            }
          }
        },
        "chosen": false,
        "selected": false
      }],
      "parent_id": 1,
      "styles": {},
      "options": {
        "animateOn": ""
      },
      "chosen": false,
      "selected": false
    }],
    "parent_id": null,
    "styles": {},
    "chosen": false,
    "selected": false
  }],
  wrapper: {
    options: {
      content: "",
      tag: "div",
      class: "post-grid-wrapper"
    },
    styles: {}
  },
  itemsWrap: {
    options: {
      class: "items"
    },
    styles: {
      "display": {
        "Desktop": "grid"
      },
      "gap": {
        "Desktop": "1em"
      },
      "gridTemplateColumns": {
        "Desktop": "1fr 1fr 1fr"
      }
    }
  },
  itemWrap: {
    options: {
      class: "item"
    },
    styles: {}
  },
  paginationWrap: {
    options: {
      type: "",
      class: ""
    },
    styles: {
      "display": {
        "Desktop": "flex"
      },
      "gap": {
        "Desktop": "1em"
      },
      "justifyContent": {
        "Desktop": "center"
      },
      "margin": {
        "Desktop": "50px 0px 0px 0px"
      }
    }
  },
  paginationItem: {
    options: {
      class: ""
    },
    styles: {
      "backgroundColor": {
        "Desktop": "#6923F7"
      },
      "padding": {
        "Desktop": "10px 15px 10px 15px"
      },
      "borderRadius": {
        "Desktop": "3px 3px 3px 3px"
      },
      "color": {
        "Desktop": "#ffffff"
      },
      "fontSize": {
        "Desktop": "16px"
      },
      "textDecoration": {
        "Desktop": "none #000000 wavy 1px !important"
      }
    }
  },
  paginationItemActive: {
    options: {
      class: ""
    },
    styles: {
      "backgroundColor": {
        "Desktop": "#0e6761"
      }
    }
  }
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (GridDefaultData);

/***/ }),

/***/ "./src/components/Builder/default-data-masonry.js":
/*!********************************************************!*\
  !*** ./src/components/Builder/default-data-masonry.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 MasonryDefaultData = {
  globalOptions: {
    viewType: "viewMasonry",
    itemSource: "posts",
    search: true,
    pagination: {
      type: 'normal',
      nextText: "Next",
      previousText: "Previous",
      loadMoreText: "Load More",
      loadingText: "Loading...",
      noPostText: "No More Posts",
      "nextIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      },
      "previousIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      },
      "loadingIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      },
      "loadMoreIcon": {
        "library": "fontAwesome",
        "srcType": "class",
        "iconSrc": "",
        "class": "load-more"
      }
    }
  },
  itemQueryArgs: {
    "postType": {
      "id": "postType",
      "value": ["post"]
    },
    "order": {
      "id": "order",
      "value": "DESC"
    },
    "orderby": {
      "id": "orderby",
      "value": ["date"]
    },
    "postStatus": {
      "id": "postStatus",
      "value": ["publish"]
    },
    "postsPerPage": {
      "id": "postsPerPage",
      "value": "5"
    }
  },
  items: [],
  loopLayout: [{
    "id": 1,
    "type": "root",
    "children": [{
      "id": 2,
      "type": "layer",
      "children": [{
        "id": 5,
        "type": "postThumbnail",
        "content": "",
        "parent_id": 2,
        "options": {
          "thumbnailSize": "full",
          "srcId": "",
          "srcUrl": "",
          "defaultSrcUrl": "https://comboblocks.com/server/wp-content/uploads/2024/11/da41bd7c-7420-3c0a-b169-d2d87acba187.jpg",
          "linkTo": "postUrl"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Featured Image Wrapper",
            "styles": {}
          },
          "img": {
            "handle": "img",
            "label": "Image",
            "styles": {
              "width": {
                "Desktop": "100%"
              }
            }
          },
          "a": {
            "handle": "a",
            "label": "Link",
            "styles": {}
          }
        },
        "chosen": false,
        "selected": false
      }, {
        "id": 3,
        "type": "postTitle",
        "content": "Dummy Title",
        "parent_id": 2,
        "options": {
          "linkTo": "postUrl",
          "target": "_blank"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Post Title Wrapper",
            "styles": {
              "fontSize": {
                "Desktop": "16px"
              }
            }
          },
          "a": {
            "handle": "a",
            "label": "Post Title Link",
            "styles": {}
          }
        },
        "chosen": false,
        "selected": false
      }, {
        "id": 4,
        "type": "postExcerpt",
        "parent_id": 2,
        "options": {
          "limitBy": "",
          "limitCount": 20,
          "readMoreText": "Read More"
        },
        "cssSelectors": {
          "wrapper": {
            "handle": "",
            "label": "Excerpt Wrapper",
            "styles": {}
          },
          "excerpt-text": {
            "handle": ".excerpt-text",
            "label": "Excerpt Text",
            "styles": {
              "fontSize": {
                "Desktop": "16px"
              }
            }
          },
          "redmore": {
            "handle": ".redmore",
            "label": "Redmore Text",
            "styles": {
              "fontSize": {
                "Desktop": "18px"
              }
            }
          }
        },
        "chosen": false,
        "selected": false
      }],
      "parent_id": 1,
      "styles": {},
      "options": {
        "animateOn": ""
      },
      "chosen": false,
      "selected": false
    }],
    "parent_id": null,
    "styles": {},
    "chosen": false,
    "selected": false
  }],
  wrapper: {
    options: {
      content: "",
      tag: "div",
      class: "post-grid-wrapper"
    },
    styles: {}
  },
  itemsWrap: {
    options: {
      class: ""
    },
    styles: {}
  },
  itemWrap: {
    options: {
      class: ""
    },
    styles: {
      "width": {
        "Desktop": "calc((100% - 60px) / 4)"
      },
      "marginBottom": {
        "Desktop": "20px"
      },
      "backgroundColor": {
        "Desktop": "#ffffff"
      },
      "padding": {
        "Desktop": "10px 10px 10px 10px"
      }
    }
  },
  masonryOptions: {
    gutter: 20,
    numberOfColumns: 4,
    itemSelector: ".item",
    columnWidth: ".item"
  },
  paginationWrap: {
    options: {
      type: "",
      class: ""
    },
    styles: {}
  },
  paginationItem: {
    options: {
      class: ""
    },
    styles: {}
  },
  paginationItemActive: {
    options: {
      class: ""
    },
    styles: {}
  }
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MasonryDefaultData);

/***/ }),

/***/ "./src/components/Builder/edit-carousel.js":
/*!*************************************************!*\
  !*** ./src/components/Builder/edit-carousel.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_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_core_data__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__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 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_block_editor__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__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_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/help.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 _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/copy.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/pages.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/page.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/brush.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _inAnimation__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../inAnimation */ "./src/inAnimation.js");
/* harmony import */ var _outAnimation__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../outAnimation */ "./src/outAnimation.js");
/* harmony import */ var _dropdown__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _icon_picker__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _input_select__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _input_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../input-toggle */ "./src/components/input-toggle/index.js");
/* harmony import */ var _input_wp_editor__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../input-wp-editor */ "./src/components/input-wp-editor/index.js");
/* harmony import */ var _styles__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../styles */ "./src/components/styles/index.js");
/* harmony import */ var _tab__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../tab */ "./src/components/tab/index.js");
/* harmony import */ var _tabs__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _icon_toggle__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _layout_generator__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ../layout-generator */ "./src/components/layout-generator/index.js");
/* harmony import */ var _items__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../items */ "./src/components/items/index.js");
/* harmony import */ var _layouts__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./layouts */ "./src/components/Builder/layouts.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;

























var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var onChange = props.onChange;
  var onChangeStyleObj = props.onChangeStyleObj;
  var addNotifications = props.addNotifications;
  var setHelp = props.setHelp;
  var postData = props.postData;
  if (postData.post_content == null) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
      className: "p-3 my-5 bg-orange-400",
      children: "Please choose an Post Grid first."
    });
  }
  var breakPointX = "Desktop";
  var [PostGridData, setPostGridData] = useState(postData.post_content);
  var [globalOptions, setglobalOptions] = useState(PostGridData.globalOptions);
  var [itemQueryArgs, setitemQueryArgs] = useState(PostGridData.itemQueryArgs);
  var [loopLayout, setloopLayout] = useState(PostGridData.loopLayout);
  var [wrapper, setwrapper] = useState(PostGridData.wrapper);
  var [items, setitems] = useState(PostGridData.items);
  var [itemsWrap, setitemsWrap] = useState(PostGridData.itemsWrap);
  var [itemWrap, setitemWrap] = useState(PostGridData.itemWrap);
  var [paginationWrap, setpaginationWrap] = useState(PostGridData.paginationWrap);
  var [paginationItem, setpaginationItem] = useState(PostGridData.paginationItem);
  var [paginationItemActive, setpaginationItemActive] = useState(PostGridData.paginationItemActive);
  var [prev, setprev] = useState(PostGridData?.prev);
  var [prevIcon, setprevIcon] = useState(PostGridData?.prevIcon);
  var [next, setnext] = useState(PostGridData?.next);
  var [nextIcon, setnextIcon] = useState(PostGridData?.nextIcon);
  var [sliderOptions, setsliderOptions] = useState(PostGridData?.sliderOptions);
  var [sliderOptionsRes, setsliderOptionsRes] = useState(PostGridData?.sliderOptionsRes);
  var [navsWrap, setnavsWrap] = useState(PostGridData?.navsWrap);
  var [navItem, setnavItem] = useState(PostGridData?.navItem);
  var [styleObj, setstyleObj] = useState({});
  var [customerData, setcustomerData] = useState(props.customerData);
  var [datePicker, setdatePicker] = useState(9999999);
  var [isProFeature, setisProFeature] = useState(true);
  var [editLayouts, seteditLayouts] = useState(false);
  const gapValue = sliderOptions?.gap || "0px";
  const [number, setNumber] = useState(parseInt(gapValue));
  const [unit, setUnit] = useState(gapValue.replace(number, ""));
  const [itemActive, setitemActive] = useState(99999);
  const [AIautoUpdate, setAIautoUpdate] = useState(false);
  var [AIWriter, setAIWriter] = useState(false);
  var formattedPrompt = "Respond only with question answer as json array and no other text. Do not include any explanations, introductions, or concluding remarks.";
  var wrapperSelector = "#post-grid-" + postData.ID;
  var itemsWrapSelector = wrapperSelector + " .splide__list";
  var itemWrapSelector = wrapperSelector + " .splide__list > .item";
  var navsWrapSelector = wrapperSelector + " .splide__arrows";
  var navItemSelector = wrapperSelector + " .splide__arrows > .splide__arrow";
  var prevSelector = wrapperSelector + " .splide__arrows > .prev";
  var prevIconSelector = wrapperSelector + "  .splide__arrows > .prev .icon";
  var nextSelector = wrapperSelector + " .splide__arrows > .next";
  var nextIconSelector = wrapperSelector + " .splide__arrows > .next .icon";
  var paginationWrapSelector = wrapperSelector + "  .splide__pagination";
  var paginationItemSelector = wrapperSelector + "  .splide__pagination .splide__pagination__page";
  var paginationItemActiveSelector = wrapperSelector + "  .splide__pagination .splide__pagination__page.is-active";
  var breakPointList = [{
    label: "Select..",
    icon: "",
    value: ""
  }];
  for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_7__["default"]) {
    var breakPointItem = _breakpoints__WEBPACK_IMPORTED_MODULE_7__["default"][x];
    breakPointList.push({
      label: breakPointItem.name,
      icon: breakPointItem.icon,
      value: breakPointItem.id
    });
  }
  var postTypes = [];
  const postTypesData = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_2__.useSelect)(select => select(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_1__.store).getPostTypes({
    per_page: -1
  }), []);
  postTypesData !== null && postTypesData.map(x => {
    postTypes.push({
      value: x.slug,
      label: x.name
    });
  });
  useEffect(() => {
    if (Object.entries(styleObj).length > 0) {
      onChangeStyleObj(styleObj);
    }
    console.log(styleObj);
  }, [styleObj]);
  useEffect(() => {
    var styles = generateStyleObj();
    setstyleObj(styles);
  }, [PostGridData]);
  useEffect(() => {
    if (customerData.isPro) {
      setisProFeature(false);
    }
  }, [props.customerData]);
  useEffect(() => {
    onChange(PostGridData);
  }, [PostGridData]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.globalOptions = globalOptions;
    setPostGridData(PostGridDataX);
  }, [globalOptions]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemQueryArgs = itemQueryArgs;
    setPostGridData(PostGridDataX);
  }, [itemQueryArgs]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.sliderOptions = sliderOptions;
    setPostGridData(PostGridDataX);
  }, [sliderOptions]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.items = items;
    setPostGridData(PostGridDataX);
  }, [items]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.wrapper = wrapper;
    setPostGridData(PostGridDataX);
  }, [wrapper]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.navsWrap = navsWrap;
    setPostGridData(PostGridDataX);
  }, [navsWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.navItem = navItem;
    setPostGridData(PostGridDataX);
  }, [navItem]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.loopLayout = loopLayout;
    setPostGridData(PostGridDataX);
  }, [loopLayout]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemsWrap = itemsWrap;
    setPostGridData(PostGridDataX);
  }, [itemsWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemWrap = itemWrap;
    setPostGridData(PostGridDataX);
  }, [itemWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.next = next;
    setPostGridData(PostGridDataX);
  }, [next]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.nextIcon = nextIcon;
    setPostGridData(PostGridDataX);
  }, [nextIcon]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.prev = prev;
    setPostGridData(PostGridDataX);
  }, [prev]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.prevIcon = prevIcon;
    setPostGridData(PostGridDataX);
  }, [prevIcon]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationItem = paginationItem;
    setPostGridData(PostGridDataX);
  }, [paginationItem]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationWrap = paginationWrap;
    setPostGridData(PostGridDataX);
  }, [paginationWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationItemActive = paginationItemActive;
    setPostGridData(PostGridDataX);
  }, [paginationItemActive]);
  function generateStyleObj() {
    var styleObjX = {};

    // wrapper
    var wrapperX = {
      ...PostGridData.wrapper
    };
    var wrapperStyles = myStore.deletePropertyDeep(wrapperX, ['options']);
    styleObjX[wrapperSelector] = wrapperStyles;
    var itemsWrapX = {
      ...PostGridData.itemsWrap
    };
    var itemsWrapStyles = myStore.deletePropertyDeep(itemsWrapX, ['options']);
    styleObjX[itemsWrapSelector] = itemsWrapStyles;
    var itemWrapX = {
      ...PostGridData.itemWrap
    };
    var itemWrapStyles = myStore.deletePropertyDeep(itemWrapX, ['options']);
    styleObjX[itemWrapSelector] = itemWrapStyles;
    var navsWrapX = {
      ...PostGridData.navsWrap
    };
    var navsWrapStyles = myStore.deletePropertyDeep(navsWrapX, ['options']);
    styleObjX[navsWrapSelector] = navsWrapStyles;
    var navItemX = {
      ...PostGridData.navItem
    };
    var navItemStyles = myStore.deletePropertyDeep(navItemX, ['options']);
    styleObjX[navItemSelector] = navItemStyles;
    var prevX = {
      ...PostGridData.prev
    };
    var prevStyles = myStore.deletePropertyDeep(prevX, ['options']);
    styleObjX[prevSelector] = prevStyles;
    var prevIconX = {
      ...PostGridData.prevIcon
    };
    var prevIconStyles = myStore.deletePropertyDeep(prevIconX, ['options']);
    styleObjX[prevIconSelector] = prevIconStyles;
    var nextX = {
      ...PostGridData.next
    };
    var nextStyles = myStore.deletePropertyDeep(nextX, ['options']);
    styleObjX[nextSelector] = nextStyles;
    var nextIconX = {
      ...PostGridData.nextIcon
    };
    var nextIconStyles = myStore.deletePropertyDeep(nextIconX, ['options']);
    styleObjX[nextIconSelector] = nextIconStyles;
    var paginationWrapX = {
      ...PostGridData.paginationWrap
    };
    var paginationWrapStyles = myStore.deletePropertyDeep(paginationWrapX, ['options']);
    styleObjX[paginationWrapSelector] = paginationWrapStyles;
    var paginationItemX = {
      ...PostGridData.paginationItem
    };
    var paginationItemStyles = myStore.deletePropertyDeep(paginationItemX, ['options']);
    styleObjX[paginationItemSelector] = paginationItemStyles;
    var paginationItemActiveX = {
      ...PostGridData.paginationItemActive
    };
    var paginationItemActiveStyles = myStore.deletePropertyDeep(paginationItemActiveX, ['options']);
    styleObjX[paginationItemActiveSelector] = paginationItemActiveStyles;
    var loopLayoutFlatArry = myStore.flattenObject(PostGridData.loopLayout);
    loopLayoutFlatArry.map(element => {
      var elementId = element.id;
      var elementHdnle = "#element-" + elementId;
      var cssSelectors = element.cssSelectors;
      if (cssSelectors != undefined) {
        Object.entries(cssSelectors).map(args => {
          var elementSubIndex = args[0];
          var elementStylesObj = args[1];
          var itemhdnle = elementStylesObj?.handle == undefined ? elementHdnle : elementStylesObj?.handle;
          if (itemhdnle.length == 0) {
            var elementSubHdnle = wrapperSelector + ' ' + elementHdnle;
          } else {
            var elementSubHdnle = wrapperSelector + ' ' + elementHdnle + ' ' + itemhdnle;
          }
          var elementStylesObjX = {
            ...elementStylesObj
          };
          delete elementStylesObjX.handle;
          delete elementStylesObjX.label;
          styleObjX[elementSubHdnle] = elementStylesObjX;
        });
      }
    });
    console.log(styleObjX);
    return styleObjX;
    //setstyleObj(styleObjX)
  }
  var RemoveSliderArg = function ({
    index
  }) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
      className: "cursor-pointer hover:bg-red-500 hover:text-white ",
      onClick: ev => {
        var sliderOptionsX = {
          ...sliderOptions
        };
        delete sliderOptionsX[index];
        setsliderOptions(sliderOptionsX);
      },
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"]
      })
    });
  };
  const ALLOWED_MEDIA_TYPES = ["image"];
  var videoType = {
    choose: {
      label: "Choose",
      value: ""
    },
    youtube: {
      label: "YouTube",
      value: "youtube"
    }
  };
  function onChangeStyle(sudoScource, newVal, attr, propertyType, setProperty) {
    var path = [sudoScource, attr, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.updatePropertyDeep(obj, path, newVal);
    setProperty(object);
  }
  function onAddStyle(sudoScource, key, propertyType, setProperty) {
    var path = [sudoScource, key, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.addPropertyDeep(obj, path, "");
    setProperty(object);
  }
  function onResetStyle(sudoSources, propertyType, setProperty) {
    let obj = Object.assign({}, propertyType);
    Object.entries(sudoSources).map(args => {
      var sudoScource = args[0];
      if (obj[sudoScource] == undefined) {} else {
        obj[sudoScource] = {};
        // var elementSelector = myStore.getElementSelector(
        // 	sudoScource,
        // 	contentSelector // Replace this selector if needed
        // );
      }
    });
    setProperty(obj);
  }
  function onRemoveStyle(sudoScource, key, propertyType, setProperty) {
    let obj = {
      ...propertyType
    };
    var object = myStore.deletePropertyDeep(obj, [sudoScource, key, breakPointX]);
    var isEmpty = Object.entries(object[sudoScource][key]).length === 0 ? true : false;
    var objectX = isEmpty ? myStore.deletePropertyDeep(object, [sudoScource, key]) : object;
    setProperty(objectX);
  }
  function onBulkAddStyle(sudoSource, cssObj, propertyType, setProperty) {
    let obj = {
      ...propertyType
    };
    obj[sudoSource] = cssObj;
    setProperty(obj);
  }
  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
    },
    releaseWheel: {
      label: "Release 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
    },
    type: {
      label: "Slider Type",
      value: "slide"
    },
    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",
      unit: "em",
      number: "1"
    },
    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 itemSources = {
    manual: {
      label: "Manual",
      value: "manual"
    },
    posts: {
      label: "Posts",
      value: "posts",
      isPro: customerData.isPro ? false : true
    }
  };
  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",
      unit: "em",
      number: "1"
    },
    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)"
    }
  };
  var RemoveSliderArgRes = function ({
    index
  }) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
      className: "cursor-pointer hover:bg-red-500 hover:text-white ",
      onClick: ev => {
        var sliderOptionsResX = {
          ...sliderOptionsRes
        };
        delete sliderOptionsResX[index];
        setAttributes({
          sliderOptionsRes: sliderOptionsResX
        });
      },
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"]
      })
    });
  };
  function generate3Digit() {
    return Math.floor(100 + Math.random() * 900);
  }
  const handleDelete = id => {
    // Filter out the item with the specified id
    const updatedItems = Object.fromEntries(Object.entries(itemQueryArgs).filter(([key, item]) => item.id !== id));
    setitemQueryArgs(updatedItems);
  };
  const copyData = data => {
    navigator.clipboard.writeText(data).then(() => {
      addNotifications({
        title: "Copied to clipboard!",
        content: "Use the shortcode in page or post conent where you want to display.",
        type: "success"
      });
    }).catch(err => {});
  };
  function escapeHTML(str) {
    const map = {
      "&": "&amp;",
      "<": "&lt;",
      ">": "&gt;",
      '"': "&quot;",
      "'": "&#039;"
    };
    return str.replace(/[&<>"']/g, function (match) {
      return map[match];
    });
  }
  function unescapeHTML(str) {
    const map = {
      "&amp;": "&",
      "&lt;": "<",
      "&gt;": ">",
      "&quot;": '"',
      "&#039;": "'"
    };
    return str.replace(/&amp;|&lt;|&gt;|&quot;|&#039;/g, function (match) {
      return map[match];
    });
  }
  function onChangeBreakPoint(x, _index) {
    var asdsdsd = wp.data.dispatch("PostGridStore").setBreakPoint(x.value);
    asdsdsd.then(res => {
      setBreakPointX(res.breakpoint);
      myStore.generateBlockCss(blockCssY.items, blockId);
    });
    const {
      getPreviewDeviceType
    } = select("core/editor");
    const gutenbergDeviceType = getPreviewDeviceType;
  }
  function onChangeLayouts(loopLayout) {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.loopLayout = loopLayout;
    setPostGridData(PostGridDataX);
    setloopLayout(loopLayout);
  }
  // console.log(itemQueryArgs)

  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
    className: "",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
      className: "hidden",
      onClick: () => {
        var str = `{
						${JSON.stringify(PostGridData)},
				"wrapper":${JSON.stringify(wrapper)},
				"navItem":${JSON.stringify(navItem)},
				}`;
        copyData(str);
        addNotifications({
          title: "Copied to clipboard!",
          content: "Use the shortcode in page or post conent where you want to display.",
          type: "success"
        });
      },
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
        className: "p-3",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
          children: `{`
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          children: [`"items":${JSON.stringify(items)}`, ","]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          children: [`"wrapper":${JSON.stringify(wrapper)}`, ","]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          children: [`"navsWrap":${JSON.stringify(navsWrap)}`, ","]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          children: [`"navItem":${JSON.stringify(navItem)}`, ","]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
          children: `}`
        })]
      })
    }), props.postData.post_content != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_items__WEBPACK_IMPORTED_MODULE_21__["default"], {
        itemsState: {
          items,
          setitems
        },
        globalOptionsState: {
          globalOptions,
          setglobalOptions
        },
        itemQueryState: {
          itemQueryArgs,
          setitemQueryArgs
        },
        customerData: customerData,
        setHelp: setHelp,
        addNotifications: addNotifications
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Settings",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
          className: "py-3",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("label", {
              htmlFor: "",
              className: "flex gap-2 items-center",
              children: ["Lazyload", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                className: "cursor-pointer",
                title: "Click to know more",
                onClick: () => {
                  setHelp({
                    id: "lazyloadSetting",
                    enable: true
                  });
                },
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
                })
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_toggle__WEBPACK_IMPORTED_MODULE_14__["default"], {
              value: globalOptions?.lazyLoad,
              onChange: newVal => {
                var globalOptionsX = {
                  ...globalOptions
                };
                globalOptionsX.lazyLoad = newVal;
                setglobalOptions(globalOptionsX);
              }
            })]
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Slider Options", "post-grid"),
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_tabs__WEBPACK_IMPORTED_MODULE_18__["default"], {
          activeTab: "normal",
          orientation: "horizontal",
          activeClass: "active-tab",
          onSelect: tabName => {},
          tabs: [{
            name: "normal",
            title: "Normal",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
            className: "tab-normal"
          }, {
            name: "responsive",
            title: "Responsive",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
            className: "tab-responsive"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
            name: "normal",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "flex gap-4 mb-3",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_10__["default"], {
                position: "bottom right",
                variant: "secondary",
                buttonTitle: "Add Options",
                options: sliderOptionsArgs,
                onChange: (option, index) => {
                  var sliderOptionsX = {
                    ...sliderOptions
                  };
                  sliderOptionsX[index] = option.value;
                  setsliderOptions(sliderOptionsX);
                },
                values: ""
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("button", {
                onClick: () => {
                  var str = JSON.stringify(sliderOptions);
                  copyData(str);
                },
                className: "pg-font flex gap-2 justify-center  cursor-pointer py-2 px-4 capitalize  !bg-gray-700 !text-white font-medium !rounded hover:bg-gray-600 hover:text-white focus:outline-none focus:bg-gray-600",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
                  className: "fill-white ",
                  size: 14
                }), (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Copy", "post-grid")]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("button", {
                onClick: async () => {
                  try {
                    var data = await navigator.clipboard.readText();
                    data = JSON.parse(data);
                    setsliderOptions(data);
                    addNotifications({
                      title: "Paste Done!",
                      content: "Paste successful.",
                      type: "success"
                    });
                  } catch (e) {
                    console.log(e);
                  }
                },
                className: "pg-font flex gap-2 justify-center  cursor-pointer py-2 px-4 capitalize  !bg-gray-700 !text-white font-medium !rounded hover:bg-gray-600 hover:text-white focus:outline-none focus:bg-gray-600",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
                  className: "fill-white ",
                  size: 14
                }), (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Paste", "post-grid")]
              })]
            }), Object.entries(sliderOptions).map((item, index) => {
              var id = item[0];
              var value = item[1];
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                children: [id == "autoplay" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Autoplay?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "rewind" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Rewind?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value,
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "type" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Slider Type?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value,
                    options: [{
                      label: "Slide",
                      value: "slide"
                    }, {
                      label: "Loop",
                      value: "loop"
                    }, {
                      label: "Fade",
                      value: "fade"
                    }],
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "interval" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Interval?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    type: "number",
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "speed" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Speed?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    type: "number",
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "rewindSpeed" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Rewind Speed?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    type: "number",
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "start" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Start?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    type: "number",
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "perPage" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Per Page?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    type: "number",
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "perMove" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Per Move?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    type: "number",
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "gap" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Gap?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center gap-1 ",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("input", {
                      type: "number",
                      value: number,
                      className: "w-[100px]",
                      onChange: e => {
                        const newNumber = e.target.value;
                        setNumber(newNumber);
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = `${newNumber}${unit}`;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("select", {
                      value: unit,
                      onChange: e => {
                        const newUnit = e.target.value;
                        setUnit(newUnit);
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = `${number}${newUnit}`;
                        setsliderOptions(sliderOptionsX);
                      },
                      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("option", {
                        value: "px",
                        children: "px"
                      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("option", {
                        value: "em",
                        children: "em"
                      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("option", {
                        value: "rem",
                        children: "rem"
                      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("option", {
                        value: "%",
                        children: "%"
                      })]
                    })]
                  })]
                }), id == "padding" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Padding?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "focus" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Focus?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "width" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Width?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "height" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Height?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "fixedWidth" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Fixed Width?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "fixedHeight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Fixed Height?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "heightRatio" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Height Ratio?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "easing" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Easing?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "pauseOnHover" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pause On Hover?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "pauseOnFocus" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pause On Focus?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                    for: "",
                    className: "font-medium text-slate-900 ",
                    children: "?"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "rewindByDrag" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Rewind By Drag?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "autoWidth" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Auto Width?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "autoHeight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Auto Height?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "arrows" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Navigation?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "pagination" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pagination?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "paginationKeyboard" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pagination Keyboard?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "drag" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Drag?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "snap" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Snap?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex gap-2 items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.ToggleControl, {
                      className: "!mb-0",
                      checked: value ? true : false,
                      onChange: newVal => {
                        var sliderOptionsX = {
                          ...sliderOptions
                        };
                        sliderOptionsX[id] = newVal;
                        setsliderOptions(sliderOptionsX);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Disabled.", "post-grid")
                    })]
                  })]
                }), id == "noDrag" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("noDrag?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value,
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "paginationDirection" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pagination Direction?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.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;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "direction" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Direction?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.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;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "lazyLoad" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("LazyLoad?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value,
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Nearby", "post-grid"),
                      value: "nearby"
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Sequential", "post-grid"),
                      value: "sequential"
                    }],
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "keyboard" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Keyboard?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value,
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Global", "post-grid"),
                      value: "global"
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Focused", "post-grid"),
                      value: "focused"
                    }],
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "mediaQuery" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Media Query?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value,
                    options: [{
                      label: "min",
                      value: "min"
                    }, {
                      label: "max",
                      value: "max"
                    }],
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "wheel" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Wheel?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value,
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                }), id == "cover" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArg, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Cover?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value,
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsX = {
                        ...sliderOptions
                      };
                      sliderOptionsX[id] = newVal;
                      setsliderOptions(sliderOptionsX);
                    }
                  })]
                })]
              }, index);
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
            name: "responsive",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
              className: "my-3",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Slider Options", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_10__["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;
                  }
                  setsliderOptionsRes(sliderOptionsResX);
                },
                values: ""
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_icon_toggle__WEBPACK_IMPORTED_MODULE_19__["default"], {
                position: "bottom",
                variant: "secondary",
                iconList: breakPointList,
                buttonTitle: "Break Point Switch",
                onChange: onChangeBreakPoint,
                activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_7__["default"][breakPointX].icon,
                value: breakPointX
              })]
            }), Object.entries(sliderOptionsRes).map((item, index) => {
              var id = item[0];
              var value = item[1];
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                children: [id == "autoplay" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Autoplay?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "rewind" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Rewind?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "interval" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Interval?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__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;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "speed" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Speed?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__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;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "rewindSpeed" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Rewind Speed?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__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;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "start" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Start?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__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;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "perPage" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: "Per Page?"
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__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;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "perMove" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Per Move?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__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;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "gap" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Gap?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "padding" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Padding?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "focus" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Focus?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "width" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Width?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "height" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Height?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "fixedWidth" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Fixed Width?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "fixedHeight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Fixed Height?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "heightRatio" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Height Ratio?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "pauseOnHover" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pause On Hover?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "pauseOnFocus" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pause On Focus?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                    for: "",
                    className: "font-medium text-slate-900 ",
                    children: "?"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "rewindByDrag" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Rewind By Drag?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "autoWidth" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Auto Width?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "autoHeight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Auto Height?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "arrows" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Navigation?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "pagination" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pagination?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "paginationKeyboard" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pagination Keyboard?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "drag" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Drag?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "snap" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Snap?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "noDrag" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("No Drag?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "paginationDirection" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pagination Direction?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.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;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "direction" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Direction?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.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;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "lazyLoad" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("LazyLoad?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Nearby", "post-grid"),
                      value: "nearby"
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Sequential", "post-grid"),
                      value: "sequential"
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "keyboard" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Keyboard?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Global", "post-grid"),
                      value: "global"
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Focused", "post-grid"),
                      value: "focused"
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "mediaQuery" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Media Query?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.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;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "wheel" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Wheel?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                }), id == "cover" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                    className: "flex items-center",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(RemoveSliderArgRes, {
                      index: id
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Cover?", "post-grid")
                    })]
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                    label: "",
                    value: value[breakPointX] == undefined ? "" : value[breakPointX],
                    options: [{
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
                      value: 1
                    }, {
                      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("False", "post-grid"),
                      value: 0
                    }],
                    onChange: newVal => {
                      var sliderOptionsResX = {
                        ...sliderOptionsRes
                      };
                      if (sliderOptionsResX[id][breakPointX] == undefined) {
                        sliderOptionsResX[id][breakPointX] = "";
                      }
                      sliderOptionsResX[id][breakPointX] = newVal;
                      setsliderOptionsRes(sliderOptionsResX);
                    }
                  })]
                })]
              }, index);
            })]
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Layouts",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          className: "flex items-center justify-between",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
            className: "bg-slate-700 inline-block text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
            onClick: ev => {
              seteditLayouts(!editLayouts);
            },
            children: "Customize Layouts"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
            className: "bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
            onClick: () => {
              navigator.clipboard.writeText(JSON.stringify(PostGridData.loopLayout)).then(() => {
                addNotifications({
                  title: "Copied to clipboard!",
                  content: "Layout Copied!",
                  type: "success"
                });
              });
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
              size: 14,
              fill: "#fff"
            }), "Copy"]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
            className: "bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
            onClick: async () => {
              try {
                var data = await navigator.clipboard.readText();
                data = JSON.parse(data);
                onChangeLayouts(data).then(() => {
                  addNotifications({
                    title: "Layout Pasted!",
                    content: "Layout paste successful.",
                    type: "success"
                  });
                });
              } catch (e) {
                console.log(e);
              }
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_30__["default"],
              size: 14,
              fill: "#fff"
            }), "Paste"]
          }), editLayouts && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
            className: "fixed h-full top-0 py-10 overflow-y-auto bg-slate-500 bg-opacity-70 left-0 w-full z-50",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "w-[1400px] mx-auto ",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex justify-between bg-gray-700 p-3",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                  className: "text-white text-md",
                  children: "Layout Editor"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                    className: "size-6 bg-red-500 flex items-center justify-center cursor-pointer",
                    onClick: ev => {
                      seteditLayouts(!editLayouts);
                    },
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
                      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
                      fill: "#fff",
                      size: 18
                    })
                  })
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_layout_generator__WEBPACK_IMPORTED_MODULE_20__["default"], {
                postData: postData,
                customerData: customerData,
                addNotifications: addNotifications,
                onChange: onChangeLayouts,
                layouts: PostGridData.loopLayout
              })]
            })
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_layouts__WEBPACK_IMPORTED_MODULE_22__["default"], {
            postData: postData,
            onChangeLayouts: onChangeLayouts,
            customerData: customerData,
            addNotifications: addNotifications,
            setHelp: setHelp
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Wrapper",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                value: wrapper?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...wrapper,
                    options: {
                      ...wrapper?.options,
                      class: newVal
                    }
                  };
                  setwrapper(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
              obj: wrapper,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, wrapper, setwrapper),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, wrapper, setwrapper),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, wrapper, setwrapper),
              onReset: sudoSources => onResetStyle(sudoSources, wrapper, setwrapper),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, wrapper, setwrapper)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Items Wrap",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                value: itemsWrap?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...itemsWrap,
                    options: {
                      ...itemsWrap?.options,
                      class: newVal
                    }
                  };
                  setitemsWrap(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
              obj: itemsWrap,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, itemsWrap, setitemsWrap),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, itemsWrap, setitemsWrap),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, itemsWrap, setitemsWrap),
              onReset: sudoSources => onResetStyle(sudoSources, itemsWrap, setitemsWrap),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, itemsWrap, setitemsWrap)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Item",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                value: itemWrap?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...itemWrap,
                    options: {
                      ...itemWrap?.options,
                      class: newVal
                    }
                  };
                  setitemWrap(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
              obj: itemWrap,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, itemWrap, setitemWrap),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, itemWrap, setitemWrap),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, itemWrap, setitemWrap),
              onReset: sudoSources => onResetStyle(sudoSources, itemWrap, setitemWrap),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, itemWrap, setitemWrap)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Navigation/Arrows",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Navs Wrap",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: navsWrap?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...navsWrap,
                      options: {
                        ...navsWrap?.options,
                        class: newVal
                      }
                    };
                    setnavsWrap(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
                obj: navsWrap,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, navsWrap, setnavsWrap),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, navsWrap, setnavsWrap),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, navsWrap, setnavsWrap),
                onReset: sudoSources => onResetStyle(sudoSources, navsWrap, setnavsWrap),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, navsWrap, setnavsWrap)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Navs Item",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: navItem?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...navItem,
                      options: {
                        ...navItem?.options,
                        class: newVal
                      }
                    };
                    setnavItem(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
                obj: navItem,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, navItem, setnavItem),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, navItem, setnavItem),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, navItem, setnavItem),
                onReset: sudoSources => onResetStyle(sudoSources, navItem, setnavItem),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, navItem, setnavItem)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Prev",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: prev?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...prev,
                      options: {
                        ...prev?.options,
                        class: newVal
                      }
                    };
                    setprev(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
                obj: prev,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, prev, setprev),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, prev, setprev),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, prev, setprev),
                onReset: sudoSources => onResetStyle(sudoSources, prev, setprev),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, prev, setprev)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Prev Icon",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: prevIcon?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...prevIcon,
                      options: {
                        ...prevIcon?.options,
                        class: newVal
                      }
                    };
                    setprevIcon(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
                obj: prevIcon,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, prevIcon, setprevIcon),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, prevIcon, setprevIcon),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, prevIcon, setprevIcon),
                onReset: sudoSources => onResetStyle(sudoSources, prevIcon, setprevIcon),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, prevIcon, setprevIcon)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Next",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: next?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...next,
                      options: {
                        ...next?.options,
                        class: newVal
                      }
                    };
                    setnext(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
                obj: next,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, next, setnext),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, next, setnext),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, next, setnext),
                onReset: sudoSources => onResetStyle(sudoSources, next, setnext),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, next, setnext)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Next Icon",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: nextIcon?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...nextIcon,
                      options: {
                        ...nextIcon?.options,
                        class: newVal
                      }
                    };
                    setnextIcon(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
                obj: nextIcon,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, nextIcon, setnextIcon),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, nextIcon, setnextIcon),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, nextIcon, setnextIcon),
                onReset: sudoSources => onResetStyle(sudoSources, nextIcon, setnextIcon),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, nextIcon, setnextIcon)
              })
            })]
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Pagination/Dots",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Pagination Wrap",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: paginationWrap?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationWrap,
                      options: {
                        ...paginationWrap?.options,
                        class: newVal
                      }
                    };
                    setpaginationWrap(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
                obj: paginationWrap,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationWrap, setpaginationWrap),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationWrap, setpaginationWrap),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationWrap, setpaginationWrap),
                onReset: sudoSources => onResetStyle(sudoSources, paginationWrap, setpaginationWrap),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationWrap, setpaginationWrap)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Pagination Item",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: paginationItem?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationItem,
                      options: {
                        ...paginationItem?.options,
                        class: newVal
                      }
                    };
                    setpaginationItem(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
                obj: paginationItem,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationItem, setpaginationItem),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationItem, setpaginationItem),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationItem, setpaginationItem),
                onReset: sudoSources => onResetStyle(sudoSources, paginationItem, setpaginationItem),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationItem, setpaginationItem)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "pagination Item Active",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_26__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_31__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: paginationItemActive?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationItemActive,
                      options: {
                        ...paginationItemActive?.options,
                        class: newVal
                      }
                    };
                    setpaginationItemActive(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_17__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_16__["default"], {
                obj: paginationItemActive,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationItemActive, setpaginationItemActive),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationItemActive, setpaginationItemActive),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationItemActive, setpaginationItemActive),
                onReset: sudoSources => onResetStyle(sudoSources, paginationItemActive, setpaginationItemActive),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationItemActive, setpaginationItemActive)
              })
            })]
          })
        })]
      })]
    })]
  });
}
class EditCarousel extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true,
      isLoaded: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }
  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }
  render() {
    var {
      onChange,
      onChangeStyleObj,
      postData,
      customerData,
      addNotifications,
      setHelp
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(Html, {
      onChange: onChange,
      onChangeStyleObj: onChangeStyleObj,
      addNotifications: addNotifications,
      postData: postData,
      customerData: customerData,
      setHelp: setHelp,
      warn: this.state.showWarning,
      isLoaded: this.state.isLoaded
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (EditCarousel);

/***/ }),

/***/ "./src/components/Builder/edit-filterable.js":
/*!***************************************************!*\
  !*** ./src/components/Builder/edit-filterable.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_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_core_data__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__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 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_block_editor__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__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_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/help.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/copy.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/page.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/pages.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/brush.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _inAnimation__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../inAnimation */ "./src/inAnimation.js");
/* harmony import */ var _outAnimation__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../outAnimation */ "./src/outAnimation.js");
/* harmony import */ var _dropdown__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _icon_picker__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _input_select__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _input_toggle__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../input-toggle */ "./src/components/input-toggle/index.js");
/* harmony import */ var _input_wp_editor__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../input-wp-editor */ "./src/components/input-wp-editor/index.js");
/* harmony import */ var _items__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../items */ "./src/components/items/index.js");
/* harmony import */ var _styles__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../styles */ "./src/components/styles/index.js");
/* harmony import */ var _tab__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../tab */ "./src/components/tab/index.js");
/* harmony import */ var _tabs__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _layouts__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./layouts */ "./src/components/Builder/layouts.js");
/* harmony import */ var _layout_generator__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../layout-generator */ "./src/components/layout-generator/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;
























var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var onChange = props.onChange;
  var onChangeStyleObj = props.onChangeStyleObj;
  var addNotifications = props.addNotifications;
  var setHelp = props.setHelp;
  var postData = props.postData;
  if (postData.post_content == null) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
      className: "p-3 my-5 bg-orange-400",
      children: "Please choose an Post Grid first."
    });
  }
  var breakPointX = "Desktop";
  var [PostGridData, setPostGridData] = useState(postData.post_content);
  var [globalOptions, setglobalOptions] = useState(PostGridData.globalOptions);
  var [itemQueryArgs, setitemQueryArgs] = useState(PostGridData.itemQueryArgs);
  var [loopLayout, setloopLayout] = useState(PostGridData.loopLayout);
  var [wrapper, setwrapper] = useState(PostGridData.wrapper);
  var [items, setitems] = useState(PostGridData.items);
  var [itemsWrap, setitemsWrap] = useState(PostGridData.itemsWrap);
  var [itemWrap, setitemWrap] = useState(PostGridData.itemWrap);
  var [paginationWrap, setpaginationWrap] = useState(PostGridData.paginationWrap);
  var [paginationItem, setpaginationItem] = useState(PostGridData.paginationItem);
  var [paginationItemActive, setpaginationItemActive] = useState(PostGridData.paginationItemActive);
  var [editLayouts, seteditLayouts] = useState(false);
  var [debounce, setDebounce] = useState(null); // Using the hook.

  var [isBusy, setIsBusy] = useState(false);
  const [filterableTerms, setFilterableTerms] = useState([]);
  var [filterItem, setfilterItem] = useState(PostGridData.filterItem);
  var [activeFilter, setactiveFilter] = useState(PostGridData.activeFilter);
  var [filterGroupWrap, setfilterGroupWrap] = useState(PostGridData.filterGroupWrap);
  var [filterGroup, setfilterGroup] = useState(PostGridData.filterGroup);
  var [filterGroupTitle, setfilterGroupTitle] = useState(PostGridData.filterGroupTitle);
  var [topWrap, settopWrap] = useState(PostGridData.topWrap);
  var [activeNavItem, setactiveNavItem] = useState(PostGridData?.activeNavItem);
  var [styleObj, setstyleObj] = useState({});
  var [customerData, setcustomerData] = useState(props.customerData);
  var [isProFeature, setisProFeature] = useState(true);
  var wrapperSelector = "#post-grid-" + postData.ID;
  var itemsWrapSelector = wrapperSelector + " > .items";
  var itemWrapSelector = wrapperSelector + " > .items > .item";
  var paginationWrapSelector = wrapperSelector + " > .pagination";
  var paginationItemSelector = wrapperSelector + " > .pagination .page-numbers";
  var paginationItemActiveSelector = wrapperSelector + " > .pagination .page-numbers.mixitup-control-active";
  var filterItemSelector = wrapperSelector + " .pg-filter";
  var activeFilterSelector = wrapperSelector + " .mixitup-control-active ";
  var filterGroupWrapSelector = wrapperSelector + " .filterable-group-wrap";
  var filterGroupSelector = wrapperSelector + " .filterable-group";
  var filterGroupTitleSelector = wrapperSelector + " .filterable-group-title";
  const paginationTypes = {
    none: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("None", "post-grid"),
      value: "none"
    },
    filterable: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Filterable", "post-grid"),
      value: "filterable"
    }
  };
  var breakPointList = [{
    label: "Select..",
    icon: "",
    value: ""
  }];
  for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_7__["default"]) {
    var breakPointItem = _breakpoints__WEBPACK_IMPORTED_MODULE_7__["default"][x];
    breakPointList.push({
      label: breakPointItem.name,
      icon: breakPointItem.icon,
      value: breakPointItem.id
    });
  }
  useEffect(() => {
    if (Object.entries(styleObj).length > 0) {
      onChangeStyleObj(styleObj);
    }
  }, [styleObj]);
  useEffect(() => {
    var styles = generateStyleObj();
    setstyleObj(styles);
  }, [PostGridData]);
  useEffect(() => {
    if (customerData.isPro) {
      setisProFeature(false);
    }
  }, [props.customerData]);
  useEffect(() => {
    onChange(PostGridData);
  }, [PostGridData]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.globalOptions = globalOptions;
    setPostGridData(PostGridDataX);
  }, [globalOptions]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemQueryArgs = itemQueryArgs;
    setPostGridData(PostGridDataX);
  }, [itemQueryArgs]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemsWrap = itemsWrap;
    setPostGridData(PostGridDataX);
  }, [itemsWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemWrap = itemWrap;
    setPostGridData(PostGridDataX);
  }, [itemWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.items = items;
    setPostGridData(PostGridDataX);
  }, [items]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.wrapper = wrapper;
    setPostGridData(PostGridDataX);
  }, [wrapper]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.filterItem = filterItem;
    setPostGridData(PostGridDataX);
  }, [filterItem]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.activeFilter = activeFilter;
    setPostGridData(PostGridDataX);
  }, [activeFilter]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.filterGroupWrap = filterGroupWrap;
    setPostGridData(PostGridDataX);
  }, [filterGroupWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.filterGroup = filterGroup;
    setPostGridData(PostGridDataX);
  }, [filterGroup]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.filterGroupTitle = filterGroupTitle;
    setPostGridData(PostGridDataX);
  }, [filterGroupTitle]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.activeNavItem = activeNavItem;
    setPostGridData(PostGridDataX);
  }, [activeNavItem]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.loopLayout = loopLayout;
    setPostGridData(PostGridDataX);
  }, [loopLayout]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationWrap = paginationWrap;
    setPostGridData(PostGridDataX);
  }, [paginationWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationItem = paginationItem;
    setPostGridData(PostGridDataX);
  }, [paginationItem]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationItemActive = paginationItemActive;
    setPostGridData(PostGridDataX);
  }, [paginationItemActive]);
  function fetchPostTypeTerms(keyword) {
    var postTypes = [];
    var terms = [];
    setIsBusy(true);
    setFilterableTerms([]);
    console.log(itemQueryArgs);
    // itemQueryArgs.map((x) => {
    // 	if (x.id == "postType") {
    // 		postTypes.push(x.val);
    // 	}
    // });

    postTypes = itemQueryArgs.postType.value;
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: "/post-grid/v2/get_tax_terms",
      method: "POST",
      data: {
        search: keyword,
        postTypes: postTypes
      }
    }).then(res => {
      //setFilterablTerms(res);
      res.length > 0 && res.map(y => {
        terms.push(y);
      });
      console.log(terms);
      setFilterableTerms(terms);
      setIsBusy(false);
    });

    // var sss = apiFetch({
    // 	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) => {
    // 			apiFetch({
    // 				path: "/post-grid/v2/get_tax_terms",
    // 				method: "POST",
    // 				data: { taxonomy: x.id, search: keyword, postTypes: postTypes },
    // 			}).then((res) => {
    // 				//setFilterablTerms(res);
    // 				res.length > 0 &&
    // 					res.map((y) => {
    // 						terms.push(y);
    // 					});
    // 				console.log(terms)

    // 				setFilterableTerms(terms);
    // 				setIsBusy(false);
    // 			});
    // 		});
    // 	//return result;
    // });
  }
  function generateStyleObj() {
    var styleObjX = {};

    // wrapper
    var wrapperX = {
      ...PostGridData.wrapper
    };
    var wrapperStyles = myStore.deletePropertyDeep(wrapperX, ['options']);
    styleObjX[wrapperSelector] = wrapperStyles;
    var itemsWrapX = {
      ...PostGridData.itemsWrap
    };
    var itemsWrapStyles = myStore.deletePropertyDeep(itemsWrapX, ['options']);
    styleObjX[itemsWrapSelector] = itemsWrapStyles;
    var itemWrapX = {
      ...PostGridData.itemWrap
    };
    var itemWrapStyles = myStore.deletePropertyDeep(itemWrapX, ['options']);
    styleObjX[itemWrapSelector] = itemWrapStyles;
    var filterItemX = {
      ...PostGridData.filterItem
    };
    var filterItemStyles = myStore.deletePropertyDeep(filterItemX, ['options']);
    styleObjX[filterItemSelector] = filterItemStyles;
    var activeFilterX = {
      ...PostGridData.activeFilter
    };
    var activeFilterStyles = myStore.deletePropertyDeep(activeFilterX, ['options']);
    styleObjX[activeFilterSelector] = activeFilterStyles;
    var filterGroupWrapX = {
      ...PostGridData.filterGroupWrap
    };
    var filterGroupWrapStyles = myStore.deletePropertyDeep(filterGroupWrapX, ['options']);
    styleObjX[filterGroupWrapSelector] = filterGroupWrapStyles;
    var filterGroupX = {
      ...PostGridData.filterGroup
    };
    var filterGroupStyles = myStore.deletePropertyDeep(filterGroupX, ['options']);
    styleObjX[filterGroupSelector] = filterGroupStyles;
    var filterGroupTitleX = {
      ...PostGridData.filterGroupTitle
    };
    var filterGroupTitleStyles = myStore.deletePropertyDeep(filterGroupTitleX, ['options']);
    styleObjX[filterGroupTitleSelector] = filterGroupTitleStyles;
    var paginationWrapX = {
      ...PostGridData.paginationWrap
    };
    var paginationWrapStyles = myStore.deletePropertyDeep(paginationWrapX, ['options']);
    styleObjX[paginationWrapSelector] = paginationWrapStyles;
    var paginationItemX = {
      ...PostGridData.paginationItem
    };
    var paginationItemStyles = myStore.deletePropertyDeep(paginationItemX, ['options']);
    styleObjX[paginationItemSelector] = paginationItemStyles;
    var paginationItemActiveX = {
      ...PostGridData.paginationItemActive
    };
    var paginationItemActiveStyles = myStore.deletePropertyDeep(paginationItemActiveX, ['options']);
    styleObjX[paginationItemActiveSelector] = paginationItemActiveStyles;
    var loopLayoutFlatArry = myStore.flattenObject(PostGridData.loopLayout);
    loopLayoutFlatArry.map(element => {
      var elementId = element.id;
      var elementHdnle = "#element-" + elementId;
      var cssSelectors = element.cssSelectors;
      if (cssSelectors != undefined) {
        Object.entries(cssSelectors).map(args => {
          var elementSubIndex = args[0];
          var elementStylesObj = args[1];
          var itemhdnle = elementStylesObj?.handle == undefined ? elementHdnle : elementStylesObj?.handle;
          if (itemhdnle.length == 0) {
            var elementSubHdnle = wrapperSelector + ' ' + elementHdnle;
          } else {
            var elementSubHdnle = wrapperSelector + ' ' + elementHdnle + ' ' + itemhdnle;
          }
          var elementStylesObjX = {
            ...elementStylesObj
          };
          delete elementStylesObjX.handle;
          delete elementStylesObjX.label;
          styleObjX[elementSubHdnle] = elementStylesObjX;
        });
      }
    });
    return styleObjX;
    //setstyleObj(styleObjX)
  }
  function onChangeLayouts(loopLayout) {
    console.log(loopLayout);
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.loopLayout = loopLayout;
    setPostGridData(PostGridDataX);
    setloopLayout(loopLayout);
  }
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.topWrap = topWrap;
    setPostGridData(PostGridDataX);
  }, [topWrap]);
  const pasteData = () => {
    navigator.clipboard.readText().then(text => {
      const parsedData = JSON.parse(text);
      console.log(parsedData);
      var globalOptionsX = {
        ...globalOptions,
        filters: parsedData
      };
      setglobalOptions(globalOptionsX);
    }).catch(err => {});
  };
  const ALLOWED_MEDIA_TYPES = ["image"];
  var videoType = {
    choose: {
      label: "Choose",
      value: ""
    },
    youtube: {
      label: "YouTube",
      value: "youtube"
    }
  };
  function onChangeStyle(sudoScource, newVal, attr, propertyType, setProperty) {
    var path = [sudoScource, attr, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.updatePropertyDeep(obj, path, newVal);
    setProperty(object);
  }
  function onAddStyle(sudoScource, key, propertyType, setProperty) {
    var path = [sudoScource, key, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.addPropertyDeep(obj, path, "");
    setProperty(object);
  }
  function onResetStyle(sudoSources, propertyType, setProperty) {
    let obj = Object.assign({}, propertyType);
    Object.entries(sudoSources).map(args => {
      var sudoScource = args[0];
      if (obj[sudoScource] == undefined) {} else {
        obj[sudoScource] = {};
        // var elementSelector = myStore.getElementSelector(
        // 	sudoScource,
        // 	contentSelector // Replace this selector if needed
        // );
      }
    });
    setProperty(obj);
  }
  function onRemoveStyle(sudoScource, key, propertyType, setProperty) {
    let obj = {
      ...propertyType
    };
    var object = myStore.deletePropertyDeep(obj, [sudoScource, key, breakPointX]);
    var isEmpty = Object.entries(object[sudoScource][key]).length === 0 ? true : false;
    var objectX = isEmpty ? myStore.deletePropertyDeep(object, [sudoScource, key]) : object;
    setProperty(objectX);
  }
  function onBulkAddStyle(sudoSource, cssObj, propertyType, setProperty) {
    let obj = {
      ...propertyType
    };
    obj[sudoSource] = cssObj;
    setProperty(obj);
  }
  const copyData = data => {
    navigator.clipboard.writeText(data).then(() => {
      addNotifications({
        title: "Copied to clipboard!",
        content: "Use the shortcode in page or post conent where you want to display.",
        type: "success"
      });
    }).catch(err => {});
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
    className: "",
    children: props.postData.post_content != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_items__WEBPACK_IMPORTED_MODULE_16__["default"], {
        itemsState: {
          items,
          setitems
        },
        globalOptionsState: {
          globalOptions,
          setglobalOptions
        },
        itemQueryState: {
          itemQueryArgs,
          setitemQueryArgs
        },
        customerData: customerData,
        setHelp: setHelp,
        addNotifications: addNotifications
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Settings",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
          className: "py-3",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("label", {
              htmlFor: "",
              className: "flex gap-2 items-center",
              children: ["Lazyload", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
                className: "cursor-pointer",
                title: "Click to know more",
                onClick: () => {
                  setHelp({
                    id: "lazyloadSetting",
                    enable: true
                  });
                },
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"]
                })
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_toggle__WEBPACK_IMPORTED_MODULE_14__["default"], {
              value: globalOptions?.lazyLoad,
              onChange: newVal => {
                var globalOptionsX = {
                  ...globalOptions
                };
                globalOptionsX.lazyLoad = newVal;
                setglobalOptions(globalOptionsX);
              }
            })]
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Layouts",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          className: "flex flex-wrap gap-2 items-center justify-start",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
            className: "bg-slate-700 inline-block text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
            onClick: ev => {
              seteditLayouts(!editLayouts);
            },
            children: "Customize Layouts"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
            className: "bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
            onClick: () => {
              navigator.clipboard.writeText(JSON.stringify(PostGridData.loopLayout)).then(() => {
                addNotifications({
                  title: "Copied to clipboard!",
                  content: "Layout Copied!",
                  type: "success"
                });
              });
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
              size: 14,
              fill: "#fff"
            }), "Copy"]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
            className: "bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
            onClick: async () => {
              try {
                var data = await navigator.clipboard.readText();
                var datax = JSON.parse(data);
                onChangeLayouts(datax).then(() => {
                  addNotifications({
                    title: "Layout Pasted!",
                    content: "Layout paste successful.",
                    type: "success"
                  });
                });
              } catch (e) {}
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
              size: 14,
              fill: "#fff"
            }), "Paste"]
          }), editLayouts && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
            className: "fixed h-full top-0 py-10 overflow-y-auto bg-slate-500 bg-opacity-70 left-0 w-full z-50",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: "w-[1400px] mx-auto ",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex justify-between bg-gray-700 p-3",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
                  className: "text-white text-md",
                  children: "Layout Editor"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
                    className: "size-6 bg-red-500 flex items-center justify-center cursor-pointer",
                    onClick: ev => {
                      seteditLayouts(!editLayouts);
                    },
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
                      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
                      fill: "#fff",
                      size: 18
                    })
                  })
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_layout_generator__WEBPACK_IMPORTED_MODULE_21__["default"], {
                postData: postData,
                customerData: customerData,
                addNotifications: addNotifications,
                onChange: onChangeLayouts,
                layouts: PostGridData.loopLayout
              })]
            })
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_layouts__WEBPACK_IMPORTED_MODULE_20__["default"], {
            postData: postData,
            onChangeLayouts: onChangeLayouts,
            customerData: customerData,
            addNotifications: addNotifications,
            setHelp: setHelp
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Filters", "post-grid"),
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
            className: "flex items-center justify-center gap-3 mb-4 ",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
              className: "components-button undefined pg-font flex gap-2 justify-center  cursor-pointer py-2 px-4 capitalize  !bg-gray-800 !text-white font-medium !rounded hover:!bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700",
              onClick: ev => {
                if (!customerData.isPro && globalOptions.filters.length > 1) {
                  addNotifications({
                    title: "Ooops Its Pro!",
                    content: "Adding Multiple group on avilable in pro.",
                    type: "error"
                  });
                  return;
                }
                var filters = globalOptions.filters.concat({
                  groupTitle: "",
                  type: "",
                  logic: "",
                  showPostCount: "",
                  items: []
                });
                var globalOptionsX = {
                  ...globalOptions,
                  filters: filters
                };
                setglobalOptions(globalOptionsX);
              },
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Add Filter Group", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: " components-button undefined pg-font flex gap-2 justify-center  cursor-pointer py-2 px-4 capitalize  !bg-gray-800 !text-white font-medium !rounded hover:!bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700 ",
              onClick: () => {
                navigator.clipboard.writeText(JSON.stringify(globalOptions.filters)).then(() => {
                  addNotifications({
                    title: "Copied to clipboard!",
                    content: "Filters Copied!",
                    type: "success"
                  });
                });
              },
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"],
                className: "fill-white ",
                size: 14
              }), (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Copy", "post-grid")]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: " components-button undefined pg-font flex gap-2 justify-center  cursor-pointer py-2 px-4 capitalize  !bg-gray-800 !text-white font-medium !rounded hover:!bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700 ",
              onClick: () => {
                pasteData();
              }

              // onClick={async () => {
              // 									try {
              // 										var data = await navigator.clipboard.readText();
              // 										var datax = JSON.parse(data);
              // 										onChangeLayouts(datax).then(() => {
              // 											addNotifications({
              // 												title: "Layout Pasted!",
              // 												content: "Layout paste successful.",
              // 												type: "success",
              // 											});
              // 										});
              // 									} catch (e) {
              // 									}
              // 								}}
              ,
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Icon, {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
                className: "fill-white ",
                size: 14
              }), (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Paste", "post-grid")]
            })]
          }), globalOptions?.filters?.map((x, i) => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
              title: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.Fragment, {
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
                  onClick: ev => {
                    globalOptions.filters.splice(i, 1);
                    var globalOptionsX = {
                      ...globalOptions,
                      filters: globalOptions.filters
                    };
                    setglobalOptions(globalOptionsX);
                  },
                  className: "hover:bg-red-500 bg-red-400 py-1 px-[10px] text-lg leading-normal cursor-pointer mr-2 ",
                  children: "\xD7"
                }), x.groupTitle ? x.groupTitle : "Filter Group " + i]
              }),
              initialOpen: false,
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  htmlFor: "",
                  className: "font-medium text-slate-900 ",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Group Title", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                  value: x.groupTitle,
                  onChange: newVal => {
                    globalOptions.filters[i].groupTitle = newVal;
                    var globalOptionsX = {
                      ...globalOptions,
                      filters: globalOptions.filters
                    };
                    setglobalOptions(globalOptionsX);
                  }
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  htmlFor: "",
                  className: "font-medium text-slate-900 ",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Group Type", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                  value: x.type,
                  options: [{
                    value: "inline",
                    label: "Inline"
                  }, {
                    value: "dropdown",
                    label: "Dropdown"
                  }, {
                    value: "radio",
                    label: "Radio"
                  }, {
                    value: "checkbox",
                    label: "Checkbox"
                  }],
                  onChange: newVal => {
                    globalOptions.filters[i].type = newVal;
                    var globalOptionsX = {
                      ...globalOptions,
                      filters: globalOptions.filters
                    };
                    setglobalOptions(globalOptionsX);
                  }
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  htmlFor: "",
                  className: "font-medium text-slate-900 ",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Data Logic", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                  value: x.logic,
                  options: [{
                    value: "or",
                    label: "OR"
                  }, {
                    value: "and",
                    label: "AND"
                  }],
                  onChange: newVal => {
                    globalOptions.filters[i].logic = newVal;
                    var globalOptionsX = {
                      ...globalOptions,
                      filters: globalOptions.filters
                    };
                    setglobalOptions(globalOptionsX);
                  }
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  htmlFor: "",
                  className: "font-medium text-slate-900 ",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Show Post Count", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
                  value: x.showPostCount,
                  options: [{
                    value: "no",
                    label: "No"
                  }, {
                    value: "yes",
                    label: "Yes"
                  }],
                  onChange: newVal => {
                    globalOptions.filters[i].showPostCount = newVal;
                    var globalOptionsX = {
                      ...globalOptions,
                      filters: globalOptions.filters
                    };
                    setglobalOptions(globalOptionsX);
                  }
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                for: "",
                className: "font-medium text-slate-900 my-3 ",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Search Terms", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("p", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("To add custom filter please use following format and hit Enter", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("code", {
                children: "Filter Name|filter-slug|15"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
                autoComplete: "off",
                className: "my-3",
                placeholder: "Search Categories or terms",
                value: "",
                onKeyPress: ev => {
                  if (ev.key === "Enter") {
                    var filterParts = ev.target.value.split("|");
                    var ss = globalOptions.filters[i].items.concat({
                      id: 0,
                      slug: filterParts[1],
                      title: filterParts[0],
                      count: filterParts[2]
                    });
                    globalOptions.filters[i].items = ss;
                    var globalOptionsX = {
                      ...globalOptions,
                      filters: globalOptions.filters
                    };
                    setglobalOptions(globalOptionsX);
                  }
                },
                onChange: newVal => {
                  clearTimeout(debounce);
                  debounce = setTimeout(() => {
                    if (newVal.length > 0) {
                      fetchPostTypeTerms(newVal);
                    }
                  }, 2000);
                }
              }), x.items.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
                className: "my-1",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("No terms added.", "post-grid")
              }), x.items.map((y, j) => {
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                  className: "py-2 my-1 border-b border-gray-400 flex justify-between",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
                    children: y.title
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
                      onClick: ev => {
                        var globalOptionsX = {
                          ...activeFilter.options,
                          slug: activeFilter.options.slug == y.slug ? "" : y.slug
                        };
                        setglobalOptions(globalOptionsX);
                      },
                      className: [activeFilter.options.slug == y.slug ? "bg-gray-700 hover:bg-gray-600 cursor-pointer p-1   text-white  text-sm" : "bg-gray-400 cursor-pointer p-1   text-white  text-sm"],
                      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
                        className: "dashicons dashicons-yes-alt"
                      })
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
                      onClick: ev => {
                        globalOptions.filters[i].items.splice(j, 1);
                        var globalOptionsX = {
                          ...globalOptions,
                          filters: globalOptions.filters
                        };
                        setglobalOptions(globalOptionsX);
                      },
                      className: "cursor-pointer p-1  text-white bg-red-600 text-sm",
                      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
                        className: "dashicon dashicons dashicons-no-alt"
                      })
                    })]
                  })]
                });
              }), isBusy && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
                className: "border-b border-gray-400 my-2 pb-1 bg-gray-200 p-2",
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.Spinner, {})
              }), filterableTerms.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
                className: "bg-gray-200 p-2 mt-2",
                children: filterableTerms.map(x => {
                  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                    title: "Click Add terms",
                    className: "border-b border-gray-400 my-2 pb-1 cursor-pointer",
                    onClick: ev => {
                      if (x.slug) {
                        var ss = globalOptions.filters[i].items.concat({
                          id: x.term_id,
                          slug: x.slug,
                          title: x.name,
                          count: x.count
                        });
                        globalOptions.filters[i].items = ss;
                        var globalOptionsX = {
                          ...globalOptions,
                          filters: globalOptions.filters
                        };
                        setglobalOptions(globalOptionsX);
                      }
                    },
                    children: [x.name, " (", x.count, ")"]
                  });
                })
              })]
            });
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enable Multifilter", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
            label: "",
            value: globalOptions.multifilter,
            options: [{
              label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("True", "post-grid"),
              value: true
            }, {
              label: "False",
              value: false
            }],
            onChange: newVal => {
              if (!customerData.isPro) {
                addNotifications({
                  title: "Ooops Its Pro!",
                  content: "Multifilter only avilable in pro.",
                  type: "error"
                });
                return;
              }
              var globalOptionsX = {
                ...globalOptions,
                multifilter: newVal
              };
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Enable Filter Toggle", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
            label: "",
            value: globalOptions.filterToggle,
            options: [{
              label: "Yes",
              value: "yes"
            }, {
              label: "No",
              value: "no"
            }],
            onChange: newVal => {
              if (!customerData.isPro) {
                addNotifications({
                  title: "Ooops Its Pro!",
                  content: "Filter Toggle Only avilable in pro.",
                  type: "error"
                });
                return;
              }
              var globalOptionsX = {
                ...globalOptions,
                filterToggle: newVal
              };
              setglobalOptions(globalOptionsX);
            }
          })]
        }), globalOptions.multifilter && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
              htmlFor: "",
              className: "font-medium text-slate-900 ",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Logic Within Group", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
              label: "",
              value: globalOptions.logicWithinGroup,
              options: [{
                label: "OR",
                value: "or"
              }, {
                label: "AND",
                value: "and"
              }],
              onChange: newVal => {
                if (!customerData.isPro) {
                  addNotifications({
                    title: "Ooops Its Pro!",
                    content: "Multifilter Only avilable in pro.",
                    type: "error"
                  });
                  return;
                }
                var globalOptionsX = {
                  ...globalOptions,
                  logicWithinGroup: newVal
                };
                setglobalOptions(globalOptionsX);
              }
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
              htmlFor: "",
              className: "font-medium text-slate-900 ",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Logic Between Groups", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
              label: "",
              value: globalOptions.logicBetweenGroups,
              options: [{
                label: "OR",
                value: "or"
              }, {
                label: "AND",
                value: "and"
              }],
              onChange: newVal => {
                if (!customerData.isPro) {
                  addNotifications({
                    title: "Ooops Its Pro!",
                    content: "Multifilter Only avilable in pro.",
                    type: "error"
                  });
                  return;
                }
                var globalOptionsX = {
                  ...globalOptions,
                  logicBetweenGroups: newVal
                };
                setglobalOptions(globalOptionsX);
              }
            })]
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Show Sort Filter", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
            label: "",
            value: globalOptions.showSort,
            options: [{
              label: "No",
              value: "no"
            }, {
              label: "Yes",
              value: "yes"
            }],
            onChange: newVal => {
              if (!customerData.isPro) {
                addNotifications({
                  title: "Ooops Its Pro!",
                  content: "Multifilter Only avilable in pro.",
                  type: "error"
                });
                return;
              }
              var globalOptionsX = {
                ...globalOptions,
                showSort: newVal
              };
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Show Random Filter", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
            label: "",
            value: globalOptions.showRandom,
            options: [{
              label: "No",
              value: "no"
            }, {
              label: "Yes",
              value: "yes"
            }],
            onChange: newVal => {
              if (!customerData.isPro) {
                addNotifications({
                  title: "Ooops Its Pro!",
                  content: "Multifilter Only avilable in pro.",
                  type: "error"
                });
                return;
              }
              var globalOptionsX = {
                ...globalOptions,
                showRandom: newVal
              };
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Show Clear Filter", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
            label: "",
            value: globalOptions.showClear,
            options: [{
              label: "No",
              value: "no"
            }, {
              label: "Yes",
              value: "yes"
            }],
            onChange: newVal => {
              if (!customerData.isPro) {
                addNotifications({
                  title: "Ooops Its Pro!",
                  content: "Multifilter Only avilable in pro.",
                  type: "error"
                });
                return;
              }
              var globalOptionsX = {
                ...globalOptions,
                showClear: newVal
              };
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Show All Filter", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.SelectControl, {
            label: "",
            value: globalOptions.showAll,
            options: [{
              label: "No",
              value: "no"
            }, {
              label: "Yes",
              value: "yes"
            }],
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions,
                showAll: newVal
              };
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Items Per Page", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.__experimentalInputControl, {
            type: "number",
            value: globalOptions.perPage != undefined ? globalOptions.perPage : 6,
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions,
                perPage: newVal
              };
              setglobalOptions(globalOptionsX);
            }
          })]
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Filters Style", "post-grid"),
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Filter Item", "post-grid"),
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
            obj: filterItem,
            onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, filterItem, setfilterItem),
            onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, filterItem, setfilterItem),
            onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, filterItem, setfilterItem),
            onReset: sudoSources => onResetStyle(sudoSources, filterItem, setfilterItem),
            onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, filterItem, setfilterItem)
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Active Filter", "post-grid"),
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
            obj: activeFilter,
            onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, activeFilter, setactiveFilter),
            onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, activeFilter, setactiveFilter),
            onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, activeFilter, setactiveFilter),
            onReset: sudoSources => onResetStyle(sudoSources, activeFilter, setactiveFilter),
            onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, activeFilter, setactiveFilter)
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Filter Group Wrap", "post-grid"),
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
            obj: filterGroupWrap,
            onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, filterGroupWrap, setfilterGroupWrap),
            onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, filterGroupWrap, setfilterGroupWrap),
            onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, filterGroupWrap, setfilterGroupWrap),
            onReset: sudoSources => onResetStyle(sudoSources, filterGroupWrap, setfilterGroupWrap),
            onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, filterGroupWrap, setfilterGroupWrap)
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Filter Group", "post-grid"),
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
            obj: filterGroup,
            onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, filterGroup, setfilterGroup),
            onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, filterGroup, setfilterGroup),
            onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, filterGroup, setfilterGroup),
            onReset: sudoSources => onResetStyle(sudoSources, filterGroup, setfilterGroup),
            onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, filterGroup, setfilterGroup)
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Filter Group Title", "post-grid"),
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
            obj: filterGroupTitle,
            onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, filterGroupTitle, setfilterGroup),
            onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, filterGroupTitle, setfilterGroup),
            onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, filterGroupTitle, setfilterGroup),
            onReset: sudoSources => onResetStyle(sudoSources, filterGroupTitle, setfilterGroup),
            onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, filterGroupTitle, setfilterGroup)
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Wrapper",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_28__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                value: wrapper?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...wrapper,
                    options: {
                      ...wrapper?.options,
                      class: newVal
                    }
                  };
                  setwrapper(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
              obj: wrapper,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, wrapper, setwrapper),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, wrapper, setwrapper),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, wrapper, setwrapper),
              onReset: sudoSources => onResetStyle(sudoSources, wrapper, setwrapper),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, wrapper, setwrapper)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Items Wrap",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_28__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                value: itemsWrap?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...itemsWrap,
                    options: {
                      ...itemsWrap?.options,
                      class: newVal
                    }
                  };
                  setitemsWrap(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
              obj: itemsWrap,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, itemsWrap, setitemsWrap),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, itemsWrap, setitemsWrap),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, itemsWrap, setitemsWrap),
              onReset: sudoSources => onResetStyle(sudoSources, itemsWrap, setitemsWrap),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, itemsWrap, setitemsWrap)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Item",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_28__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                value: itemWrap?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...itemWrap,
                    options: {
                      ...itemWrap?.options,
                      class: newVal
                    }
                  };
                  setitemWrap(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
              obj: itemWrap,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, itemWrap, setitemWrap),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, itemWrap, setitemWrap),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, itemWrap, setitemWrap),
              onReset: sudoSources => onResetStyle(sudoSources, itemWrap, setitemWrap),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, itemWrap, setitemWrap)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Pagination",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          className: "my-4",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pagination Type", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_10__["default"], {
            position: "bottom right",
            variant: "secondary",
            options: paginationTypes,
            buttonTitle: paginationTypes[globalOptions?.pagination?.type] != undefined ? paginationTypes[globalOptions.pagination.type].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Choose", "post-grid"),
            onChange: (arg, index) => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.type = arg.value;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            },
            values: ""
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Previous Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
            value: globalOptions?.pagination?.previousText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.previousText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Next Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
            value: globalOptions?.pagination?.nextText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.nextText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Previous Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_icon_picker__WEBPACK_IMPORTED_MODULE_11__["default"], {
            library: globalOptions?.pagination?.previousIcon?.library,
            srcType: globalOptions?.pagination?.previousIcon?.srcType,
            iconSrc: globalOptions?.pagination?.previousIcon?.iconSrc,
            class: globalOptions?.pagination?.previousIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.previousIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Next Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_icon_picker__WEBPACK_IMPORTED_MODULE_11__["default"], {
            library: globalOptions?.pagination?.nextIcon?.library,
            srcType: globalOptions?.pagination?.nextIcon?.srcType,
            iconSrc: globalOptions?.pagination?.nextIcon?.iconSrc,
            class: globalOptions?.pagination?.nextIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.nextIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Pagination Wrap",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_28__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: paginationWrap?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationWrap,
                      options: {
                        ...paginationWrap?.options,
                        class: newVal
                      }
                    };
                    setpaginationWrap(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
                obj: paginationWrap,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationWrap, setpaginationWrap),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationWrap, setpaginationWrap),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationWrap, setpaginationWrap),
                onReset: sudoSources => onResetStyle(sudoSources, paginationWrap, setpaginationWrap),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationWrap, setpaginationWrap)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Pagination Item",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_28__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: paginationItem?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationItem,
                      options: {
                        ...paginationItem?.options,
                        class: newVal
                      }
                    };
                    setpaginationItem(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
                obj: paginationItem,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationItem, setpaginationItem),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationItem, setpaginationItem),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationItem, setpaginationItem),
                onReset: sudoSources => onResetStyle(sudoSources, paginationItem, setpaginationItem),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationItem, setpaginationItem)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "pagination Item Active",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_28__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_13__["default"], {
                  value: paginationItemActive?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationItemActive,
                      options: {
                        ...paginationItemActive?.options,
                        class: newVal
                      }
                    };
                    setpaginationItemActive(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_18__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_17__["default"], {
                obj: paginationItemActive,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationItemActive, setpaginationItemActive),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationItemActive, setpaginationItemActive),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationItemActive, setpaginationItemActive),
                onReset: sudoSources => onResetStyle(sudoSources, paginationItemActive, setpaginationItemActive),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationItemActive, setpaginationItemActive)
              })
            })]
          })
        })]
      })]
    })
  });
}
class EditFilterable extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true,
      isLoaded: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }
  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }
  render() {
    var {
      onChange,
      onChangeStyleObj,
      postData,
      customerData,
      addNotifications,
      setHelp
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(Html, {
      onChange: onChange,
      onChangeStyleObj: onChangeStyleObj,
      addNotifications: addNotifications,
      postData: postData,
      customerData: customerData,
      setHelp: setHelp,
      warn: this.state.showWarning,
      isLoaded: this.state.isLoaded
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (EditFilterable);

/***/ }),

/***/ "./src/components/Builder/edit-grid.js":
/*!*********************************************!*\
  !*** ./src/components/Builder/edit-grid.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_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_core_data__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__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 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_hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__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_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/help.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/copy.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/page.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/settings.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/brush.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/pages.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _dropdown__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _input_select__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _input_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../input-toggle */ "./src/components/input-toggle/index.js");
/* harmony import */ var _input_wp_editor__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../input-wp-editor */ "./src/components/input-wp-editor/index.js");
/* harmony import */ var _layout_generator__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../layout-generator */ "./src/components/layout-generator/index.js");
/* harmony import */ var _styles__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../styles */ "./src/components/styles/index.js");
/* harmony import */ var _tab__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../tab */ "./src/components/tab/index.js");
/* harmony import */ var _tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _items__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../items */ "./src/components/items/index.js");
/* harmony import */ var _layouts__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./layouts */ "./src/components/Builder/layouts.js");
/* harmony import */ var _pagination_types__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./pagination-types */ "./src/components/Builder/pagination-types.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_toggle__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../../components/toggle */ "./src/components/toggle/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;

























var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var onChange = props.onChange;
  var onChangeStyleObj = props.onChangeStyleObj;
  var addNotifications = props.addNotifications;
  var setHelp = props.setHelp;
  var postData = props.postData;
  if (postData.post_content == null) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
      className: "p-3 my-5 bg-orange-400",
      children: "Please choose an Post Grid first."
    });
  }
  var breakPointX = "Desktop";
  var [PostGridData, setPostGridData] = useState(postData.post_content);
  var [globalOptions, setglobalOptions] = useState(PostGridData.globalOptions);
  var [itemQueryArgs, setitemQueryArgs] = useState(PostGridData.itemQueryArgs);

  /*Selectors*/
  var [wrapper, setwrapper] = useState(PostGridData.wrapper);
  var [loopLayout, setloopLayout] = useState(PostGridData.loopLayout);
  var [items, setitems] = useState(PostGridData.items);
  var [itemsWrap, setitemsWrap] = useState(PostGridData.itemsWrap);
  var [itemWrap, setitemWrap] = useState(PostGridData.itemWrap);
  var [nthItemStyle, setnthItemStyle] = useState(PostGridData.nthItemStyle);
  var [paginationWrap, setpaginationWrap] = useState(PostGridData.paginationWrap);
  var [paginationItem, setpaginationItem] = useState(PostGridData.paginationItem);
  var [paginationItemActive, setpaginationItemActive] = useState(PostGridData.paginationItemActive);
  var [styleObj, setstyleObj] = useState({});
  var [customerData, setcustomerData] = useState(props.customerData);
  var [isProFeature, setisProFeature] = useState(true);
  var [editLayouts, seteditLayouts] = useState(false);
  var wrapperSelector = "#post-grid-" + postData.ID;
  var itemsWrapSelector = wrapperSelector + " > .items";
  var itemWrapSelector = wrapperSelector + " > .items > .item";
  var paginationWrapSelector = wrapperSelector + " > .pagination";
  var paginationItemSelector = wrapperSelector + " > .pagination .page-numbers";
  var paginationItemActiveSelector = wrapperSelector + " > .pagination .page-numbers.current";
  var id = postData.ID;
  var paginationTypesX = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_5__.applyFilters)('PostGridPaginationTypes', _pagination_types__WEBPACK_IMPORTED_MODULE_20__.paginationTypes);
  var breakPointList = [{
    label: "Select..",
    icon: "",
    value: ""
  }];
  for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
    var breakPointItem = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
    breakPointList.push({
      label: breakPointItem.name,
      icon: breakPointItem.icon,
      value: breakPointItem.id
    });
  }
  useEffect(() => {
    if (customerData.isPro) {
      setisProFeature(false);
    }
  }, [props.customerData]);
  useEffect(() => {
    onChange(PostGridData);
  }, [PostGridData]);
  useEffect(() => {
    if (Object.entries(styleObj).length > 0) {
      onChangeStyleObj(styleObj);
    }
  }, [styleObj]);
  useEffect(() => {
    var styles = generateStyleObj();
    setstyleObj(styles);
  }, [PostGridData]);
  function generateStyleObj() {
    var styleObjX = {};

    // wrapper
    var wrapperX = {
      ...PostGridData.wrapper
    };
    var wrapperStyles = myStore.deletePropertyDeep(wrapperX, ['options']);
    styleObjX[wrapperSelector] = wrapperStyles;
    var itemsWrapX = {
      ...PostGridData.itemsWrap
    };
    var itemsWrapStyles = myStore.deletePropertyDeep(itemsWrapX, ['options']);
    styleObjX[itemsWrapSelector] = itemsWrapStyles;
    var itemWrapX = {
      ...PostGridData.itemWrap
    };
    var itemWrapStyles = myStore.deletePropertyDeep(itemWrapX, ['options']);
    styleObjX[itemWrapSelector] = itemWrapStyles;
    var paginationWrapX = {
      ...PostGridData.paginationWrap
    };
    var paginationWrapStyles = myStore.deletePropertyDeep(paginationWrapX, ['options']);
    styleObjX[paginationWrapSelector] = paginationWrapStyles;
    var paginationItemX = {
      ...PostGridData.paginationItem
    };
    var paginationItemStyles = myStore.deletePropertyDeep(paginationItemX, ['options']);
    styleObjX[paginationItemSelector] = paginationItemStyles;
    var paginationItemActiveX = {
      ...PostGridData.paginationItemActive
    };
    var paginationItemActiveStyles = myStore.deletePropertyDeep(paginationItemActiveX, ['options']);
    styleObjX[paginationItemActiveSelector] = paginationItemActiveStyles;
    var loopLayoutFlatArry = myStore.flattenObject(PostGridData.loopLayout);
    loopLayoutFlatArry.map(element => {
      var elementId = element.id;
      var elementHdnle = "#element-" + elementId;
      var cssSelectors = element.cssSelectors;
      if (cssSelectors != undefined) {
        Object.entries(cssSelectors).map(args => {
          var elementSubIndex = args[0];
          var elementStylesObj = args[1];
          var itemhdnle = elementStylesObj?.handle == undefined ? elementHdnle : elementStylesObj?.handle;
          if (itemhdnle.length == 0) {
            var elementSubHdnle = wrapperSelector + ' ' + elementHdnle;
          } else {
            var elementSubHdnle = wrapperSelector + ' ' + elementHdnle + ' ' + itemhdnle;
          }
          var elementStylesObjX = {
            ...elementStylesObj
          };
          delete elementStylesObjX.handle;
          delete elementStylesObjX.label;
          styleObjX[elementSubHdnle] = elementStylesObjX;
        });
      }
    });

    //nthItemStyle
    nthItemStyle?.map((element, index) => {
      var elementId = element.id;
      var loopItemHdnle = wrapperSelector + ' ' + ".loop-item-" + index;
      styleObjX[loopItemHdnle] = element;

      // if (cssSelectors != undefined) {
      // 	Object.entries(cssSelectors).map(args => {

      // 		var elementSubIndex = args[0];
      // 		var elementStylesObj = args[1];
      // 		var itemhdnle = elementStylesObj?.handle == undefined ? elementHdnle : elementStylesObj?.handle;

      // 		if (itemhdnle.length == 0) {
      // 			var elementSubHdnle = wrapperSelector + ' ' + elementHdnle;
      // 		} else {
      // 			var elementSubHdnle = wrapperSelector + ' ' + elementHdnle + ' ' + itemhdnle;
      // 		}
      // 		var elementStylesObjX = { ...elementStylesObj }
      // 		delete elementStylesObjX.handle
      // 		delete elementStylesObjX.label

      // 		styleObjX[elementSubHdnle] = elementStylesObjX

      // 	})
      // }
    });
    return styleObjX;
    //setstyleObj(styleObjX)
  }
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.globalOptions = globalOptions;
    setPostGridData(PostGridDataX);
  }, [globalOptions]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemQueryArgs = itemQueryArgs;
    setPostGridData(PostGridDataX);
  }, [itemQueryArgs]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemsWrap = itemsWrap;
    setPostGridData(PostGridDataX);
  }, [itemsWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemWrap = itemWrap;
    setPostGridData(PostGridDataX);
  }, [itemWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.items = items;
    setPostGridData(PostGridDataX);
  }, [items]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.wrapper = wrapper;
    setPostGridData(PostGridDataX);
  }, [wrapper]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.loopLayout = loopLayout;
    setPostGridData(PostGridDataX);
  }, [loopLayout]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.nthItemStyle = nthItemStyle;
    setPostGridData(PostGridDataX);
  }, [nthItemStyle]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationWrap = paginationWrap;
    setPostGridData(PostGridDataX);
  }, [paginationWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationItem = paginationItem;
    setPostGridData(PostGridDataX);
  }, [paginationItem]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationItemActive = paginationItemActive;
    setPostGridData(PostGridDataX);
  }, [paginationItemActive]);
  function onChangeLayouts(loopLayout) {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.loopLayout = loopLayout;
    setPostGridData(PostGridDataX);
    setloopLayout(loopLayout);
  }
  function onChangeStyle(sudoScource, newVal, attr, propertyType, setProperty) {
    var path = [sudoScource, attr, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.updatePropertyDeep(obj, path, newVal);
    setProperty(object);
  }
  function onAddStyle(sudoScource, key, propertyType, setProperty) {
    var path = [sudoScource, key, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.addPropertyDeep(obj, path, "");
    setProperty(object);
  }
  function onResetStyle(sudoSources, propertyType, setProperty) {
    let obj = Object.assign({}, propertyType);
    Object.entries(sudoSources).map(args => {
      var sudoScource = args[0];
      if (obj[sudoScource] == undefined) {} else {
        obj[sudoScource] = {};
      }
    });
    setProperty(obj);
  }
  function onRemoveStyle(sudoScource, key, propertyType, setProperty) {
    let obj = {
      ...propertyType
    };
    var object = myStore.deletePropertyDeep(obj, [sudoScource, key, breakPointX]);
    var isEmpty = Object.entries(object[sudoScource][key]).length === 0 ? true : false;
    var objectX = isEmpty ? myStore.deletePropertyDeep(object, [sudoScource, key]) : object;
    setProperty(objectX);
  }
  function onBulkAddStyle(sudoSource, cssObj, propertyType, setProperty) {
    let obj = {
      ...propertyType
    };
    obj[sudoSource] = cssObj;
    setProperty(obj);
  }

  // nth items CSS

  function onAddStyleNthItem(sudoScource, key, propertyType, extra) {
    var index = extra.index;
    var path = [sudoScource, key, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.addPropertyDeep(obj, path, "");
    // setProperty(object);
    var nthItemStyleX = [...nthItemStyle];
    nthItemStyleX[index] = object;
    setnthItemStyle(nthItemStyleX);
  }
  function onChangeStyleNthItem(sudoScource, newVal, attr, propertyType, extra) {
    var index = extra.index;
    var path = [sudoScource, attr, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.updatePropertyDeep(obj, path, newVal);
    // setProperty(object);

    var nthItemStyleX = [...nthItemStyle];
    nthItemStyleX[index] = object;
    setnthItemStyle(nthItemStyleX);
  }
  function onRemoveStyleNthItem(sudoScource, key, propertyType, extra) {
    var index = extra.index;
    let obj = {
      ...propertyType
    };
    var object = myStore.deletePropertyDeep(obj, [sudoScource, key, breakPointX]);
    var isEmpty = Object.entries(object[sudoScource][key]).length === 0 ? true : false;
    var objectX = isEmpty ? myStore.deletePropertyDeep(object, [sudoScource, key]) : object;
    // setProperty(objectX);

    var nthItemStyleX = [...nthItemStyle];
    nthItemStyleX[index] = objectX;
    setnthItemStyle(nthItemStyleX);
  }
  function onResetNthItem(sudoSources, propertyType, extra) {
    var index = extra.index;
    let obj = Object.assign({}, propertyType);
    Object.entries(sudoSources).map(args => {
      var sudoScource = args[0];
      if (obj[sudoScource] == undefined) {} else {
        obj[sudoScource] = {};
      }
    });
    // setProperty(obj);

    var nthItemStyleX = [...nthItemStyle];
    nthItemStyleX[index] = obj;
    setnthItemStyle(nthItemStyleX);
  }
  function onBulkAddStyleNthItem(sudoSource, cssObj, propertyType, extra) {
    var index = extra.index;
    let obj = {
      ...propertyType
    };
    obj[sudoSource] = cssObj;
    // setProperty(obj);

    var nthItemStyleX = [...nthItemStyle];
    nthItemStyleX[index] = obj;
    setnthItemStyle(nthItemStyleX);
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
    className: "",
    children: props.postData.post_content != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_items__WEBPACK_IMPORTED_MODULE_18__["default"], {
        itemsState: {
          items,
          setitems
        },
        globalOptionsState: {
          globalOptions,
          setglobalOptions
        },
        itemQueryState: {
          itemQueryArgs,
          setitemQueryArgs
        },
        customerData: customerData,
        setHelp: setHelp,
        addNotifications: addNotifications
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Settings",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
          className: "py-3",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("label", {
              htmlFor: "",
              className: "flex gap-2 items-center",
              children: ["Lazyload", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                className: "cursor-pointer",
                title: "Click to know more",
                onClick: () => {
                  setHelp({
                    id: "lazyloadSetting",
                    enable: true
                  });
                },
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"]
                })
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_toggle__WEBPACK_IMPORTED_MODULE_12__["default"], {
              value: globalOptions?.lazyLoad,
              onChange: newVal => {
                var globalOptionsX = {
                  ...globalOptions
                };
                globalOptionsX.lazyLoad = newVal;
                setglobalOptions(globalOptionsX);
              }
            })]
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Layouts",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          className: "flex flex-wrap gap-2 items-center justify-start",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
            className: "bg-slate-700 inline-block text-white px-3 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
            onClick: ev => {
              seteditLayouts(!editLayouts);
            },
            children: "Customize Layouts"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
            className: "bg-slate-700 text-white px-3 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
            onClick: () => {
              navigator.clipboard.writeText(JSON.stringify(PostGridData.loopLayout)).then(() => {
                addNotifications({
                  title: "Copied to clipboard!",
                  content: "Layout Copied!",
                  type: "success"
                });
              });
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
              size: 14,
              fill: "#fff"
            }), "Copy"]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
            className: "bg-slate-700 text-white px-3 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
            onClick: async () => {
              try {
                var data = await navigator.clipboard.readText();
                var datax = JSON.parse(data);
                onChangeLayouts(datax).then(() => {
                  addNotifications({
                    title: "Layout Pasted!",
                    content: "Layout paste successful.",
                    type: "success"
                  });
                });
              } catch (e) {}
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
              size: 14,
              fill: "#fff"
            }), "Paste"]
          }), editLayouts && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
            className: "fixed h-full top-0 py-10 overflow-y-auto bg-slate-500 bg-opacity-70 left-0 w-full z-50",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "w-[1400px] mx-auto ",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex justify-between bg-gray-700 p-3",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                  className: "text-white text-md",
                  children: "Layout Editor"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                    className: "size-6 bg-red-500 flex items-center justify-center cursor-pointer",
                    onClick: ev => {
                      seteditLayouts(!editLayouts);
                    },
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
                      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
                      fill: "#fff",
                      size: 18
                    })
                  })
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_layout_generator__WEBPACK_IMPORTED_MODULE_14__["default"], {
                postData: postData,
                customerData: customerData,
                addNotifications: addNotifications,
                onChange: onChangeLayouts,
                layouts: PostGridData.loopLayout
              })]
            })
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_layouts__WEBPACK_IMPORTED_MODULE_19__["default"], {
            postData: postData,
            onChangeLayouts: onChangeLayouts,
            customerData: customerData,
            addNotifications: addNotifications,
            setHelp: setHelp
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Wrapper",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_28__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                value: wrapper?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...wrapper,
                    options: {
                      ...wrapper?.options,
                      class: newVal
                    }
                  };
                  setwrapper(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
              obj: wrapper,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, wrapper, setwrapper),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, wrapper, setwrapper),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, wrapper, setwrapper),
              onReset: sudoSources => onResetStyle(sudoSources, wrapper, setwrapper),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, wrapper, setwrapper)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody
      // title="N'th Item CSS"
      , {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("N'th Item CSS", "post-grid"),
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          className: "justify-start gap-2 mb-3",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("button", {
            onClick: ev => {
              if (!customerData.isPro) {
                addNotifications({
                  title: "Opps its pro!",
                  content: "This feature is avilable in pro.",
                  type: "error"
                });
                return;
              }
              var nthItemStyleX = [...nthItemStyle];
              nthItemStyleX.push({});
              // setAttributes({ nthItemStyle: nthItemStyleX });

              setnthItemStyle(nthItemStyleX);
            },
            className: " flex gap-2 justify-center items-center cursor-pointer py-2 px-3 capitalize  !bg-gray-700 !text-white font-medium !rounded hover:bg-gray-600 hover:text-white focus:outline-none focus:bg-gray-600",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Add", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("button", {
            onClick: () => {
              navigator.clipboard.writeText(JSON.stringify(nthItemStyle)).then(() => {
                addNotifications({
                  title: "Copied to clipboard!",
                  content: "Nth Styles Copied!",
                  type: "success"
                });
              });
            },
            className: " flex gap-2 justify-center items-center cursor-pointer py-2 px-3 capitalize  !bg-gray-700 !text-white font-medium !rounded hover:bg-gray-600 hover:text-white focus:outline-none focus:bg-gray-600",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
              className: "fill-white ",
              size: 14
            }), (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Copy", "post-grid")]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("button", {
            onClick: async () => {
              try {
                var data = await navigator.clipboard.readText();
                var datax = JSON.parse(data);
                setnthItemStyle(datax);
                addNotifications({
                  title: "Layout Pasted!",
                  content: "Layout paste successful.",
                  type: "success"
                });
              } catch (e) {}
            },
            className: " flex gap-2 justify-center items-center cursor-pointer py-2 px-3 capitalize  !bg-gray-700 !text-white font-medium !rounded hover:bg-gray-600 hover:text-white focus:outline-none focus:bg-gray-600",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_30__["default"],
              className: "fill-white ",
              size: 14
            }), (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Paste", "post-grid")]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("button", {
            onClick: ev => {
              var nthItemStyleX = [...nthItemStyle];
              setnthItemStyle([]);
            },
            className: " flex gap-2 justify-center items-center cursor-pointer py-2 px-3 capitalize  !bg-gray-700 !text-white font-medium !rounded hover:bg-gray-600 hover:text-white focus:outline-none focus:bg-gray-600",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Clear", "post-grid")
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__.ReactSortable, {
          list: nthItemStyle,
          handle: ".handle",
          setList: item => {
            // var nthItemStyleX = [...nthItemStyle];
            // setAttributes({ nthItemStyle: { ...nthItemStyle, nthItemStyle: item } });
          },
          children: nthItemStyle != undefined && nthItemStyle?.map((item, index) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
            className: "",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
              title: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.Fragment, {
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                  className: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
                  onClick: ev => {
                    var nthItemStyleX = [...nthItemStyle];
                    nthItemStyleX.splice(index, 1);
                    setnthItemStyle(nthItemStyleX);
                  },
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
                    icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"]
                  })
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                  className: "mx-2",
                  children: index + 1
                })]
              }),
              initialOpen: false,
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
                obj: item,
                extra: {
                  index: index
                },
                onAdd: (sudoScource, key) => onAddStyleNthItem(sudoScource, key, item, {
                  index: index
                }),
                onChange: (sudoScource, newVal, attr) => onChangeStyleNthItem(sudoScource, newVal, attr, item, {
                  index: index
                })

                // onRemove={onRemoveStyleNthItem}
                // onBulkAdd={onBulkAddNthItem}
                // onReset={onResetNthItem}
                ,

                onRemove: (sudoScource, key) => onRemoveStyleNthItem(sudoScource, key, item, {
                  index: index
                }),
                onReset: sudoSources => onResetNthItem(sudoSources, item, {
                  index: index
                }),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyleNthItem(sudoSource, cssObj, item, {
                  index: index
                })
              })
            })
          }, item.id))
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Items Wrap",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_28__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                value: itemsWrap?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...itemsWrap,
                    options: {
                      ...itemsWrap?.options,
                      class: newVal
                    }
                  };
                  setitemsWrap(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
              obj: itemsWrap,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, itemsWrap, setitemsWrap),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, itemsWrap, setitemsWrap),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, itemsWrap, setitemsWrap),
              onReset: sudoSources => onResetStyle(sudoSources, itemsWrap, setitemsWrap),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, itemsWrap, setitemsWrap)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Item",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_28__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                value: itemWrap?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...itemWrap,
                    options: {
                      ...itemWrap?.options,
                      class: newVal
                    }
                  };
                  setitemWrap(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
              obj: itemWrap,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, itemWrap, setitemWrap),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, itemWrap, setitemWrap),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, itemWrap, setitemWrap),
              onReset: sudoSources => onResetStyle(sudoSources, itemWrap, setitemWrap),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, itemWrap, setitemWrap)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Pagination",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          className: "my-4",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pagination Type", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_9__["default"], {
            position: "bottom right",
            variant: "secondary",
            options: paginationTypesX,
            buttonTitle: paginationTypesX[globalOptions?.pagination?.type] != undefined ? paginationTypesX[globalOptions.pagination.type].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Choose", "post-grid"),
            onChange: (arg, index) => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.type = arg.value;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            },
            values: ""
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Previous Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.previousText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.previousText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Next Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.nextText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.nextText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Load More Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.loadMoreText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.loadMoreText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Loading Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.loadingText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.loadingText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("No Post Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.noPostText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.noPostText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Loading Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_21__["default"], {
            library: globalOptions?.pagination?.loadingIcon?.library,
            srcType: globalOptions?.pagination?.loadingIcon?.srcType,
            iconSrc: globalOptions?.pagination?.loadingIcon?.iconSrc,
            class: globalOptions?.pagination?.loadingIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.loadingIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Load More Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_21__["default"], {
            library: globalOptions?.pagination?.loadMoreIcon?.library,
            srcType: globalOptions?.pagination?.loadMoreIcon?.srcType,
            iconSrc: globalOptions?.pagination?.loadMoreIcon?.iconSrc,
            class: globalOptions?.pagination?.loadMoreIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.loadMoreIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Previous Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_21__["default"], {
            library: globalOptions?.pagination?.previousIcon?.library,
            srcType: globalOptions?.pagination?.previousIcon?.srcType,
            iconSrc: globalOptions?.pagination?.previousIcon?.iconSrc,
            class: globalOptions?.pagination?.previousIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.previousIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Next Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_21__["default"], {
            library: globalOptions?.pagination?.nextIcon?.library,
            srcType: globalOptions?.pagination?.nextIcon?.srcType,
            iconSrc: globalOptions?.pagination?.nextIcon?.iconSrc,
            class: globalOptions?.pagination?.nextIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.nextIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Pagination Wrap",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_28__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                  value: paginationWrap?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationWrap,
                      options: {
                        ...paginationWrap?.options,
                        class: newVal
                      }
                    };
                    setpaginationWrap(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
                obj: paginationWrap,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationWrap, setpaginationWrap),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationWrap, setpaginationWrap),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationWrap, setpaginationWrap),
                onReset: sudoSources => onResetStyle(sudoSources, paginationWrap, setpaginationWrap),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationWrap, setpaginationWrap)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Pagination Item",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_28__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                  value: paginationItem?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationItem,
                      options: {
                        ...paginationItem?.options,
                        class: newVal
                      }
                    };
                    setpaginationItem(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
                obj: paginationItem,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationItem, setpaginationItem),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationItem, setpaginationItem),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationItem, setpaginationItem),
                onReset: sudoSources => onResetStyle(sudoSources, paginationItem, setpaginationItem),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationItem, setpaginationItem)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "pagination Item Active",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_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_28__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                  value: paginationItemActive?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationItemActive,
                      options: {
                        ...paginationItemActive?.options,
                        class: newVal
                      }
                    };
                    setpaginationItemActive(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
                obj: paginationItemActive,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationItemActive, setpaginationItemActive),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationItemActive, setpaginationItemActive),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationItemActive, setpaginationItemActive),
                onReset: sudoSources => onResetStyle(sudoSources, paginationItemActive, setpaginationItemActive),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationItemActive, setpaginationItemActive)
              })
            })]
          })
        })]
      })]
    })
  });
}
class EditGrid extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true,
      isLoaded: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }
  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }
  render() {
    var {
      onChange,
      onChangeStyleObj,
      postData,
      customerData,
      addNotifications,
      setHelp
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(Html, {
      onChange: onChange,
      onChangeStyleObj: onChangeStyleObj,
      addNotifications: addNotifications,
      postData: postData,
      customerData: customerData,
      setHelp: setHelp,
      warn: this.state.showWarning,
      isLoaded: this.state.isLoaded
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (EditGrid);

/***/ }),

/***/ "./src/components/Builder/edit-masonry.js":
/*!************************************************!*\
  !*** ./src/components/Builder/edit-masonry.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_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_core_data__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/core-data */ "@wordpress/core-data");
/* harmony import */ var _wordpress_core_data__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/data */ "@wordpress/data");
/* harmony import */ var _wordpress_data__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_data__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 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_hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__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_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/help.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/copy.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/page.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/brush.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _dropdown__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _input_select__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _input_toggle__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../input-toggle */ "./src/components/input-toggle/index.js");
/* harmony import */ var _input_wp_editor__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../input-wp-editor */ "./src/components/input-wp-editor/index.js");
/* harmony import */ var _layout_generator__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../layout-generator */ "./src/components/layout-generator/index.js");
/* harmony import */ var _styles__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../styles */ "./src/components/styles/index.js");
/* harmony import */ var _tab__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../tab */ "./src/components/tab/index.js");
/* harmony import */ var _tabs__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _items__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../items */ "./src/components/items/index.js");
/* harmony import */ var _layouts__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./layouts */ "./src/components/Builder/layouts.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 _pagination_types__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./pagination-types */ "./src/components/Builder/pagination-types.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;
























var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var onChange = props.onChange;
  var onChangeStyleObj = props.onChangeStyleObj;
  var addNotifications = props.addNotifications;
  var setHelp = props.setHelp;
  var postData = props.postData;
  if (postData.post_content == null) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
      className: "p-3 my-5 bg-orange-400",
      children: "Please choose an Post Grid first."
    });
  }
  var breakPointX = "Desktop";
  var [PostGridData, setPostGridData] = useState(postData.post_content);
  var [globalOptions, setglobalOptions] = useState(PostGridData.globalOptions);
  var [itemQueryArgs, setitemQueryArgs] = useState(PostGridData.itemQueryArgs);
  var [wrapper, setwrapper] = useState(PostGridData.wrapper);
  var [items, setitems] = useState(PostGridData.items);
  var [itemsWrap, setitemsWrap] = useState(PostGridData.itemsWrap);
  var [itemWrap, setitemWrap] = useState(PostGridData.itemWrap);
  var [paginationWrap, setpaginationWrap] = useState(PostGridData.paginationWrap);
  var [paginationItem, setpaginationItem] = useState(PostGridData.paginationItem);
  var [paginationItemActive, setpaginationItemActive] = useState(PostGridData.paginationItemActive);
  var [icon, seticon] = useState(PostGridData.icon);
  var [iconToggle, seticonToggle] = useState(PostGridData.iconToggle);
  var [masonryOptions, setmasonryOptions] = useState(PostGridData.masonryOptions);
  var [prev, setprev] = useState(PostGridData?.prev);
  var [prevIcon, setprevIcon] = useState(PostGridData?.prevIcon);
  var [next, setnext] = useState(PostGridData?.next);
  var [nextIcon, setnextIcon] = useState(PostGridData?.nextIcon);
  var [sliderOptions, setsliderOptions] = useState(PostGridData?.sliderOptions);
  var [sliderOptionsRes, setsliderOptionsRes] = useState(PostGridData?.sliderOptionsRes);
  var [topWrap, settopWrap] = useState(PostGridData.topWrap);
  var [styleObj, setstyleObj] = useState({});
  const [taxonomiesObjects, setTaxonomiesObjects] = useState([]);
  var [customerData, setcustomerData] = useState(props.customerData);
  var [datePicker, setdatePicker] = useState(9999999);
  var [isProFeature, setisProFeature] = useState(true);
  var [editLayouts, seteditLayouts] = useState(false);
  var [loopLayout, setloopLayout] = useState(PostGridData.loopLayout);
  var wrapperSelector = "#post-grid-" + postData.ID;
  var itemsWrapSelector = wrapperSelector + " > .items";
  var itemWrapSelector = wrapperSelector + " > .items > .item";
  var paginationWrapSelector = wrapperSelector + " > .pagination";
  var paginationItemSelector = wrapperSelector + " > .pagination .page-numbers";
  var paginationItemActiveSelector = wrapperSelector + " > .pagination .page-numbers.current";
  var paginationTypesX = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_5__.applyFilters)('PostGridPaginationTypes', _pagination_types__WEBPACK_IMPORTED_MODULE_21__.paginationTypes);
  var breakPointList = [{
    label: "Select..",
    icon: "",
    value: ""
  }];
  for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"]) {
    var breakPointItem = _breakpoints__WEBPACK_IMPORTED_MODULE_8__["default"][x];
    breakPointList.push({
      label: breakPointItem.name,
      icon: breakPointItem.icon,
      value: breakPointItem.id
    });
  }
  var postTypes = [];
  const postTypesData = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_2__.useSelect)(select => select(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_1__.store).getPostTypes({
    per_page: -1
  }), []);
  postTypesData !== null && postTypesData.map(x => {
    postTypes.push({
      value: x.slug,
      label: x.name
    });
  });
  useEffect(() => {
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: "/post-grid/v2/post_type_objects",
      method: "POST",
      data: {
        postTypes: []
      }
    }).then(res => {
      var taxonomies = [];
      res.map(item => {
        taxonomies.push({
          label: item.label,
          value: item.id
        });
      });
      setTaxonomiesObjects(taxonomies);
    });
  }, []);
  useEffect(() => {
    if (customerData.isPro) {
      setisProFeature(false);
    }
  }, [props.customerData]);
  useEffect(() => {
    onChange(PostGridData);
  }, [PostGridData]);
  useEffect(() => {
    if (Object.entries(styleObj).length > 0) {
      onChangeStyleObj(styleObj);
    }
  }, [styleObj]);
  useEffect(() => {
    var styles = generateStyleObj();
    setstyleObj(styles);
  }, [PostGridData]);
  function generateStyleObj() {
    var styleObjX = {};

    // wrapper
    var wrapperX = {
      ...PostGridData.wrapper
    };
    var wrapperStyles = myStore.deletePropertyDeep(wrapperX, ['options']);
    styleObjX[wrapperSelector] = wrapperStyles;
    var itemsWrapX = {
      ...PostGridData.itemsWrap
    };
    var itemsWrapStyles = myStore.deletePropertyDeep(itemsWrapX, ['options']);
    styleObjX[itemsWrapSelector] = itemsWrapStyles;
    var itemWrapX = {
      ...PostGridData.itemWrap
    };
    var itemWrapStyles = myStore.deletePropertyDeep(itemWrapX, ['options']);
    styleObjX[itemWrapSelector] = itemWrapStyles;
    var paginationWrapX = {
      ...PostGridData.paginationWrap
    };
    var paginationWrapStyles = myStore.deletePropertyDeep(paginationWrapX, ['options']);
    styleObjX[paginationWrapSelector] = paginationWrapStyles;
    var paginationItemX = {
      ...PostGridData.paginationItem
    };
    var paginationItemStyles = myStore.deletePropertyDeep(paginationItemX, ['options']);
    styleObjX[paginationItemSelector] = paginationItemStyles;
    var paginationItemActiveX = {
      ...PostGridData.paginationItemActive
    };
    var paginationItemActiveStyles = myStore.deletePropertyDeep(paginationItemActiveX, ['options']);
    styleObjX[paginationItemActiveSelector] = paginationItemActiveStyles;
    var loopLayoutFlatArry = myStore.flattenObject(PostGridData.loopLayout);
    loopLayoutFlatArry.map(element => {
      var elementId = element.id;
      var elementHdnle = "#element-" + elementId;
      var cssSelectors = element.cssSelectors;
      if (cssSelectors != undefined) {
        Object.entries(cssSelectors).map(args => {
          var elementSubIndex = args[0];
          var elementStylesObj = args[1];
          var itemhdnle = elementStylesObj?.handle == undefined ? elementHdnle : elementStylesObj?.handle;
          if (itemhdnle.length == 0) {
            var elementSubHdnle = wrapperSelector + ' ' + elementHdnle;
          } else {
            var elementSubHdnle = wrapperSelector + ' ' + elementHdnle + ' ' + itemhdnle;
          }
          var elementStylesObjX = {
            ...elementStylesObj
          };
          delete elementStylesObjX.handle;
          delete elementStylesObjX.label;
          styleObjX[elementSubHdnle] = elementStylesObjX;
        });
      }
    });
    return styleObjX;
    //setstyleObj(styleObjX)
  }
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.globalOptions = globalOptions;
    setPostGridData(PostGridDataX);
  }, [globalOptions]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.items = items;
    setPostGridData(PostGridDataX);
  }, [items]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemsWrap = itemsWrap;
    setPostGridData(PostGridDataX);
  }, [itemsWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemWrap = itemWrap;
    setPostGridData(PostGridDataX);
  }, [itemWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.itemQueryArgs = itemQueryArgs;
    setPostGridData(PostGridDataX);
  }, [itemQueryArgs]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.masonryOptions = masonryOptions;
    setPostGridData(PostGridDataX);
  }, [masonryOptions]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationWrap = paginationWrap;
    setPostGridData(PostGridDataX);
  }, [paginationWrap]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationItem = paginationItem;
    setPostGridData(PostGridDataX);
  }, [paginationItem]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.paginationItemActive = paginationItemActive;
    setPostGridData(PostGridDataX);
  }, [paginationItemActive]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.wrapper = wrapper;
    setPostGridData(PostGridDataX);
  }, [wrapper]);
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.loopLayout = loopLayout;
    setPostGridData(PostGridDataX);
  }, [loopLayout]);
  var RemoveMasonryArg = function ({
    index
  }) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
      className: "cursor-pointer hover:bg-red-500 hover:text-white ",
      onClick: ev => {
        var masonryOptionsX = {
          ...masonryOptions
        };
        delete masonryOptionsX[index];
        setmasonryOptions(masonryOptionsX);
      },
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"]
      })
    });
  };
  useEffect(() => {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.topWrap = topWrap;
    setPostGridData(PostGridDataX);
  }, [topWrap]);
  const ALLOWED_MEDIA_TYPES = ["image"];
  var videoType = {
    choose: {
      label: "Choose",
      value: ""
    },
    youtube: {
      label: "YouTube",
      value: "youtube"
    }
  };
  function onChangeStyle(sudoScource, newVal, attr, propertyType, setProperty) {
    var path = [sudoScource, attr, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.updatePropertyDeep(obj, path, newVal);
    setProperty(object);
  }
  function onAddStyle(sudoScource, key, propertyType, setProperty) {
    var path = [sudoScource, key, breakPointX];
    let obj = {
      ...propertyType
    };
    const object = myStore.addPropertyDeep(obj, path, "");
    setProperty(object);
  }
  function onResetStyle(sudoSources, propertyType, setProperty) {
    let obj = Object.assign({}, propertyType);
    Object.entries(sudoSources).map(args => {
      var sudoScource = args[0];
      if (obj[sudoScource] == undefined) {} else {
        obj[sudoScource] = {};
        // var elementSelector = myStore.getElementSelector(
        // 	sudoScource,
        // 	contentSelector // Replace this selector if needed
        // );
      }
    });
    setProperty(obj);
  }
  function onRemoveStyle(sudoScource, key, propertyType, setProperty) {
    let obj = {
      ...propertyType
    };
    var object = myStore.deletePropertyDeep(obj, [sudoScource, key, breakPointX]);
    var isEmpty = Object.entries(object[sudoScource][key]).length === 0 ? true : false;
    var objectX = isEmpty ? myStore.deletePropertyDeep(object, [sudoScource, key]) : object;
    setProperty(objectX);
  }
  function onBulkAddStyle(sudoSource, cssObj, propertyType, setProperty) {
    let obj = {
      ...propertyType
    };
    obj[sudoSource] = cssObj;
    setProperty(obj);
  }

  // useEffect(() => {
  // 	var numberOfColumns = masonryOptions.numberOfColumns;
  // 	var gutter =
  // 		parseInt(masonryOptions.gutter) * (parseInt(numberOfColumns) - 1);
  // 	var calc = "calc((100% - " + gutter + "px)/" + numberOfColumns + ")";
  // 	console.log(calc, itemWrap.styles)
  // 	var itemWrapX = {
  // 		...itemWrap,
  // 		styles: { ...itemWrap.styles, width: { Desktop: calc } },
  // 	};
  // 	setitemWrap(itemWrapX);
  // 	// onChangeStyleItem("styles", clac, "width");
  // }, [masonryOptions.numberOfColumns]);
  // useEffect(() => {
  // 	var gutter = parseInt(masonryOptions.gutter);
  // 	var itemWrapX = {
  // 		...itemWrap,
  // 		styles: { ...itemWrap.styles, marginBottom: { Desktop: `${gutter}px` } },
  // 	};
  // 	setitemWrap(itemWrapX);
  // 	// onChangeStyleItem("styles", clac, "width");
  // }, [masonryOptions.gutter]);

  useEffect(() => {
    var numberOfColumns = masonryOptions.numberOfColumns;
    var gutter = parseInt(masonryOptions.gutter);
    var totalGutter = gutter * (parseInt(numberOfColumns) - 1);
    var calc = `calc((100% - ${totalGutter}px) / ${numberOfColumns})`;
    console.log(gutter, calc);
    var itemWrapX = {
      ...itemWrap,
      styles: {
        ...itemWrap.styles,
        width: {
          Desktop: calc
        },
        marginBottom: {
          Desktop: `${gutter}px`
        }
      }
    };
    setitemWrap(itemWrapX);
  }, [masonryOptions.numberOfColumns, masonryOptions.gutter]);
  // console.log(itemWrap)

  var itemSources = {
    manual: {
      label: "Manual",
      value: "manual"
    },
    posts: {
      label: "Posts",
      value: "posts",
      isPro: customerData.isPro ? false : true
    }
    // terms: {
    // 	label: "Terms",
    // 	value: "terms",
    // 	isPro: customerData.isPro ? false : true,
    // },
  };
  function generate3Digit() {
    return Math.floor(100 + Math.random() * 900);
  }
  const copyData = data => {
    navigator.clipboard.writeText(data).then(() => {
      addNotifications({
        title: "Copied to clipboard!",
        content: "Use the shortcode in page or post conent where you want to display.",
        type: "success"
      });
    }).catch(err => {});
  };
  function escapeHTML(str) {
    const map = {
      "&": "&amp;",
      "<": "&lt;",
      ">": "&gt;",
      '"': "&quot;",
      "'": "&#039;"
    };
    return str.replace(/[&<>"']/g, function (match) {
      return map[match];
    });
  }
  function unescapeHTML(str) {
    const map = {
      "&amp;": "&",
      "&lt;": "<",
      "&gt;": ">",
      "&quot;": '"',
      "&#039;": "'"
    };
    return str.replace(/&amp;|&lt;|&gt;|&quot;|&#039;/g, function (match) {
      return map[match];
    });
  }
  const handleDelete = id => {
    // Filter out the item with the specified id
    const updatedItems = Object.fromEntries(Object.entries(itemQueryArgs).filter(([key, item]) => item.id !== id));
    setitemQueryArgs(updatedItems);
  };
  var masonryOptionsArgs = {
    numberOfColumns: {
      label: "Number Of Columns",
      value: 3
    },
    gutter: {
      label: "Gutter",
      value: 15
    },
    itemSelector: {
      label: "Item Selector",
      value: ".item"
    },
    columnWidth: {
      label: "Column Width",
      value: ".item"
    },
    percentPosition: {
      label: "Percent Position",
      value: true
    },
    horizontalOrder: {
      label: "Horizontal Order",
      value: true
    },
    stamp: {
      label: "Stamp",
      value: ".stamp"
    },
    fitWidth: {
      label: "Fit Width",
      value: true
    },
    originLeft: {
      label: "Origin Left",
      value: true
    },
    originTop: {
      label: "Origin Top",
      value: true
    },
    stagger: {
      label: "Stagger",
      value: 30
    },
    resize: {
      label: "Resize",
      value: true
    }
  };
  function onChangeLayouts(loopLayout) {
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.loopLayout = loopLayout;
    setPostGridData(PostGridDataX);
    setloopLayout(loopLayout);
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
    className: "",
    children: props.postData.post_content != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_items__WEBPACK_IMPORTED_MODULE_18__["default"], {
        itemsState: {
          items,
          setitems
        },
        globalOptionsState: {
          globalOptions,
          setglobalOptions
        },
        itemQueryState: {
          itemQueryArgs,
          setitemQueryArgs
        },
        customerData: customerData,
        setHelp: setHelp,
        addNotifications: addNotifications
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Settings",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
          className: "py-3",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("label", {
              htmlFor: "",
              className: "flex gap-2 items-center",
              children: ["Lazyload", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
                className: "cursor-pointer",
                title: "Click to know more",
                onClick: () => {
                  setHelp({
                    id: "lazyloadSetting",
                    enable: true
                  });
                },
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"]
                })
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_toggle__WEBPACK_IMPORTED_MODULE_12__["default"], {
              value: globalOptions?.lazyLoad,
              onChange: newVal => {
                var globalOptionsX = {
                  ...globalOptions
                };
                globalOptionsX.lazyLoad = newVal;
                setglobalOptions(globalOptionsX);
              }
            })]
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Layouts",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          className: "flex items-center justify-between",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
            className: "bg-slate-700 inline-block text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
            onClick: ev => {
              seteditLayouts(!editLayouts);
            },
            children: "Customize Layouts"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
            className: "bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
            onClick: () => {
              navigator.clipboard.writeText(JSON.stringify(PostGridData.loopLayout)).then(() => {
                addNotifications({
                  title: "Copied to clipboard!",
                  content: "Layout Copied!",
                  type: "success"
                });
              });
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"],
              size: 14,
              fill: "#fff"
            }), "Copy"]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
            className: "bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
            onClick: async () => {
              try {
                var data = await navigator.clipboard.readText();
                data = JSON.parse(data);
                onChangeLayouts(data).then(() => {
                  addNotifications({
                    title: "Layout Pasted!",
                    content: "Layout paste successful.",
                    type: "success"
                  });
                });
              } catch (e) {
                console.log(e);
              }
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"],
              size: 14,
              fill: "#fff"
            }), "Paste"]
          }), editLayouts && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
            className: "fixed h-full top-0 py-10 overflow-y-auto bg-slate-500 bg-opacity-70 left-0 w-full z-50",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: "w-[1400px] mx-auto ",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex justify-between bg-gray-700 p-3",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
                  className: "text-white text-md",
                  children: "Layout Editor"
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("span", {
                    className: "size-6 bg-red-500 flex items-center justify-center cursor-pointer",
                    onClick: ev => {
                      seteditLayouts(!editLayouts);
                    },
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.Icon, {
                      icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
                      fill: "#fff",
                      size: 18
                    })
                  })
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_layout_generator__WEBPACK_IMPORTED_MODULE_14__["default"], {
                postData: postData,
                customerData: customerData,
                addNotifications: addNotifications,
                onChange: onChangeLayouts,
                layouts: PostGridData.loopLayout
              })]
            })
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_layouts__WEBPACK_IMPORTED_MODULE_19__["default"], {
            postData: postData,
            onChangeLayouts: onChangeLayouts,
            customerData: customerData,
            addNotifications: addNotifications,
            setHelp: setHelp
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Masonry", "post-grid"),
        initialOpen: true,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          className: "my-3",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_9__["default"], {
            position: "bottom right",
            variant: "secondary",
            buttonTitle: "Choose",
            options: masonryOptionsArgs
            // onChange={(option, index) => {
            // 	var masonryOptionsX = { ...masonryOptions };
            // 	masonryOptionsX[index] = option.value;
            // 	setAttributes({ masonryOptions: masonryOptionsX });
            // }}
            ,
            onChange: (newVal, index) => {
              var masonryOptionsX = {
                ...masonryOptions
              };
              masonryOptionsX[index] = newVal.value;
              setmasonryOptions(masonryOptionsX);
            },
            values: ""
          })
        }), Object.entries(masonryOptions).map((item, index) => {
          var id = item[0];
          var value = item[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
            children: [id == "itemSelector" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  htmlFor: "",
                  className: "font-medium text-slate-900 ",
                  children: "Item Selector"
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
                value: masonryOptions.itemSelector,
                onChange: newVal => {
                  setmasonryOptions({
                    ...masonryOptions,
                    itemSelector: newVal
                  });
                }
              })]
            }), id == "gutter" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  htmlFor: "",
                  className: "font-medium text-slate-900 ",
                  children: "Gutter"
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
                type: "number",
                value: masonryOptions.gutter,
                onChange: newVal => {
                  setmasonryOptions({
                    ...masonryOptions,
                    gutter: parseInt(newVal)
                  });
                  // onChangeStyleItem(
                  // 	"styles",
                  // 	parseInt(newVal) + "px",
                  // 	"marginBottom"
                  // );
                }
              })]
            }), id == "columnWidth" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  htmlFor: "",
                  className: "font-medium text-slate-900 ",
                  children: "Column width"
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
                value: masonryOptions.columnWidth,
                onChange: newVal => {
                  setmasonryOptions({
                    ...masonryOptions,
                    columnWidth: newVal
                  });
                }
              })]
            }), id == "numberOfColumns" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  htmlFor: "",
                  className: "font-medium text-slate-900 ",
                  children: "Number Of Columns"
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.__experimentalInputControl, {
                type: "number",
                value: masonryOptions.numberOfColumns,
                onChange: newVal => {
                  setmasonryOptions({
                    ...masonryOptions,
                    numberOfColumns: parseInt(newVal)
                  });
                }
              })]
            }), id == "horizontalOrder" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
                  label: "Horizontal Order?",
                  help: masonryOptions.horizontalOrder ? "Horizontal Order Enabled" : "Horizontal Order Disabled",
                  checked: masonryOptions.horizontalOrder,
                  onChange: newHorizontalOrder => {
                    const updatedMasonryOptions = {
                      ...masonryOptions,
                      horizontalOrder: newHorizontalOrder
                    };
                    setmasonryOptions(updatedMasonryOptions);
                  }
                })]
              })
            }), id == "percentPosition" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
                  label: "Percent Position?",
                  help: masonryOptions.percentPosition ? "Percent Position Enabled" : "Percent Position Disabled",
                  checked: masonryOptions.percentPosition,
                  onChange: newPercentPosition => {
                    const updatedMasonryOptions = {
                      ...masonryOptions,
                      percentPosition: newPercentPosition
                    };
                    setmasonryOptions(updatedMasonryOptions);
                  }
                })]
              })
            }), id == "stamp" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  htmlFor: "",
                  className: "font-medium text-slate-900 ",
                  children: "Stamp"
                })]
              })
            }), id == "fitWidth" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
                  label: "Fit Width?",
                  help: masonryOptions.fitWidth ? "Fit Width Enabled" : "Fit Width Disabled.",
                  checked: masonryOptions.fitWidth,
                  onChange: fitWidth => {
                    const updatedMasonryOptions = {
                      ...masonryOptions,
                      fitWidth: fitWidth
                    };
                    setmasonryOptions(updatedMasonryOptions);
                  }
                })]
              })
            }), id == "originLeft" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
                  label: "Origin Left?",
                  help: masonryOptions.originLeft ? "Origin Left Enabled" : "Origin Left Disabled.",
                  checked: masonryOptions.originLeft,
                  onChange: originLeft => {
                    const updatedMasonryOptions = {
                      ...masonryOptions,
                      originLeft: originLeft
                    };
                    setmasonryOptions(updatedMasonryOptions);
                  }
                })]
              })
            }), id == "originTop" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
                  label: "Origin Top?",
                  help: masonryOptions.originTop ? "Origin Top Enabled" : "Origin Top Disabled.",
                  checked: masonryOptions.originTop,
                  onChange: originTop => {
                    const updatedMasonryOptions = {
                      ...masonryOptions,
                      originTop: originTop
                    };
                    setmasonryOptions(updatedMasonryOptions);
                  }
                })]
              })
            }), id == "stagger" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
                  label: "Stagger?",
                  help: masonryOptions.stagger ? "Stagger Enabled" : "Stagger Disabled.",
                  checked: masonryOptions.stagger,
                  onChange: stagger => {
                    const updatedMasonryOptions = {
                      ...masonryOptions,
                      stagger: stagger
                    };
                    setmasonryOptions(updatedMasonryOptions);
                  }
                })]
              })
            }), id == "resize" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(RemoveMasonryArg, {
                  index: id
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.ToggleControl, {
                  label: "Resize?",
                  help: masonryOptions.resize ? "Resize Enabled" : "Resize Disabled.",
                  checked: masonryOptions.resize,
                  onChange: resize => {
                    const updatedMasonryOptions = {
                      ...masonryOptions,
                      resize: resize
                    };
                    setmasonryOptions(updatedMasonryOptions);
                  }
                })]
              })
            })]
          }, index);
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Wrapper",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_27__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                value: wrapper?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...wrapper,
                    options: {
                      ...wrapper?.options,
                      class: newVal
                    }
                  };
                  setwrapper(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
              obj: wrapper,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, wrapper, setwrapper),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, wrapper, setwrapper),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, wrapper, setwrapper),
              onReset: sudoSources => onResetStyle(sudoSources, wrapper, setwrapper),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, wrapper, setwrapper)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Items Wrap",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_27__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                value: itemsWrap?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...itemsWrap,
                    options: {
                      ...itemsWrap?.options,
                      class: newVal
                    }
                  };
                  setitemsWrap(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
              obj: itemsWrap,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, itemsWrap, setitemsWrap),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, itemsWrap, setitemsWrap),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, itemsWrap, setitemsWrap),
              onReset: sudoSources => onResetStyle(sudoSources, itemsWrap, setitemsWrap),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, itemsWrap, setitemsWrap)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Item",
        initialOpen: false,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_27__["default"],
            className: "tab-settings"
          }, {
            name: "styles",
            title: "Styles",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
            className: "tab-style"
          }],
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "options",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
              className: "flex  my-5  justify-between items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                className: "",
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                value: itemWrap?.options?.class,
                className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                onChange: newVal => {
                  var optionsX = {
                    ...itemWrap,
                    options: {
                      ...itemWrap?.options,
                      class: newVal
                    }
                  };
                  setitemWrap(optionsX);
                }
              })]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
            name: "styles",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
              obj: itemWrap,
              onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, itemWrap, setitemWrap),
              onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, itemWrap, setitemWrap),
              onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, itemWrap, setitemWrap),
              onReset: sudoSources => onResetStyle(sudoSources, itemWrap, setitemWrap),
              onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, itemWrap, setitemWrap)
            })
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
        className: "font-medium text-slate-900 ",
        title: "Pagination",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          className: "my-4",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Pagination Type", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_9__["default"], {
            position: "bottom right",
            variant: "secondary",
            options: paginationTypesX,
            buttonTitle: paginationTypesX[globalOptions?.pagination?.type] != undefined ? paginationTypesX[globalOptions.pagination.type].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Choose", "post-grid"),
            onChange: (arg, index) => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.type = arg.value;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            },
            values: ""
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Previous Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.previousText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.previousText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Next Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.nextText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.nextText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Load More Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.loadMoreText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.loadMoreText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Loading Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.loadingText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.loadingText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
          className: "flex  my-5  justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            className: "",
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("No Post Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
            value: globalOptions?.pagination?.noPostText,
            className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
            onChange: newVal => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.noPostText = newVal;
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Loading Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
            library: globalOptions?.pagination?.loadingIcon?.library,
            srcType: globalOptions?.pagination?.loadingIcon?.srcType,
            iconSrc: globalOptions?.pagination?.loadingIcon?.iconSrc,
            class: globalOptions?.pagination?.loadingIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.loadingIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Load More Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
            library: globalOptions?.pagination?.loadMoreIcon?.library,
            srcType: globalOptions?.pagination?.loadMoreIcon?.srcType,
            iconSrc: globalOptions?.pagination?.loadMoreIcon?.iconSrc,
            class: globalOptions?.pagination?.loadMoreIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.loadMoreIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Previous Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
            library: globalOptions?.pagination?.previousIcon?.library,
            srcType: globalOptions?.pagination?.previousIcon?.srcType,
            iconSrc: globalOptions?.pagination?.previousIcon?.iconSrc,
            class: globalOptions?.pagination?.previousIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.previousIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Next Icon", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_20__["default"], {
            library: globalOptions?.pagination?.nextIcon?.library,
            srcType: globalOptions?.pagination?.nextIcon?.srcType,
            iconSrc: globalOptions?.pagination?.nextIcon?.iconSrc,
            class: globalOptions?.pagination?.nextIcon?.class,
            onChange: arg => {
              var globalOptionsX = {
                ...globalOptions
              };
              var paginationX = {
                ...globalOptionsX.pagination
              };
              paginationX.nextIcon = {
                srcType: arg.srcType,
                library: arg.library,
                iconSrc: arg.iconSrc,
                class: arg.class
              };
              globalOptionsX.pagination = paginationX;
              setglobalOptions(globalOptionsX);
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Pagination Wrap",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_27__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                  value: paginationWrap?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationWrap,
                      options: {
                        ...paginationWrap?.options,
                        class: newVal
                      }
                    };
                    setpaginationWrap(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
                obj: paginationWrap,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationWrap, setpaginationWrap),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationWrap, setpaginationWrap),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationWrap, setpaginationWrap),
                onReset: sudoSources => onResetStyle(sudoSources, paginationWrap, setpaginationWrap),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationWrap, setpaginationWrap)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "Pagination Item",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_27__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                  value: paginationItem?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationItem,
                      options: {
                        ...paginationItem?.options,
                        class: newVal
                      }
                    };
                    setpaginationItem(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
                obj: paginationItem,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationItem, setpaginationItem),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationItem, setpaginationItem),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationItem, setpaginationItem),
                onReset: sudoSources => onResetStyle(sudoSources, paginationItem, setpaginationItem),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationItem, setpaginationItem)
              })
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: "pagination Item Active",
          initialOpen: false,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)(_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_27__["default"],
              className: "tab-settings"
            }, {
              name: "styles",
              title: "Styles",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
              className: "tab-style"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "options",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsxs)("div", {
                className: "flex  my-5  justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)("label", {
                  className: "",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_3__.__)("Class", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_11__["default"], {
                  value: paginationItemActive?.options?.class,
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[210px]",
                  onChange: newVal => {
                    var optionsX = {
                      ...paginationItemActive,
                      options: {
                        ...paginationItemActive?.options,
                        class: newVal
                      }
                    };
                    setpaginationItemActive(optionsX);
                  }
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_tab__WEBPACK_IMPORTED_MODULE_16__["default"], {
              name: "styles",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_15__["default"], {
                obj: paginationItemActive,
                onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, paginationItemActive, setpaginationItemActive),
                onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, paginationItemActive, setpaginationItemActive),
                onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, paginationItemActive, setpaginationItemActive),
                onReset: sudoSources => onResetStyle(sudoSources, paginationItemActive, setpaginationItemActive),
                onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, paginationItemActive, setpaginationItemActive)
              })
            })]
          })
        })]
      })]
    })
  });
}
class EditMasonry extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showWarning: true,
      isLoaded: false
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }
  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }
  render() {
    var {
      onChange,
      onChangeStyleObj,
      postData,
      customerData,
      addNotifications,
      setHelp
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_22__.jsx)(Html, {
      onChange: onChange,
      onChangeStyleObj: onChangeStyleObj,
      addNotifications: addNotifications,
      postData: postData,
      customerData: customerData,
      setHelp: setHelp,
      warn: this.state.showWarning,
      isLoaded: this.state.isLoaded
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (EditMasonry);

/***/ }),

/***/ "./src/components/Builder/generate-css.js":
/*!************************************************!*\
  !*** ./src/components/Builder/generate-css.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_block_editor__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__);
/* 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 _splidejs_react_splide__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @splidejs/react-splide */ "./node_modules/@splidejs/react-splide/dist/js/react-splide.esm.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__);
const {
  Component,
  RawHTML,
  useState,
  useEffect,
  useMemo
} = wp.element;








var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var onGenerateCss = props.onGenerateCss;
  var styleObj = props.styleObj;
  var reponsiveCss = props.reponsiveCss == undefined ? "" : props.reponsiveCss;
  useEffect(() => {
    if (Object.entries(styleObj).length == 0) {
      return;
    }
    var reponsiveCss = convertStyleobjToCss(styleObj);
    onGenerateCss(reponsiveCss);
    var wpfooter = document.getElementById("wpfooter");
    var csswrappg = document.getElementById("post-grid-builder-styles");
    if (csswrappg == null) {
      var divWrap = '<style id="post-grid-builder-styles">' + reponsiveCss + '</style>';
      wpfooter.insertAdjacentHTML("beforeend", divWrap);
      var csswrappg = document.getElementById("post-grid-builder-styles");
      csswrappg.innerHtml = reponsiveCss;
    } else {
      csswrappg.innerHTML = reponsiveCss;
    }
  }, [styleObj]);
  useEffect(() => {
    if (reponsiveCss.length == 0) {
      return;
    }
    reponsiveCss = unescapeHTML(reponsiveCss);
    var wpfooter = document.getElementById("wpfooter");
    var csswrappg = document.getElementById("post-grid-builder-styles");
    if (csswrappg == null) {
      var divWrap = '<style id="post-grid-builder-styles">' + reponsiveCss + '</style>';
      wpfooter.insertAdjacentHTML("beforeend", divWrap);
      var csswrappg = document.getElementById("post-grid-builder-styles");
      csswrappg.innerHtml = reponsiveCss;
    } else {
      csswrappg.innerHTML = reponsiveCss;
    }
  }, [reponsiveCss]);
  function unescapeHTML(str) {
    const map = {
      "&amp;": "&",
      "&lt;": "<",
      "&gt;": ">",
      "&quot;": '"',
      "&#039;": "'"
    };
    return str.replace(/&amp;|&lt;|&gt;|&quot;|&#039;/g, function (match) {
      return map[match];
    });
  }
  function getElementSelector(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;
  }
  function cssAttrParse(key) {
    var cssProp = "";
    if (key == "alignContent") {
      cssProp = "align-content";
    } else if (key == "alignItems") {
      cssProp = "align-items";
    } else if (key == "animationName") {
      cssProp = "animation-name";
    } 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 == "counterIncrement") {
      cssProp = "counter-increment";
    } else if (key == "counterReset") {
      cssProp = "counter-reset";
    } else if (key == "counterSet") {
      cssProp = "counter-set";
    } 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 == "gridAutoFlow") {
      cssProp = "grid-auto-flow";
    } 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 == "maskImage") {
      cssProp = "mask-image";
    } 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 == "placeItems") {
      cssProp = "place-items";
    } 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 == "transformOrigin") {
      cssProp = "transform-origin";
    } else if (key == "transformStyle") {
      cssProp = "transform-style";
    } else if (key == "tableLayout") {
      cssProp = "table-layout";
    } else if (key == "emptyCells") {
      cssProp = "empty-cells";
    } else if (key == "captionSide") {
      cssProp = "caption-side";
    } else if (key == "gap") {
      cssProp = "gap";
    } else if (key == "rowGap") {
      cssProp = "row-gap";
    } else if (key == "columnGap") {
      cssProp = "column-gap";
    } else if (key == "userSelect") {
      cssProp = "user-select";
    } else if (key == "-webkit-text-fill-color") {
      cssProp = "-webkit-text-fill-color";
    } else {
      cssProp = key;
    }
    return cssProp;
  }
  function convertStyleobjToCss(items) {
    var reponsiveCssGroups = {};
    for (var selector in items) {
      var sudoArgs = items[selector];
      for (var sudoSrc in sudoArgs) {
        var selectorHandl = getElementSelector(sudoSrc, selector);
        var sudoPrams = sudoArgs[sudoSrc];
        for (var attr in sudoPrams) {
          var breakpoints = sudoPrams[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][selectorHandl] == undefined) {
              reponsiveCssGroups[device][selectorHandl] = [];
            }
            if (typeof attrValue == "string") {
              attrValue = attrValue.replaceAll("u0022", '"');
              attr = cssAttrParse(attr);
              reponsiveCssGroups[device][selectorHandl][attr] = attrValue;
            }
          }
        }
      }
    }
    var reponsiveCssDesktop = "";
    if (reponsiveCssGroups["Desktop"] != undefined) {
      for (var selector in reponsiveCssGroups["Desktop"]) {
        var attrs = reponsiveCssGroups["Desktop"][selector];
        reponsiveCssDesktop += selector + "{";
        for (var attrName in attrs) {
          var attrValue = attrs[attrName];
          // 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;
    return reponsiveCss;
  }
  return;
}
class GenerateCss 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 {
      onGenerateCss,
      styleObj,
      reponsiveCss
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(Html, {
      onGenerateCss: onGenerateCss,
      styleObj: styleObj,
      reponsiveCss: reponsiveCss,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (GenerateCss);

/***/ }),

/***/ "./src/components/Builder/help.js":
/*!****************************************!*\
  !*** ./src/components/Builder/help.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_icons__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
const {
  Component,
  useState,
  useEffect
} = wp.element;


function Html(props) {
  if (!props.warn) {
    return null;
  }
  var [help, sethelp] = useState(props.help);
  useEffect(() => {
    sethelp(props.help);
  }, [props.help]);
  var helpPrams = {
    createPostGrid: {
      title: "How to create Post Grid",
      content: `, 
`,
      video: "",
      docsUrl: "#"
    },
    useShortcodes: {
      title: "How to create Post Grid",
      content: ` 
`,
      video: "",
      docsUrl: "#"
    },
    urlHash: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    addPostQuery: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    lazyloadSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    autoembedSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    shortcodesSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    wpautopSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    schemaSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    toggleTextSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    expandCollapseSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    enableSearchSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    statsSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    scrollToTopSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    animationSetting: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    },
    templatesHelp: {
      title: "",
      content: ``,
      video: "",
      docsUrl: ""
    }
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", {
    className: `${help.enable ? "" : "hidden"} z-[99999] top-0 left-0 fixed w-full h-full bg-slate-600 bg-opacity-90   `,
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
      className: " bg-white my-[100px] p-5 relative w-[800px] h-[600px] overflow-y-scroll mx-auto rounded-md overflow-hidden",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("span", {
        className: "cursor-pointer px-2 py-1 bg-red-500 hover:bg-red-700 hover:text-white absolute top-0 right-0",
        onClick: ev => {
          var helpX = {
            ...help
          };
          helpX.enable = false;
          sethelp(helpX);
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_1__["default"], {
          fill: "#fff",
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"]
        })
      }), !helpPrams[help?.id]?.video && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", {
        children: "Coming Soon"
      }), helpPrams[help?.id]?.video && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", {
          className: "flex items-center  gap-2 align-middle"
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", {
          className: "my-4 text-base",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("iframe", {
            width: "100%",
            height: "450",
            src: `https://www.youtube.com/embed/${helpPrams[help?.id]?.video}`,
            title: "YouTube video player",
            frameborder: "0",
            allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",
            referrerpolicy: "strict-origin-when-cross-origin",
            allowfullscreen: true
          })
        })]
      })]
    })
  });
}
class Help 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 {
      help
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(Html, {
      help: help,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Help);

/***/ }),

/***/ "./src/components/Builder/index.js":
/*!*****************************************!*\
  !*** ./src/components/Builder/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_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_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_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_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/cog.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/columns.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/brush.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/category.js");
/* harmony import */ var _dropdown__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _input_select__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _components_BuilderView__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/BuilderView */ "./src/components/BuilderView/index.js");
/* harmony import */ var _components_BuilderWelcome__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/BuilderWelcome */ "./src/components/BuilderWelcome/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _post_grid_list__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./post-grid-list */ "./src/components/Builder/post-grid-list.js");
/* harmony import */ var _generate_css__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./generate-css */ "./src/components/Builder/generate-css.js");
/* harmony import */ var _help__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./help */ "./src/components/Builder/help.js");
/* harmony import */ var _notify__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./notify */ "./src/components/Builder/notify.js");
/* harmony import */ var _templates__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./templates */ "./src/components/Builder/templates.js");
/* harmony import */ var _default_data_carousel__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./default-data-carousel */ "./src/components/Builder/default-data-carousel.js");
/* harmony import */ var _default_data_fliterable__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./default-data-fliterable */ "./src/components/Builder/default-data-fliterable.js");
/* harmony import */ var _default_data_grid__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./default-data-grid */ "./src/components/Builder/default-data-grid.js");
/* harmony import */ var _default_data_masonry__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./default-data-masonry */ "./src/components/Builder/default-data-masonry.js");
/* harmony import */ var _edit_grid__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./edit-grid */ "./src/components/Builder/edit-grid.js");
/* harmony import */ var _edit_filterable__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./edit-filterable */ "./src/components/Builder/edit-filterable.js");
/* harmony import */ var _edit_masonry__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./edit-masonry */ "./src/components/Builder/edit-masonry.js");
/* harmony import */ var _edit_carousel__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./edit-carousel */ "./src/components/Builder/edit-carousel.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__);
const {
  Component,
  useState,
  useEffect
} = wp.element;

























var myStore = wp.data.select('PostGridStore');
function Html(props) {
  var _optionData$user_role, _optionData$font_aw_v, _optionData$post_grid, _optionData$license_k;
  if (!props.warn) {
    return null;
  }
  var appData = props.appData;
  var [activePostGrid, setactivePostGrid] = useState(null);
  var [postData, setpostData] = useState({
    ID: null,
    post_content: {},
    post_title: ""
  });
  var [PostGridData, setPostGridData] = useState(postData?.post_content);
  var [globalOptions, setglobalOptions] = useState(PostGridData.globalOptions);
  var [isLoading, setisLoading] = useState(false);
  var [pleaseUpdate, setpleaseUpdate] = useState(false);
  const [optionData, setoptionData] = useState({});
  const [roles, setroles] = useState([]);
  var [needSave, setneedSave] = useState(false);
  var [toggleSettings, settoggleSettings] = useState(false);
  var [listQueryPrams, setlistQueryPrams] = useState({
    page: 1,
    search: ""
  }); // Using the hook.

  var [styleObj, setstyleObj] = useState({});
  var [notifications, setnotifications] = useState([]);
  var [help, sethelp] = useState({
    id: "",
    enable: false
  });
  var [customerData, setcustomerData] = useState({
    id: "",
    isPro: false
  });
  var [isProFeature, setisProFeature] = useState(true);
  var viewTypeArgs = {
    viewGrid: {
      label: "Grid",
      value: "viewGrid"
    },
    viewSlider: {
      label: "Slider/Carousel",
      value: "viewSlider"
    },
    // viewFilterable: {
    // 	label: "Filterable",
    // 	value: "viewFilterable",
    //  isPro: true	
    // },
    viewMasonry: {
      label: "Masonry",
      value: "viewMasonry"
      // isPro: true
    }
    // viewTimeline: {
    // 	label: "Post Timeline",
    // 	value: "viewTimeline",
    // 	// isPro: true
    // },
    // viewTicker: {
    // 	label: "Post Ticker",
    // 	value: "viewTicker",
    // 	// isPro: true
    // },
  };
  function onChangeStyleObj(styleObjPrams) {
    setstyleObj(styleObjPrams);
  }
  useEffect(() => {}, [styleObj]);
  function escapeHTML(str) {
    const map = {
      "&": "&amp;",
      "<": "&lt;",
      ">": "&gt;",
      '"': "&quot;",
      "'": "&#039;"
    };
    return str.replace(/[&<>"']/g, function (match) {
      return map[match];
    });
  }
  useEffect(() => {
    setPostGridData(postData.post_content);
  }, [postData]);
  useEffect(() => {
    if (globalOptions?.viewType == "viewGrid") {
      setpostData({
        ...postData,
        post_content: _default_data_grid__WEBPACK_IMPORTED_MODULE_17__["default"]
      });
    }
    if (globalOptions?.viewType == "viewSlider") {
      setpostData({
        ...postData,
        post_content: _default_data_carousel__WEBPACK_IMPORTED_MODULE_15__["default"]
      });
    }
    if (globalOptions?.viewType == "viewMasonry") {
      setpostData({
        ...postData,
        post_content: _default_data_masonry__WEBPACK_IMPORTED_MODULE_18__["default"]
      });
    }
    if (globalOptions?.viewType == "viewFilterable") {
      setpostData({
        ...postData,
        post_content: _default_data_fliterable__WEBPACK_IMPORTED_MODULE_16__["default"]
      });
    }
  }, [globalOptions]);
  useEffect(() => {
    setisLoading(true);
    if (activePostGrid == null) return;
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: "/post-grid/v2/post_grid_data",
      method: "POST",
      data: {
        postId: activePostGrid,
        _wpnonce: post_grid_builder_js._wpnonce
      }
    }).then(res => {
      setisLoading(false);
      if (res.post_content == null) {
        res.post_content = _default_data_grid__WEBPACK_IMPORTED_MODULE_17__["default"];
      }
      setpostData(res);
    });
  }, [activePostGrid]);
  useEffect(() => {
    setnotifications(notifications);
    const timer = setTimeout(() => {
      setnotifications([]); // Update the debounced value after delay
    }, 5000); // 300ms debounce delay

    return () => clearTimeout(timer); // Cleanup timer on value change or unmount
  }, [notifications]);
  useEffect(() => {
    if (customerData.isPro) {
      setisProFeature(false);
    }
  }, [customerData]);
  function handleAlertConfirmation() {
    if (confirm("Are you sure you want to reset the option data?")) {
      resetOptionData();
    }
  }
  function resetOptionData() {
    setoptionData(optionDataDefault);
  }
  function addNotifications(notification) {
    var notificationsX = [...notifications];
    notificationsX.push(notification);
    setnotifications(notificationsX);
  }
  function setHelp(helpX) {
    sethelp(helpX);
  }
  function selectPostGrid(args) {
    setactivePostGrid(args);
  }
  function onChangePostGrid(args) {
    var postDataX = {
      ...postData
    };
    postDataX.post_content = args;
    setpostData(postDataX);
    setPostGridData(args);
    setpleaseUpdate(true);
  }
  function onApplyTemplate(args) {
    var postDataX = {
      ...postData
    };
    postDataX.post_content = args;
    setpostData(postDataX);
    setPostGridData(args);
    setpleaseUpdate(true);
  }
  function updateOption() {
    setisLoading(true);
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: "/post-grid/v2/update_options",
      method: "POST",
      data: {
        name: "post_grid_settings",
        value: optionData
      }
    }).then(res => {
      setisLoading(false);
      if (res.status) {
        setneedSave(false);
        addNotifications({
          title: "Data Saved!",
          content: "You change successfully saved!.",
          type: "success"
        });
      }
    });
  }
  function onSavePostGrid() {
    setisLoading(true);
    var content = PostGridData;
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: "/post-grid/v2/update_post_data",
      method: "POST",
      data: {
        postId: activePostGrid,
        content: content,
        _wpnonce: post_grid_builder_js._wpnonce
      }
    }).then(res => {
      setisLoading(false);
      setpleaseUpdate(false);
      addNotifications({
        title: "Data Saved!",
        content: "You change successfully saved!.",
        type: "success"
      });
    });
  }
  useEffect(() => {
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: "/post-grid/v2/user_roles_list",
      method: "POST",
      data: {}
    }).then(res => {
      var rolesX = [];
      Object.entries(res?.roles).map(role => {
        var index = role[0];
        var val = role[1];
        rolesX.push({
          label: val,
          value: index
        });
      });
      setroles(rolesX);
    });
  }, []);
  useEffect(() => {
    setisLoading(true);
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_0___default()({
      path: "/post-grid/v2/get_options",
      method: "POST",
      data: {
        option: "post_grid_settings"
      }
    }).then(res => {
      if (res.length != 0) {
        var resX = {
          ...res
        };
        if (resX?.license_key?.length > 0) {
          setcustomerData({
            ...customerData,
            isPro: true
          });
        }
        setoptionData(resX);
      }
      setisLoading(false);
    });
  }, []);
  function onGenerateCss(css) {
    if (css.length == 0) return;
    var PostGridDataX = {
      ...PostGridData
    };
    PostGridDataX.reponsiveCss = escapeHTML(css);
    setPostGridData(PostGridDataX);
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
    className: "pg-setting-input-text pg-dashboard",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
      className: "flex",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
        className: "basis-[380px] w-[380px] h-screen overflow-y-scroll light-scrollbar flex-shrink-0",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          className: "flex items-center justify-between bg-blue-700 py-3 px-3",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "flex items-center align-middle gap-3",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                className: "text-xl text-white",
                children: "Post Grid"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                className: "text-xs text-white flex items-center gap-2",
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                  className: "bg-lime-600 px-3 py-1 rounded-md",
                  children: "Beta"
                })
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
              className: "text-sm text-white",
              children: "By PickPlugins"
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: `py-1 px-2 cursor-pointer  capitalize  text-white font-medium rounded hover:bg-gray-700 focus:outline-none focus:bg-gray-700 ${toggleSettings ? "bg-gray-800" : "bg-gray-500"}`,
              onClick: ev => {
                settoggleSettings(!toggleSettings);
              },
              children: [isLoading && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.Spinner, {}), !isLoading && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.Fragment, {
                children: [toggleSettings && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
                  fill: "#fff",
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_25__["default"]
                }), !toggleSettings && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_24__["default"], {
                  fill: "#fff",
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_26__["default"]
                })]
              })]
            })
          })]
        }), toggleSettings && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.Fragment, {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
            className: "relative bg-white",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "px-4 py-2 bg-slate-400 text-white  ",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                className: "text-xl text-white mb-4",
                children: "Post Grid Settings"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "flex gap-2 items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                  className: "bg-amber-500 rounded-sm text-md p-2 px-4 cursor-pointer pg-font text-white ",
                  onClick: ev => {
                    handleAlertConfirmation();
                  },
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Reset", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                  className: "bg-green-700 rounded-sm text-md p-2 px-4 cursor-pointer pg-font text-white flex items-center",
                  onClick: ev => {
                    updateOption();
                  },
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                    children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Save", "post-grid")
                  }), needSave && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                    className: "w-5 inline-block h-5 ml-3 rounded-xl text-center bg-red-500",
                    children: "!"
                  })]
                })]
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "p-3",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "my-5",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: " text-base",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Allow access by roles", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_4__["default"], {
                  val: (_optionData$user_role = optionData?.user_roles) !== null && _optionData$user_role !== void 0 ? _optionData$user_role : [],
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[250px]",
                  options: roles,
                  onChange: newVal => {
                    var optionsX = {
                      ...optionData,
                      user_roles: newVal
                    };
                    setoptionData(optionsX);
                  },
                  multiple: true
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "my-5",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "text-base",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Font-awesome version", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_4__["default"], {
                  val: (_optionData$font_aw_v = optionData?.font_aw_version) !== null && _optionData$font_aw_v !== void 0 ? _optionData$font_aw_v : "none",
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[250px]",
                  options: [{
                    label: "None",
                    value: "none"
                  }, {
                    label: "Version 4+",
                    value: "v_4"
                  }, {
                    label: "Version 5+",
                    value: "v_5"
                  }],
                  onChange: newVal => {
                    var optionsX = {
                      ...optionData,
                      font_aw_version: newVal
                    };
                    setoptionData(optionsX);
                  },
                  multiple: false
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "my-5",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                  className: "text-base",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Enable Post Grid preview", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_4__["default"], {
                  val: (_optionData$post_grid = optionData?.post_grid_preview) !== null && _optionData$post_grid !== void 0 ? _optionData$post_grid : "no",
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[250px]",
                  options: [{
                    label: "No",
                    value: "no"
                  }, {
                    label: "Yes",
                    value: "yes"
                  }],
                  onChange: newVal => {
                    var optionsX = {
                      ...optionData,
                      post_grid_preview: newVal
                    };
                    setoptionData(optionsX);
                  },
                  multiple: false
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "my-5",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                  className: "text-base",
                  htmlFor: "",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("License Key", "post-grid")
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_5__["default"], {
                  label: "",
                  className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[250px]",
                  value: (_optionData$license_k = optionData?.license_key) !== null && _optionData$license_k !== void 0 ? _optionData$license_k : "",
                  onChange: newVal => {
                    var optionsX = {
                      ...optionData,
                      license_key: newVal
                    };
                    setoptionData(optionsX);
                  }
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                className: "my-3 flex gap-2"
              })]
            })]
          })
        }), !toggleSettings && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.Fragment, {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_components_tabs__WEBPACK_IMPORTED_MODULE_8__["default"], {
            activeTab: "post-grid",
            orientation: "",
            stickyNavs: true,
            contentClass: " bg-white w-full",
            navItemClass: "bg-gray-200 px-5 py-3 gap-2 grow ",
            navItemLabelClass: "flex-col ",
            navItemSelectedClass: "!bg-white",
            activeClass: "active-tab",
            onSelect: tabName => {},
            tabs: [{
              name: "post-grid",
              title: "Post Grid",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_27__["default"],
              className: "tab-disable-blocks"
            }, {
              name: "edit",
              title: "Edit",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_28__["default"],
              className: "tab-disable-blocks"
            }, {
              name: "templates",
              title: "Templates",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_29__["default"],
              className: "tab-disable-blocks"
            }],
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_components_tab__WEBPACK_IMPORTED_MODULE_9__["default"], {
              name: "post-grid",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
                className: "relative p-3",
                children: [postData?.post_content == null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                  className: "p-3 my-5 bg-orange-400",
                  children: "Please choose an Post Grid first."
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_post_grid_list__WEBPACK_IMPORTED_MODULE_10__["default"], {
                  addNotifications: addNotifications,
                  selectPostGrid: selectPostGrid,
                  activePostGrid: activePostGrid,
                  setHelp: setHelp,
                  listQueryPrams: listQueryPrams,
                  setlistQueryPrams: setlistQueryPrams
                })]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_components_tab__WEBPACK_IMPORTED_MODULE_9__["default"], {
              name: "edit",
              children: [postData?.ID == null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                className: "py-3 px-3",
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                  className: "my-3 bg-orange-400 p-3  text-white  text-center animate__animated animate__flash animate__repeat-2",
                  children: "Please select post from list."
                })
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                className: " ",
                children: postData?.ID != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.Fragment, {
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                    className: "my-4 p-3",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
                      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("label", {
                        htmlFor: "",
                        children: "View Type?"
                      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_3__["default"], {
                        position: "bottom right",
                        variant: "secondary",
                        buttonTitle: postData?.post_content?.globalOptions?.viewType ? viewTypeArgs[postData?.post_content?.globalOptions?.viewType]?.label : "Choose",
                        options: viewTypeArgs,
                        onChange: (option, index) => {
                          if (confirm("Data will reset, Please confirm?")) {
                            if (option.value == "viewGrid") {
                              setpostData({
                                ...postData,
                                post_content: _default_data_grid__WEBPACK_IMPORTED_MODULE_17__["default"]
                              });
                            }
                            if (option.value == "viewSlider") {
                              setpostData({
                                ...postData,
                                post_content: _default_data_carousel__WEBPACK_IMPORTED_MODULE_15__["default"]
                              });
                            }
                            if (option.value == "viewFilterable") {
                              setpostData({
                                ...postData,
                                post_content: _default_data_fliterable__WEBPACK_IMPORTED_MODULE_16__["default"]
                              });
                            }
                            if (option.value == "viewMasonry") {
                              setpostData({
                                ...postData,
                                post_content: _default_data_masonry__WEBPACK_IMPORTED_MODULE_18__["default"]
                              });
                            }
                          }
                        },
                        values: ""
                      })]
                    })
                  }), postData.post_content.globalOptions?.viewType == "viewGrid" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_edit_grid__WEBPACK_IMPORTED_MODULE_19__["default"], {
                    onChange: onChangePostGrid,
                    addNotifications: addNotifications,
                    postData: postData,
                    customerData: customerData,
                    setHelp: setHelp,
                    onChangeStyleObj: onChangeStyleObj
                  }), postData.post_content.globalOptions?.viewType == "viewSlider" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_edit_carousel__WEBPACK_IMPORTED_MODULE_22__["default"], {
                    onChange: onChangePostGrid,
                    addNotifications: addNotifications,
                    postData: postData,
                    customerData: customerData,
                    setHelp: setHelp,
                    onChangeStyleObj: onChangeStyleObj
                  }), postData.post_content.globalOptions?.viewType == "viewMasonry" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_edit_masonry__WEBPACK_IMPORTED_MODULE_21__["default"], {
                    onChange: onChangePostGrid,
                    addNotifications: addNotifications,
                    postData: postData,
                    customerData: customerData,
                    setHelp: setHelp,
                    onChangeStyleObj: onChangeStyleObj
                  }), postData.post_content.globalOptions?.viewType == "viewFilterable" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_edit_filterable__WEBPACK_IMPORTED_MODULE_20__["default"], {
                    onChange: onChangePostGrid,
                    addNotifications: addNotifications,
                    postData: postData,
                    customerData: customerData,
                    setHelp: setHelp,
                    onChangeStyleObj: onChangeStyleObj
                  })]
                })
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)(_components_tab__WEBPACK_IMPORTED_MODULE_9__["default"], {
              name: "templates",
              children: [postData?.ID == null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                className: "py-3 px-3",
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
                  className: "my-3 bg-orange-400 p-3  text-white  text-center animate__animated animate__flash animate__repeat-2",
                  children: "Please select post from list."
                })
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_templates__WEBPACK_IMPORTED_MODULE_14__["default"], {
                onChange: onChangePostGrid,
                onApplyTemplate: onApplyTemplate,
                addNotifications: addNotifications,
                postData: postData,
                customerData: customerData,
                setHelp: setHelp
              })]
            })]
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
        className: "w-full  top-0 overflow-y-scroll",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
          className: "  relative",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
            className: "my-3 hidden bg-orange-400 p-3 ml-5 text-white  text-center animate__animated animate__flash animate__repeat-2",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsxs)("div", {
              className: "text-xl",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("i", {
                class: "fa-solid fa-triangle-exclamation"
              }), " Please test the Post Grid Builder and", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("span", {
                className: "font-bold cursor-pointer underline",
                onClick: ev => {
                  settoggleSettings(!toggleSettings);
                },
                children: "send us feedbacks."
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)("div", {
              children: "Please do not use for old Post Grid, we will add migration later."
            })]
          }), (postData?.ID == null || toggleSettings) && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_components_BuilderWelcome__WEBPACK_IMPORTED_MODULE_7__["default"], {
            appData: appData,
            addNotifications: addNotifications,
            customerData: customerData
          }), !toggleSettings && postData?.ID != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_components_BuilderView__WEBPACK_IMPORTED_MODULE_6__["default"], {
            pleaseUpdate: pleaseUpdate,
            onSavePostGrid: onSavePostGrid,
            isLoading: isLoading,
            onChangePostGrid: onChangePostGrid,
            postData: postData,
            id: activePostGrid,
            settoggleSettings: settoggleSettings,
            customerData: customerData,
            addNotifications: addNotifications,
            setHelp: setHelp
          })]
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_notify__WEBPACK_IMPORTED_MODULE_13__["default"], {
      notifications: notifications
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_help__WEBPACK_IMPORTED_MODULE_12__["default"], {
      help: help
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(_generate_css__WEBPACK_IMPORTED_MODULE_11__["default"], {
      styleObj: styleObj,
      onGenerateCss: onGenerateCss,
      reponsiveCss: PostGridData.reponsiveCss
    })]
  });
}
class Builder 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,
      appData
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_23__.jsx)(Html, {
      appData: appData,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Builder);

/***/ }),

/***/ "./src/components/Builder/layouts.js":
/*!*******************************************!*\
  !*** ./src/components/Builder/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_block_editor__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__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_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/help.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__);
/* 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_api_fetch__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _splidejs_react_splide__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @splidejs/react-splide */ "./node_modules/@splidejs/react-splide/dist/js/react-splide.esm.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;










var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var addNotifications = props.addNotifications;
  if (!props?.postData?.post_content?.globalOptions?.viewType) {
    addNotifications({
      title: "Opps item missing",
      content: "Please select post first.",
      type: "error"
    });
    return null;
  }
  var onChangeLayouts = props.onChangeLayouts;
  var setHelp = props.setHelp;
  var [postData, setpostData] = useState(props.postData);
  var [PostGridData, setPostGridData] = useState(postData.post_content);
  var [isLoading, setisLoading] = useState(false);
  var [isProFeature, setisProFeature] = useState(true);
  var [customerData, setcustomerData] = useState(props.customerData);
  var postId = postData.ID;
  var [templates, settemplates] = useState([]);
  const [queryLayouts, setqueryLayouts] = useState({
    keyword: "",
    price: "",
    viewType: postData.post_content.globalOptions.viewType == undefined ? "viewGrid" : postData.post_content.globalOptions.viewType,
    page: 1
  });
  useEffect(() => {
    if (customerData.isPro) {
      setisProFeature(false);
    }
  }, [props.customerData]);
  useEffect(() => {
    setisLoading(true);
    var requestData = {
      keyword: queryLayouts.keyword,
      page: queryLayouts.page,
      price: queryLayouts.price,
      viewType: queryLayouts.viewType
    };
    requestData = JSON.stringify(requestData);
    fetch("https://demo.pickplugins.com/post-grid/wp-json/post-grid/v2/get_posts_post_grid", {
      method: "POST",
      headers: {
        "Content-Type": "application/json;charset=utf-8"
      },
      body: requestData
    }).then(response => {
      if (response.ok && response.status < 400) {
        response.json().then(data => {
          var posts = data?.posts;
          var postsX = [];
          posts.map(item => {
            postsX.push({
              label: item.post_title,
              thumb: item.thumb,
              isPro: item?.is_pro == "yes" ? true : false,
              data: item.post_content
            });
            settemplates(postsX);
          });
          setisLoading(false);
        });
      }
    }).catch(_error => {
      //this.saveAsStatus = 'error';
      // handle the error
    });
  }, []);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("div", {
    className: "max-h-screen overflow-y-scroll",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("div", {
      className: "p-3",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("p", {
        className: "flex items-center gap-2",
        children: ["How layouts work.", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("span", {
          className: "cursor-pointer",
          title: "Click to know more",
          onClick: () => {
            setHelp({
              id: "templatesHelp",
              enable: true
            });
          },
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"], {
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__["default"]
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("div", {
        className: "my-4  items-center hidden gap-3",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_6__["default"], {
          value: queryLayouts.keyword,
          placeholder: "Search...",
          className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
          onChange: newVal => {
            var queryLayoutsX = {
              ...queryLayouts
            };
            queryLayoutsX.keyword = newVal;
            setqueryLayouts(queryLayoutsX);
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.SelectControl, {
          label: "",
          value: queryLayouts.price,
          options: [{
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Free/Pro", "post-grid"),
            value: ""
          }, {
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Free", "post-grid"),
            value: "free"
          }, {
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Pro", "post-grid"),
            value: "pro"
          }],
          onChange: newVal => {
            var queryLayoutsX = {
              ...queryLayouts
            };
            queryLayoutsX.keyword = newVal;
            setqueryLayouts(queryLayoutsX);
          }
        })]
      }), isLoading && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("div", {
        className: "text-center py-3",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Spinner, {})
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.Fragment, {
        children: templates.map((preset, index) => {
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("div", {
            className: "my-5 bg-slate-400 hover:bg-slate-500 p-3 rounded-sm cursor-pointer",
            title: "Click To Apply",
            onClick: ev => {
              if (preset.isPro) {
                if (isProFeature) {
                  addNotifications({
                    title: "Opps its pro!",
                    content: "This feature only avilable in premium version",
                    type: "error"
                  });
                  return;
                }
              }
              addNotifications({
                title: "Preset Applied",
                content: "WOW, Your Post Grid just got new look!",
                type: "success"
              });
              var presetData = preset.data;
              presetData = JSON.parse(presetData);
              var presetId = presetData.postId;
              var loopLayout = presetData.loopLayout == undefined ? [] : presetData.loopLayout;
              var nthItemStyle = presetData.nthItemStyle == undefined ? [] : presetData.nthItemStyle;
              onChangeLayouts(loopLayout);
              addNotifications({
                title: "Layout Applied",
                content: "WOW, Your Post Grid just got new look!",
                type: "success"
              });
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("img", {
              className: "w-full",
              src: preset.thumb,
              alt: ""
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("div", {
              className: "mt-3 flex justify-between  items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("span", {
                className: "text-lg  text-white ",
                children: preset.label
              }), preset.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.Fragment, {
                children: isProFeature && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("span", {
                  className: "bg-amber-500 px-2 py-1  no-underline rounded-sm  cursor-pointer text-white ",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Pro", "post-grid")
                })
              })]
            })]
          }, index);
        })
      })]
    })
  });
}
class Layouts 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 {
      postData,
      onChangeLayouts,
      customerData,
      addNotifications,
      setHelp
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(Html, {
      postData: postData,
      onChangeLayouts: onChangeLayouts,
      customerData: customerData,
      addNotifications: addNotifications,
      setHelp: setHelp,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Layouts);

/***/ }),

/***/ "./src/components/Builder/notify.js":
/*!******************************************!*\
  !*** ./src/components/Builder/notify.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_icons__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/check.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
const {
  Component,
  useState,
  useEffect
} = wp.element;


function Html(props) {
  if (!props.warn) {
    return null;
  }
  var [notifications, setnotifications] = useState(props.notifications);
  useEffect(() => {
    var slicedArray = props.notifications.slice(-1);
    setnotifications(slicedArray);
    //setnotifications(props.notifications)
  }, [props.notifications]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", {
    className: `${notifications.length > 0 ? "" : "hidden"} fixed right-6 bottom-6 `,
    children: notifications?.map((item, index) => {
      var type = item.type;
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: `max-w-72 min-w-64 mb-2 animate__animated animate__backInRight overflow-hidden relative rounded-sm shadow-md bg-white p-3 border-l-4 border-0 ${type == 'success' ? "   border-l-green-700 border-solid " : ""} ${type == 'error' ? "   border-l-red-700 border-solid" : ""} ${type == 'warnning' ? "  border-l-yellow-500 border-solid" : ""}`,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("span", {
          className: "cursor-pointer px-1 bg-red-500 hover:bg-red-700 hover:text-white absolute top-0 right-0",
          onClick: ev => {
            var notificationsX = [...notifications];
            notificationsX.splice(index, 1);
            setnotifications(notificationsX);
          },
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_1__["default"], {
            fill: "#fff",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
          className: "flex items-center gap-3 ",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
            children: [type == "warnning" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_1__["default"], {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"]
            }), type == "error" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_1__["default"], {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"]
            }), type == "success" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_1__["default"], {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"]
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", {
            className: "text-base mb-2",
            children: item?.title
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", {
          className: "text-xs",
          children: item?.content
        })]
      }, index);
    })
  });
}
class Notify 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 {
      notifications
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(Html, {
      notifications: notifications,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Notify);

/***/ }),

/***/ "./src/components/Builder/pagination-types.js":
/*!****************************************************!*\
  !*** ./src/components/Builder/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 */   paginationTypes: () => (/* binding */ paginationTypes)
/* harmony export */ });
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__);

const paginationTypes = {
  none: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("None", "post-grid"),
    value: "none"
  },
  normal: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Normal Pagination", "post-grid"),
    value: "normal"
  }
  // ajax: {
  // 	label: __("Ajax Pagination", "post-grid"),
  // 	value: "ajax",
  // 	isPro: true,
  // },
  // next_previous: {
  // 	label: __("Next-Previous", "post-grid"),
  // 	value: "next_previous",
  // 	isPro: true,
  // },
  // loadmore: {
  // 	label: __("Load More", "post-grid"),
  // 	value: "loadmore",
  // 	isPro: true,
  // },
  // infinite: {
  // 	label: __("Infinite Load", "post-grid"),
  // 	value: "infinite",
  // 	isPro: true,
  // },
  // filterable: {
  // 	label: __("Filterable", "post-grid"),
  // 	value: "filterable"
  // },
};

/***/ }),

/***/ "./src/components/Builder/post-grid-list.js":
/*!**************************************************!*\
  !*** ./src/components/Builder/post-grid-list.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 react_sortablejs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__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__);
/* 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/add-card.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/help.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/check.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/copy-small.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/trash.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/pencil.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;




var myStore = wp.data.select('PostGridStore');


function Html(props) {
  if (!props.warn) {
    return null;
  }
  var isLoaded = props.isLoaded;
  var selectPostGrid = props.selectPostGrid;
  var activePostGrid = props.activePostGrid;
  var addNotifications = props.addNotifications;
  var setHelp = props.setHelp;
  var listQueryPrams = props.listQueryPrams;
  var setlistQueryPrams = props.setlistQueryPrams;
  var [searchPrams, setsearchPrams] = useState(listQueryPrams);
  var [posts, setPosts] = useState(null);
  var [pagination, setPagination] = useState({
    currentPage: listQueryPrams.page
  });
  var [dataLoaded, setdataLoaded] = useState(false);
  var [isLoading, setisLoading] = useState(false);
  var [deleteConfirm, setdeleteConfirm] = useState({
    id: "",
    confirm: false
  });
  var [rename, setrename] = useState({
    id: "",
    confirm: false
  });
  var [addNew, setaddNew] = useState({
    enable: false,
    title: ''
  });
  const copyData = data => {
    navigator.clipboard.writeText(data).then(() => {
      addNotifications({
        title: "Copied to clipboard!",
        content: "Use the shortcode in page or post conent where you want to display.",
        type: "success"
      });
    }).catch(err => {});
  };
  var queryArgs = [{
    "id": "postType",
    "val": ["post_grid"]
  }, {
    "id": "postStatus",
    "val": ["publish"]
  }, {
    "id": "s",
    "val": ""
  }, {
    "id": "order",
    "val": "DESC"
  }, {
    "id": "orderby",
    "val": ["date"]
  }, {
    "id": "postsPerPage",
    "val": "20"
  }, {
    "id": "paged",
    "val": "1"
  }];
  useEffect(() => {
    setisLoading(true);
    queryArgs.map(item => {
      var id = item.id;
      if (id == "paged") {
        item.val = pagination.currentPage;
      }
      if (id == "s") {
        item.val = searchPrams.search;
      }
    });
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
      path: "/post-grid/v2/post_list",
      method: "POST",
      data: {
        queryArgs: queryArgs,
        _wpnonce: post_grid_builder_js._wpnonce
      }
    }).then(res => {
      setisLoading(false);
      if (res.posts == undefined) {
        setPosts([]);
        addNotifications({
          title: "No Items Found",
          content: "It seems there is no items in the list.",
          type: "success"
        });
      } else {
        setPosts(res.posts);
        addNotifications({
          title: "Post Grid Loaded",
          content: "All Post Grid loaded, Now click to pick one to edit.",
          type: "success"
        });
      }
    });
  }, [isLoaded, pagination.currentPage, searchPrams.search]);
  function create_post() {
    setisLoading(true);
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
      path: "/post-grid/v2/create_post",
      method: "POST",
      data: {
        postTitle: addNew.title
      }
    }).then(res => {
      if (res.error) {
        addNotifications({
          title: "There is an Error!",
          content: res.errorMessage,
          type: "error"
        });
      }
      if (res.success) {
        var postsX = [...posts];
        postsX.unshift({
          ID: res.id,
          post_content: "",
          post_author: 0,
          post_title: addNew.title
        });
        setPosts(postsX);
        addNotifications({
          title: "Post Grid Created! ",
          content: res.successMessage,
          type: "success"
        });
        var addNewX = {
          ...addNew
        };
        addNewX.enable = !addNew.enable;
        setaddNew(addNewX);
      }
      setisLoading(false);
      if (res.status) {}
    });
  }
  function update_post_title(newValue, postId) {
    setisLoading(true);
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
      path: "/post-grid/v2/update_post_title",
      method: "POST",
      data: {
        postTitle: newValue,
        postId: postId
      }
    }).then(res => {
      // console.log(res);

      if (res.error) {
        addNotifications({
          title: "There is an Error!",
          content: res.errorMessage,
          type: "error"
        });
      }
      if (res.success) {
        //var postsX = [...posts];

        //postsX.unshift({ ID: res.id, post_content: "", post_author: 0, post_title: searchPrams.search });

        //setPosts(postsX)

        addNotifications({
          title: "Post Grid Title Updated!",
          content: res.successMessage,
          type: "success"
        });
      }
      setisLoading(false);
      if (res.status) {}
    });
  }
  function duplicate_post(postId) {
    setisLoading(true);
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
      path: "/post-grid/v2/duplicate_post",
      method: "POST",
      data: {
        postId: postId
      }
    }).then(res => {
      if (res.error) {
        addNotifications({
          title: "There is an Error!",
          content: res.errorMessage,
          type: "error"
        });
      }
      if (res.success) {
        var postsX = [...posts];
        postsX.unshift({
          ID: res.id,
          post_title: res.post_title
        });
        setPosts(postsX);
        addNotifications({
          title: "Post Grid duplicated!",
          content: res.successMessage,
          type: "success"
        });
      }
      setisLoading(false);
      if (res.status) {}
    });
  }
  function delete_post(postId, index) {
    if (!deleteConfirm) {
      return;
    }
    setisLoading(true);
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_2___default()({
      path: "/post-grid/v2/delete_post",
      method: "POST",
      data: {
        postId: postId
      }
    }).then(res => {
      if (res.error) {
        addNotifications({
          title: "There is an Error!",
          content: res.errorMessage,
          type: "error"
        });
      }
      if (res.success) {
        var postsX = [...posts];
        postsX.splice(index, 1);
        setPosts(postsX);
        //posts.unshift({ ID: res.id, post_title: res.post_title });

        addNotifications({
          title: "Post Grid deleted!",
          content: res.successMessage,
          type: "success"
        });
        setdeleteConfirm({
          id: "",
          confirm: false
        });
      }
      setisLoading(false);
      if (res.status) {}
    });
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
    className: "",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      className: "my-4 flex items-center gap-3",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_3__["default"], {
        value: searchPrams.search,
        placeholder: "Search...",
        className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
        onChange: newVal => {
          var searchPramsX = {
            ...searchPrams
          };
          searchPramsX.search = newVal;
          setsearchPrams(searchPramsX);
          const timer = setTimeout(() => {
            // Update the debounced value after delay
          }, 3000); // 300ms debounce delay
          return () => clearTimeout(timer); // Cleanup timer on value change or unmount
        }
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: "flex items-center  gap-2 py-2 px-3 cursor-pointer  capitalize bg-gray-700 text-white font-medium rounded hover:bg-gray-600 focus:outline-none focus:bg-gray-600",
        onClick: ev => {
          var addNewX = {
            ...addNew
          };
          addNewX.enable = !addNew.enable;
          setaddNew(addNewX);
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
          fill: "#fff",
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"]
        })
      }), addNew.enable && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
        position: "bottom right",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
          className: "p-4 ",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_3__["default"], {
            value: addNew.title,
            placeholder: "Give a name",
            className: "!py-1 px-2 mb-3 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
            onChange: newVal => {
              var addNewX = {
                ...addNew
              };
              addNewX.title = newVal;
              setaddNew(addNewX);
              const timer = setTimeout(() => {
                // Update the debounced value after delay
              }, 3000); // 300ms debounce delay
              return () => clearTimeout(timer); // Cleanup timer on value change or unmount
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
            className: "flex items-center  gap-2 py-2 px-3 cursor-pointer  capitalize bg-gray-700 text-white font-medium rounded hover:bg-gray-600 focus:outline-none focus:bg-gray-600",
            onClick: ev => {
              create_post();
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
              fill: "#fff",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              children: "Create"
            })]
          })]
        })
      }), !isLoading && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
        className: "cursor-pointer",
        title: "Click to know more",
        onClick: () => {
          setHelp({
            id: "createPostGrid",
            enable: true
          });
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"]
        })
      }), isLoading && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Spinner, {})
      })]
    }), !isLoading && posts == null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
      className: "p-3 my-5 bg-orange-400 ",
      children: "No Items, Please Create First One!"
    }), posts != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
      children: posts.map((item, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
          className: "border-0 border-b border-solid border-[#ddd]",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
            className: "flex justify-between align-middle items-center p-3  hover:bg-slate-300 cursor-pointer",
            onClick: ev => {
              selectPostGrid(item.ID);
              addNotifications({
                title: "Ready to Edit",
                content: "Now go to Edit panel to customize Post Grid.",
                type: "success"
              });
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
              className: "flex  align-middle items-center gap-2  ",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
                className: "text-base mb-2",
                children: item.post_title
              })
            }), activePostGrid == item.ID && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"]
              })
            })]
          }, index), activePostGrid == item.ID && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
              className: " px-3 flex flex-wrap align-middle items-center text-xs gap-3 my-2",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("a", {
                className: "",
                href: `${window.PostGrid.baseUrl}post.php?post=${item.ID}&action=edit`,
                target: "_blank",
                children: ["#", item.ID]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
                className: "cursor-pointer flex items-center",
                onClick: ev => {
                  duplicate_post(item.ID);
                },
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"],
                  size: "20"
                }), "Duplicate"]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
                className: "cursor-pointer text-red-700 flex items-center",
                title: "Delete Post",
                onClick: ev => {
                  setdeleteConfirm({
                    id: item.ID,
                    confirm: true
                  });
                  if (deleteConfirm.confirm) {
                    delete_post(item.ID, index);
                  }
                },
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__["default"],
                  size: "20"
                }), deleteConfirm.id == item.ID && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                  children: deleteConfirm && "Confirm"
                }), deleteConfirm.id != item.ID && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                  children: deleteConfirm && "Delete"
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
                className: "cursor-pointer flex items-center",
                title: "Copy Shortcodes",
                onClick: () => {
                  var str = `[post_grid_builder id="${item.ID}"]`;
                  copyData(str);
                },
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"],
                  size: "20"
                }), " Shortcode"]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
                className: "cursor-pointer flex items-center",
                title: "Rename",
                onClick: () => {
                  if (rename.id.length == 0) {
                    setrename({
                      id: item.ID,
                      confirm: false
                    });
                  } else {
                    setrename({
                      id: "",
                      confirm: false
                    });
                  }
                },
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_11__["default"],
                  size: "20"
                }), " Rename"]
              })]
            }), rename.id == item.ID && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
              className: "my-4 flex items-center justify-between gap-3",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_3__["default"], {
                placeholder: item.post_title,
                value: item.post_title,
                className: " px-2 !rounded-none border !border-[#8c8f94] !border-solid w-full",
                onChange: newVal => {
                  var postsX = [...posts];
                  postsX[index].post_title = newVal;
                  setPosts(postsX);
                  const timer = setTimeout(() => {
                    // Update the debounced value after delay
                    update_post_title(newVal, item.ID);
                  }, 3000); // 300ms debounce delay
                  return () => clearTimeout(timer); // Cleanup timer on value change or unmount
                }
              })
            })]
          })]
        });
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      className: "flex py-5 justify-between px-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: "bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
        onClick: ev => {
          if (pagination.currentPage > 1) {
            var currentPage = parseInt(pagination.currentPage) - 1;
            setPagination({
              currentPage: currentPage
            });
            setlistQueryPrams({
              ...listQueryPrams,
              page: currentPage
            });
          }
        },
        children: "Prev"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_3__["default"], {
        value: pagination.currentPage,
        type: "number",
        placeholder: "Search.../Add New...",
        className: "!py-1 px-2 text-center !border-2 !border-[#8c8f94] !border-solid w-[70px]",
        onChange: newVal => {
          newVal = parseInt(newVal);
          setPagination({
            currentPage: newVal
          });
          setlistQueryPrams({
            ...listQueryPrams,
            page: newVal
          });
        }
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: "bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
        onClick: ev => {
          var currentPage = parseInt(pagination.currentPage) + 1;
          setPagination({
            currentPage: currentPage
          });
          setlistQueryPrams({
            ...listQueryPrams,
            page: currentPage
          });
        },
        children: "Next"
      })]
    })]
  });
}
class PostGridList 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 {
      selectPostGrid,
      activePostGrid,
      setHelp,
      listQueryPrams,
      setlistQueryPrams,
      addNotifications
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
      selectPostGrid: selectPostGrid,
      activePostGrid: activePostGrid,
      warn: this.state.showWarning,
      isLoaded: this.state.isLoaded,
      setHelp: setHelp,
      listQueryPrams: listQueryPrams,
      setlistQueryPrams: setlistQueryPrams,
      addNotifications: addNotifications
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PostGridList);

/***/ }),

/***/ "./src/components/Builder/templates.js":
/*!*********************************************!*\
  !*** ./src/components/Builder/templates.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_block_editor__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__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_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/help.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__);
/* 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_api_fetch__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _splidejs_react_splide__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @splidejs/react-splide */ "./node_modules/@splidejs/react-splide/dist/js/react-splide.esm.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;










var myStore = wp.data.select("PostGridStore");
function Html(props) {
  if (!props.warn) {
    return null;
  }
  var addNotifications = props.addNotifications;
  if (!props?.postData?.post_content?.globalOptions?.viewType) {
    addNotifications({
      title: "Opps item missing",
      content: "Please select post first.",
      type: "error"
    });
    return null;
  }
  var onApplyTemplate = props.onApplyTemplate;
  var setHelp = props.setHelp;
  var [postData, setpostData] = useState(props.postData);
  var [PostGridData, setPostGridData] = useState(postData.post_content);
  var [isLoading, setisLoading] = useState(false);
  var [isProFeature, setisProFeature] = useState(true);
  var [customerData, setcustomerData] = useState(props.customerData);
  var postId = postData.ID;
  var [templates, settemplates] = useState([]);
  const [queryLayouts, setqueryLayouts] = useState({
    keyword: "",
    price: "",
    viewType: postData.post_content.globalOptions.viewType == undefined ? "viewGrid" : postData.post_content.globalOptions.viewType,
    page: 1
  });
  useEffect(() => {
    if (customerData.isPro) {
      setisProFeature(false);
    }
  }, [props.customerData]);
  useEffect(() => {
    setisLoading(true);
    var requestData = {
      keyword: queryLayouts.keyword,
      page: queryLayouts.page,
      price: queryLayouts.price,
      viewType: queryLayouts.viewType
    };
    requestData = JSON.stringify(requestData);
    fetch("https://demo.pickplugins.com/post-grid/wp-json/post-grid/v2/get_posts_post_grid", {
      method: "POST",
      headers: {
        "Content-Type": "application/json;charset=utf-8"
      },
      body: requestData
    }).then(response => {
      if (response.ok && response.status < 400) {
        response.json().then(data => {
          var posts = data?.posts;
          var postsX = [];
          posts.map(item => {
            postsX.push({
              label: item.post_title,
              thumb: item.thumb,
              isPro: item?.is_pro == "yes" ? true : false,
              data: item.post_content
            });
            settemplates(postsX);
          });
          setisLoading(false);
        });
      }
    }).catch(_error => {
      //this.saveAsStatus = 'error';
      // handle the error
    });
  }, []);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("div", {
    className: "max-h-screen overflow-y-scroll",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("div", {
      className: "p-3",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("p", {
        className: "flex items-center gap-2",
        children: ["How templates work.", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("span", {
          className: "cursor-pointer",
          title: "Click to know more",
          onClick: () => {
            setHelp({
              id: "templatesHelp",
              enable: true
            });
          },
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"], {
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__["default"]
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("div", {
        className: "my-4  items-center hidden gap-3",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_6__["default"], {
          value: queryLayouts.keyword,
          placeholder: "Search...",
          className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
          onChange: newVal => {
            var queryLayoutsX = {
              ...queryLayouts
            };
            queryLayoutsX.keyword = newVal;
            setqueryLayouts(queryLayoutsX);
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.SelectControl, {
          label: "",
          value: queryLayouts.price,
          options: [{
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Free/Pro", "post-grid"),
            value: ""
          }, {
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Free", "post-grid"),
            value: "free"
          }, {
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Pro", "post-grid"),
            value: "pro"
          }],
          onChange: newVal => {
            var queryLayoutsX = {
              ...queryLayouts
            };
            queryLayoutsX.keyword = newVal;
            setqueryLayouts(queryLayoutsX);
          }
        })]
      }), isLoading && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("div", {
        className: "text-center py-3",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__.Spinner, {})
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.Fragment, {
        children: templates.map((preset, index) => {
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("div", {
            className: "my-5 bg-slate-400 hover:bg-slate-500 p-3 rounded-sm cursor-pointer",
            title: "Click To Apply",
            onClick: ev => {
              if (preset.isPro) {
                if (isProFeature) {
                  addNotifications({
                    title: "Opps its pro!",
                    content: "This feature only avilable in premium version",
                    type: "error"
                  });
                  return;
                }
              }
              addNotifications({
                title: "Preset Applied",
                content: "WOW, Your Post Grid just got new look!",
                type: "success"
              });
              var presetData = preset.data;
              presetData = JSON.parse(presetData);
              var presetId = presetData.postId;
              var presetClean = {};
              Object.entries(presetData).map(item => {
                var itemIndex = item[0];
                var itemArg = item[1];
                if (itemArg.options != undefined) {
                  delete itemArg.options;
                }
                if (PostGridData[itemIndex]) {
                  delete PostGridData[itemIndex]?.styles;
                  delete PostGridData[itemIndex]?.hover;
                  delete PostGridData[itemIndex]?.after;
                  delete PostGridData[itemIndex]?.before;
                  delete PostGridData[itemIndex]?.active;
                  delete PostGridData[itemIndex]?.focus;
                  delete PostGridData[itemIndex]?.target;
                  delete PostGridData[itemIndex]?.visited;
                }
                if (itemIndex == 'loopLayout') {
                  presetClean[itemIndex] = itemArg;
                } else {
                  presetClean[itemIndex] = {
                    ...PostGridData[itemIndex],
                    ...itemArg
                  };
                }
              });
              var PostGridDataX = {
                ...PostGridData,
                ...presetClean
              };

              //	var reponsiveCss = Array.isArray(PostGridDataX.reponsiveCss) ? Object.values(PostGridDataX.reponsiveCss).join("") : PostGridDataX.reponsiveCss;

              var reponsiveCss = Object.values(PostGridDataX.reponsiveCss).join("");
              var reponsiveCss = reponsiveCss.replaceAll(presetId, postId);
              PostGridDataX.reponsiveCss = reponsiveCss;
              if (PostGridDataX.nthItemStyle != undefined) {
                var nthItemStyle = [];
                Object.entries(PostGridDataX.nthItemStyle).map(item => {
                  //console.log(item[1])

                  nthItemStyle.push(item[1]);
                });
                console.log(PostGridDataX);
                PostGridDataX.nthItemStyle = nthItemStyle;
              }
              onApplyTemplate(PostGridDataX);
              addNotifications({
                title: "Preset Applied",
                content: "WOW, Your Post Grid just got new look!",
                type: "success"
              });
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("img", {
              className: "w-full",
              src: preset.thumb,
              alt: ""
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsxs)("div", {
              className: "mt-3 flex justify-between  items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("span", {
                className: "text-lg  text-white ",
                children: preset.label
              }), preset.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.Fragment, {
                children: isProFeature && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)("span", {
                  className: "bg-amber-500 px-2 py-1  no-underline rounded-sm  cursor-pointer text-white ",
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Pro", "post-grid")
                })
              })]
            })]
          }, index);
        })
      })]
    })
  });
}
class Templates 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 {
      postData,
      onApplyTemplate,
      customerData,
      addNotifications,
      setHelp
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_8__.jsx)(Html, {
      postData: postData,
      onApplyTemplate: onApplyTemplate,
      customerData: customerData,
      addNotifications: addNotifications,
      setHelp: setHelp,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Templates);

/***/ }),

/***/ "./src/components/animate-on/index.js":
/*!********************************************!*\
  !*** ./src/components/animate-on/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_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_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__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_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _toggle__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../toggle */ "./src/components/toggle/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__);










function Html(props) {
  if (!props.warn) {
    return null;
  }
  const [animateOn, setanimateOn] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useState)(props.animateOn);
  var [rules, setrules] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useState)(animateOn?.rules == null || animateOn?.rules == undefined ? [] : animateOn.rules);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useEffect)(() => {
    props.onChange(animateOn);
  }, [animateOn]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_3__.useEffect)(() => {
    var animateOnX = {
      ...animateOn
    };
    animateOnX.rules = rules;
    setanimateOn(animateOnX);
  }, [rules]);
  var animateListArgsBasic = {
    backInDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("backInDown", "post-grid"),
      value: "backInDown"
    },
    backInLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("backInLeft", "post-grid"),
      value: "backInLeft"
    },
    backInRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("backInRight", "post-grid"),
      value: "backInRight"
      //isPro: true,
    },
    backInUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("backInUp", "post-grid"),
      value: "backInUp"
      //isPro: true,
    },
    bounceIn: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceIn", "post-grid"),
      value: "bounceIn"
    },
    bounceInDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceInDown", "post-grid"),
      value: "bounceInDown"
      //isPro: true,
    },
    bounceInLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceInLeft", "post-grid"),
      value: "bounceInLeft"
      //isPro: true,
    },
    bounceInRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceInRight", "post-grid"),
      value: "bounceInRight"
      //isPro: true,
    },
    bounceInUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceInUp", "post-grid"),
      value: "bounceInUp"
      //isPro: true,
    },
    fadeIn: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeIn", "post-grid"),
      value: "fadeIn"
    },
    fadeInDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInDown", "post-grid"),
      value: "fadeInDown"
      //isPro: true,
    },
    fadeInDownBig: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInDownBig", "post-grid"),
      value: "fadeInDownBig"
      //isPro: true,
    },
    fadeInLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInLeft", "post-grid"),
      value: "fadeInLeft"
      //isPro: true,
    },
    fadeInLeftBig: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInLeftBig", "post-grid"),
      value: "fadeInLeftBig"
      //isPro: true,
    },
    fadeInRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInRight", "post-grid"),
      value: "fadeInRight"
      //isPro: true,
    },
    fadeInRightBig: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInRightBig", "post-grid"),
      value: "fadeInRightBig"
      //isPro: true,
    },
    fadeInUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInUp", "post-grid"),
      value: "fadeInUp"
      //isPro: true,
    },
    fadeInUpBig: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInUpBig", "post-grid"),
      value: "fadeInUpBig"
      //isPro: true,
    },
    fadeInTopLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInTopLeft", "post-grid"),
      value: "fadeInTopLeft"
      //isPro: true,
    },
    fadeInTopRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInTopRight", "post-grid"),
      value: "fadeInTopRight"
      //isPro: true,
    },
    fadeInBottomRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInBottomRight", "post-grid"),
      value: "fadeInBottomRight"
      //isPro: true,
    },
    fadeInBottomLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeInBottomLeft", "post-grid"),
      value: "fadeInBottomLeft"
      //isPro: true,
    },
    rotateIn: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateIn", "post-grid"),
      value: "rotateIn"
    },
    rotateInDownLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateInDownLeft", "post-grid"),
      value: "rotateInDownLeft"
      //isPro: true,
    },
    rotateInDownRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateInDownRight", "post-grid"),
      value: "rotateInDownRight"
      //isPro: true,
    },
    rotateInUpLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateInUpLeft", "post-grid"),
      value: "rotateInUpLeft"
      //isPro: true,
    },
    rotateInUpRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateInUpRight", "post-grid"),
      value: "rotateInUpRight"
      //isPro: true,
    },
    zoomIn: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomIn", "post-grid"),
      value: "zoomIn",
      isPro: true
    },
    zoomInDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomInDown", "post-grid"),
      value: "zoomInDown"
      //isPro: true,
    },
    zoomInLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomInLeft", "post-grid"),
      value: "zoomInLeft"
      //isPro: true,
    },
    zoomInRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomInRight", "post-grid"),
      value: "zoomInRight"
      //isPro: true,
    },
    zoomInUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomInUp", "post-grid"),
      value: "zoomInUp"
      //isPro: true,
    },
    slideInDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("slideInDown", "post-grid"),
      value: "slideInDown"
      //isPro: true,
    },
    slideInLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("slideInLeft", "post-grid"),
      value: "slideInLeft"
      //isPro: true,
    },
    slideInRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("slideInRight", "post-grid"),
      value: "slideInRight"
      //isPro: true,
    },
    slideInUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("slideInUp", "post-grid"),
      value: "slideInUp"
      //isPro: true,
    },
    backOutDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("backOutDown", "post-grid"),
      value: "backOutDown"
    },
    backOutLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("backOutLeft", "post-grid"),
      value: "backOutLeft"
    },
    backOutRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("backOutRight", "post-grid"),
      value: "backOutRight"
      //isPro: true,
    },
    backOutUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("backOutUp", "post-grid"),
      value: "backOutUp"
      //isPro: true,
    },
    bounceOut: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceOut", "post-grid"),
      value: "bounceOut"
    },
    bounceOutDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceOutDown", "post-grid"),
      value: "bounceOutDown"
      //isPro: true,
    },
    bounceOutLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceOutLeft", "post-grid"),
      value: "bounceOutLeft"
      //isPro: true,
    },
    bounceOutRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceOutRight", "post-grid"),
      value: "bounceOutRight"
      //isPro: true,
    },
    bounceOutUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("bounceOutUp", "post-grid"),
      value: "bounceOutUp"
      //isPro: true,
    },
    fadeOut: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOut", "post-grid"),
      value: "fadeOut"
    },
    fadeOutDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutDown", "post-grid"),
      value: "fadeOutDown"
      //isPro: true,
    },
    fadeOutDownBig: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutDownBig", "post-grid"),
      value: "fadeOutDownBig"
      //isPro: true,
    },
    fadeOutLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutLeft", "post-grid"),
      value: "fadeOutLeft"
      //isPro: true,
    },
    fadeOutLeftBig: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutLeftBig", "post-grid"),
      value: "fadeOutLeftBig"
      //isPro: true,
    },
    fadeOutRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutRight", "post-grid"),
      value: "fadeOutRight"
      //isPro: true,
    },
    fadeOutRightBig: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutRightBig", "post-grid"),
      value: "fadeOutRightBig"
      //isPro: true,
    },
    fadeOutUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutUp", "post-grid"),
      value: "fadeOutUp"
      //isPro: true,
    },
    fadeOutUpBig: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutUpBig", "post-grid"),
      value: "fadeOutUpBig"
      //isPro: true,
    },
    fadeOutTopLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutTopLeft", "post-grid"),
      value: "fadeOutTopLeft"
      //isPro: true,
    },
    fadeOutTopRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutTopRight", "post-grid"),
      value: "fadeOutTopRight"
      //isPro: true,
    },
    fadeOutBottomRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutBottomRight", "post-grid"),
      value: "fadeOutBottomRight"
      //isPro: true,
    },
    fadeOutBottomLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("fadeOutBottomLeft", "post-grid"),
      value: "fadeOutBottomLeft"
      //isPro: true,
    },
    rotateOut: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateOut", "post-grid"),
      value: "rotateOut"
    },
    rotateOutDownLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateOutDownLeft", "post-grid"),
      value: "rotateOutDownLeft"
      //isPro: true,
    },
    rotateOutDownRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateOutDownRight", "post-grid"),
      value: "rotateOutDownRight"
      //isPro: true,
    },
    rotateOutUpLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateOutUpLeft", "post-grid"),
      value: "rotateOutUpLeft"
      //isPro: true,
    },
    rotateOutUpRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("rotateOutUpRight", "post-grid"),
      value: "rotateOutUpRight"
      //isPro: true,
    },
    zoomOut: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomOut", "post-grid"),
      value: "zoomOut"
      //isPro: true,
    },
    zoomOutDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomOutDown", "post-grid"),
      value: "zoomOutDown"
      //isPro: true,
    },
    zoomOutLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomOutLeft", "post-grid"),
      value: "zoomOutLeft"
      //isPro: true,
    },
    zoomOutRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomOutRight", "post-grid"),
      value: "zoomOutRight"
      //isPro: true,
    },
    zoomOutUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("zoomOutUp", "post-grid"),
      value: "zoomOutUp"
      //isPro: true,
    },
    slideOutDown: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("slideOutDown", "post-grid"),
      value: "slideOutDown"
      //isPro: true,
    },
    slideOutLeft: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("slideOutLeft", "post-grid"),
      value: "slideOutLeft"
      //isPro: true,
    },
    slideOutRight: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("slideOutRight", "post-grid"),
      value: "slideOutRight"
      //isPro: true,
    },
    slideOutUp: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("slideOutUp", "post-grid"),
      value: "slideOutUp"
      //isPro: true,
    }
  };
  let animateListArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_1__.applyFilters)("AnimateOnArgs", animateListArgsBasic);
  var events = {
    load: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Page Load", "post-grid"),
      value: "load"
    },
    scroll: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Scroll To", "post-grid"),
      value: "scroll"
    },
    mouseover: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Mouse Over", "post-grid"),
      value: "mouseover"
    },
    mouseout: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Mouse Out", "post-grid"),
      value: "mouseout"
    },
    click: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Click Element", "post-grid"),
      value: "click"
    }
  };
  var RemoveAnimateOnGroup = function ({
    title,
    index
  }) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"], {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"],
        onClick: ev => {
          var rulesX = [...rules];
          rulesX.splice(index, 1);
          setrules(rulesX);
        }
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("span", {
        children: title
      })]
    });
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
    className: "relative",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      className: "my-3",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
        // className="bg-gray-700 hover:bg-gray-600 p-2 px-4 text-white inline-block cursor-pointer rounded-sm"
        className: "flex gap-2 justify-center my-2 cursor-pointer py-2 px-4 capitalize  bg-gray-700\t text-white font-medium rounded hover:bg-gray-600\t hover:text-white focus:outline-none focus:bg-gray-600\t",
        onClick: ev => {
          var rulesX = [...rules];
          rulesX.push({
            event: "mouseover",
            title: "",
            animationName: "backInDown",
            eventTarget: '.item',
            duration: "",
            delay: ""
          });
          setrules(rulesX);
        },
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Add", "post-grid")
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
      className: "my-4",
      children: rules.map((group, groupIndex) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_toggle__WEBPACK_IMPORTED_MODULE_6__["default"], {
          title: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(RemoveAnimateOnGroup, {
            title: events[group.event]?.label + " - " + animateListArgs[group.animationName]?.label,
            index: groupIndex
          }),
          initialOpen: false,
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
            className: "my-3",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
              children: "Event?"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
              position: "bottom right",
              variant: "secondary",
              buttonTitle: group.event == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : group.event,
              options: events,
              onChange: (option, index) => {
                var rulesX = [...rules];
                rulesX[groupIndex]["event"] = option.value;
                setrules(rulesX);
              },
              values: ""
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Target?", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
              className: "",
              value: group.eventTarget,
              onChange: newVal => {
                var rulesX = [...rules];
                rulesX[groupIndex]["eventTarget"] = newVal;
                setrules(rulesX);
              }
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Animation", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
              position: "bottom right",
              variant: "secondary",
              buttonTitle: animateListArgs[group.animationName] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : animateListArgs[group.animationName].label,
              options: animateListArgs,
              onChange: (option, index) => {
                var rulesX = [...rules];
                rulesX[groupIndex]["animationName"] = option.value;
                setrules(rulesX);
              },
              values: ""
            })]
          })]
        }, groupIndex);
      })
    })]
  });
}
class CBAnimateOn extends _wordpress_element__WEBPACK_IMPORTED_MODULE_3__.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,
      searchPlaceholder,
      options,
      //[{"label":"Select..","icon":"","value":""}]
      buttonTitle,
      onChange,
      animateOn,
      values,
      value
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(Html, {
        value: value,
        position: position,
        searchPlaceholder: searchPlaceholder,
        btnClass: btnClass,
        variant: variant,
        options: options,
        buttonTitle: buttonTitle,
        onChange: onChange,
        animateOn: animateOn,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (CBAnimateOn);

/***/ }),

/***/ "./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__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);





function Html(props) {
  const position = props.position;
  const obj = props.obj;
  const variant = props.variant;
  const options = props.options;
  const buttonTitle = props.buttonTitle;
  const onChange = props.onChange;
  const values = props.values;
  const value = props.value;
  const sudoScourceUpdate = props.sudoScourceUpdate;

  //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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "relative",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "",
      onClick: ev => {
        setPickerOpen(prev => !prev);
      },
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
        className: "pg-font flex gap-2 justify-center cursor-pointer py-2 px-4 capitalize tracking-wide !bg-gray-800 !text-white font-medium !rounded hover:!bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700"
        // variant={variant}
        ,
        children: optionsX[value] != undefined ? optionsX[value].label : buttonTitle
      })
    }), pickerOpen && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Popover, {
      position: position,
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "p-2 w-[260px] pg-font pg-setting-input-text custom-scrollbar ",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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);
            }
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          children: [keyword.length == 0 && typeof optionsX == "object" && Object.entries(optionsX).map(args => {
            var index = args[0];
            var x = args[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
              className: "border-b border-b-gray-800/20 hover:border-b-gray-800 transition-all duration-200 ease-in-out border-transparent border-solid cursor-pointer hover:bg-slate-200 p-2 block last-of-type:border-b-0 min-h-[40px]",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                className: [x.isPro ? "flex justify-between items-center" : ""],
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                  className: [x.isPro ? "text-gray-400" : ""],
                  children: [x.icon != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                    className: "",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, {
                      children: x.icon
                    })
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                    className: "flex items-center gap-2",
                    onClick: ev => {
                      if (x.isPro == true) {
                        alert("Sorry this feature only available 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');

                        //localStorage.clear();

                        //options = JSON.parse(sudoScourceArgsLocalX);
                        //setoptionsX(JSON.parse(sudoScourceArgsLocalX));

                        onChange(x, index);
                        optionsX[sudoId] = {
                          label: x.label,
                          value: sudoId
                        };
                        setoptionsX(optionsX);

                        //sudoScourceUpdate();
                      }
                    },
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                      children: x.label
                    }), obj[index] != null && Object.entries(obj[index]).length > 0 ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                      className: "pg-text-color font-bold",
                      children: "*"
                    }) : " "]
                  })]
                }), x.arg != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                  className: "w-16",
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
                    className: "mr-2",
                    value: x.arg,
                    onChange: newVal => {
                      x.arg = newVal;
                    }
                  })
                }), x.isPro &&
                /*#__PURE__*/
                // <span className="bg-amber-400 rounded-sm px-3  text-white hover:text-white">
                (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
                  target: "_blank",
                  href: "https://pickplugins.com/post-grid/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=" + x.label,
                  className: "pg-bg-color rounded-sm px-3 inline-block cursor-pointer py-1 no-underline text-white hover:text-white",
                  children: "Pro"
                })
                // </span>
                ]
              }), x.description != undefined && x.description.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                className: "text-xs text-slate-400",
                children: x.description
              })]
            });
          }), keyword.length == 0 && typeof optionsX == "array" && optionsX.map((x, index) => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
              className: " border-b border-b-gray-800/20 hover:border-b-gray-800 transition-all duration-200 ease-in-out border-transparent border-solid cursor-pointer hover:bg-slate-200 p-2 block last-of-type:border-b-0 min-h-[40px]",
              onClick: ev => {
                //onChange(x, index)

                if (x.isPro == true) {
                  alert("Sorry this feature only available in pro");
                } else {
                  onChange(x, index);
                }
              },
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                className: "flex justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                  className: "",
                  children: [x.icon != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                    className: "",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, {
                      children: x.icon
                    })
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("span", {
                    className: "flex items-center gap-2",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                      children: x.label
                    }), obj[index] != null && Object.entries(obj[index]).length > 0 ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                      className: "pg-text-color font-bold",
                      children: "*"
                    }) : " "]
                  })]
                }), x.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
                  target: "_blank",
                  href: "https://comboblocks.com/pricing/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=" + x.label,
                  className: "pg-bg-color rounded-sm px-3 inline-block cursor-pointer py-1 no-underline text-white hover:text-white",
                  children: "Pro"
                })]
              }), x.description != undefined && x.description.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                className: "text-xs text-slate-400",
                children: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                className: "border-b border-b-gray-800/20 hover:border-b-gray-800 transition-all duration-200 ease-in-out border-transparent border-solid cursor-pointer hover:bg-slate-200 p-2 block last-of-type:border-b-0 min-h-[40px]",
                onClick: ev => {
                  //onChange(x, index)

                  if (x.isPro == true) {
                    alert("Sorry this feature only available in pro");
                  } else {
                    onChange(x, index);
                  }
                },
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                  className: "flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                    className: "",
                    children: [x.icon != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                      className: "",
                      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, {
                        children: x.icon
                      })
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("span", {
                      className: "flex items-center gap-2",
                      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                        children: x.label
                      }), obj[index] != null && Object.entries(obj[index]).length > 0 ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                        className: "pg-text-color font-bold",
                        children: "*"
                      }) : " "]
                    })]
                  }), x.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
                    target: "_blank",
                    href: "https://comboblocks.com/pricing/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=" + x.label,
                    className: "pg-bg-color rounded-sm px-3 inline-block cursor-pointer py-1 no-underline text-white hover:text-white",
                    children: "Pro"
                  })]
                }), x.description != undefined && x.description.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                  className: "text-xs text-slate-400",
                  children: x.description
                })]
              });
            }
          }), keyword.length > 0 && typeof filteredOptions == "array" && filteredOptions.map((x, index) => {
            if (x.exclude == false) {
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                className: "border-b border-b-gray-800/20 hover:border-b-gray-800 transition-all duration-200 ease-in-out border-transparent border-solid cursor-pointer hover:bg-slate-200 p-2 block last-of-type:border-b-0 min-h-[40px]",
                onClick: ev => {
                  //onChange(x, index)

                  if (x.isPro == true) {
                    alert("Sorry this feature only available in pro");
                  } else {
                    onChange(x, index);
                  }
                },
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                  className: "flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                    className: "",
                    children: [x.icon != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                      className: "",
                      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, {
                        children: x.icon
                      })
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("span", {
                      className: "flex items-center gap-2",
                      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                        children: x.label
                      }), obj[index] != null && Object.entries(obj[index]).length > 0 ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                        className: "pg-text-color font-bold",
                        children: "*"
                      }) : " "]
                    })]
                  }), x.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
                    target: "_blank",
                    href: "https://comboblocks.com/pricing/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=" + x.label,
                    className: "pg-bg-color rounded-sm px-3 inline-block cursor-pointer py-1 no-underline text-white hover:text-white",
                    children: "Pro"
                  })]
                }), x.description != undefined && x.description.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                  className: "text-xs text-slate-400",
                  children: x.description
                })]
              });
            }
          }), keyword.length > 0 && typeof filteredOptions == "object" && Object.entries(filteredOptions).length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: "text-center p-2 text-red-500 ",
            children: "No options found."
          }), keyword.length > 0 && filteredOptions.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: "text-center p-2 text-red-500 ",
            children: "No options found."
          })]
        })]
      })
    })]
  });
}
class PGDropdownSudoSelector 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,
      obj,
      variant,
      options,
      buttonTitle,
      onChange,
      values,
      value,
      sudoScourceUpdate
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
        position: position,
        obj: obj,
        variant: variant,
        options: options,
        buttonTitle: buttonTitle,
        onChange: onChange,
        values: values,
        value: value,
        sudoScourceUpdate: sudoScourceUpdate,
        warn: this.state.showWarning
      })
    });
  }
}
/* 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__);
/* harmony import */ var _wordpress_keycodes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/keycodes */ "@wordpress/keycodes");
/* harmony import */ var _wordpress_keycodes__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_keycodes__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);





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;

  //////////////////
  const firstElementRef = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useRef)(null);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
    if (pickerOpen && firstElementRef.current) {
      firstElementRef.current.focus();
    }
  }, [pickerOpen]);
  const handleKeyDown = event => {
    if (!props.warn) return;
    const focusableElements = document.querySelectorAll(".focusable");
    const inputControl = document.querySelector(".pgDropdownSearch");
    switch (event.key) {
      case "ArrowDown":
        // case "ArrowRight":
        event.preventDefault();
        for (let i = 0; i < focusableElements.length; i++) {
          if (focusableElements[i] === document.activeElement) {
            const nextIndex = (i + 1) % focusableElements.length;
            focusableElements[nextIndex].focus();
            break;
          }
        }
        break;
      case "ArrowUp":
        // case "ArrowLeft":
        event.preventDefault();
        for (let i = 0; i < focusableElements.length; i++) {
          if (focusableElements[i] === document.activeElement) {
            const prevIndex = (i - 1 + focusableElements.length) % focusableElements.length;
            focusableElements[prevIndex].focus();
            break;
          }
        }
        break;
      case "/":
        event.preventDefault();
        if (inputControl) inputControl.focus();
        break;
      case "Escape":
        event.preventDefault();
        setPickerOpen(false);
        break;
      default:
        break;
    }
  };

  // Handle focusing on the first element
  // useEffect(() => {
  // 	if (props.warn && firstElementRef.current) {
  // 		firstElementRef.current.focus();
  // 	}
  // }, [props.warn]);
  //////////////////

  function isNumeric(n) {
    return !isNaN(parseFloat(n)) && isFinite(n);
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "relative",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "",
      onClick: ev => {
        setPickerOpen(prev => !prev);
      },
      children: [typeof value == "string" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
        className: `${btnClass} pg-font flex gap-2 justify-center  cursor-pointer py-2 px-4 capitalize  !bg-gray-800 !text-white font-medium !rounded hover:!bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700`
        // variant={variant}
        ,
        children: options[value] != undefined ? options[value]?.label : buttonTitle
      }), typeof value != "string" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
        className: `${btnClass} pg-font flex gap-2 justify-center  cursor-pointer py-2 px-4 capitalize  !bg-gray-800 !text-white font-medium !rounded hover:!bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700`
        // variant={variant}
        ,
        children: buttonTitle
      })]
    }), pickerOpen && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Popover, {
      position: position,
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "p-2 w-[300px] pg-font pg-setting-input-text max-h-[350px] custom-scrollbar\t",
        onKeyDown: handleKeyDown,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "absolute -top-[15px] -left-[15px] rounded-full  w-[30px] h-[30px] bg-red-500 flex justify-center items-center cursor-pointer ",
          onClick: ev => {
            setPickerOpen(prev => !prev);
          },
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: "text-[20px] text-white ",
            children: "\xD7"
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "flex flex-col w-full ",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
            autoComplete: "off",
            className: "p-3 w-full pgDropdownSearch",
            placeholder: props.searchPlaceholder == undefined ? "Search..." : props.searchPlaceholder,
            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);
              }
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("p", {
            className: "block w-full text-xs pg-font ",
            children: ["Press", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("code", {
              className: "inline-block p-1 px-2 bg-gray-500/60 text-white",
              children: "\u2B7E Tab"
            }), "to access by keyboard."]
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          children: [keyword.length == 0 && typeof options == "object" && Object.entries(options).map(args => {
            var index = args[0];
            var x = args[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("button", {
              ////
              ref: firstElementRef
              ////
              ,
              className: [typeof value == "object" && value.includes(isNumeric(index) ? parseInt(index) : index) ? "w-full focusable !border-b cursor-pointer bg-slate-200 p-2 block" : "w-full focusable !border-b !border-b-gray-800/20 hover:border-b-gray-800 transition-all duration-200 ease-in-out border-transparent !border-solid cursor-pointer hover:bg-slate-200 p-2 block last-of-type:!border-b-0 min-h-[40px] "],
              onClick: ev => {
                if (x.isPro == true) {
                  alert("Sorry this feature only available in pro");
                } else {
                  onChange(x, index);
                }
              },
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                className: "flex justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                  className: [x.isPro ? "text-gray-400 text-left" : "text-left"],
                  children: [x.icon != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                    className: "",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, {
                      children: x.icon
                    })
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                    className: " text-left",
                    children: x.label
                  })]
                }), x.isPro &&
                /*#__PURE__*/
                // <span className="bg-amber-500 rounded-sm px-3  py-1 no-underline text-white hover:text-white">
                (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
                  target: "_blank",
                  href: "https://comboblocks.com/pricing/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=" + x.label,
                  className: " bg-amber-500 rounded-sm px-3 inline-block cursor-pointer py-1 no-underline text-white hover:text-white",
                  children: "Pro"
                })
                // </span>
                , x.coming && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                  className: "bg-violet-700 text-white px-2 py-1 rounded-sm",
                  children: "Coming"
                })]
              }), x.description != undefined && x.description.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                className: "text-xs text-slate-400 text-left",
                children: x.description
              })]
            });
          }), keyword.length == 0 && typeof options == "array" && options.map((x, index) => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("button", {
              ////
              ref: firstElementRef
              ////
              ,
              className: [typeof value == "object" && value.includes(IsNumeric(index) ? parseInt(index) : index) ? "border-b cursor-pointer bg-slate-200 p-2 block" : "border-b border-b-gray-800/20 hover:border-b-gray-800 transition-all duration-200 ease-in-out border-transparent border-solid cursor-pointer hover:bg-slate-200 p-2 block last-of-type:!border-b-0 min-h-[40px] "],
              onClick: ev => {
                //onChange(x, index)

                if (x.isPro == true) {
                  alert("Sorry this feature only available in pro");
                } else {
                  onChange(x, index);
                }
              },
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                className: "flex justify-between items-center",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                  className: [x.isPro ? "text-gray-400  text-left" : "  text-left"],
                  children: [x.icon != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                    className: "",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, {
                      children: x.icon
                    })
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("span", {
                    className: "  text-left",
                    children: [x.label, " "]
                  })]
                }), x.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
                  target: "_blank",
                  href: "https://comboblocks.com/pricing/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=" + x.label,
                  className: "bg-amber-500 rounded-sm px-3 inline-block cursor-pointer py-1 no-underline text-white hover:text-white",
                  children: "Pro"
                }), x.coming && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                  className: "bg-violet-700 text-white px-2 py-1 rounded-sm",
                  children: "Coming"
                })]
              }), x.description != undefined && x.description.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                className: "text-xs text-slate-400 text-left",
                children: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("button", {
                ////
                ref: firstElementRef
                ////
                ,
                className: "w-full focusable !border-b !border-b-gray-800/20 hover:border-b-gray-800 transition-all duration-200 ease-in-out border-transparent !border-solid cursor-pointer hover:bg-slate-200 p-2 block last-of-type:!border-b-0 min-h-[40px] ",
                onClick: ev => {
                  //onChange(x, index)

                  if (x.isPro == true) {
                    alert("Sorry this feature only available in pro");
                  } else {
                    onChange(x, index);
                  }
                },
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                  className: "flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                    className: [x.isPro ? "text-gray-400  text-left" : "  text-left"],
                    children: [x.icon != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                      className: "",
                      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, {
                        children: x.icon
                      })
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("span", {
                      className: "  text-left",
                      children: [x.label, " "]
                    })]
                  }), x.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
                    target: "_blank",
                    href: "https://comboblocks.com/pricing/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=" + x.label,
                    className: "bg-amber-500 rounded-sm px-3 inline-block cursor-pointer py-1 n  text-lefto-underline text-white hover:text-white",
                    children: "Pro"
                  }), x.coming && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                    className: "bg-violet-700 text-white px-2 py-1 rounded-sm",
                    children: "Coming"
                  })]
                }), x.description != undefined && x.description.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                  className: "text-xs text-slate-400 text-left",
                  children: x.description
                })]
              });
            }
          }), keyword.length > 0 && typeof filteredOptions == "array" && filteredOptions.map((x, index) => {
            if (x.exclude == false) {
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("button", {
                ////
                ref: firstElementRef
                ////
                ,
                className: "w-full focusable !border-b !border-b-gray-800/20 hover:border-b-gray-800 transition-all duration-200 ease-in-out border-transparent !border-solid cursor-pointer hover:bg-slate-200 p-2 block last-of-type:!border-b-0 min-h-[40px] ",
                onClick: ev => {
                  //onChange(x, index)

                  if (x.isPro == true) {
                    alert("Sorry this feature only available in pro");
                  } else {
                    onChange(x, index);
                  }
                },
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                  className: "flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
                    className: [x.isPro ? "text-gray-400  text-left" : "  text-left"],
                    children: [x.icon != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                      className: "",
                      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.RawHTML, {
                        children: x.icon
                      })
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("span", {
                      className: "  text-left",
                      children: [x.label, " "]
                    })]
                  }), x.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
                    target: "_blank",
                    href: "https://comboblocks.com/pricing/?utm_source=dropdownComponent&utm_term=proFeature&utm_campaign=pluginPostGrid&utm_medium=" + x.label,
                    className: "bg-amber-500 rounded-sm px-3 inline-block cursor-pointer py-1 no-underline text-white hover:text-white",
                    children: "Pro"
                  }), x.coming && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
                    className: "bg-violet-700 text-white px-2 py-1 rounded-sm",
                    children: "Coming"
                  })]
                }), x.description != undefined && x.description.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                  className: "text-xs text-slate-400 text-left",
                  children: x.description
                })]
              });
            }
          }), keyword.length > 0 && typeof filteredOptions == "object" && Object.entries(filteredOptions).length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: "text-center p-2 text-red-500 ",
            children: "No options found."
          }), keyword.length > 0 && filteredOptions.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: "text-center p-2 text-red-500 ",
            children: "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,
      searchPlaceholder,
      options,
      buttonTitle,
      onChange,
      values,
      value
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
        value: value,
        position: position,
        searchPlaceholder: searchPlaceholder,
        btnClass: btnClass,
        variant: variant,
        options: options,
        buttonTitle: buttonTitle,
        onChange: onChange,
        warn: this.state.showWarning,
        handleToggleClick: this.handleToggleClick
      })
    });
  }
}
/* 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_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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/link.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/close.js");
/* harmony import */ var _fontawesome_classes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./fontawesome-classes */ "./src/components/icon-picker/fontawesome-classes.js");
/* harmony import */ var _iconfont_classes__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./iconfont-classes */ "./src/components/icon-picker/iconfont-classes.js");
/* harmony import */ var _bootstrap_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./bootstrap-icons */ "./src/components/icon-picker/bootstrap-icons.js");
/* harmony import */ var _dropdown__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__);
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;
  var isPro = props.isPro;
  const [isVisible, setIsVisible] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(false);
  const [iconsArr, setIconsArr] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(_fontawesome_classes__WEBPACK_IMPORTED_MODULE_3__["default"]);
  const [pickerOpen, setPickerOpen] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(false);
  const [iconData, setIconData] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)({
    keyword: "",
    library: library,
    filtered: []
  });
  const [filteredIcons, setFilteredIcons] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)([]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useEffect)(() => {
    if (iconData.library == "fontAwesome") {
      setIconsArr(_fontawesome_classes__WEBPACK_IMPORTED_MODULE_3__["default"]);
    }
    if (iconData.library == "iconFont") {
      setIconsArr(_iconfont_classes__WEBPACK_IMPORTED_MODULE_4__["default"]);
    }
    if (iconData.library == "bootstrap") {
      setIconsArr(_bootstrap_icons__WEBPACK_IMPORTED_MODULE_5__["default"]);
    }
  }, [iconData]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
    className: "relative",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
      className: "border border-solid border-gray-500 rounded-md flex justify-center items-center cursor-pointer h-[30px] w-[30px] hover:bg-gray-200 hover:border-gray-800 transition-all duration-150 ease-in-out pg-icon-picker ",
      onClick: ev => {
        if (isPro) {
          setIsVisible(!isVisible);
        } else {
          setPickerOpen(prev => !prev);
        }
      },
      children: [iconSrc?.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"]
      }), iconSrc?.length == undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Button, {
        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"]
      }), iconSrc?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
        className: "w-8  text-lg  text-center"
        // className="w-8 h-8 text-lg !border cursor-pointer hover:bg-gray-200 border-gray-500 text-center"
        ,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("span", {
          className: ` inline-block ${iconSrc}`
        })
      })]
    }), isPro && isVisible &&
    /*#__PURE__*/
    // <div className="absolute bottom-2 right-0 pg-bg-color text-white no-underline px-2 rounded-sm py-1 ">
    (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("a", {
      href: "https://comboblocks.com/pricing/",
      target: "_blank",
      className: "absolute top-full right-0 pg-bg-color text-white hover:text-white no-underline px-2 rounded-sm py-1 whitespace-nowrap ",
      children: "Subscribe to use"
    })

    // </div>
    , pickerOpen && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Popover, {
      position: "bottom right",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
        className: "w-72 p-2 pg-setting-input-text  custom-scrollbar relative ",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
          className: "w-[calc(100%_-_8px)] fixed top-0 left-0  p-1 bg-white ",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
            className: "flex gap-1 items-center",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_6__["default"], {
              position: "bottom right",
              variant: "secondary",
              buttonTitle: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Choose", "post-grid"),
              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.value
                });
                props.onChange({
                  iconSrc: iconSrc,
                  library: newVal,
                  srcType: srcType
                });
              },
              values: ""
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("span", {
              className: "bg-red-500 px-1 py-1",
              onClick: ev => {
                props.onChange({
                  iconSrc: "",
                  library: "",
                  srcType: ""
                });
              },
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"], {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__["default"]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_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);
              }
            })]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
          className: "flex flex-wrap justify-around mt-[28px] ",
          children: [iconData.keyword.length == 0 && iconsArr.map(icon => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("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",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("span", {
                className: icon
              })
            });
          }), iconData.keyword.length > 0 && filteredIcons.map(icon => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("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",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("span", {
                className: icon
              })
            });
          }), filteredIcons.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
            className: "text-center p-2 text-red-500 ",
            children: "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,
      isPro,
      onChange
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(Html, {
        library: library,
        srcType: srcType,
        iconSrc: iconSrc,
        isPro: isPro,
        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_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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Dropdown, {
        position: position,
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
          className: "border border-solid border-gray-400 p-1 px-2 cursor-pointer",
          title: buttonTitle,
          variant: variant,
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(RawHTML, {
            className: "text-sm ",
            children: activeIcon
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
          className: "",
          children: iconList.map((x, index) => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("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);
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
                  className: "icon-close"
                })
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(RawHTML, {
                children: 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_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 _breakpoints__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;




function WarningBanner(props) {
  if (!props.warn) {
    return null;
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Popover, {
      position: "bottom right",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "p-2",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "my-4",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "flex justify-between items-center mb-3",
          children: label
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "relative h-10",
          style: placeholderStyle,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: "absolute w-full  h-full top-0 left-0 text-center",
            style: btnStyle,
            onClick: this.handleToggleClick,
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "w-full text-center left-0 top-1/2 -translate-y-1/2\t absolute",
              children: value == undefined ? "Set Color" : value
            })
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(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-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_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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__);
const {
  Component
} = wp.element;




class PGinputSelect extends Component {
  render() {
    var {
      value,
      options,
      multiple,
      className,
      onChange
    } = this.props;
    multiple = multiple == undefined ? false : multiple;
    function Html() {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.Fragment, {
        children: [multiple == true && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.Fragment, {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("select", {
            className: ` ${className}`,
            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);
            },
            children: options.map((x, index) => {
              var isSelected = value?.includes(x.value);
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("option", {
                value: x.value,
                selected: isSelected,
                children: x.label
              }, index);
            })
          })
        }), multiple == false && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("select", {
          className: ` ${className}`,
          onChange: event => {
            var currentVal = options[event.target.options.selectedIndex].value;
            onChange(currentVal);
          },
          children: options.map((x, index) => {
            var selected = value == x.value ? true : false;
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("option", {
              value: x.value,
              selected: selected,
              children: x.label
            }, index);
          })
        })]
      });
    }
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Html, {});
  }
}
/* 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_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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__);
const {
  Component
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("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: e => {
      props.onChange(e.target.value);
    }
  });
}
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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Html, {
      value: 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/input-toggle/index.js":
/*!**********************************************!*\
  !*** ./src/components/input-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_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_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 react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);




const InputToggle = ({
  label,
  value,
  onChange
}) => {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex items-center gap-2 justify-between ",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      children: value ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Enabled.", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__.__)("Disabled.", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl
    // help={value ? __("Enabled", "post-grid") : __("Disabled.", "post-grid")}
    , {
      checked: value ? true : false,
      onChange: e => {
        onChange(!value);
      }
    })]
  });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (InputToggle);

/***/ }),

/***/ "./src/components/input-wp-editor/index.js":
/*!*************************************************!*\
  !*** ./src/components/input-wp-editor/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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__);
const {
  Component
} = wp.element;


function Html(props) {
  if (!props.warn) {
    return null;
  }
  const editorRef = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
  var editorId = props.editorId;
  var onChange = props.onChange;
  var value = props.value;
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
    // Initialize WordPress editor
    wp.editor.initialize(editorId, {
      tinymce: {
        toolbar1: "bold italic underline strikethrough | bullist numlist | blockquote hr wp_more | alignleft aligncenter alignright | link unlink | fullscreen | wp_adv",
        toolbar2: "formatselect alignjustify forecolor | pastetext removeformat charmap | outdent indent | undo redo | wp_help"
      },
      quicktags: true,
      mediaButtons: true
    });

    // Wait for TinyMCE to load
    const setupEditor = () => {
      const instance = tinymce.get(editorId);
      if (instance) {
        editorRef.current = instance;
        if (value) {
          instance.setContent(value);
        }

        // Attach change event listener
        instance.on("change", () => {
          const content = instance.getContent();
          if (onChange) {
            onChange(content);
          }
        });
      }
    };

    // Use a slight delay to ensure the editor is ready
    const timer = setTimeout(setupEditor, 500);
    return () => {
      clearTimeout(timer);

      // Cleanup WordPress editor on unmount
      if (editorRef.current) {
        editorRef.current.destroy();
        editorRef.current = null;
      }
      wp.editor.remove(editorId);
    };
  }, []);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("textarea", {
    id: editorId
  });
}
class WPEditor 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 {
      editorId,
      onChange,
      value
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(Html, {
      value: value,
      editorId: editorId,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (WPEditor);

/***/ }),

/***/ "./src/components/items/index.js":
/*!***************************************!*\
  !*** ./src/components/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_block_editor__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__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_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_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_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_icons__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/help.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/page.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/copy.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/add-card.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/menu.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/calendar.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/star-empty.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/star-filled.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_6__);
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__WEBPACK_IMPORTED_MODULE_7__);
/* harmony import */ var _dropdown__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _input_select__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../input-select */ "./src/components/input-select/index.js");
/* harmony import */ var _input_text__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../input-text */ "./src/components/input-text/index.js");
/* harmony import */ var _input_wp_editor__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../input-wp-editor */ "./src/components/input-wp-editor/index.js");
/* harmony import */ var _queryprams__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./queryprams */ "./src/components/items/queryprams.js");
/* harmony import */ var _query_presets__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./query-presets */ "./src/components/items/query-presets.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__);
















const PostGridItems = ({
  itemsState,
  globalOptionsState,
  itemQueryState,
  customerData,
  setHelp,
  addNotifications
}) => {
  const {
    items,
    setitems
  } = itemsState;
  const {
    globalOptions,
    setglobalOptions
  } = globalOptionsState;
  const {
    itemQueryArgs,
    setitemQueryArgs
  } = itemQueryState;
  const [itemActive, setitemActive] = (0,react__WEBPACK_IMPORTED_MODULE_6__.useState)(999);
  var [datePicker, setdatePicker] = (0,react__WEBPACK_IMPORTED_MODULE_6__.useState)(9999999);
  var postQueryArgsX = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)('PostGridPostQueryArgs', _queryprams__WEBPACK_IMPORTED_MODULE_12__["default"]);
  let queryPresetsX = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)("PostGridQueryPresets", _query_presets__WEBPACK_IMPORTED_MODULE_13__["default"]);
  function generate3Digit() {
    return Math.floor(100 + Math.random() * 900);
  }
  var [AIWriter, setAIWriter] = (0,react__WEBPACK_IMPORTED_MODULE_6__.useState)(false);
  const updatePostQueryArgs = (newVal, key) => {
    // setitemQueryArgs((prevState) => ({
    // 	...prevState,
    // 	[key]: {
    // 		...prevState[key],
    // 		value: newVal,
    // 	},
    // }));

    var itemQueryArgsX = {
      ...itemQueryArgs
    };
    itemQueryArgsX[key].value = newVal;
    setitemQueryArgs(itemQueryArgsX);
  };
  const updateTermQueryArgs = (newVal, index) => {
    var itemQueryArgsX = [...itemQueryArgs];
    itemQueryArgsX[index].value = newVal;
    setitemQueryArgs(itemQueryArgsX);
  };
  const handleDelete = id => {
    // Filter out the item with the specified id
    const updatedItems = Object.fromEntries(Object.entries(itemQueryArgs).filter(([key, item]) => item.id !== id));
    setitemQueryArgs(updatedItems);
  };
  var formattedPrompt = "Respond only with question answer as json array and no other text. Do not include any explanations, introductions, or concluding remarks.";
  var postTypes = [];
  const postTypesData = (0,_wordpress_data__WEBPACK_IMPORTED_MODULE_4__.useSelect)(select => select(_wordpress_core_data__WEBPACK_IMPORTED_MODULE_3__.store).getPostTypes({
    per_page: -1
  }), []);
  postTypesData !== null && postTypesData.map(x => {
    postTypes.push({
      value: x.slug,
      label: x.name
    });
  });
  function escapeHTML(str) {
    const map = {
      "&": "&amp;",
      "<": "&lt;",
      ">": "&gt;",
      '"': "&quot;",
      "'": "&#039;"
    };
    return str.replace(/[&<>"']/g, function (match) {
      return map[match];
    });
  }
  var itemSources = {
    // manual: { label: "Manual", value: "manual" },
    posts: {
      label: "Posts",
      value: "posts",
      isPro: customerData.isPro ? false : true
    }
  };
  function unescapeHTML(str) {
    const map = {
      "&amp;": "&",
      "&lt;": "<",
      "&gt;": ">",
      "&quot;": '"',
      "&#039;": "'"
    };
    return str.replace(/&amp;|&lt;|&gt;|&quot;|&#039;/g, function (match) {
      return map[match];
    });
  }
  var videoType = {
    choose: {
      label: "Choose",
      value: ""
    },
    youtube: {
      label: "YouTube",
      value: "youtube"
    }
  };
  function addQueryPreset(option, index) {
    // var items = [...queryArgs.items];
    //var item = { ...queryArgs.items[index] };
    var prams = option.prams;
    console.log(prams);
    setitemQueryArgs(prams);

    //setAttributes({ queryArgs: { items: queryArgsX.items } });
    // setAttributes({
    // 	queryArgs: { ...queryArgs, items: items },
    // });
    // fetchPosts();
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
    className: "font-medium text-slate-900 ",
    title: "Query Posts/Items",
    initialOpen: false,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
      className: "my-4 flex items-center justify-between ",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
        className: "flex items-center  flex-wrap gap-2",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_8__["default"], {
          position: "bottom right",
          variant: "secondary",
          buttonTitle: globalOptions?.itemSource == undefined ? "Item Source" : itemSources[globalOptions?.itemSource]?.label,
          options: itemSources,
          onChange: (option, index) => {
            var globalOptionsX = {
              ...globalOptions
            };
            globalOptionsX.itemSource = option.value;
            setglobalOptions(globalOptionsX);
          },
          values: ""
        }), globalOptions?.itemSource == "posts" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_8__["default"], {
            position: "bottom right",
            variant: "secondary",
            buttonTitle: "Add Query",
            options: postQueryArgsX,
            onChange: (option, index) => {
              var itemQueryArgsX = {
                ...itemQueryArgs
              };
              itemQueryArgsX[option.id] = {
                id: option.id,
                value: option.value
              };
              console.log(itemQueryArgsX);
              setitemQueryArgs(itemQueryArgsX);
            },
            values: ""
          })
        }), globalOptions?.itemSource == "terms" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
            className: "cursor-pointer",
            title: "Click to know more",
            onClick: () => {
              setHelp({
                id: "addTermQuery",
                enable: true
              });
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_15__["default"]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_8__["default"], {
            position: "bottom right",
            variant: "secondary",
            buttonTitle: "Add Query",
            options: termQueryArgs,
            onChange: (option, index) => {
              var itemQueryArgsX = {
                ...itemQueryArgs
              };
              itemQueryArgsX[option.id] = {
                id: option.id,
                value: option.value
              };
              setitemQueryArgs(itemQueryArgsX);
            },
            values: ""
          })]
        }), globalOptions?.itemSource == "manual" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center gap-2",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
              className: "flex items-center gap-2 bg-slate-700 text-white px-3 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
              title: "Click to paste",
              onClick: async () => {
                try {
                  // Read text from clipboard
                  const clipboardText = await navigator.clipboard.readText();

                  // Parse the JSON string back to an object
                  const pastedItems = JSON.parse(clipboardText);

                  // Here you need to handle the pasted items
                  // For example, if you have a state setter:
                  setitems(pastedItems);
                  addNotifications({
                    title: "Items Pasted",
                    content: "You just pasted items, Now go to edit.",
                    type: "success"
                  });
                } catch (error) {}
              },
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_16__["default"],
                fill: "#fff",
                size: "20"
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
              className: "flex items-center gap-2 bg-slate-700 text-white px-3 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
              title: "Click to copy",
              onClick: () => {
                try {
                  const itemsString = JSON.stringify(items, null, 2);
                  navigator.clipboard.writeText(itemsString).then(() => {
                    addNotifications({
                      title: "Items Copied",
                      content: "You just copied items, Now go to edit.",
                      type: "success"
                    });
                  }).catch(err => {});
                } catch (error) {}
              },
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_17__["default"],
                fill: "#fff",
                size: "20"
              })
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
            className: "flex items-center gap-2 bg-slate-700 text-white px-3 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
            onClick: ev => {
              var itemsX = [...items];
              itemsX.push({
                isActive: false,
                person: {
                  name: "",
                  avatar: {
                    id: "",
                    srcUrl: ""
                  },
                  jobTitle: "",
                  comapny: {
                    name: "",
                    website: "",
                    logoUrl: ""
                  }
                },
                rating: 5,
                date: "11/01/2025",
                videoUrl: "",
                title: "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.",
                tags: []
              });
              setitems(itemsX);
              addNotifications({
                title: "Item Added",
                content: "You just added an item, Now go to edit.",
                type: "success"
              });
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_18__["default"],
              fill: "#fff",
              size: "20"
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: " tracking-wide ",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
              className: "py-2 px-4 cursor-pointer  capitalize bg-gray-700 text-white font-medium rounded hover:bg-gray-600 focus:outline-none focus:bg-gray-600",
              onClick: ev => {
                ev.preventDefault();
                ev.stopPropagation();
                if (isProFeature) {
                  addNotifications({
                    title: "Opps its pro!",
                    content: "This feature only avilable in premium version",
                    type: "error"
                  });
                  return;
                }
                setAIWriter(!AIWriter);
              },
              children: "AI"
            }), AIWriter && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
              position: "bottom right",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                className: "w-[800px] p-3 relative",
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
                  className: "cursor-pointer px-1 bg-red-500 hover:bg-red-700 hover:text-white absolute top-0 right-0",
                  onClick: ev => {
                    ev.preventDefault();
                    ev.stopPropagation();
                    setAIWriter(!AIWriter);
                  },
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
                    fill: "#fff",
                    icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"]
                  })
                })
              })
            })]
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_8__["default"], {
          position: "bottom right",
          btnClass: "py-2",
          variant: "secondary",
          options: queryPresetsX,
          buttonTitle: "Query Presets",
          onChange: addQueryPreset,
          values: ""
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
          className: "bg-slate-700 text-white px-3 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
          onClick: () => {
            navigator.clipboard.writeText(JSON.stringify(itemQueryArgs)).then(() => {
              addNotifications({
                title: "Copied to clipboard!",
                content: "Layout Copied!",
                type: "success"
              });
            });
          },
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_17__["default"],
            size: 14,
            fill: "#fff"
          }), "Copy"]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
          className: "bg-slate-700 text-white px-3 py-2 rounded-sm cursor-pointer hover:bg-slate-600 flex items-center gap-1",
          onClick: async () => {
            try {
              var data = await navigator.clipboard.readText();
              var datax = JSON.parse(data);
              setitemQueryArgs(datax);
              addNotifications({
                title: "Query Pasted!",
                content: "Query Params paste successful.",
                type: "success"
              });
            } catch (e) {}
          },
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_16__["default"],
            size: 14,
            fill: "#fff"
          }), "Paste"]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
          className: "bg-red-500 text-white px-5 py-2 rounded  cursor-pointer hover:bg-slate-600",
          onClick: ev => {
            setitemQueryArgs([]);
          },
          children: "Clear"
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
          className: "cursor-pointer",
          title: "Click to know more",
          onClick: () => {
            setHelp({
              id: "addPostQuery",
              enable: true
            });
          },
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_15__["default"]
          })
        })]
      })
    }), globalOptions?.itemSource == "posts" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
      children: Object.entries(itemQueryArgs)?.map(prams => {
        var index = prams[0];
        var item = prams[1];
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
          className: "my-4 flex gap-2 items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
            className: "cursor-pointer px-1 py-1 bg-red-500 hover:bg-red-700 hover:text-white",
            onClick: () => handleDelete(item.id),
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
              fill: "#fff",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
              size: "20"
            })
          }), item.id == "postType" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              value: item.value,
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              options: postTypes,
              multiple: true,
              onChange: newVal => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "postStatus" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "postStatus" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              value: item.value,
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              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 => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "order" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "order" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Order"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              options: [{
                label: "Ascending",
                value: "ASC"
              }, {
                label: "Descending",
                value: "DESC"
              }],
              multiple: false,
              onChange: newVal => updatePostQueryArgs(newVal, index)
            })]
          }), item.id == "orderby" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              value: item.value,
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              options: [{
                label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("None", "post-grid"),
                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 => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "taxQueryRelation" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              label: "",
              value: item.value,
              options: [{
                label: "OR",
                value: "OR"
              }, {
                label: "AND",
                value: "AND"
              }],
              onChange: newVal => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "metaQuery" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-gray-700 hover:bg-gray-600 text-sm",
                onClick: _ev => {
                  var items = [...queryArgs.items];
                  var item = {
                    ...queryArgs.items[index]
                  };
                  var xx = item.value.concat({
                    fields: [{
                      key: "",
                      value: "",
                      type: "",
                      compare: ""
                    }],
                    relation: "OR"
                  });
                  items[index].value = xx;
                  //setAttributes({ queryArgs: { items: queryArgsX.items } });
                  setAttributes({
                    queryArgs: {
                      ...queryArgs,
                      items: items
                    }
                  });
                },
                children: "Add"
              }), item.value.map((x, j) => {
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(CBtoggle, {
                    title: "Meta Field",
                    initialOpen: false,
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                      className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-red-600 text-sm",
                      onClick: _ev => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        var xx = item.value.splice(j, 1);
                        items[index].value = item.value;
                        // setAttributes({
                        // 	queryArgs: { items: queryArgsX.items },
                        // });
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                      },
                      children: "Remove"
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
                      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                        children: "Relation"
                      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                        style: {
                          margin: 0
                        },
                        label: "",
                        value: x.relation,
                        options: [{
                          label: "OR",
                          value: "OR"
                        }, {
                          label: "AND",
                          value: "AND"
                        }],
                        onChange: newVal => {
                          var items = [...queryArgs.items];
                          var item = {
                            ...queryArgs.items[index]
                          };
                          item.value[j].relation = newVal;
                          //var term = itemData.value[j].fields[k]
                          //term.taxonomy = newVal;
                          items[index].value = item.value;
                          // setAttributes({
                          // 	queryArgs: { items: queryArgsX.items },
                          // });
                          setAttributes({
                            queryArgs: {
                              ...queryArgs,
                              items: items
                            }
                          });
                        }
                      })]
                    }), x.fields.map((y, k) => {
                      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                        className: "border-b border-solid border-gray-300 py-3",
                        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                          className: "cursor-pointer block text-right mb-2 px-3 py-1 text-white bg-red-600 text-sm",
                          onClick: _ev => {
                            var items = [...queryArgs.items];
                            var item = {
                              ...queryArgs.items[index]
                            };
                            var fields = item.value[j].fields;
                            var xx = item.value[j].fields.splice(k, 1);
                            items[index].value = item.value;
                            // setAttributes({
                            // 	queryArgs: { items: queryArgsX.items },
                            // });
                            setAttributes({
                              queryArgs: {
                                ...queryArgs,
                                items: items
                              }
                            });
                          },
                          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Remove", "post-grid")
                        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                          label: "Custom field key",
                          value: y.key,
                          placeholder: "meta_key",
                          onChange: newVal => {
                            var items = [...queryArgs.items];
                            var item = {
                              ...queryArgs.items[index]
                            };
                            var term = item.value[j].fields[k];
                            term.key = newVal;
                            items[index].value = item.value;
                            // setAttributes({
                            // 	queryArgs: { items: queryArgsX.items },
                            // });
                            setAttributes({
                              queryArgs: {
                                ...queryArgs,
                                items: items
                              }
                            });
                          }
                        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                          label: "Meta Value ",
                          value: y.value,
                          placeholder: "25",
                          onChange: newVal => {
                            var items = [...queryArgs.items];
                            var item = {
                              ...queryArgs.items[index]
                            };
                            var term = item.value[j].fields[k];
                            term.value = newVal;
                            items[index].value = item.value;
                            // setAttributes({
                            // 	queryArgs: { items: queryArgsX.items },
                            // });
                            setAttributes({
                              queryArgs: {
                                ...queryArgs,
                                items: items
                              }
                            });
                          }
                        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
                          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                            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 items = [...queryArgs.items];
                              var item = {
                                ...queryArgs.items[index]
                              };
                              var term = item.value[j].fields[k];
                              term.type = newVal;
                              items[index].value = item.value;
                              // setAttributes({
                              // 	queryArgs: { items: queryArgsX.items },
                              // });
                              setAttributes({
                                queryArgs: {
                                  ...queryArgs,
                                  items: items
                                }
                              });
                            }
                          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                            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 items = [...queryArgs.items];
                              var item = {
                                ...queryArgs.items[index]
                              };
                              var term = item.value[j].fields[k];
                              term.compare = newVal;
                              items[index].value = item.value;
                              setAttributes({
                                queryArgs: {
                                  ...queryArgs,
                                  items: items
                                }
                              });
                            }
                          })]
                        })]
                      });
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                      className: "cursor-pointer text-center px-3 py-1 text-white bg-gray-700 hover:bg-gray-600 text-sm",
                      onClick: _ev => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        var xx = item.value[j].fields.concat({
                          key: "",
                          value: "",
                          type: "",
                          compare: ""
                        });
                        items[index].value[j].fields = xx;
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                      },
                      children: "Add"
                    })]
                  })
                });
              })]
            })
          }), item.id == "dateQuery" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
              className: "my-3",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
                children: "Add Arguments"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                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 items = [...queryArgs.items];
                  var itemData = {
                    ...queryArgs.items[index]
                  };
                  if (newVal == "year") {
                    var xx = itemData.value.concat({
                      id: "year",
                      value: "",
                      compare: ""
                    });
                  }
                  if (newVal == "month") {
                    var xx = itemData.value.concat({
                      id: "month",
                      value: "",
                      compare: ""
                    });
                  }
                  if (newVal == "week") {
                    var xx = itemData.value.concat({
                      id: "week",
                      value: "",
                      compare: ""
                    });
                  }
                  if (newVal == "day") {
                    var xx = itemData.value.concat({
                      id: "day",
                      value: "",
                      compare: ""
                    });
                  }
                  if (newVal == "hour") {
                    var xx = itemData.value.concat({
                      id: "hour",
                      value: "",
                      compare: ""
                    });
                  }
                  if (newVal == "minute") {
                    var xx = itemData.value.concat({
                      id: "minute",
                      value: "",
                      compare: ""
                    });
                  }
                  if (newVal == "second") {
                    var xx = itemData.value.concat({
                      id: "second",
                      value: "",
                      compare: ""
                    });
                  }
                  if (newVal == "inclusive") {
                    var xx = itemData.value.concat({
                      id: "inclusive",
                      value: true
                    });
                  }
                  if (newVal == "compare") {
                    var xx = itemData.value.concat({
                      id: "compare",
                      value: ""
                    });
                  }
                  if (newVal == "column") {
                    var xx = itemData.value.concat({
                      id: "column",
                      value: ""
                    });
                  }
                  if (newVal == "relation") {
                    var xx = itemData.value.concat({
                      id: "relation",
                      value: ""
                    });
                  }
                  if (newVal == "before") {
                    var xx = itemData.value.concat({
                      id: "before",
                      value: "",
                      year: "",
                      month: "",
                      day: ""
                    });
                  }
                  if (newVal == "after") {
                    var xx = itemData.value.concat({
                      id: "after",
                      value: "",
                      year: "",
                      month: "",
                      day: ""
                    });
                  }
                  items[index].value = xx;
                  setAttributes({
                    queryArgs: {
                      ...queryArgs,
                      items: items
                    }
                  });
                }
              })]
            }), item.value.map((x, j) => {
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(CBtoggle, {
                  title: x.id,
                  initialOpen: false,
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
                    className: "cursor-pointer px-3 py-1 text-white bg-red-600 text-sm my-2 inline-block",
                    onClick: _ev => {
                      var items = [...queryArgs.items];
                      var item = {
                        ...queryArgs.items[index]
                      };
                      //item.value = newVal;
                      //queryArgsX.items[index].value.splice(j, 1);
                      item.value.splice(j, 1);
                      items[index] = item;
                      // setAttributes({
                      // 	queryArgs: { items: queryArgsX.items },
                      // });
                      setAttributes({
                        queryArgs: {
                          ...queryArgs,
                          items: items
                        }
                      });
                    },
                    children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Delete", "post-grid")
                  }), (x.id == "after" || x.id == "before") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
                      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
                        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Year", "post-grid")
                      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                        onChange: newVal => {
                          var items = [...queryArgs.items];
                          var item = {
                            ...queryArgs.items[index]
                          };
                          //queryArgsX.items[index].value[j].year = newVal;
                          item.value[j].year = newVal;
                          items[index] = item;
                          // setAttributes({
                          // 	queryArgs: { items: queryArgsX.items },
                          // });
                          setAttributes({
                            queryArgs: {
                              ...queryArgs,
                              items: items
                            }
                          });
                        }
                      })]
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
                      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
                        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Month", "post-grid")
                      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                        onChange: newVal => {
                          var items = [...queryArgs.items];
                          var item = {
                            ...queryArgs.items[index]
                          };
                          //queryArgsX.items[index].value[j].month = newVal;
                          item.value[j].month = newVal;
                          items[index] = item;
                          // setAttributes({
                          // 	queryArgs: { items: queryArgsX.items },
                          // });
                          setAttributes({
                            queryArgs: {
                              ...queryArgs,
                              items: items
                            }
                          });
                        }
                      })]
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
                      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
                        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Day", "post-grid")
                      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                        onChange: newVal => {
                          //clearTimeout(debounce);
                          //debounce = setTimeout(() => {
                          var items = [...queryArgs.items];
                          var item = {
                            ...queryArgs.items[index]
                          };
                          //queryArgsX.items[index].value[j].day = newVal;
                          item.value[j].day = newVal;
                          items[index] = item;
                          // setAttributes({
                          // 	queryArgs: { items: queryArgsX.items },
                          // });
                          setAttributes({
                            queryArgs: {
                              ...queryArgs,
                              items: items
                            }
                          });
                          //}, 1000);
                        }
                      })]
                    })]
                  }), x.id == "inclusive" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                      style: {
                        margin: 0
                      },
                      options: [{
                        label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("True", "post-grid"),
                        value: true
                      }, {
                        label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("False", "post-grid"),
                        value: false
                      }],
                      onChange: newVal => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        //queryArgsX.items[index].value[j].value = newVal;
                        item.value[j].value = newVal;
                        items[index] = item;
                        // setAttributes({
                        // 	queryArgs: { items: queryArgsX.items },
                        // });
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                      }
                    })
                  }), x.id == "compare" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                      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 => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        //queryArgsX.items[index].value[j].value = newVal;
                        item.value[j].value = newVal;
                        // setAttributes({
                        // 	queryArgs: { items: queryArgsX.items },
                        // });
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                      }
                    })
                  }), x.id == "column" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                      onChange: newVal => {
                        //clearTimeout(debounce);
                        //debounce = setTimeout(() => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        // queryArgsX.items[index].value[j].value = newVal;
                        item.value[j].value = newVal;
                        // setAttributes({
                        // 	queryArgs: { items: queryArgsX.items },
                        // });
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                        //}, 1000);
                      }
                    })
                  }), x.id == "relation" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "flex items-center justify-between flex-1",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                      style: {
                        margin: 0
                      },
                      options: [{
                        label: "OR",
                        value: "OR"
                      }, {
                        label: "AND",
                        value: "AND"
                      }],
                      onChange: newVal => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        //queryArgsX.items[index].value[j].value = newVal;
                        item.value[j].value = newVal;
                        items[index] = item;
                        // setAttributes({
                        // 	queryArgs: { items: queryArgsX.items },
                        // });
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                      }
                    })
                  }), (x.id == "year" || x.id == "month" || x.id == "week" || x.id == "day" || x.id == "hour" || x.id == "minute" || x.id == "second") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                    className: "flex items-center justify-between flex-1",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                      label: "Value",
                      onChange: newVal => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        //clearTimeout(debounce);
                        //debounce = setTimeout(() => {
                        //queryArgsX.items[index].value[j].value = newVal;
                        item.value[j].value = newVal;
                        items[index] = item;
                        // setAttributes({
                        // 	queryArgs: { items: queryArgsX.items },
                        // });
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                        //}, 1000);
                      }
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                      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 => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        item.value[j].compare = newVal;
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                      }
                    })]
                  })]
                })
              });
            })]
          }), item.id == "taxQuery" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-gray-700 hover:bg-gray-600 text-sm",
                onClick: _ev => {
                  var items = [...queryArgs.items];
                  var item = {
                    ...queryArgs.items[index]
                  };
                  var xx = item.value.concat({
                    terms: [{
                      taxonomy: "",
                      field: "",
                      terms: [],
                      operator: ""
                    }],
                    relation: "OR"
                  });
                  items[index].value = xx;
                  setAttributes({
                    queryArgs: {
                      ...queryArgs,
                      items: items
                    }
                  });
                },
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Add", "post-grid")
              }), item?.value?.map((x, j) => {
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(CBtoggle, {
                    title: "Term",
                    initialOpen: false,
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                      className: "cursor-pointer inline-block mb-2 px-3 py-1 text-white bg-red-600 text-sm",
                      onClick: _ev => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        //var itemData = items[index];
                        var xx = item.value.splice(j, 1);
                        items[index].value = item.value;
                        // setAttributes({
                        // 	queryArgs: { items: queryArgsX.items },
                        // });
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                      },
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Remove", "post-grid")
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
                      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                        children: "Terms Relation"
                      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                        style: {
                          margin: 0
                        },
                        label: "",
                        value: x.relation,
                        options: [{
                          label: "OR",
                          value: "OR"
                        }, {
                          label: "AND",
                          value: "AND"
                        }],
                        onChange: newVal => {
                          var items = [...queryArgs.items];
                          var item = {
                            ...queryArgs.items[index]
                          };
                          item.value[j].relation = newVal;
                          items[index].value = itemData.value;
                          setAttributes({
                            queryArgs: {
                              ...queryArgs,
                              items: items
                            }
                          });
                        }
                      })]
                    }), x.terms.map((y, k) => {
                      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                        className: "border-b border-solid border-gray-300 py-3",
                        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                          label: "Taxonomy",
                          value: y.taxonomy,
                          placeholder: "Taxonomy",
                          onChange: newVal => {
                            var items = [...queryArgs.items];
                            var item = {
                              ...queryArgs.items[index]
                            };
                            var term = item.value[j].terms[k];
                            term.taxonomy = newVal;
                            items[index].value = item.value;
                            setAttributes({
                              queryArgs: {
                                ...queryArgs,
                                items: items
                              }
                            });
                          }
                        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                          label: "Terms",
                          value: y.terms.join(","),
                          placeholder: "Comma separated",
                          onChange: newVal => {
                            var items = [...queryArgs.items];
                            var item = {
                              ...queryArgs.items[index]
                            };
                            var term = item.value[j].terms[k];
                            term.terms = newVal.split(",");
                            items[index].value = item.value;
                            setAttributes({
                              queryArgs: {
                                ...queryArgs,
                                items: items
                              }
                            });
                          }
                        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
                          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                            style: {
                              margin: 0
                            },
                            label: "Fields",
                            value: y.field,
                            options: [{
                              label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Choose...", "post-grid"),
                              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 items = [...queryArgs.items];
                              var item = {
                                ...queryArgs.items[index]
                              };
                              var term = item.value[j].terms[k];
                              term.field = newVal;
                              items[index].value = item.value;
                              setAttributes({
                                queryArgs: {
                                  ...queryArgs,
                                  items: items
                                }
                              });
                            }
                          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
                            style: {
                              margin: 0
                            },
                            label: "Operator",
                            value: y.operator,
                            options: [{
                              label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Choose...", "post-grid"),
                              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 items = [...queryArgs.items];
                              var item = {
                                ...queryArgs.items[index]
                              };
                              var term = item.value[j].terms[k];
                              term.operator = newVal;
                              items[index].value = item.value;
                              setAttributes({
                                queryArgs: {
                                  ...queryArgs,
                                  items: items
                                }
                              });
                            }
                          })]
                        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                          className: "cursor-pointer block text-center my-2 px-3 py-1 text-white bg-red-600 text-sm",
                          onClick: _ev => {
                            var items = [...queryArgs.items];
                            var item = {
                              ...queryArgs.items[index]
                            };
                            var terms = item.value[j].terms;
                            var xx = item.value[j].terms.splice(k, 1);
                            items[index].value = item.value;
                            setAttributes({
                              queryArgs: {
                                ...queryArgs,
                                items: items
                              }
                            });
                          },
                          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Remove", "post-grid")
                        })]
                      });
                    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                      className: "cursor-pointer text-center px-3 py-1 text-white bg-gray-700 hover:bg-gray-600 text-sm",
                      onClick: _ev => {
                        var items = [...queryArgs.items];
                        var item = {
                          ...queryArgs.items[index]
                        };
                        var xx = item.value[j].terms.concat({
                          taxonomy: "",
                          field: "",
                          terms: [],
                          operator: ""
                        });
                        items[index].value[j].terms = xx;
                        setAttributes({
                          queryArgs: {
                            ...queryArgs,
                            items: items
                          }
                        });
                      },
                      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Add", "post-grid")
                    })]
                  })
                });
              })]
            })
          }), (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") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              onChange: newVal => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "metaCompare" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              style: {
                margin: 0
              },
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              label: "",
              value: item.value,
              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 => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "postPassword" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              onChange: newVal => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), (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") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              placeholder: "Comma separated",
              onChange: newVal => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "commentCount" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
              value: item.value?.value,
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              placeholder: "Comment Count, Ex: 25",
              onChange: newVal => updateQueryPram({
                ...item.value,
                value: newVal
              }, index)
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              style: {
                margin: 0
              },
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value?.compare,
              options: [{
                label: "=",
                value: "="
              }, {
                label: "!=",
                value: "!="
              }, {
                label: ">",
                value: ">"
              }, {
                label: ">=",
                value: ">="
              }, {
                label: "<",
                value: "<"
              }, {
                label: "<=",
                value: "<="
              }],
              onChange: newVal => updateQueryPram({
                ...item.value,
                compare: newVal
              }, index)
            })]
          }), item.id == "postMimeType" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              value: item.value,
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              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 => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), (item.id == "cacheResults" || item.id == "nopaging" || item.id == "hasPassword" || item.id == "updatePostMetaCache" || item.id == "updatePostTermCache") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              style: {
                margin: 0
              },
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              options: [{
                label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("True", "post-grid"),
                value: true
              }, {
                label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("False", "post-grid"),
                value: false
              }],
              onChange: newVal => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "ignoreStickyPosts" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: postQueryArgsX[item.id].label
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              style: {
                margin: 0
              },
              multiple: false,
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              options: [{
                label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("True", "post-grid"),
                value: true
              }, {
                label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("False", "post-grid"),
                value: false
              }],
              onChange: newVal => {
                updatePostQueryArgs(newVal, item.id);
              }
            })]
          })]
        }, index);
      })
    }), globalOptions?.itemSource == "terms" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
      children: Object.entries(itemQueryArgs)?.map(prams => {
        var index = prams[0];
        var item = prams[1];
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
          className: "my-4 flex gap-2 items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
            className: "cursor-pointer px-1 bg-red-500 hover:bg-red-700 hover:text-white",
            onClick: () => handleDelete(item.id),
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
              fill: "#fff",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"],
              size: "20"
            })
          }), item.id == "taxonomy" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "flex items-center justify-between flex-1",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Taxonomy"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              options: taxonomiesObjects,
              multiple: true,
              onChange: newVal => {
                var itemQueryArgsX = {
                  ...itemQueryArgs
                };
                itemQueryArgsX[index].value = newVal;
                setitemQueryArgs(itemQueryArgsX);

                //updatePostQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "orderby" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "orderby" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Order By"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              value: item.value,
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              options: [{
                label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("None", "post-grid"),
                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 => {
                updateTermQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "order" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "order" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Order"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_select__WEBPACK_IMPORTED_MODULE_9__["default"], {
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              options: [{
                label: "Ascending",
                value: "ASC"
              }, {
                label: "Descending",
                value: "DESC"
              }],
              multiple: false,
              onChange: newVal => updatePostQueryArgs(newVal, index)
            })]
          }), item.id == "number" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "number" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Number"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(PGinputNumber, {
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              onChange: newVal => {
                updateTermQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "include" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "include" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Include"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              onChange: newVal => {
                updateTermQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "exclude" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "exclude" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Exclude"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              onChange: newVal => {
                updateTermQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "child_of" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "child_of" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Child Of"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              onChange: newVal => {
                updateTermQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "parent" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "parent" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Parent"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              onChange: newVal => {
                updateTermQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "meta_value" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "meta_value" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Meta Value"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
              label: "",
              className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-[200px]",
              value: item.value,
              onChange: newVal => {
                updateTermQueryArgs(newVal, item.id);
              }
            })]
          }), item.id == "hide_empty" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: item.id == "hide_empty" ? "flex items-center justify-between flex-1" : "hidden",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
              htmlFor: "",
              children: "Hide Empty"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(InputToggle, {
              value: item?.value,
              onChange: () => {
                const newValue = !itemQueryArgs[index].value;
                updateTermQueryArgs(newValue, index);
              }
            })]
          })]
        }, index);
      })
    }), globalOptions?.itemSource == "manual" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_sortablejs__WEBPACK_IMPORTED_MODULE_7__.ReactSortable, {
      list: items,
      handle: ".handle",
      setList: itemsSorted => {
        setTimeout(() => {
          setitems(itemsSorted);
        }, 200);
        addNotifications({
          title: "Items Sorted",
          content: "You just sorted items",
          type: "success"
        });
      },
      children: items?.map((item, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
              className: "bg-slate-300 flex justify-between items-center p-3 py-2 my-2 cursor-pointer hover:bg-slate-400",
              onClick: ev => {
                setitemActive(index == itemActive ? 999 : index);
              },
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                children: item?.title
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                className: "flex items-center gap-2",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
                  className: "handle  cursor-pointer bg-gray-700 hover:bg-gray-600 hover:text-white px-1 py-1",
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
                    size: "20",
                    fill: "#fff",
                    icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_20__["default"]
                  })
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
                  className: "cursor-pointer bg-gray-700 hover:bg-gray-600 hover:text-white px-1 py-1",
                  onClick: ev => {
                    ev.stopPropagation();
                    var itemsX = [...items];
                    var itemToDup = {
                      ...itemsX[index]
                    };
                    itemsX.splice(index + 1, 0, itemToDup);
                    setitems(itemsX);
                    addNotifications({
                      title: "Item Duplicated",
                      content: "You just duplicate an item",
                      type: "success"
                    });
                  },
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
                    size: "20",
                    fill: "#fff",
                    icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_17__["default"]
                  })
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
                  className: "cursor-pointer bg-red-700 hover:bg-red-600 hover:text-white px-1 py-1",
                  onClick: ev => {
                    ev.stopPropagation();
                    var itemsX = [...items];
                    itemsX.splice(index, 1);
                    setitems(itemsX);
                    addNotifications({
                      title: "Item Removed",
                      content: "You just removed an item",
                      type: "success"
                    });
                  },
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
                    size: "20",
                    fill: "#fff",
                    icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_19__["default"]
                  })
                })]
              })]
            }), itemActive == index && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
              className: "py-2 w-full",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                className: "mb-3",
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__.RichText, {
                  placeholder: "Write Header Text...",
                  className: "bg-slate-100 p-3 ",
                  tagName: "div",
                  value: item?.title,
                  onChange: content => {
                    setitems(prevItems => {
                      // if(!item?.headerLabelSlugLock){

                      // }

                      const updatedItems = [...prevItems];
                      updatedItems[index] = {
                        ...updatedItems[index],
                        title: content
                      };
                      return updatedItems;
                    });
                  }
                })
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                className: "mb-3",
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_wp_editor__WEBPACK_IMPORTED_MODULE_11__["default"], {
                  placeholder: "Write Header Text...",
                  editorId: `content-${index}-${generate3Digit()}`,
                  className: `bg-slate-100 p-3 min-h-24 w-full`,
                  value: unescapeHTML(item?.content),
                  onChange: content => {
                    content = content.replace(/[\r\n]+/g, "");
                    content = escapeHTML(content);

                    //var content = JSON.stringify(content);
                    setitems(prevItems => {
                      const updatedItems = [...prevItems];
                      updatedItems[index] = {
                        ...updatedItems[index],
                        content: content
                      };
                      return updatedItems;
                    });
                  }
                })
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                className: "mb-3 space-y-3",
                children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "w-full flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "mb-2",
                    children: "Date"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                    className: "flex items-center gap-2",
                    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
                      className: "flex items-center gap-2 bg-slate-700 text-white px-3 py-2 rounded-sm cursor-pointer hover:bg-slate-600",
                      title: "Date Picker",
                      onClick: () => {
                        setdatePicker(datePicker == index ? 9999999 : index);
                      },
                      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
                        icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_21__["default"],
                        fill: "#fff",
                        size: "20"
                      })
                    }), datePicker == index && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
                      position: "bottom right",
                      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                        className: "p-2 rounded-md",
                        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.DateTimePicker, {
                          currentDate: item?.date,
                          onChange: newDate => {
                            const timestamp = newDate;
                            const date = timestamp.split("T")[0];
                            setitems(prevItems => {
                              const updatedItems = [...prevItems];
                              updatedItems[index] = {
                                ...updatedItems[index],
                                date: date
                              };
                              return updatedItems;
                            });
                          },
                          is12Hour: true
                        })
                      })
                    })]
                  })]
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "w-full flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "mb-2",
                    children: "Rating"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "flex items-center gap-2",
                    children: [1, 2, 3, 4, 5].map(star => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
                      className: "size-5",
                      onClick: () => {
                        setitems(prevItems => {
                          const updatedItems = [...prevItems];
                          updatedItems[index] = {
                            ...updatedItems[index],
                            rating: star
                          };
                          return updatedItems;
                        });
                      },
                      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Icon, {
                        icon: star > item?.rating ? _wordpress_icons__WEBPACK_IMPORTED_MODULE_22__["default"] : _wordpress_icons__WEBPACK_IMPORTED_MODULE_23__["default"],
                        fill: "gold",
                        size: "24"
                      })
                    }, star))
                  })]
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "w-full flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "mb-2",
                    children: "Video Type"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "flex items-center gap-2",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_dropdown__WEBPACK_IMPORTED_MODULE_8__["default"], {
                      position: "bottom right",
                      variant: "secondary",
                      buttonTitle: videoType[item?.videoType] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Choose", "post-grid") : videoType[item?.videoType].label,
                      options: videoType,
                      onChange: newVal => {
                        setitems(prevItems => {
                          const updatedItems = [...prevItems];
                          updatedItems[index] = {
                            ...updatedItems[index],
                            videoType: newVal.value
                          };
                          return updatedItems;
                        });
                      },
                      values: ""
                    })
                  })]
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "w-full flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "mb-2",
                    children: "Video Url"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "flex items-center gap-2",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                      className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-full ",
                      label: "",
                      value: item?.videoUrl,
                      onChange: newVal => {
                        setitems(prevItems => {
                          const updatedItems = [...prevItems];
                          updatedItems[index] = {
                            ...updatedItems[index],
                            videoUrl: newVal
                          };
                          return updatedItems;
                        });
                      }
                    })
                  })]
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "w-full flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "",
                    children: "Person Name"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "flex items-center gap-2",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                      className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-full ",
                      label: "",
                      value: item?.personName,
                      onChange: newVal => {
                        setitems(prevItems => {
                          const updatedItems = [...prevItems];
                          updatedItems[index] = {
                            ...updatedItems[index],
                            personName: newVal
                          };
                          return updatedItems;
                        });
                      }
                    })
                  })]
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "w-full flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "",
                    children: "Job Title"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "flex items-center gap-2",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                      className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-full ",
                      label: "",
                      value: item?.jobTitle,
                      onChange: newVal => {
                        setitems(prevItems => {
                          const updatedItems = [...prevItems];
                          updatedItems[index] = {
                            ...updatedItems[index],
                            jobTitle: newVal
                          };
                          return updatedItems;
                        });
                      }
                    })
                  })]
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "flex my-5 justify-between items-center ",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
                    className: "w-[400px]",
                    htmlFor: "",
                    children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Avatar", "user-verification")
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__.MediaUpload, {
                    onSelect: media => {
                      setitems(prevItems => {
                        const updatedItems = [...prevItems];
                        updatedItems[index] = {
                          ...updatedItems[index],
                          personAvatar: {
                            id: media.id,
                            srcUrl: media.url
                          }
                        };
                        return updatedItems;
                      });
                    },
                    onClose: () => {},
                    allowedTypes: ["image"],
                    value: item?.personAvatar?.id,
                    render: ({
                      open
                    }) => {
                      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                        className: "flex flex-col items-center gap-2",
                        children: [item?.personAvatar?.srcUrl && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("img", {
                          src: item?.personAvatar?.srcUrl,
                          alt: "",
                          className: "cursor-pointer rounded-md max-w-[160px] max-h-[160px] object-contain border border-solid border-gray-300 p-1",
                          onClick: () => {
                            open();
                          }
                        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                          className: "flex items-center gap-2",
                          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("button", {
                            onClick: open,
                            className: "no-underline px-4 py-2 rounded-sm bg-gray-700 hover:bg-gray-700 text-white  whitespace-nowrap  hover:text-white",
                            children: "Open Media Library"
                          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("button", {
                            onClick: () => {
                              setitems(prevItems => {
                                const updatedItems = [...prevItems];
                                updatedItems[index] = {
                                  ...updatedItems[index],
                                  personAvatar: {
                                    id: "",
                                    srcUrl: ""
                                  }
                                };
                                return updatedItems;
                              });
                            },
                            className: "no-underline size-[38px] flex items-center justify-center text-[30px] rounded-sm !border !bg-transparent !border-solid !border-gray-700 hover:!border-red-700 text-gray-700   hover:text-red-700",
                            title: "Clear Logo",
                            children: "\xD7"
                          })]
                        })]
                      });
                    }
                  })]
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "w-full flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "",
                    children: "Company Name"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "flex items-center gap-2",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                      className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-full ",
                      label: "",
                      value: item?.companyName,
                      onChange: newVal => {
                        setitems(prevItems => {
                          const updatedItems = [...prevItems];
                          updatedItems[index] = {
                            ...updatedItems[index],
                            companyName: newVal
                          };
                          return updatedItems;
                        });
                      }
                    })
                  })]
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "w-full flex justify-between items-center",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "",
                    children: "Company Website"
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "flex items-center gap-2",
                    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_input_text__WEBPACK_IMPORTED_MODULE_10__["default"], {
                      className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-full ",
                      label: "",
                      value: item?.companyWebsite,
                      onChange: newVal => {
                        setitems(prevItems => {
                          const updatedItems = [...prevItems];
                          updatedItems[index] = {
                            ...updatedItems[index],
                            companyWebsite: newVal
                          };
                          return updatedItems;
                        });
                      }
                    })
                  })]
                }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                  className: "flex my-5 justify-between items-center ",
                  children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("label", {
                    className: "w-[400px]",
                    htmlFor: "",
                    children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_5__.__)("Company logo", "user-verification")
                  }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_0__.MediaUpload, {
                    onSelect: media => {
                      setitems(prevItems => {
                        const updatedItems = [...prevItems];
                        updatedItems[index] = {
                          ...updatedItems[index],
                          companyLogo: {
                            id: media.id,
                            srcUrl: media.url
                          }
                        };
                        return updatedItems;
                      });
                    },
                    onClose: () => {},
                    allowedTypes: ["image"],
                    value: item?.companyLogo?.id,
                    render: ({
                      open
                    }) => {
                      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                        className: "flex flex-col items-center gap-2",
                        children: [item?.companyLogo?.srcUrl && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("img", {
                          src: item?.companyLogo?.srcUrl,
                          alt: "",
                          className: "cursor-pointer rounded-md max-w-[160px] max-h-[160px] object-contain border border-solid border-gray-300 p-1",
                          onClick: () => {
                            open();
                          }
                        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
                          className: "flex items-center gap-2",
                          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("button", {
                            onClick: open,
                            className: "no-underline px-4 py-2 rounded-sm bg-gray-700 hover:bg-gray-700 text-white  whitespace-nowrap  hover:text-white",
                            children: "Open Media Library"
                          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("button", {
                            onClick: () => {
                              setitems(prevItems => {
                                const updatedItems = [...prevItems];
                                updatedItems[index] = {
                                  ...updatedItems[index],
                                  companyLogo: {
                                    id: "",
                                    srcUrl: ""
                                  }
                                };
                                return updatedItems;
                              });
                            },
                            className: "no-underline size-[38px] flex items-center justify-center text-[30px] rounded-sm !border !bg-transparent !border-solid !border-gray-700 hover:!border-red-700 text-gray-700   hover:text-red-700",
                            title: "Clear Logo",
                            children: "\xD7"
                          })]
                        })]
                      });
                    }
                  })]
                })]
              })]
            })]
          }, index)
        });
      })
    })]
  });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PostGridItems);

/***/ }),

/***/ "./src/components/items/query-presets.js":
/*!***********************************************!*\
  !*** ./src/components/items/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 */ });
var queryPresets = [{
  label: "Latest Posts by Publish Date",
  key: "preset1",
  isPro: false,
  prams: {
    postType: {
      value: ["post"],
      id: "postType"
    },
    postStatus: {
      value: ["publish"],
      id: "postStatus"
    },
    order: {
      value: "DESC",
      id: "order"
    },
    orderby: {
      value: ["date"],
      id: "orderby"
    },
    postsPerPage: {
      value: "10",
      id: "postsPerPage"
    }
  }
}, {
  label: "Oldest Posts by Publish Date",
  key: "preset2",
  isPro: false,
  prams: {
    postType: {
      value: ["post"],
      id: "postType"
    },
    postStatus: {
      value: ["publish"],
      id: "postStatus"
    },
    order: {
      value: "ASC",
      id: "order"
    },
    orderby: {
      value: ["date"],
      id: "orderby"
    },
    postsPerPage: {
      value: "10",
      id: "postsPerPage"
    }
  }
}, {
  label: "Latest Posts by Modified Date",
  key: "preset3",
  isPro: false,
  prams: {
    postType: {
      value: ["post"],
      id: "postType"
    },
    postStatus: {
      value: ["publish"],
      id: "postStatus"
    },
    order: {
      value: "DESC",
      id: "order"
    },
    orderby: {
      value: ["modified"],
      id: "orderby"
    },
    postsPerPage: {
      value: "10",
      id: "postsPerPage"
    }
  }
}, {
  label: "Oldest Posts by Modified Date",
  key: "preset4",
  isPro: false,
  prams: {
    postType: {
      value: ["post"],
      id: "postType"
    },
    postStatus: {
      value: ["publish"],
      id: "postStatus"
    },
    order: {
      value: "ASC",
      id: "order"
    },
    orderby: {
      value: ["modified"],
      id: "orderby"
    },
    postsPerPage: {
      value: "10",
      id: "postsPerPage"
    }
  }
}, {
  label: "Alphabetical Order A-Z",
  key: "preset5",
  isPro: false,
  prams: {
    postType: {
      value: ["post"],
      id: "postType"
    },
    postStatus: {
      value: ["publish"],
      id: "postStatus"
    },
    order: {
      value: "ASC",
      id: "order"
    },
    orderby: {
      value: ["name"],
      id: "orderby"
    },
    postsPerPage: {
      value: "10",
      id: "postsPerPage"
    }
  }
}, {
  label: "Alphabetical Order Z-A",
  key: "preset6",
  isPro: false,
  prams: {
    postType: {
      value: ["post"],
      id: "postType"
    },
    postStatus: {
      value: ["publish"],
      id: "postStatus"
    },
    order: {
      value: "DESC",
      id: "order"
    },
    orderby: {
      value: ["name"],
      id: "orderby"
    },
    postsPerPage: {
      value: "10",
      id: "postsPerPage"
    }
  }
}, {
  label: "Most Commented Posts",
  key: "preset7",
  isPro: false,
  prams: {
    postType: {
      value: ["post"],
      id: "postType"
    },
    postStatus: {
      value: ["publish"],
      id: "postStatus"
    },
    order: {
      value: "DESC",
      id: "order"
    },
    orderby: {
      value: ["name"],
      id: "comment_count"
    },
    postsPerPage: {
      value: "10",
      id: "postsPerPage"
    }
  }
}, {
  label: "Random 10 Posts",
  key: "preset8",
  isPro: false,
  prams: {
    postType: {
      value: ["post"],
      id: "postType"
    },
    postStatus: {
      value: ["publish"],
      id: "postStatus"
    },
    order: {
      value: "DESC",
      id: "order"
    },
    orderby: {
      value: ["rand"],
      id: "orderby"
    },
    postsPerPage: {
      value: "10",
      id: "postsPerPage"
    }
  }
}];
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (queryPresets);

/***/ }),

/***/ "./src/components/items/queryprams.js":
/*!********************************************!*\
  !*** ./src/components/items/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 postQueryArgs = {
  postType: {
    value: ["post"],
    multiple: false,
    id: "postType",
    label: "Post types",
    description: "Select Post Types to Query"
  },
  s: {
    value: "",
    multiple: false,
    id: "s",
    label: "Keyword",
    description: "Search keyword, ex: hello"
  },
  postStatus: {
    value: [],
    multiple: false,
    id: "postStatus",
    label: "Post status",
    description: "Query post by post status"
  },
  order: {
    value: "",
    multiple: false,
    id: "order",
    label: "Order",
    description: "Post query order"
  },
  orderby: {
    value: [],
    multiple: false,
    id: "orderby",
    label: "Orderby",
    description: "Post query orderby"
  },
  metaKey: {
    value: "",
    multiple: false,
    id: "metaKey",
    label: "Meta fields key",
    description: "Post query by meta fields key",
    isPro: true
  },
  // Category Parameters
  cat: {
    value: "",
    multiple: false,
    id: "cat",
    label: "Category ID",
    description: "Post query by Category ID"
  },
  categoryName: {
    value: "",
    multiple: false,
    id: "categoryName",
    label: "Category Name",
    description: "Post query by Category Name"
  },
  categoryAnd: {
    value: [],
    multiple: false,
    id: "categoryAnd",
    label: "Category And",
    description: "Post query by Category IDs",
    isPro: true
  },
  categoryIn: {
    value: [],
    multiple: false,
    id: "categoryIn",
    label: "Category In",
    description: "Post query by Category IDs",
    isPro: true
  },
  categoryNotIn: {
    value: [],
    multiple: false,
    id: "categoryNotIn",
    label: "Category Not In",
    description: "Post query by excluded Category IDs",
    isPro: true
  },
  // Tag Parameters
  tag: {
    value: "",
    multiple: false,
    id: "tag",
    label: "Tags",
    description: "Post query by Tag slug"
  },
  tagId: {
    value: "",
    multiple: false,
    id: "tagId",
    label: "Tag Id",
    description: "Post query by Tag ID"
  },
  tagAnd: {
    value: "",
    multiple: false,
    id: "tagAnd",
    label: "Tag And",
    description: "Post query by Tag Ids",
    isPro: true
  },
  tagIn: {
    value: "",
    multiple: false,
    id: "tagIn",
    label: "Tag In",
    description: "Post query by Tag ids",
    isPro: true
  },
  tagNotIn: {
    value: "",
    multiple: false,
    id: "tagNotIn",
    label: "Tag Not In",
    description: "Post query by excluded Tag ids",
    isPro: true
  },
  tagSlugAnd: {
    value: "",
    multiple: false,
    id: "tagSlugAnd",
    label: "Tag Slug And",
    description: "Post query by Tags slug",
    isPro: true
  },
  tagSlugIn: {
    value: "",
    multiple: false,
    id: "tagSlugIn",
    label: "Tag Slug In",
    description: "Post query by excluded Tags slug",
    isPro: true
  },
  // taxQuery: {
  // 	value: [],
  // 	multiple: false,
  // 	id: "taxQuery",
  // 	label: "Tax Query",
  // 	description: "Taxonomies query arguments",
  // 	isPro: true,
  // },
  taxQueryRelation: {
    value: "OR",
    multiple: false,
    id: "taxQueryRelation",
    label: "Taxonomy Query Relation",
    description: "Taxonomies query relation",
    isPro: true
  },
  // // Date Parameters
  // dateQuery: {
  // 	value: [],

  // 	multiple: false,
  // 	id: "dateQuery",
  // 	label: "Date Query",
  // 	description: "Post query by date",
  // 	isPro: true,
  // },
  year: {
    value: "",
    multiple: false,
    id: "year",
    label: "Year",
    description: "Post query by year"
  },
  monthnum: {
    value: "",
    multiple: false,
    id: "monthnum",
    label: "Month",
    description: "Post query by month"
  },
  w: {
    value: "",
    multiple: false,
    id: "w",
    label: "Week",
    description: "Post query by week"
  },
  day: {
    value: "",
    multiple: false,
    id: "day",
    label: "Day",
    description: "Post query by day"
  },
  hour: {
    value: "",
    multiple: false,
    id: "hour",
    label: "Hour",
    description: "Post query by hour"
  },
  minute: {
    value: "",
    multiple: false,
    id: "minute",
    label: "Miniute",
    description: "Post query by miniute"
  },
  second: {
    value: "",
    multiple: false,
    id: "second",
    label: "Second",
    description: "Post query by second"
  },
  m: {
    value: "",
    multiple: false,
    id: "m",
    label: "Month",
    description: "Post query by month"
  },
  // // Author Parameters
  author: {
    value: "",
    multiple: false,
    id: "author",
    label: "Author",
    description: "Post query by Author ID"
  },
  authorName: {
    value: "",
    multiple: false,
    id: "authorName",
    label: "Author Name",
    description: "Post query by Author Name"
  },
  authorIn: {
    value: "",
    multiple: false,
    id: "authorIn",
    label: "Author In",
    description: "Post query by Author IDs",
    isPro: true
  },
  authorNotIn: {
    value: "",
    multiple: false,
    id: "authorNotIn",
    label: "Author Not In",
    description: "Post query by exluded Author IDs",
    isPro: true
  },
  p: {
    value: "",
    multiple: false,
    id: "p",
    label: "Post id",
    description: "Post query by single post id"
  },
  name: {
    value: "",
    multiple: false,
    id: "name",
    label: "Name",
    description: "Post query by post slug"
  },
  pageId: {
    value: "",
    multiple: false,
    id: "pageId",
    label: "Page Id",
    description: "Post query by single page id"
  },
  pagename: {
    value: "",
    multiple: false,
    id: "pagename",
    label: "Page name",
    description: "Post query by page slug"
  },
  postParent: {
    value: "",
    multiple: false,
    id: "postParent",
    label: "Post Parent",
    description: "Add {ID} to Post query by post parent id",
    isPro: true
  },
  postParentIn: {
    value: "",
    multiple: false,
    id: "postParentIn",
    label: "Post Parent In",
    description: "Post query by post parent ids",
    isPro: true
  },
  postParentNotIn: {
    value: "",
    multiple: false,
    id: "postParentNotIn",
    label: "Post Parent Not In",
    description: "Post query by excluded post parent ids",
    isPro: true
  },
  postIn: {
    value: "",
    multiple: false,
    id: "postIn",
    label: "Post In",
    description: "Post query by multiple post ids, comma separated.",
    isPro: true
  },
  postNotIn: {
    value: "",
    multiple: false,
    id: "postNotIn",
    label: "Post Not In",
    description: "Post query by excluded post ids",
    isPro: true
  },
  postNameIn: {
    value: [{
      slug: ""
    }],
    multiple: false,
    id: "postNameIn",
    label: "Post Name In",
    description: "Post query by post slugs",
    isPro: true
  },
  hasPassword: {
    value: "",
    multiple: false,
    id: "hasPassword",
    label: "Has Password",
    description: "Post query for posts with passwords",
    isPro: true
  },
  postPassword: {
    value: "",
    multiple: false,
    id: "postPassword",
    label: "Post Password",
    description: "Post query for posts with particular passwords",
    isPro: true
  },
  commentCount: {
    value: {
      compare: "=",
      value: 10
    },
    multiple: false,
    id: "commentCount",
    label: "Comment Count",
    description: "Post query by comment count",
    isPro: true
  },
  nopaging: {
    value: "",
    multiple: false,
    id: "nopaging",
    label: "No Paging",
    description: "Enable show all posts or use pagination"
  },
  postsPerPage: {
    value: "",
    multiple: false,
    id: "postsPerPage",
    label: "Posts Per Page",
    description: "Number of post to show per page"
  },
  paged: {
    value: "",
    multiple: false,
    id: "paged",
    label: "Paged",
    description: "Pagination start with"
  },
  offset: {
    value: "",
    multiple: false,
    id: "offset",
    label: "Offset",
    description: "Number of post to displace or pass over",
    isPro: true
  },
  postsPerArchivePage: {
    value: "",
    multiple: false,
    id: "postsPerArchivePage",
    label: "Posts Per Archive Page",
    description: ""
  },
  ignoreStickyPosts: {
    value: "",
    multiple: false,
    id: "ignoreStickyPosts",
    label: "Ignore Sticky Posts",
    description: "Ignore post from post query",
    isPro: true
  },
  metaKey: {
    value: "",
    multiple: false,
    id: "metaKey",
    label: "Meta Key",
    description: "Post query by custom field key",
    isPro: true
  },
  metaValue: {
    value: "",
    multiple: false,
    id: "metaValue",
    label: "Meta Value",
    description: "Post query by custom field value",
    isPro: true
  },
  metaValueNum: {
    value: "",
    multiple: false,
    id: "metaValueNum",
    label: "Meta Value Num",
    description: "Post query by custom field value for number types",
    isPro: true
  },
  metaCompare: {
    value: "",
    multiple: false,
    id: "metaCompare",
    label: "Meta Compare",
    description: "Meta query compare",
    isPro: true
  },
  // metaQuery: {
  // 	value: [],

  // 	multiple: false,
  // 	id: "metaQuery",
  // 	label: "Meta Query",
  // 	description: "Advance meta fields query",
  // 	isPro: true,
  // },
  perm: {
    value: "readable",
    multiple: false,
    id: "perm",
    label: "Perm",
    description: "User permission parameter"
  },
  postMimeType: {
    value: "",
    multiple: false,
    id: "postMimeType",
    label: "Post Mime Type",
    description: "Post query by allwed post mime types",
    isPro: true
  },
  cacheResults: {
    value: false,
    multiple: false,
    id: "cacheResults",
    label: "Cache Results",
    description: "Enable Post information cache",
    isPro: true
  },
  updatePostMetaCache: {
    value: false,
    multiple: false,
    id: "updatePostMetaCache",
    label: "Update Post Meta Cache",
    description: "Enable Post meta information cache",
    isPro: true
  },
  updatePostTermCache: {
    value: false,
    multiple: false,
    id: "updatePostTermCache",
    label: "Update Post Term Cache",
    description: "Enable Post term information cache",
    isPro: true
  }
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (postQueryArgs);

/***/ }),

/***/ "./src/components/layout-generator/TreeView.jsx":
/*!******************************************************!*\
  !*** ./src/components/layout-generator/TreeView.jsx ***!
  \******************************************************/
/***/ ((__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_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 _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/pages.js");
/* 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__);
/* 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 _elements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./elements */ "./src/components/layout-generator/elements.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);





const sortableOptions = {
  animation: 150,
  fallbackOnBody: true,
  swapThreshold: 0.65,
  ghostClass: "ghost",
  group: "shared",
  filter: ".no-drag",
  preventOnFilter: false
};
const TreeView = ({
  blocks,
  setBlocks,
  selected,
  setSelected
}) => {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "flex items-center justify-between bg-slate-400 px-3 py-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "text-[20px] font-bold",
        children: "Tree View"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "hover:bg-red-500 bg-slate-700 text-white px-5 py-2 rounded-sm cursor-pointer ",
        onClick: () => setBlocks([{
          id: 1,
          type: "root",
          children: [],
          parent_id: null,
          styles: {}
        }]),
        children: "Remove All  "
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "p-2",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_sortablejs__WEBPACK_IMPORTED_MODULE_1__.ReactSortable, {
        list: blocks,
        setList: setBlocks,
        ...sortableOptions,
        children: blocks.map((block, blockIndex) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(BlockWrapper, {
          block: block,
          blockIndex: [blockIndex],
          setBlocks: setBlocks,
          selected: selected,
          setSelected: setSelected
        }, block.id))
      })
    })]
  });
};
function Container({
  block,
  blockIndex,
  setBlocks,
  selected,
  setSelected
}) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_sortablejs__WEBPACK_IMPORTED_MODULE_1__.ReactSortable, {
      list: block.children,
      setList: currentList => {
        setBlocks(sourceList => {
          const tempList = [...sourceList];
          const _blockIndex = [...blockIndex];
          const lastIndex = _blockIndex.pop();
          const lastArr = _blockIndex.reduce((arr, i) => arr[i]["children"], tempList);
          lastArr[lastIndex]["children"] = currentList;
          return tempList;
        });
      },
      ...sortableOptions,
      children: block.children && block.children.map((childBlock, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(BlockWrapper, {
          block: childBlock,
          blockIndex: [...blockIndex, index],
          setBlocks: setBlocks,
          selected: selected,
          setSelected: setSelected
        }, childBlock.id);
      })
    }, block.id)
  });
}
function BlockWrapper({
  block,
  blockIndex,
  setBlocks,
  selected,
  setSelected
}) {
  if (!block) return null;
  const handleRemove = () => {
    if (block.type == "root") {
      return;
    }
    setBlocks(prev => {
      const updatedBlocks = [...prev];
      removeNestedBlock(updatedBlocks, blockIndex);
      return updatedBlocks;
    });
  };
  const handleDuplicate = () => {
    setBlocks(prev => {
      const updatedBlocks = [...prev];
      const duplicateBlock = block => {
        // Create a deep clone of the block with a new ID
        const newBlock = {
          ...block,
          id: Math.random(),
          // Ensure a unique ID
          children: block.children ? block.children.map(duplicateBlock) : [] // Recursively duplicate children
        };
        return newBlock;
      };
      const parentBlock = getNestedBlock(updatedBlocks, blockIndex.slice(0, -1));
      const newBlock = duplicateBlock(block);
      if (blockIndex.length === 1) {
        // If the block is at the root level
        updatedBlocks.splice(blockIndex[0] + 1, 0, newBlock);
      } else {
        // If the block is nested
        parentBlock.children.splice(blockIndex[blockIndex.length - 1] + 1, 0, newBlock);
      }
      return updatedBlocks;
    });
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: `block ${block.type == "root" ? "no-drag " : ""} ${block.type == "container" || block.type == "layer" ? "border-0 border-l border-solid" : ""} relative my-2  pl-2`,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: `flex items-center  border border-solid px-2 py-1 cursor-pointer hover:bg-gray-300 ${block.id == selected ? "bg-gray-300" : ""} `,
      onClick: () => {
        setSelected(block.id);
      },
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "flex-1 overflow-hidden truncate text-md",
        children: _elements__WEBPACK_IMPORTED_MODULE_2__["default"][block.type] != undefined ? _elements__WEBPACK_IMPORTED_MODULE_2__["default"][block.type]?.label : block.type
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "flex items-center gap-2",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "size-6 bg-red-500 flex items-center justify-center cursor-pointer",
          onClick: handleRemove,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"],
            fill: "#fff",
            size: 18
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "size-6 bg-blue-500 flex items-center justify-center cursor-pointer",
          onClick: handleDuplicate,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"],
            fill: "#fff",
            size: 18
          })
        })]
      })]
    }), ["root", "container", 'layer'].includes(block.type) && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Container, {
      block: block,
      setBlocks: setBlocks,
      blockIndex: blockIndex,
      selected: selected,
      setSelected: setSelected
    })]
  });
}
function getNestedBlock(blocks, indices) {
  return indices.reduce((block, index) => block.children[index], {
    children: blocks
  });
}
function removeNestedBlock(blocks, indices) {
  if (indices.length === 1) {
    blocks.splice(indices[0], 1);
  } else {
    const parentBlock = getNestedBlock(blocks, indices.slice(0, -1));
    parentBlock.children.splice(indices[indices.length - 1], 1);
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TreeView);

/***/ }),

/***/ "./src/components/layout-generator/TreeViewMetaFields.jsx":
/*!****************************************************************!*\
  !*** ./src/components/layout-generator/TreeViewMetaFields.jsx ***!
  \****************************************************************/
/***/ ((__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_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 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__);
/* 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 _postMetaPrams__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./postMetaPrams */ "./src/components/layout-generator/postMetaPrams.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);





const sortableOptions = {
  animation: 150,
  fallbackOnBody: true,
  swapThreshold: 0.65,
  ghostClass: "ghost",
  group: "shared",
  filter: ".no-drag",
  preventOnFilter: false
};
const TreeViewMetaFields = ({
  blocks,
  setPrams
}) => {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "p-2",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_sortablejs__WEBPACK_IMPORTED_MODULE_1__.ReactSortable, {
        list: blocks,
        setList: setPrams,
        ...sortableOptions,
        children: typeof blocks == 'object' && blocks?.map((block, blockIndex) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(BlockWrapper, {
          block: block,
          blockIndex: [blockIndex],
          setPrams: setPrams
        }, block.id))
      })
    })
  });
};
function Container({
  block,
  blockIndex,
  setPrams
}) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_sortablejs__WEBPACK_IMPORTED_MODULE_1__.ReactSortable, {
      list: block.children,
      setList: currentList => {
        setPrams(sourceList => {
          const tempList = [...sourceList];
          const _blockIndex = [...blockIndex];
          const lastIndex = _blockIndex.pop();
          const lastArr = _blockIndex.reduce((arr, i) => arr[i]["children"], tempList);
          lastArr[lastIndex]["children"] = currentList;
          return tempList;
        });
      },
      ...sortableOptions,
      children: block.children && block.children.map((childBlock, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(BlockWrapper, {
          block: childBlock,
          blockIndex: [...blockIndex, index],
          setPrams: setPrams
        }, childBlock.id);
      })
    }, block.id)
  });
}
function BlockWrapper({
  block,
  blockIndex,
  setPrams
}) {
  if (!block) return null;
  const handleRemove = () => {
    if (block.type == "root") {
      return;
    }
    setPrams(prev => {
      const updatedBlocks = [...prev];
      removeNestedBlock(updatedBlocks, blockIndex);
      return updatedBlocks;
    });
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: `block ${block.type == "root" ? "no-drag " : ""} ${block.type == "container" || block.type == "layer" ? "border-0 border-l border-solid" : ""} relative my-2  pl-2`,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: `flex items-center  border border-solid px-2 py-1 cursor-pointer hover:bg-gray-300  `,
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "flex-1 overflow-hidden truncate text-md",
        children: _postMetaPrams__WEBPACK_IMPORTED_MODULE_2__["default"][block.type] != undefined ? _postMetaPrams__WEBPACK_IMPORTED_MODULE_2__["default"][block.type]?.label : block.type
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "flex items-center gap-2",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "size-6 bg-red-500 flex items-center justify-center cursor-pointer",
          onClick: handleRemove,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"],
            fill: "#fff",
            size: 18
          })
        })
      })]
    }), ["root", "container", 'layer'].includes(block.type) && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Container, {
      block: block,
      setPrams: setPrams,
      blockIndex: blockIndex
    })]
  });
}
function getNestedBlock(blocks, indices) {
  return indices.reduce((block, index) => block.children[index], {
    children: blocks
  });
}
function removeNestedBlock(blocks, indices) {
  if (indices.length === 1) {
    blocks.splice(indices[0], 1);
  } else {
    const parentBlock = getNestedBlock(blocks, indices.slice(0, -1));
    parentBlock.children.splice(indices[indices.length - 1], 1);
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (TreeViewMetaFields);

/***/ }),

/***/ "./src/components/layout-generator/elements-options.js":
/*!*************************************************************!*\
  !*** ./src/components/layout-generator/elements-options.js ***!
  \*************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* 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__);
/* 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 _components_dropdown__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _components_icon_picker__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/icon-picker */ "./src/components/icon-picker/index.js");
/* harmony import */ var _components_radio_control__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/radio-control */ "./src/components/radio-control/index.js");
/* harmony import */ var _components_animate_on__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../components/animate-on */ "./src/components/animate-on/index.js");
/* harmony import */ var _TreeViewMetaFields__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./TreeViewMetaFields */ "./src/components/layout-generator/TreeViewMetaFields.jsx");
/* harmony import */ var _postMetaPrams__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./postMetaPrams */ "./src/components/layout-generator/postMetaPrams.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__);
const {
  Component
} = wp.element;













const ALLOWED_MEDIA_TYPES = ["image"];
var thumbnailSizeArgs = {
  full: {
    label: "Full",
    value: "full",
    height: "",
    width: "",
    crop: false
  },
  thumbnail: {
    label: "thumbnail(150*150)",
    value: "thumbnail",
    height: 150,
    width: 150
  },
  medium: {
    label: "medium(300*300)",
    value: "medium",
    height: 300,
    width: 300
  },
  medium_large: {
    label: "medium large(768*0)",
    value: "medium_large",
    height: 0,
    width: 768
  },
  large: {
    label: "large(1024*1024)",
    value: "large",
    height: 1024,
    width: 1024
  },
  "1536x1536": {
    label: "1536x1536(1536*1536)",
    value: "1536x1536",
    height: 1536,
    width: 1536
  },
  "2048x2048": {
    label: "2048x2048(2048*2048)",
    value: "2048x2048",
    height: 2048,
    width: 2048
  },
  woocommerce_archive_thumbnail: {
    label: "woocommerce archive thumbnail(500*500)",
    value: "woocommerce_archive_thumbnail",
    height: 500,
    width: 500
  },
  woocommerce_thumbnail: {
    label: "woocommerce thumbnail(300*300)",
    value: "woocommerce_thumbnail",
    height: 300,
    width: 300
  },
  woocommerce_single: {
    label: "woocommerce single(600*0)",
    value: "woocommerce_single",
    height: 0,
    width: 600
  },
  woocommerce_gallery_thumbnail: {
    label: "woocommerce gallery thumbnail(100*100)",
    value: "woocommerce_gallery_thumbnail",
    height: 100,
    width: 100
  }
};
var LinkToArgs = {
  none: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
    value: ""
  },
  postUrl: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Post URL", "post-grid"),
    value: "postUrl"
  },
  homeUrl: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Home URL", "post-grid"),
    value: "homeUrl"
  },
  authorUrl: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Author URL", "post-grid"),
    value: "authorUrl"
  },
  authorLink: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Author Link", "post-grid"),
    value: "authorLink"
  },
  authorMail: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Author Mail", "post-grid"),
    value: "authorMail",
    isPro: true
  },
  authorMeta: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Author Meta", "post-grid"),
    value: "authorMeta",
    isPro: true
  },
  customField: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom Field", "post-grid"),
    value: "customField",
    isPro: true
  },
  customUrl: {
    label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom URL", "post-grid"),
    value: "customUrl",
    isPro: true
  }
};
var linkTargetArgs = {
  _self: {
    label: "_self",
    value: "_self"
  },
  _blank: {
    label: "_blank",
    value: "_blank"
  },
  _parent: {
    label: "_parent",
    value: "_parent"
  },
  _top: {
    label: "_top",
    value: "_top"
  }
};
var limitByArgs = {
  words: {
    label: "words",
    value: "words"
  },
  characters: {
    label: "characters",
    value: "characters"
  }
};
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 numberFormats = {
  "decimal": {
    label: "Decimal",
    value: "decimal"
  },
  "wordForm": {
    label: "Word Form",
    value: "wordForm"
  },
  "scientificNotation": {
    label: "Scientific Notation",
    value: "scientificNotation"
  },
  "binaryBase2": {
    label: "Binary (Base 2)",
    value: "binaryBase2"
  },
  "octalBase8": {
    label: "Octal (Base 8)",
    value: "octalBase8"
  },
  "hexadecimalBase16": {
    label: "2022/05/25",
    value: "hexadecimalBase16"
  },
  "roman": {
    label: "Roman",
    value: "roman"
  },
  "engineeringNotation": {
    label: "Engineering Notation",
    value: "engineeringNotation"
  },
  "compactNumber": {
    label: "Feb Sun 11, 2022",
    value: "compactNumber"
  }
};
var tagsPrams = {
  "ul": {
    label: "UL",
    value: "ul"
  },
  "li": {
    label: "LI",
    value: "li"
  },
  "div": {
    label: "DIV",
    value: "div"
  },
  "span": {
    label: "SPAN",
    value: "span"
  },
  "p": {
    label: "P",
    value: "p"
  },
  "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"
  }
};
var customFieldSrcPrams = {
  "acf": {
    label: "ACF",
    value: "acf"
  },
  "none": {
    label: "Default",
    value: ""
  }
};

/*postTitle*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionspostTitle', 'post-grid/element', PostGridElementOptionspostTitle, 10);
function PostGridElementOptionspostTitle(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: LinkToArgs,
        buttonTitle: selectedElement?.options?.linkTo == undefined || selectedElement?.options?.linkTo.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo].label,
        onChange: option => {
          handleChange("linkTo", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    })]
  });
}

/*postThumbnail*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionspostThumbnail', 'post-grid/element', PostGridElementOptionspostThumbnail, 10);
function PostGridElementOptionspostThumbnail(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: LinkToArgs,
        buttonTitle: selectedElement?.options?.linkTo == undefined || selectedElement?.options?.linkTo.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo].label,
        onChange: option => {
          handleChange("linkTo", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Default Thumbnail", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.MediaUpload, {
          className: "bg-gray-700 hover:bg-gray-600",
          onSelect: media => {
            // media.id

            handleChange("defaultSrcId", media.id);
            handleChange("defaultSrcUrl", media.url);
          },
          onClose: () => {},
          allowedTypes: ALLOWED_MEDIA_TYPES,
          value: selectedElement.options.defaultSrcId,
          render: ({
            open
          }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
            className: "flex w-full justify-center items-center bg-gray-300/30 min-h-[200px] rounded-md border border-solid border-slate-400 hover:border-black transition-all duration-300 ease-in-out cursor-pointer mt-2 ",
            onClick: open,
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("img", {
              // src={MyLazy}
              src: selectedElement.options.defaultSrcUrl,
              alt: "",
              className: " "
            })
          })
        })
      })]
    })]
  });
}

/*postExcerpt*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionspostExcerpt', 'post-grid/element', PostGridElementOptionspostExcerpt, 10);
function PostGridElementOptionspostExcerpt(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Limit By", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: limitByArgs,
        buttonTitle: selectedElement?.options?.limitBy == undefined || selectedElement?.options?.limitBy.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : limitByArgs[selectedElement?.options?.limitBy] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : limitByArgs[selectedElement?.options?.limitBy].label,
        onChange: option => {
          handleChange("limitBy", option.value);
        },
        values: []
      })]
    }), selectedElement?.options?.limitBy.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Limit Count", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.limitCount,
        onChange: newVal => {
          handleChange("limitCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Read More Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.readMoreText,
        onChange: newVal => {
          handleChange("readMoreText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    })]
  });
}

/*readMore*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionsreadMore', 'post-grid/element', PostGridElementOptionsreadMore, 10);
function PostGridElementOptionsreadMore(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Read More Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.readMoreText,
        onChange: newVal => {
          handleChange("readMoreText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    })]
  });
}

/*customText*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionscustomText', 'post-grid/element', PostGridElementOptionscustomText, 10);
function PostGridElementOptionscustomText(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Wrapper Tag", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.SelectControl, {
        label: "",
        value: selectedElement.options.customTag,
        options: [{
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
          value: ""
        }, {
          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 => {
          handleChange("customTag", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.content,
        onChange: newVal => {
          handleChange("content", newVal);
        }
      })]
    })]
  });
}

/*container*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionscontainer', 'post-grid/element', PostGridElementOptionscontainer, 10);
function PostGridElementOptionscontainer(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Animate On", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_animate_on__WEBPACK_IMPORTED_MODULE_8__["default"], {
        animateOn: selectedElement.options?.animateOn,
        onChange: prams => {
          handleChange("animateOn", prams);

          //setAttributes({ animateOn: prams });
        }
      })]
    })]
  });
}

/*layer*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionslayer', 'post-grid/element', PostGridElementOptionslayer, 10);
function PostGridElementOptionslayer(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Animate On", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_animate_on__WEBPACK_IMPORTED_MODULE_8__["default"], {
        animateOn: selectedElement.options?.animateOn,
        onChange: prams => {
          handleChange("animateOn", prams);

          //setAttributes({ animateOn: prams });
        }
      })]
    })]
  });
}

/*postDate*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionspostDate', 'post-grid/element', PostGridElementOptionspostDate, 10);
function PostGridElementOptionspostDate(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      className: "mb-4",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Date Format", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        variant: "secondary",
        options: dateFormats
        // buttonTitle="Choose"
        ,
        buttonTitle: dateFormats[selectedElement.options.format] != undefined ? dateFormats[selectedElement.options.format].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
        onChange: option => {
          handleChange("format", option.value);
        },
        values: ""
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      className: "mb-4",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom Format", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        className: "mr-2",
        value: selectedElement.options.format,
        onChange: newVal => {
          handleChange("format", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: LinkToArgs,
        buttonTitle: selectedElement?.options?.linkTo == undefined || selectedElement?.options?.linkTo.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo].label,
        onChange: option => {
          handleChange("linkTo", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose Icon", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_6__["default"], {
        library: selectedElement.options?.icon?.library,
        srcType: selectedElement.options?.icon?.srcType,
        iconSrc: selectedElement.options?.icon?.iconSrc,
        onChange: arg => {
          handleChange("icon", {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          });
        }
      })]
    })]
  });
}

/*postAuthor*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionspostAuthor', 'post-grid/element', PostGridElementOptionspostAuthor, 10);
function PostGridElementOptionspostAuthor(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: LinkToArgs,
        buttonTitle: selectedElement?.options?.linkTo == undefined || selectedElement?.options?.linkTo.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo].label,
        onChange: option => {
          handleChange("linkTo", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose Icon", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_6__["default"], {
        library: selectedElement.options?.icon?.library,
        srcType: selectedElement.options?.icon?.srcType,
        iconSrc: selectedElement.options?.icon?.iconSrc,
        onChange: arg => {
          handleChange("icon", {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          });
        }
      })]
    })]
  });
}

/*postAuthorAvatar*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionspostAuthorAvatar', 'post-grid/element', PostGridElementOptionspostAuthorAvatar, 10);
function PostGridElementOptionspostAuthorAvatar(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: LinkToArgs,
        buttonTitle: selectedElement?.options?.linkTo == undefined || selectedElement?.options?.linkTo.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo].label,
        onChange: option => {
          handleChange("linkTo", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    })]
  });
}

/*postCategories*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionspostCategories', 'post-grid/element', PostGridElementOptionspostCategories, 10);
function PostGridElementOptionspostCategories(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Max Count", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.maxCount,
        onChange: newVal => {
          handleChange("maxCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Separator", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.separator,
        onChange: newVal => {
          handleChange("separator", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
      className: "gap-2 justify-between items-center flex",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
        className: "font-medium text-slate-900",
        children: "Enable Post Count?"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
        className: "flex items-center gap-2 py-2",
        help: selectedElement?.options?.postCount ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Disabled.", "post-grid"),
        checked: selectedElement?.options?.postCount ? true : false,
        onChange: newVal => {
          handleChange("postCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: LinkToArgs,
        buttonTitle: selectedElement?.options?.linkTo == undefined || selectedElement?.options?.linkTo.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo].label,
        onChange: option => {
          handleChange("linkTo", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    })]
  });
}

/*postTags*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionspostTags', 'post-grid/element', PostGridElementOptionspostTags, 10);
function PostGridElementOptionspostTags(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Max Count", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.maxCount,
        onChange: newVal => {
          handleChange("maxCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Separator", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.separator,
        onChange: newVal => {
          handleChange("separator", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
      className: "gap-2 justify-between items-center flex",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
        className: "font-medium text-slate-900",
        children: "Enable Post Count?"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
        className: "flex items-center gap-2 py-2",
        help: selectedElement?.options?.postCount ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Disabled.", "post-grid"),
        checked: selectedElement?.options?.postCount ? true : false,
        onChange: newVal => {
          handleChange("postCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: LinkToArgs,
        buttonTitle: selectedElement?.options?.linkTo == undefined || selectedElement?.options?.linkTo.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo].label,
        onChange: option => {
          handleChange("linkTo", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    })]
  });
}
/*postMeta*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionspostMeta', 'post-grid/element', PostGridElementOptionspostMeta, 10);
function PostGridElementOptionspostMeta(html, selectedElement, handleChange) {
  var returnPrams = selectedElement?.options?.returnPrams;
  console.log(selectedElement);
  function setPrams(prams) {
    //console.log(prams);
    handleChange("returnPrams", prams);
  }
  var linkTargets = {
    _self: {
      label: "_self",
      value: "_self"
    },
    _blank: {
      label: "_blank",
      value: "_blank"
    },
    _parent: {
      label: "_parent",
      value: "_parent"
    },
    _top: {
      label: "_top",
      value: "_top"
    }
  };
  var protocolPrams = {
    "_self": {
      "label": "_self",
      "value": "_self"
    },
    "http": {
      "label": "http",
      "value": "http"
    },
    "https": {
      "label": "https",
      "value": "https"
    },
    "mailto": {
      "label": "mailto",
      "value": "mailto"
    },
    "tel": {
      "label": "tel",
      "value": "tel"
    },
    "sms": {
      "label": "sms",
      "value": "sms"
    },
    "ftp": {
      "label": "ftp",
      "value": "ftp"
    },
    "file": {
      "label": "file",
      "value": "file"
    },
    "data": {
      "label": "data",
      "value": "data"
    },
    "geo": {
      "label": "geo",
      "value": "geo"
    },
    "whatsapp": {
      "label": "whatsapp",
      "value": "whatsapp"
    },
    "skype": {
      "label": "skype",
      "value": "skype"
    },
    "zoommtg": {
      "label": "zoommtg",
      "value": "zoommtg"
    },
    "intent": {
      "label": "intent",
      "value": "intent"
    }
  };

  // const [pramsX, setPramsX] = useState(selectedElement?.options?.returnPrams);

  // useEffect(() => {
  //   console.log(prams);
  // }, [prams]);

  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      className: "mb-4",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Wrapper tag", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        variant: "secondary",
        options: tagsPrams,
        buttonTitle: tagsPrams[selectedElement?.options?.wrapperTag] != undefined ? tagsPrams[selectedElement?.options?.wrapperTag].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
        onChange: option => {
          handleChange("wrapperTag", option.value);
        },
        values: ""
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Meta Key", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.metaKey,
        onChange: newVal => {
          handleChange("metaKey", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      className: "mb-4",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Output Type?", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: _postMetaPrams__WEBPACK_IMPORTED_MODULE_10__["default"],
        buttonTitle: returnPrams == undefined || returnPrams.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : _postMetaPrams__WEBPACK_IMPORTED_MODULE_10__["default"][returnPrams?.outputType] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : _postMetaPrams__WEBPACK_IMPORTED_MODULE_10__["default"][returnPrams?.outputType].label,
        onChange: option => {
          var optionX = {
            ...option
          };
          delete optionX.label;
          console.log(optionX);
          handleChange("returnPrams", optionX);
        },
        values: []
      })]
    }), returnPrams?.outputType?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        className: "mb-4",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom Field Src", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
          position: "bottom right",
          variant: "secondary",
          options: customFieldSrcPrams,
          buttonTitle: customFieldSrcPrams[selectedElement?.options?.customFieldSrc] != undefined ? customFieldSrcPrams[selectedElement?.options?.customFieldSrc].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
          onChange: option => {
            handleChange("customFieldSrc", option.value);
          },
          values: ""
        })]
      })
    }), returnPrams.outputType == 'string' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        className: "mb-4",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Enable Shortcodes", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
          className: "!mb-0",
          checked: returnPrams?.enableShortcodes ? true : false,
          onChange: newVal => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.enableShortcodes = newVal;
            handleChange("returnPrams", returnPramsX);
          }
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        className: "mb-4",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Enable Embeds", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
          className: "!mb-0",
          checked: returnPrams?.enableEmbeds ? true : false,
          onChange: newVal => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.enableEmbeds = newVal;
            handleChange("returnPrams", returnPramsX);
          }
        })]
      })]
    }), returnPrams.outputType == 'strToNumber' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Decimals", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
          value: returnPrams?.decimals,
          onChange: newVal => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.decimals = newVal;
            handleChange("returnPrams", returnPramsX);
          }
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Decimal Separator", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
          value: returnPrams?.decimalSeparator,
          onChange: newVal => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.decimalSeparator = newVal;
            handleChange("returnPrams", returnPramsX);
          }
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Thousand Separator", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
          value: returnPrams?.thousandSeparator,
          onChange: newVal => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.thousandSeparator = newVal;
            handleChange("returnPrams", returnPramsX);
          }
        })]
      })]
    }), returnPrams.outputType == 'strToLink' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
          className: "flex items-center",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("span", {
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Text Src?", "post-grid")
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.SelectControl, {
          label: "",
          value: returnPrams?.linkTextSrc,
          options: [{
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom", "post-grid"),
            value: "custom"
          }, {
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Post Title", "post-grid"),
            value: 'postTitle'
          }],
          onChange: newVal => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.options.linkTextSrc = newVal;
            handleChange("returnPrams", returnPramsX);
          }
        })]
      }), returnPrams?.linkTextSrc == 'custom' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Text", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
            value: returnPrams?.linkText,
            onChange: newVal => {
              var returnPramsX = {
                ...returnPrams
              };
              returnPramsX.linkText = newVal;
              handleChange("returnPrams", returnPramsX);
            }
          })]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Target", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
          position: "bottom right",
          options: linkTargets,
          buttonTitle: returnPrams?.target == undefined || returnPrams?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargets[returnPrams?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargets[returnPrams?.target].label,
          onChange: option => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.target = option.value;
            handleChange("returnPrams", returnPramsX);
          },
          values: []
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Protocol", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
          position: "bottom right",
          options: protocolPrams,
          buttonTitle: returnPrams?.protocol == undefined || returnPrams?.protocol.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : protocolPrams[returnPrams?.protocol] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : protocolPrams[returnPrams?.protocol].label,
          onChange: option => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.protocol = option.value;
            handleChange("returnPrams", returnPramsX);
          },
          values: []
        })]
      })]
    }), returnPrams.outputType == 'idToImage' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        className: "mb-4",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Enable SrcSet", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
          className: "!mb-0",
          checked: returnPrams?.enableSrcSet ? true : false,
          onChange: newVal => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.enableSrcSet = newVal;
            handleChange("returnPrams", returnPramsX);
          }
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Thumbnail Size?", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
          position: "bottom right",
          options: thumbnailSizeArgs,
          buttonTitle: returnPrams?.thumbSize == undefined || returnPrams?.thumbSize.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : thumbnailSizeArgs[returnPrams?.thumbSize] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : thumbnailSizeArgs[returnPrams?.thumbSize].label,
          onChange: option => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.thumbSize = option.value;
            handleChange("returnPrams", returnPramsX);
          },
          values: []
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To?", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.SelectControl, {
          label: "",
          value: returnPrams?.linkTo,
          options: [{
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
            value: ""
          }, {
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom", "post-grid"),
            value: "custom"
          }, {
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Post URL", "post-grid"),
            value: 'postUrl'
          }],
          onChange: newVal => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.linkTo = newVal;
            handleChange("returnPrams", returnPramsX);
          }
        })]
      }), returnPrams?.linkTo == 'custom' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
            htmlFor: "",
            className: "font-medium text-slate-900 ",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom Link", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
            value: returnPrams?.linkToUrl,
            onChange: newVal => {
              var returnPramsX = {
                ...returnPrams
              };
              returnPramsX.linkToUrl = newVal;
              handleChange("returnPrams", returnPramsX);
            }
          })]
        })
      }), returnPrams?.linkTo.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Target", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
          position: "bottom right",
          options: linkTargets,
          buttonTitle: returnPrams?.target == undefined || returnPrams?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargets[returnPrams?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargets[returnPrams?.target].label,
          onChange: option => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.target = option.value;
            handleChange("returnPrams", returnPramsX);
          },
          values: []
        })]
      })]
    }), returnPrams.outputType == 'strToDateTime' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        className: "mb-4",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Date Format", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
          position: "bottom right",
          variant: "secondary",
          options: dateFormats,
          buttonTitle: dateFormats[returnPrams?.format] != undefined ? dateFormats[returnPrams?.format].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
          onChange: option => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.format = option.value;
            handleChange("returnPrams", returnPramsX);
          },
          values: ""
        })]
      })
    }), returnPrams.outputType == 'arrayLoop' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        className: "mb-4",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Item tag", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
          position: "bottom right",
          variant: "secondary",
          options: tagsPrams,
          buttonTitle: tagsPrams[returnPrams?.itemTag] != undefined ? tagsPrams[returnPrams?.itemTag].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
          onChange: option => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.itemTag = option.value;
            handleChange("returnPrams", returnPramsX);
          },
          values: ""
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Item Class", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
          value: returnPrams?.itemClass,
          onChange: newVal => {
            var returnPramsX = {
              ...returnPrams
            };
            returnPramsX.itemClass = newVal;
            handleChange("returnPrams", returnPramsX);
          }
        })]
      })]
    })]
  });
}

/*wooPrice*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooPrice', 'post-grid/element', PostGridElementOptionswooPrice, 10);
function PostGridElementOptionswooPrice(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Currency Symbole", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.currencySymbole,
        onChange: newVal => {
          handleChange("currencySymbole", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Separator Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.separatorText,
        onChange: newVal => {
          handleChange("separatorText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Preview for?", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.SelectControl, {
        label: "",
        value: selectedElement.options.previewFor,
        options: [{
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
          value: ""
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Simple Product", "post-grid"),
          value: "simple"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Variable Product", "post-grid"),
          value: "variable"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Grouped Product", "post-grid"),
          value: "grouped"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("external Product", "post-grid"),
          value: "external"
        }],
        onChange: newVal => {
          handleChange("previewFor", newVal);
        }
      })]
    })]
  });
}

/*wooSaleBadge*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooSaleBadge', 'post-grid/element', PostGridElementOptionswooSaleBadge, 10);
function PostGridElementOptionswooSaleBadge(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("OnSale Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.onSaleText,
        onChange: newVal => {
          handleChange("onSaleText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    })]
  });
}

/*wooSKU*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooSKU', 'post-grid/element', PostGridElementOptionswooSKU, 10);
function PostGridElementOptionswooSKU(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Dafault SKU Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.dafaultSKUText,
        onChange: newVal => {
          handleChange("dafaultSKUText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    })]
  });
}

/*wooStockQuantity*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooStockQuantity', 'post-grid/element', PostGridElementOptionswooStockQuantity, 10);
function PostGridElementOptionswooStockQuantity(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Dafult Quantity", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.dafultQuantity,
        onChange: newVal => {
          handleChange("dafultQuantity", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    })]
  });
}

/*wooInStock*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooInStock', 'post-grid/element', PostGridElementOptionswooInStock, 10);
function PostGridElementOptionswooInStock(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("In Stock Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.inStockText,
        onChange: newVal => {
          handleChange("inStockText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Out Of Stock Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.outOfStockText,
        onChange: newVal => {
          handleChange("outOfStockText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("BackOrder Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.backOrderText,
        onChange: newVal => {
          handleChange("backOrderText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Preview for?", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.SelectControl, {
        label: "",
        value: selectedElement.options.previewFor,
        options: [{
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid"),
          value: ""
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("In Stock Text", "post-grid"),
          value: "inStockText"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Out Of Stock Text", "post-grid"),
          value: "outOfStockText"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Back Order Text", "post-grid"),
          value: "backOrderText"
        }],
        onChange: newVal => {
          handleChange("previewFor", newVal);
        }
      })]
    })]
  });
}

/*wooTotalSales*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooTotalSales', 'post-grid/element', PostGridElementOptionswooTotalSales, 10);
function PostGridElementOptionswooTotalSales(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Default Sale Count", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.defaultSaleCount,
        onChange: newVal => {
          handleChange("defaultSaleCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    })]
  });
}

/*wooProductRatings*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooProductRatings', 'post-grid/element', PostGridElementOptionswooProductRatings, 10);
function PostGridElementOptionswooProductRatings(html, selectedElement, handleChange) {
  var summaryTypeArgs = {
    pgNone: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("None", "post-grid"),
      value: ""
    },
    pg01: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("123 customer reviews", "post-grid"),
      value: "{review_count} customer reviews"
    },
    pg02: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("4.50/5.00", "post-grid"),
      value: "{average_rating}/5.00",
      isPro: true
    },
    pg03: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("4.50 out of 5.00", "post-grid"),
      value: "{average_rating} out of 5.00",
      isPro: true
    },
    pg04: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("4.50(123 reviews)", "post-grid"),
      value: "{average_rating}({review_count} reviews)",
      isPro: true
    },
    pg05: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom", "post-grid"),
      value: "custom",
      isPro: true
    }
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Default Rating", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.defaultRating,
        onChange: newVal => {
          handleChange("defaultRating", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Idle Icon", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_6__["default"], {
        library: selectedElement.options.iconsIdle.library,
        srcType: selectedElement.options.iconsIdle.srcType,
        iconSrc: selectedElement.options.iconsIdle.iconSrc,
        onChange: arg => {
          handleChange("iconsIdle", {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          });
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Idle Icon", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_6__["default"], {
        library: selectedElement.options.iconsFilled.library,
        srcType: selectedElement.options.iconsFilled.srcType,
        iconSrc: selectedElement.options.iconsFilled.iconSrc,
        onChange: arg => {
          handleChange("iconsFilled", {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          });
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_radio_control__WEBPACK_IMPORTED_MODULE_7__["default"], {
      selected: selectedElement.summaryType,
      options: summaryTypeArgs,
      label: "Summary Type",
      name: "summaryType",
      onChange: option => {
        handleChange("summaryType", option.value);
      }
    }), selectedElement.summaryType == "custom" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
        className: "my-3 relative",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
          htmlFor: "",
          className: "font-medium text-slate-900 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Custom Summary", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
          value: selectedElement.summaryTypeCustom,
          placeholder: "{average_rating} out of 5.00",
          onClick: () => {
            if (isProFeature) {
              setIsVisible(!isVisible);
            }
          },
          disabled: isProFeature ? true : false,
          onChange: newVal => {
            handleChange("summaryTypeCustom", newVal);
          }
        }), isProFeature && isVisible && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("a", {
          href: "https://comboblocks.com/pricing/",
          target: "_blank",
          className: "absolute bottom-2 right-0 bg-gray-700 text-white hover:text-white no-underline px-2 rounded-sm py-1 ",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Subscribe to use", "post-grid")
        })
        // </div>
        ]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("p", {
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Please use following tags:", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("ul", {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("li", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("code", {
            children: "{rating_count}"
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("li", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("code", {
            children: "{review_count}"
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("li", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("code", {
            children: "{average_rating}"
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("li", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("code", {
            children: "{product_title}"
          })
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    })]
  });
}

/*wooAddToCart*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooAddToCart', 'post-grid/element', PostGridElementOptionswooAddToCart, 10);
function PostGridElementOptionswooAddToCart(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Add To Cart Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.addToCartText,
        onChange: newVal => {
          handleChange("addToCartText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Enable Quantity", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
        className: "flex items-center gap-2 py-2",
        help: selectedElement?.options?.quantityEnable ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Disabled.", "post-grid"),
        checked: selectedElement?.options?.quantityEnable ? true : false,
        onChange: newVal => {
          handleChange("quantityEnable", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose Icon", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_icon_picker__WEBPACK_IMPORTED_MODULE_6__["default"], {
        library: selectedElement.options.icon?.library,
        srcType: selectedElement.options.icon?.srcType,
        iconSrc: selectedElement.options.icon?.iconSrc,
        onChange: arg => {
          handleChange("icon", {
            srcType: arg.srcType,
            library: arg.library,
            iconSrc: arg.iconSrc
          });
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Icon position", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.SelectControl, {
        label: "",
        value: selectedElement.options.iconPosition,
        options: [{
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose Position", "post-grid"),
          value: ""
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Before Cart Text", "post-grid"),
          value: "beforeCartText"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("After Cart Text", "post-grid"),
          value: "afterCartText"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Before Prefix", "post-grid"),
          value: "beforePrefix"
        }, {
          label: "After Prefix",
          value: "afterPrefix"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Before Postfix", "post-grid"),
          value: "beforePostfix"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Before Postfix", "post-grid"),
          value: "afterPostfix"
        }],
        onChange: newVal => {
          handleChange("iconPosition", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    })]
  });
}

/*wooCategories*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooCategories', 'post-grid/element', PostGridElementOptionswooCategories, 10);
function PostGridElementOptionswooCategories(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Max Count", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.maxCount,
        onChange: newVal => {
          handleChange("maxCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Separator", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.separator,
        onChange: newVal => {
          handleChange("separator", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
      className: "gap-2 justify-between items-center flex",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
        className: "font-medium text-slate-900",
        children: "Enable Post Count?"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
        className: "flex items-center gap-2 py-2",
        help: selectedElement?.options?.postCount ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Disabled.", "post-grid"),
        checked: selectedElement?.options?.postCount ? true : false,
        onChange: newVal => {
          handleChange("postCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: LinkToArgs,
        buttonTitle: selectedElement?.options?.linkTo == undefined || selectedElement?.options?.linkTo.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo].label,
        onChange: option => {
          handleChange("linkTo", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    })]
  });
}

/*wooTags*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementOptionswooTags', 'post-grid/element', PostGridElementOptionswooTags, 10);
function PostGridElementOptionswooTags(html, selectedElement, handleChange) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Class", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.class,
        onChange: newVal => {
          handleChange("class", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Max Count", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.maxCount,
        onChange: newVal => {
          handleChange("maxCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Separator", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.separator,
        onChange: newVal => {
          handleChange("separator", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div", {
      className: "gap-2 justify-between items-center flex",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("div", {
        className: "font-medium text-slate-900",
        children: "Enable Post Count?"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.ToggleControl, {
        className: "flex items-center gap-2 py-2",
        help: selectedElement?.options?.postCount ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Disabled.", "post-grid"),
        checked: selectedElement?.options?.postCount ? true : false,
        onChange: newVal => {
          handleChange("postCount", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Prefix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.prefixText,
        onChange: newVal => {
          handleChange("prefixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Postfix Text", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.__experimentalInputControl, {
        value: selectedElement?.options?.postfixText,
        onChange: newVal => {
          handleChange("postfixText", newVal);
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link To", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: LinkToArgs,
        buttonTitle: selectedElement?.options?.linkTo == undefined || selectedElement?.options?.linkTo.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : LinkToArgs[selectedElement?.options?.linkTo].label,
        onChange: option => {
          handleChange("linkTo", option.value);
        },
        values: []
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Link Target", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_5__["default"], {
        position: "bottom right",
        options: linkTargetArgs,
        buttonTitle: selectedElement?.options?.target == undefined || selectedElement?.options?.target.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_4__.__)("Choose", "post-grid") : linkTargetArgs[selectedElement?.options?.target].label,
        onChange: option => {
          handleChange("target", option.value);
        },
        values: []
      })]
    })]
  });
}

/***/ }),

/***/ "./src/components/layout-generator/elements-preview.js":
/*!*************************************************************!*\
  !*** ./src/components/layout-generator/elements-preview.js ***!
  \*************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* 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__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





/*postTitle*/

(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostTitle', 'post-grid/element', PostGridElementHtmlPreviewpostTitle, 10);
function PostGridElementHtmlPreviewpostTitle(html, block, setCurretnElement) {
  var options = block.options;
  var target = options.target;
  var linkTo = options.linkTo;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    className: `${block.type}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [linkTo?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      onClick: ev => {
        ev.preventDefault();
      },
      href: "#",
      target: target,
      children: "How to Get the Best Deals on Email Verification Services"
    }), linkTo?.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
      children: "How to Get the Best Deals on Email Verification Services"
    })]
  });
}

/*postId*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostId', 'post-grid/element', PostGridElementHtmlPreviewpostId, 10);
function PostGridElementHtmlPreviewpostId(html, block, setCurretnElement) {
  var options = block.options;
  var target = options.target;
  var linkTo = options.linkTo;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    className: `${block.type}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [linkTo?.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      onClick: ev => {
        ev.preventDefault();
      },
      href: "#",
      target: target,
      children: block.id
    }), linkTo?.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
      children: block.id
    })]
  });
}

/*readMore*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewreadMore', 'post-grid/element', PostGridElementHtmlPreviewreadMore, 10);
function PostGridElementHtmlPreviewreadMore(html, block, setCurretnElement) {
  var options = block.options;
  var target = options.target;
  var readMoreText = options.readMoreText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
    onClick: ev => {
      ev.preventDefault();
    },
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    target: target,
    href: "#",
    children: readMoreText
  });
}
/*customText*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewcustomText', 'post-grid/element', PostGridElementHtmlPreviewcustomText, 10);
function PostGridElementHtmlPreviewcustomText(html, block, setCurretnElement) {
  var options = block.options;
  var tag = options.tag;
  var content = options.content;
  const CustomTagWrapper = `${tag}`;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(CustomTagWrapper, {
    onClick: ev => {
      ev.preventDefault();
    },
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: content
  });
}

/*postExcerpt*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostExcerpt', 'post-grid/element', PostGridElementHtmlPreviewpostExcerpt, 10);
function PostGridElementHtmlPreviewpostExcerpt(html, block, setCurretnElement) {
  var options = block.options;
  var limitBy = options.limitBy;
  var limitCount = options.limitCount;
  var target = options.target;
  var readMoreText = options.readMoreText;
  var excerptText = "In todays digital landscape, email marketing remains one of the most effective ways to engage customers and drive conversions. However, sending emails to invalid or unverified addresses can lead to spam complaints, high bounce rates, and even blacklisting. This not…";
  var count = limitCount > 0 ? limitCount : 999;
  if (limitBy == "character") {
    excerptText = excerptText.substring(0, count);
  } else if (limitBy == "word") {
    setPostExcerptEdited(excerptText = excerptText.split(" ").splice(0, count).join(" "));
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("p", {
      className: "excerpt-text",
      children: excerptText
    }), readMoreText.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      onClick: ev => {
        ev.preventDefault();
      },
      href: "#",
      target: target,
      className: "redmore",
      children: readMoreText
    })]
  });
}

/*postDate*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostDate', 'post-grid/element', PostGridElementHtmlPreviewpostDate, 10);
function PostGridElementHtmlPreviewpostDate(html, block, setCurretnElement) {
  var options = block.options;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var linkTo = options.linkTo;
  var target = options.target;
  var icon = options.icon;
  var iconSrc = icon?.iconSrc;
  var iconHtml = `<span class="${iconSrc}"></span>`;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), linkTo.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      onClick: ev => {
        ev.preventDefault();
      },
      href: "#",
      target: target,
      className: "post-date-label",
      children: "12/05/2025"
    }), linkTo.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "post-date-label",
      children: "12/05/2025"
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*postAuthor*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostAuthor', 'post-grid/element', PostGridElementHtmlPreviewpostAuthor, 10);
function PostGridElementHtmlPreviewpostAuthor(html, block, setCurretnElement) {
  var options = block.options;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var linkTo = options.linkTo;
  var target = options.target;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), linkTo.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      onClick: ev => {
        ev.preventDefault();
      },
      href: "#",
      target: target,
      className: "author-name",
      children: "PickPlugins"
    }), linkTo.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "author-name",
      children: "PickPlugins"
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*postAuthorAvatar*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostAuthorAvatar', 'post-grid/element', PostGridElementHtmlPreviewpostAuthorAvatar, 10);
function PostGridElementHtmlPreviewpostAuthorAvatar(html, block, setCurretnElement) {
  var options = block.options;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var linkTo = options.linkTo;
  var target = options.target;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), linkTo.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("a", {
      onClick: ev => {
        ev.preventDefault();
      },
      href: "#",
      target: target,
      className: "author-link",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("img", {
        className: "avatar",
        src: "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018",
        alt: ""
      })
    }), linkTo.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("img", {
      className: "avatar",
      src: "https://pickplugins.com/wp-content/litespeed/avatar/60b037d2fe05ceb39acb7f02dbd29bd8.jpg?ver=1744938018",
      alt: ""
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*postCategories*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostCategories', 'post-grid/element', PostGridElementHtmlPreviewpostCategories, 10);
function PostGridElementHtmlPreviewpostCategories(html, block, setCurretnElement) {
  var options = block?.options;
  var maxCount = options?.maxCount;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  var target = options?.target;
  var postCount = options?.postCount;
  var separator = options?.separator;
  var categories = [{
    title: 'Category 1',
    count: 123
  }, {
    title: 'Category 2',
    count: 124
  }, {
    title: 'Category 3',
    count: 125
  }, {
    title: 'Category 4',
    count: 126
  }, {
    title: 'Category 5',
    count: 127
  }];
  var MaxCategories = categories.slice(0, maxCount);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "terms-items",
      children: MaxCategories.map((category, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "term-item",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("a", {
            onClick: ev => {
              ev.preventDefault();
            },
            className: "term-link",
            href: "#",
            target: target,
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "term-title",
              children: category.title
            }), postCount && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "post-count",
              children: `(${category.count})`
            })]
          }), MaxCategories.length > index + 1 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: "separator",
            children: separator
          }), "          "]
        });
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*postTags*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostTags', 'post-grid/element', PostGridElementHtmlPreviewpostTags, 10);
function PostGridElementHtmlPreviewpostTags(html, block, setCurretnElement) {
  var options = block?.options;
  var maxCount = options?.maxCount;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  var target = options?.target;
  var postCount = options?.postCount;
  var separator = options?.separator;
  var tags = [{
    title: 'Tag 1',
    count: 123
  }, {
    title: 'Tag 2',
    count: 124
  }, {
    title: 'Tag 3',
    count: 125
  }, {
    title: 'Tag 4',
    count: 126
  }];
  var MaxTags = tags.slice(0, maxCount);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "terms-items",
      children: MaxTags.map((tag, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "term-item",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("a", {
            onClick: ev => {
              ev.preventDefault();
            },
            className: "term-link",
            href: "#",
            target: target,
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "term-title",
              children: tag.title
            }), postCount && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "post-count",
              children: `(${tag.count})`
            })]
          }), MaxTags.length > index + 1 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: "separator",
            children: separator
          })]
        });
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}
/*postMeta*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostMeta', 'post-grid/element', PostGridElementHtmlPreviewpostMeta, 10);
function PostGridElementHtmlPreviewpostMeta(html, block, setCurretnElement) {
  var options = block?.options;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "meta-value",
      children: "Post Meta"
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*commentsCount*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewcommentsCount', 'post-grid/element', PostGridElementHtmlPreviewcommentsCount, 10);
function PostGridElementHtmlPreviewcommentsCount(html, block, setCurretnElement) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: "commentsCount"
  });
}
/*wooProductRatings*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooProductRatings', 'post-grid/element', PostGridElementHtmlPreviewwooProductRatings, 10);
function PostGridElementHtmlPreviewwooProductRatings(html, block, setCurretnElement) {
  var options = block?.options;
  var iconsIdle = options.iconsIdle;
  var iconsFilled = options.iconsFilled;
  var defaultRating = options.defaultRating;
  var summaryType = options.summaryType;
  var summaryTypeCustom = options.summaryTypeCustom;
  var summaryLinkTo = options.summaryLinkTo;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var iconsIdleHtml = `<span class="${iconsIdle.iconSrc}"></span>`;
  var iconsFilledHtml = `<span class="${iconsFilled.iconSrc}"></span>`;
  function replaceAll(str, correction) {
    Object.keys(correction).forEach(key => {
      str = str.replaceAll(key, correction[key]);
    });
    return str;
  }
  var map = {
    "{rating_count}": "",
    "{review_count}": "",
    "{average_rating}": "",
    "{product_title}": ""
  };
  const [ratingMap, setratingMap] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(map);
  var filledValue = parseFloat(defaultRating) * 20 + "%";
  var filledStyles = {
    width: filledValue
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [prefixText.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "icons-wrap",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "icons-idle",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: ``,
          dangerouslySetInnerHTML: {
            __html: iconsIdleHtml
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "icons-filled",
          style: filledStyles,
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: ``,
            dangerouslySetInnerHTML: {
              __html: iconsFilledHtml
            }
          })]
        })]
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "summary",
      children: [summaryType !== "custom" && summaryType !== null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
        children: replaceAll(summaryType, ratingMap)
      }), summaryType == "custom" && summaryTypeCustom.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
        children: replaceAll(summaryTypeCustom, ratingMap)
      })]
    }), postfixText.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*shareButton*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewshareButton', 'post-grid/element', PostGridElementHtmlPreviewshareButton, 10);
function PostGridElementHtmlPreviewshareButton(html, block, setCurretnElement) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: "shareButton"
  });
}

/*postContent*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostContent', 'post-grid/element', PostGridElementHtmlPreviewpostContent, 10);
function PostGridElementHtmlPreviewpostContent(html, block, setCurretnElement) {
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: "Affiliate marketers depend heavily on email marketing to drive sales and connect with leads. However, when email lists are not verified, they can lead to higher bounce rates, spam complaints, and even blacklisting by email providers. This section will introduce\u2026"
  });
}

/*postThumbnail*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewpostThumbnail', 'post-grid/element', PostGridElementHtmlPreviewpostThumbnail, 10);
function PostGridElementHtmlPreviewpostThumbnail(html, block, setCurretnElement) {
  var elementOptions = block.options;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("img", {
      src: elementOptions.defaultSrcUrl,
      alt: ""
    })
  });
}

/*wooPrice*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooPrice', 'post-grid/element', PostGridElementHtmlPreviewwooPrice, 10);
function PostGridElementHtmlPreviewwooPrice(html, block, setCurretnElement) {
  var _options$previewFor;
  var options = block.options;
  var currencySymbole = options.currencySymbole;
  var currencyPosition = options.currencyPosition;
  var separatorText = options.separatorText;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var previewFor = (_options$previewFor = options.previewFor) !== null && _options$previewFor !== void 0 ? _options$previewFor : 'simple';
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    className: `${block.type}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), previewFor == 'simple' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "regular",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "currency",
          children: currencySymbole
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "price-value",
          children: "123"
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "sale-price",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "currency",
          children: currencySymbole
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "price-value",
          children: "250"
        })]
      })]
    }), previewFor == 'variable' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "regular",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "currency",
          children: currencySymbole
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "price-value",
          children: "123"
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "separator",
        children: separatorText
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "sale-price",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "currency",
          children: currencySymbole
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "price-value",
          children: "250"
        })]
      })]
    }), previewFor == 'grouped' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "regular",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "currency",
          children: currencySymbole
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "price-value",
          children: "123"
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "separator",
        children: separatorText
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "sale-price",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "currency",
          children: currencySymbole
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "price-value",
          children: "250"
        })]
      })]
    }), previewFor == 'external' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooSaleBadge*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooSaleBadge', 'post-grid/element', PostGridElementHtmlPreviewwooSaleBadge, 10);
function PostGridElementHtmlPreviewwooSaleBadge(html, block, setCurretnElement) {
  var options = block.options;
  var onSaleText = options.onSaleText;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    className: `${block.type}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "on-sale-badge",
      children: onSaleText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooSKU*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooSKU', 'post-grid/element', PostGridElementHtmlPreviewwooSKU, 10);
function PostGridElementHtmlPreviewwooSKU(html, block, setCurretnElement) {
  var options = block.options;
  var dafaultSKUText = options.dafaultSKUText;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    className: `${block.type}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "sku",
      children: dafaultSKUText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooStockQuantity*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooStockQuantity', 'post-grid/element', PostGridElementHtmlPreviewwooStockQuantity, 10);
function PostGridElementHtmlPreviewwooStockQuantity(html, block, setCurretnElement) {
  var options = block.options;
  var dafultQuantity = options.dafultQuantity;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    className: `${block.type}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "stock-quantity",
      children: dafultQuantity
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooInStock*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooInStock', 'post-grid/element', PostGridElementHtmlPreviewwooInStock, 10);
function PostGridElementHtmlPreviewwooInStock(html, block, setCurretnElement) {
  var _options$previewFor2;
  var options = block.options;
  var inStockText = options.inStockText;
  var outOfStockText = options.outOfStockText;
  var backOrderText = options.backOrderText;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var previewFor = (_options$previewFor2 = options.previewFor) !== null && _options$previewFor2 !== void 0 ? _options$previewFor2 : 'inStockText';
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    className: `${block.type}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), previewFor == 'inStockText' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "instock",
      children: inStockText
    }), previewFor == 'outOfStockText' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "outofstock",
      children: outOfStockText
    }), previewFor == 'backOrderText' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "onbackorder",
      children: backOrderText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooTotalSales*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooTotalSales', 'post-grid/element', PostGridElementHtmlPreviewwooTotalSales, 10);
function PostGridElementHtmlPreviewwooTotalSales(html, block, setCurretnElement) {
  var options = block.options;
  var defaultSaleCount = options.defaultSaleCount;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    className: `${block.type}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "sale-count",
      children: defaultSaleCount
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooAddToCart*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooAddToCart', 'post-grid/element', PostGridElementHtmlPreviewwooAddToCart, 10);
function PostGridElementHtmlPreviewwooAddToCart(html, block, setCurretnElement) {
  var options = block.options;
  var addToCartText = options.addToCartText;
  var quantityEnable = options.quantityEnable;
  var icon = options.icon;
  var iconPosition = options.iconPosition;
  var prefixText = options.prefixText;
  var postfixText = options.postfixText;
  var iconSrc = icon?.iconSrc;
  var iconHtml = `<span class="${iconSrc}"></span>`;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    className: `${block.type}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [iconPosition == "beforePrefix" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), iconPosition == "afterPrefix" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("a", {
      className: "cartBtn",
      onClick: ev => {
        ev.preventDefault();
      },
      href: "?add-to-cart=1399",
      "data-quantity": "1",
      "data-product_id": "1399",
      "data-product_sku": "woo-polo",
      "aria-label": "Add \u201CPolo\u201D to your cart",
      "aria-describedby": "",
      rel: "nofollow",
      children: [iconPosition == "beforeCartText" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "icon-wrap",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      }), addToCartText, iconPosition == "afterCartText" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "icon-wrap",
        dangerouslySetInnerHTML: {
          __html: iconHtml
        }
      })]
    }), quantityEnable && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "quantityWrap",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "quantityIncrease",
        children: "+"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", {
        size: "3",
        type: "text",
        inputMode: "numeric",
        className: "quantityInput",
        placeholder: "1",
        value: '3'
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "quantityDecrease",
        children: "-"
      })]
    }), iconPosition == "beforePostfix" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    }), iconPosition == "afterPostfix" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
      className: `icon-wrap`,
      dangerouslySetInnerHTML: {
        __html: iconHtml
      }
    })]
  });
}

/*wooCategories*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooCategories', 'post-grid/element', PostGridElementHtmlPreviewwooCategories, 10);
function PostGridElementHtmlPreviewwooCategories(html, block, setCurretnElement) {
  var options = block?.options;
  var maxCount = options?.maxCount;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  var target = options?.target;
  var postCount = options?.postCount;
  var separator = options?.separator;
  var categories = [{
    title: 'Category 1',
    count: 123
  }, {
    title: 'Category 2',
    count: 124
  }, {
    title: 'Category 3',
    count: 125
  }, {
    title: 'Category 4',
    count: 126
  }, {
    title: 'Category 5',
    count: 127
  }];
  var MaxCategories = categories.slice(0, maxCount);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "terms-items",
      children: MaxCategories.map((category, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "term-item",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("a", {
            onClick: ev => {
              ev.preventDefault();
            },
            className: "term-link",
            href: "#",
            target: target,
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "term-title",
              children: category.title
            }), postCount && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "post-count",
              children: `(${category.count})`
            })]
          }), MaxCategories.length > index + 1 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: "separator",
            children: separator
          }), "          "]
        });
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/*wooTags*/
(0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.addFilter)('PostGridElementHtmlPreviewwooTags', 'post-grid/element', PostGridElementHtmlPreviewwooTags, 10);
function PostGridElementHtmlPreviewwooTags(html, block, setCurretnElement) {
  var options = block?.options;
  var maxCount = options?.maxCount;
  var prefixText = options?.prefixText;
  var postfixText = options?.postfixText;
  var target = options?.target;
  var postCount = options?.postCount;
  var separator = options?.separator;
  var tags = [{
    title: 'Tag 1',
    count: 123
  }, {
    title: 'Tag 2',
    count: 124
  }, {
    title: 'Tag 3',
    count: 125
  }, {
    title: 'Tag 4',
    count: 126
  }];
  var MaxTags = tags.slice(0, maxCount);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    id: `element-${block.id}`,
    onClick: ev => {
      setCurretnElement(block.id);
    },
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "prefix",
      children: prefixText
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "terms-items",
      children: MaxTags.map((tag, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "term-item",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("a", {
            onClick: ev => {
              ev.preventDefault();
            },
            className: "term-link",
            href: "#",
            target: target,
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "term-title",
              children: tag.title
            }), postCount && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
              className: "post-count",
              children: `(${tag.count})`
            })]
          }), MaxTags.length > index + 1 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
            className: "separator",
            children: separator
          })]
        });
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "postfix",
      children: postfixText
    })]
  });
}

/***/ }),

/***/ "./src/components/layout-generator/elements.js":
/*!*****************************************************!*\
  !*** ./src/components/layout-generator/elements.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__);


var elements = {
  postTitle: {
    type: "postTitle",
    label: "Post Title",
    placeholder: "New Study Reveals Top 5 Marketing Tactics Fueling Brand Growth in 2025",
    options: {
      linkTo: '',
      target: ''
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Post Title Wrapper',
        styles: {
          "fontSize": {
            "Desktop": "16px"
          }
        }
      },
      a: {
        handle: "a",
        label: 'Post Title Link',
        styles: {}
      }
    },
    category: ['general']
  },
  postExcerpt: {
    type: "postExcerpt",
    label: "Post Excerpt",
    placeholder: "A recent industry report has uncovered the five most effective marketing strategies driving exponential brand growth this year. Experts say these tactics, including AI-powered personalization and micro-influencer partnerships, are reshaping how companies connect with consumers. Marketers are urged to adapt quickly or risk falling behind.",
    options: {
      limitBy: "",
      limitCount: 20,
      readMoreText: "Read More",
      target: ""
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Excerpt Wrapper',
        styles: {}
      },
      'excerpt-text': {
        handle: ".excerpt-text",
        label: 'Excerpt Text',
        styles: {
          "fontSize": {
            "Desktop": "16px"
          }
        }
      },
      redmore: {
        handle: ".redmore",
        label: 'Redmore Text',
        styles: {
          "fontSize": {
            "Desktop": "18px"
          }
        }
      }
    },
    category: ['general']
  },
  postDate: {
    type: "postDate",
    label: "Post Date",
    placeholder: "12/05/2025",
    options: {
      prefixText: 'Post Date: ',
      postfixText: "",
      format: "",
      linkTo: 'postUrl',
      target: '_blank',
      icon: {
        library: "fontAwesome",
        srcType: "class",
        iconSrc: ""
      }
    },
    category: ['general'],
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Post Author Wrapper',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'postfix',
        styles: {}
      }
    }
  },
  postAuthor: {
    type: "postAuthor",
    label: "Post Author",
    options: {
      prefixText: 'Author: ',
      postfixText: "",
      linkTo: 'postUrl',
      target: '_blank'
    },
    category: ['general'],
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Post Author Wrapper',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'postfix',
        styles: {}
      }
    }
  },
  postAuthorAvatar: {
    type: "postAuthorAvatar",
    label: "Post Author Avatar",
    options: {
      prefixText: 'Author: ',
      postfixText: "",
      linkTo: 'postUrl',
      target: '_blank'
    },
    category: ['general'],
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Post Author Wrapper',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          },
          "alignItems": {
            "Desktop": "center"
          }
        }
      },
      'avatar': {
        handle: ".avatar",
        label: 'Prefix',
        styles: {
          "width": {
            "Desktop": "50px"
          },
          "borderRadius": {
            "Desktop": "4px 4px 4px 4px"
          }
        }
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'postfix',
        styles: {}
      }
    }
  },
  postCategories: {
    type: "postCategories",
    label: "Post Categories",
    placeholder: "Morgan Tate",
    category: ['general'],
    options: {
      maxCount: 3,
      postCount: false,
      separator: ', ',
      prefixText: 'Categories: ',
      postfixText: "",
      linkTo: 'postUrl',
      target: '_blank'
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Post Categories Wrapper',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      items: {
        handle: ".terms-items",
        label: 'Items Wrap',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      item: {
        handle: ".term-item",
        label: 'Item Wrap',
        styles: {}
      },
      'term-link': {
        handle: ".term-link",
        label: 'Term Link',
        styles: {}
      },
      'term-title': {
        handle: ".term-title",
        label: 'Term Title',
        styles: {}
      },
      'post-count': {
        handle: ".post-count",
        label: 'Post Count',
        styles: {}
      },
      separator: {
        handle: ".separator",
        label: 'Separator',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'postfix',
        styles: {}
      }
    }
  },
  postTags: {
    type: "postTags",
    label: "Post Tags",
    placeholder: "Morgan Tate",
    category: ['general'],
    options: {
      maxCount: 3,
      postCount: false,
      separator: ', ',
      prefixText: 'Tags: ',
      postfixText: "",
      linkTo: 'postUrl',
      target: '_blank'
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Post Tags Wrapper',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      items: {
        handle: ".terms-items",
        label: 'Items Wrap',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      item: {
        handle: ".term-item",
        label: 'Item Wrap',
        styles: {}
      },
      'term-link': {
        handle: ".term-link",
        label: 'Term Link',
        styles: {}
      },
      'term-title': {
        handle: ".term-title",
        label: 'Term Title',
        styles: {}
      },
      'post-count': {
        handle: ".post-count",
        label: 'Post Count',
        styles: {}
      },
      separator: {
        handle: ".separator",
        label: 'Separator',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'postfix',
        styles: {}
      }
    }
  },
  postTerms: {
    type: "postTerms",
    label: "Post Terms",
    placeholder: "Morgan Tate",
    isPro: true,
    category: ['general'],
    options: {
      maxCount: 3,
      postCount: false,
      separator: ', ',
      prefixText: 'Categories: ',
      postfixText: "",
      linkTo: 'postUrl',
      target: '_blank'
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Post Categories Wrapper',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      items: {
        handle: ".terms-items",
        label: 'Items Wrap',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      item: {
        handle: ".term-item",
        label: 'Item Wrap',
        styles: {}
      },
      'term-link': {
        handle: ".term-link",
        label: 'Term Link',
        styles: {}
      },
      'term-title': {
        handle: ".term-title",
        label: 'Term Title',
        styles: {}
      },
      'post-count': {
        handle: ".post-count",
        label: 'Post Count',
        styles: {}
      },
      separator: {
        handle: ".separator",
        label: 'Separator',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'postfix',
        styles: {}
      }
    }
  },
  postMeta: {
    type: "postMeta",
    label: "Post Meta",
    isPro: true,
    category: ['general'],
    options: {
      class: "",
      wrapperTag: "div",
      metaKey: "",
      callback: "",
      returnPrams: [],
      customFieldSrc: "acf",
      prefixText: '',
      postfixText: ""
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Wrapper',
        styles: {}
      },
      item: {
        handle: ".item",
        label: 'Item Wrap',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'postfix',
        styles: {}
      }
    }
  },
  wooPrice: {
    type: "wooPrice",
    label: "Product Price",
    isPro: true,
    options: {
      currencySymbole: "$",
      currencyPosition: "",
      separatorText: '-',
      prefixText: '',
      postfixText: ''
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Wrapper',
        styles: {}
      },
      currency: {
        handle: ".currency",
        label: 'Currency',
        styles: {}
      },
      regular: {
        handle: ".regular",
        label: 'Regular Price',
        styles: {}
      },
      'sale-price': {
        handle: ".sale-price",
        label: 'Sale Price',
        styles: {}
      },
      separator: {
        handle: ".separator",
        label: 'Separator',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'Postfix',
        styles: {}
      }
    },
    category: ['wooCommerce']
  },
  wooAddToCart: {
    type: "wooAddToCart",
    label: "Add To Cart Button",
    isPro: true,
    options: {
      addToCartText: 'Add To Cart',
      quantityEnable: false,
      prefixText: '',
      postfixText: '',
      iconPosition: '',
      icon: {
        library: "fontAwesome",
        srcType: "class",
        iconSrc: ""
      }
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Wrapper',
        styles: {}
      },
      viewCartLink: {
        handle: ".viewCartLink",
        label: 'viewCartLink',
        styles: {}
      },
      'cart-button': {
        handle: ".cart-button",
        label: 'Cart Btn',
        styles: {}
      },
      quantityWrap: {
        handle: ".quantityWrap",
        label: 'Quantity Wrap',
        styles: {}
      },
      quantityInput: {
        handle: ".quantityInput",
        label: 'Quantity Input',
        styles: {}
      },
      quantityIncrease: {
        handle: ".quantityIncrease",
        label: 'Quantity Increase',
        styles: {}
      },
      quantityDecrease: {
        handle: ".quantityDecrease",
        label: 'Quantity Decrease',
        styles: {}
      },
      'icon-wrap': {
        handle: ".icon-wrap",
        label: 'Icon wrap',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'Postfix',
        styles: {}
      }
    },
    category: ['wooCommerce']
  },
  wooSaleBadge: {
    type: "wooSaleBadge",
    label: "Product Sale Badge",
    isPro: true,
    options: {
      onSaleText: 'On Sale',
      prefixText: '',
      postfixText: ''
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Wrapper',
        styles: {}
      },
      'on-sale-badge': {
        handle: ".on-sale-badge",
        label: 'On Sale',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'Postfix',
        styles: {}
      }
    },
    category: ['wooCommerce']
  },
  wooTotalSales: {
    type: "wooTotalSales",
    label: "Total Sales",
    isPro: true,
    options: {
      defaultSaleCount: '123',
      prefixText: '',
      postfixText: ''
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Wrapper',
        styles: {}
      },
      'sale-count': {
        handle: ".sale-count",
        label: 'Sale Count',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'Postfix',
        styles: {}
      }
    },
    category: ['wooCommerce']
  },
  wooSKU: {
    type: "wooSKU",
    label: "Product SKU",
    isPro: true,
    options: {
      dafaultSKUText: 'T-SHIRT-XL',
      prefixText: '',
      postfixText: ''
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Wrapper',
        styles: {}
      },
      sku: {
        handle: ".sku",
        label: 'SKU Text',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'Postfix',
        styles: {}
      }
    },
    category: ['wooCommerce']
  },
  wooStockQuantity: {
    type: "wooStockQuantity",
    label: "Product Stock Quantity",
    isPro: true,
    options: {
      dafultQuantity: '1',
      prefixText: '',
      postfixText: ''
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Wrapper',
        styles: {}
      },
      'stock-quantity': {
        handle: ".stock-quantity",
        label: 'Stock Quantity',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'Postfix',
        styles: {}
      }
    },
    category: ['wooCommerce']
  },
  wooInStock: {
    type: "wooInStock",
    label: "Product In Stock",
    isPro: true,
    options: {
      "inStockText": "In Stock",
      "outOfStockText": "Out of Stock",
      "backOrderText": "Backorder Enabled",
      prefixText: '',
      postfixText: ''
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Wrapper',
        styles: {}
      },
      inStockText: {
        handle: ".instock",
        label: 'In Stock Text',
        styles: {}
      },
      outOfStockText: {
        handle: ".outofstock",
        label: 'Out Of Stock Text',
        styles: {}
      },
      backOrderText: {
        handle: ".onbackorder",
        label: 'BackOrder Text',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'Postfix',
        styles: {}
      }
    },
    category: ['wooCommerce']
  },
  wooProductRatings: {
    type: "wooProductRatings",
    label: "Product Ratings",
    isPro: true,
    options: {
      iconsIdle: {
        library: "fontAwesome",
        srcType: "class",
        iconSrc: ""
      },
      iconsFilled: {
        library: "fontAwesome",
        srcType: "class",
        iconSrc: ""
      },
      defaultRating: '4.5',
      summaryType: '',
      summaryTypeCustom: '',
      summaryLinkTo: '',
      prefixText: '',
      postfixText: ''
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Wrapper',
        styles: {}
      },
      iconsWrap: {
        handle: ".icons-wrap",
        label: 'Icons Wrap',
        styles: {}
      },
      iconsIdle: {
        handle: ".icons-idle",
        label: 'Icons Idle',
        styles: {}
      },
      iconsFilled: {
        handle: ".icons-filled",
        label: 'Icons Filled',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'Postfix',
        styles: {}
      }
    },
    category: ['wooCommerce']
  },
  wooCategories: {
    type: "wooCategories",
    label: "Product Categories",
    placeholder: "Morgan Tate",
    isPro: true,
    category: ['wooCommerce'],
    options: {
      maxCount: 3,
      postCount: false,
      separator: ', ',
      prefixText: 'Categories: ',
      postfixText: "",
      linkTo: 'postUrl',
      target: '_blank'
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Post Categories Wrapper',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      items: {
        handle: ".terms-items",
        label: 'Items Wrap',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      item: {
        handle: ".term-item",
        label: 'Item Wrap',
        styles: {}
      },
      'term-link': {
        handle: ".term-link",
        label: 'Term Link',
        styles: {}
      },
      'term-title': {
        handle: ".term-title",
        label: 'Term Title',
        styles: {}
      },
      'post-count': {
        handle: ".post-count",
        label: 'Post Count',
        styles: {}
      },
      separator: {
        handle: ".separator",
        label: 'Separator',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'postfix',
        styles: {}
      }
    }
  },
  wooTags: {
    type: "wooTags",
    label: "Product Tags",
    placeholder: "Morgan Tate",
    isPro: true,
    category: ['wooCommerce'],
    options: {
      maxCount: 3,
      postCount: false,
      separator: ', ',
      prefixText: 'Tags: ',
      postfixText: "",
      linkTo: 'postUrl',
      target: '_blank'
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Post Tags Wrapper',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      items: {
        handle: ".terms-items",
        label: 'Items Wrap',
        styles: {
          "display": {
            "Desktop": "flex"
          },
          "gap": {
            "Desktop": "1em"
          },
          "justifyContent": {
            "Desktop": "start"
          }
        }
      },
      item: {
        handle: ".term-item",
        label: 'Item Wrap',
        styles: {}
      },
      'term-link': {
        handle: ".term-link",
        label: 'Term Link',
        styles: {}
      },
      'term-title': {
        handle: ".term-title",
        label: 'Term Title',
        styles: {}
      },
      'post-count': {
        handle: ".post-count",
        label: 'Post Count',
        styles: {}
      },
      separator: {
        handle: ".separator",
        label: 'Separator',
        styles: {}
      },
      prefix: {
        handle: ".prefix",
        label: 'Prefix',
        styles: {}
      },
      postfix: {
        handle: ".postfix",
        label: 'postfix',
        styles: {}
      }
    }
  },
  readMore: {
    type: "readMore",
    label: "Read More",
    options: {
      readMoreText: 'Read More',
      linkTo: 'postUrl',
      target: '_blank'
    },
    category: ['general'],
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'ReadMore',
        styles: {}
      }
    }
  },
  postThumbnail: {
    type: "postThumbnail",
    label: "Post Thumbnail",
    category: ['general'],
    options: {
      thumbnailSize: "full",
      defaultSrcId: "",
      defaultSrcUrl: '',
      linkTo: 'postUrl'
    },
    styles: {
      width: {
        Desktop: "100px"
      },
      height: {
        Desktop: "auto"
      }
    },
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Featured Image Wrapper',
        styles: {}
      },
      img: {
        handle: "img",
        label: 'Image',
        styles: {
          "width": {
            "Desktop": "100%"
          }
        }
      },
      a: {
        handle: "a",
        label: 'Link',
        styles: {}
      }
    }
  },
  // postId: {
  //   type: "postId",
  //   label: "Post Id",
  //   options: { prefix: "" },
  //   category: ['general'],
  // },
  // postMeta: {
  //   type: "postMeta",
  //   label: "postMeta",
  //   options: { metaKey: '', format: '', callback: null },

  // },
  customText: {
    type: "customText",
    label: "Custom Text",
    options: {
      content: "",
      customTag: "div"
    },
    category: ['general'],
    cssSelectors: {
      wrapper: {
        handle: "",
        label: 'Custom Text',
        styles: {}
      }
    }
  },
  // productPrice: {
  //   type: "productPrice",
  //   label: "Product Price",
  //   options: { prefix: "" },
  //   
  // },
  // productSaleCount: {
  //   type: "productSaleCount",
  //   label: "Product Sale Count",
  //   options: { prefix: "" },
  //   
  // },
  // productSaleBadge: {
  //   type: "productSaleBadge",
  //   label: "Product Sale Badge",
  //   options: { prefix: "" },
  //   
  // },
  // productFeaturedBadge: {
  //   type: "productFeaturedBadge",
  //   label: "Product Featured Badge",
  //   options: { prefix: "" },
  //   
  // },
  // productOnsaleBadge: {
  //   type: "productOnsaleBadge",
  //   label: "Product On-sale Badge",
  //   options: { prefix: "" },
  //   
  // },
  // productAddToCart: {
  //   type: "productAddToCart",
  //   label: "Product Add To Cart",
  //   options: {},
  //   
  // },
  // productRating: {
  //   type: "productRating",
  //   label: "Product Price",
  //   options: { prefix: "" },
  //   
  // },

  // postTaxonomies: {
  //   type: "postTaxonomies",
  //   label: "Post Taxonomies",
  //   options: { taxonomy: "", maxCount: "", separator: "" },
  //   
  // },

  // termTitle: {
  //   type: "termTitle",
  //   label: "termTitle",
  //   options: { linkTo: "" },
  //   
  // },
  // termDescription: {
  //   type: "termDescription",
  //   label: "termDescription",
  //   options: {},
  //   
  // },
  // termThumbnail: {
  //   type: "termThumbnail",
  //   label: "termThumbnail",
  //   options: { size: "" },
  //   
  // },
  // termPostCount: {
  //   type: "termPostCount",
  //   label: "termPostCount",
  //   options: { prefix: "" },
  //   
  // },
  // termSlug: {
  //   type: "termSlug",
  //   label: "termSlug",
  //   options: { prefix: "" },
  //   
  // },

  container: {
    type: "container",
    label: "Container",
    children: [],
    options: {
      animateOn: {}
    },
    category: ['general'],
    cssSelectors: {
      "wrapper": {
        handle: "",
        label: 'Container Wrapper',
        styles: {}
      }
    }
  },
  layer: {
    type: "layer",
    label: "Layer",
    children: [],
    options: {
      animateOn: {}
    },
    category: ['general'],
    cssSelectors: {
      "wrapper": {
        handle: "",
        label: 'Layer Wrapper',
        styles: {}
      }
    }
  },
  root: {
    type: "root",
    label: "Root",
    hidden: true,
    children: []
    // category: ['general']
  }
};
elements = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__.applyFilters)('PostGridBuilderElements', elements);
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (elements);

/***/ }),

/***/ "./src/components/layout-generator/index.js":
/*!**************************************************!*\
  !*** ./src/components/layout-generator/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": () => (/* binding */ LayoutGenerator)
/* 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__);
/* 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_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_icons__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/columns.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/brush.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react__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 _components_animate_on__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/animate-on */ "./src/components/animate-on/index.js");
/* harmony import */ var _components_tabs__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/tabs */ "./src/components/tabs/index.js");
/* harmony import */ var _components_tab__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components/tab */ "./src/components/tab/index.js");
/* harmony import */ var _dropdown__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _styles__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../styles */ "./src/components/styles/index.js");
/* harmony import */ var _TreeView__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./TreeView */ "./src/components/layout-generator/TreeView.jsx");
/* harmony import */ var _elements__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./elements */ "./src/components/layout-generator/elements.js");
/* harmony import */ var _elements_preview__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./elements-preview */ "./src/components/layout-generator/elements-preview.js");
/* harmony import */ var _elements_options__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./elements-options */ "./src/components/layout-generator/elements-options.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__);
const {
  Component,
  useEffect
} = wp.element;
















const sortableOptions = {
  animation: 150,
  fallbackOnBody: true,
  swapThreshold: 0.65,
  group: "nested"
};
const parentSortableOptions = {
  animation: 150,
  fallbackOnBody: true,
  swapThreshold: 0.65,
  group: "parent-group" // Unique group for parent
};
const childSortableOptions = {
  animation: 150,
  // Keep desired shared options
  fallbackOnBody: true,
  dragoverBubble: true,
  swapThreshold: 0.65,
  group: "child-group",
  // Different group from parent
  ghostClass: 'sortable-ghost',
  dragClass: "sortable-drag" // Class name for the dragging item
};
function ElementOthers({
  block,
  handleBlockUpdate,
  onTemplateDrop,
  draggedTemplate,
  setCurretnElement,
  setactiveTab
}) {
  var html = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__.applyFilters)("PostGridElementHtmlPreview" + block.type, '', block, setCurretnElement);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
    children: [block.type != "root" && block.type != "container" && block.type != "layer" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
      children: html
    }), block.type === "container" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(ElementContainer, {
      block: block,
      handleBlockUpdate: handleBlockUpdate,
      onTemplateDrop: onTemplateDrop,
      draggedTemplate: draggedTemplate,
      setCurretnElement: setCurretnElement,
      setactiveTab: setactiveTab
    }), block.type === "layer" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(ElementLayer, {
      block: block,
      handleBlockUpdate: handleBlockUpdate,
      onTemplateDrop: onTemplateDrop,
      draggedTemplate: draggedTemplate,
      setCurretnElement: setCurretnElement,
      setactiveTab: setactiveTab
    }), block.type === "root" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(ElementRoot, {
      block: block,
      handleBlockUpdate: handleBlockUpdate,
      onTemplateDrop: onTemplateDrop,
      draggedTemplate: draggedTemplate,
      setCurretnElement: setCurretnElement,
      setactiveTab: setactiveTab
    })]
  });
}
function ElementContainer({
  block,
  handleBlockUpdate,
  onTemplateDrop,
  draggedTemplate,
  setCurretnElement,
  setactiveTab
}) {
  const [isDragging, setIsDragging] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(false);
  const handleDrop = e => {
    e.preventDefault();
    e.stopPropagation();
    if (draggedTemplate) {
      onTemplateDrop(draggedTemplate, block.id);
    }
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
    style: {
      display: "block"
    },
    onDragOver: e => e.preventDefault(),
    onDrop: handleDrop,
    id: `element-${block.id}`,
    className: `container ${isDragging ? "drag-over" : ""}`,
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__.ReactSortable, {
      tag: react__WEBPACK_IMPORTED_MODULE_3__.Fragment,
      list: block.children || [],
      setList: newState => handleBlockUpdate(newState, block.id),
      ...childSortableOptions,
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
        children: block.children.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
          className: "text-center text-xl min-h-40 flex align-middle items-center justify-center",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
            children: "+"
          })
        })
      }), block.children?.map(child => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(ElementOthers, {
        block: child,
        handleBlockUpdate: handleBlockUpdate,
        onTemplateDrop: onTemplateDrop,
        draggedTemplate: draggedTemplate,
        setCurretnElement: setCurretnElement,
        setactiveTab: setactiveTab
      }, child.id))]
    })
  });
}
function ElementLayer({
  block,
  handleBlockUpdate,
  onTemplateDrop,
  draggedTemplate,
  setCurretnElement,
  setactiveTab
}) {
  const [isDragging, setIsDragging] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(false);
  const [dragging, setDragging] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(false);
  const handleDrop = e => {
    e.preventDefault();
    e.stopPropagation();
    if (draggedTemplate) {
      onTemplateDrop(draggedTemplate, block.id);
    }
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
    id: `element-${block.id}`,
    className: `layer ${isDragging ? "drag-over" : ""} border border-dashed border-gray-400`,
    onDragOver: e => e.preventDefault(),
    onDrop: handleDrop,
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__.ReactSortable, {
      tag: react__WEBPACK_IMPORTED_MODULE_3__.Fragment,
      list: block.children || [],
      setList: newState => handleBlockUpdate(newState, block.id),
      ...childSortableOptions,
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
        children: block.children.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
          className: "text-center text-xl min-h-40 flex align-middle items-center justify-center",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
            children: "+"
          })
        })
      }), block.children?.map(child => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(ElementOthers, {
        block: child,
        handleBlockUpdate: handleBlockUpdate,
        onTemplateDrop: onTemplateDrop,
        draggedTemplate: draggedTemplate,
        setCurretnElement: setCurretnElement,
        setactiveTab: setactiveTab
      }, child.id))]
    })
  });
}
function ElementRoot({
  block,
  handleBlockUpdate,
  onTemplateDrop,
  draggedTemplate,
  setCurretnElement,
  setactiveTab
}) {
  const handleDrop = e => {
    e.preventDefault();
    e.stopPropagation();
    if (draggedTemplate) {
      onTemplateDrop(draggedTemplate, block.id);
    }
  };
  const [isDragging, setIsDragging] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
    onStart: () => setIsDragging(true),
    onEnd: () => setIsDragging(false)
    // Directly map child elements to avoid extra div
    ,
    className: `root border border-dashed border-gray-400 relative ${isDragging ? "drag-over" : ""}`,
    id: `element-${block.id}`,
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__.ReactSortable, {
      tag: react__WEBPACK_IMPORTED_MODULE_3__.Fragment,
      list: block.children || [],
      setList: newState => handleBlockUpdate(newState, block.id),
      ...childSortableOptions,
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
        children: block.children.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
          className: "text-center text-xl min-h-40 flex align-middle items-center justify-center",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
            children: "+"
          })
        })
      }), block.children?.map(child => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(ElementOthers, {
        block: child,
        handleBlockUpdate: handleBlockUpdate,
        onTemplateDrop: onTemplateDrop,
        draggedTemplate: draggedTemplate,
        setCurretnElement: setCurretnElement,
        setactiveTab: setactiveTab
      }, child.id))]
    })
  });
}
function LayoutGenerator({
  onChange,
  customerData,
  addNotifications,
  layouts,
  postData
}) {
  var [postId, setpostId] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(postData.ID);
  var isProcustomer = customerData?.isPro;
  var defaultLayoutElements = [{
    id: 1,
    type: "root",
    children: [],
    parent_id: null
  }];
  const [blocks, setBlocks] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(layouts.length == 0 ? defaultLayoutElements : layouts);
  const [activeTab, setactiveTab] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)("elements");
  useEffect(() => {
    onChange(blocks);
  }, [blocks]);
  const [selectedElement, setselectedElement] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(null);
  const [selectedElementId, setselectedElementId] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(null);
  const [draggedTemplate, setDraggedTemplate] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(null);
  useEffect(() => {
    const traverse = items => {
      const result = [];
      for (const item of items) {
        if (item.id === selectedElementId) {
          //removedItem = { ...selectedElement }; // Found the item, don't include it
          result.push(selectedElement);
        } else {
          const newItem = {
            ...item
          };
          if (newItem.children) {
            newItem.children = traverse(newItem.children);
          }
          result.push(newItem);
        }
      }
      return result;
    };
    const newBlocks = traverse(blocks);
    onChange(newBlocks);
    setBlocks(newBlocks);
  }, [selectedElement]);
  const setCurretnElement = (id = null) => {
    setselectedElementId(id);
    //findSelectedElement(blocks, id);

    const element = findElementById(blocks, id);
    setselectedElement(element);
    setactiveTab("edit");
  };
  const generatingUniqueId = () => {
    const ids = [];
    const collectIds = items => {
      items.forEach(item => {
        ids.push(item.id);
        if (item.children) collectIds(item.children);
      });
    };
    collectIds(blocks);
    return ids.length > 0 ? Math.max(...ids) + 1 : 1;
  };
  const handleTemplateAdd = (template, parentId = null) => {
    const newItem = {
      id: generatingUniqueId(),
      type: template.type,
      parent_id: parentId,
      options: template.options,
      styles: template.styles,
      children: template.children ? [] : undefined,
      cssSelectors: template.cssSelectors ? template.cssSelectors : null
    };
    var isPro = template?.isPro;
    if (!isProcustomer) {
      if (isPro) {
        addNotifications({
          title: "Opps its pro!",
          content: "Sorry this elemet is avilable in pro.",
          type: "error"
        });
        return;
      }
    }

    // if (isPro)
    // 	console.log(template);

    setBlocks(prev => {
      const addToParent = items => items.map(item => {
        if (item.id === parentId) {
          return {
            ...item,
            children: [...(item.children || []), newItem]
          };
        }
        if (item.children) {
          return {
            ...item,
            children: addToParent(item.children)
          };
        }
        return item;
      });
      return parentId === null ? [...prev, newItem] : addToParent(prev);
    });
  };
  const findAndRemoveItem = (blocks, id) => {
    let removedItem = null;
    const traverse = items => {
      const result = [];
      for (const item of items) {
        if (item.id === id) {
          removedItem = {
            ...item
          }; // Found the item, don't include it
        } else {
          const newItem = {
            ...item
          };
          if (newItem.children) {
            newItem.children = traverse(newItem.children);
          }
          result.push(newItem);
        }
      }
      return result;
    };
    const newBlocks = traverse(blocks);
    return {
      newBlocks,
      removedItem
    };
  };
  function findElementById(tree, id) {
    for (const node of tree) {
      if (node.id === id) return node;
      if (node.children) {
        const result = findElementById(node.children, id);
        if (result) return result;
      }
    }
    return null;
  }
  const handleBlockUpdate = (updatedList, parentId = null) => {
    setBlocks(prevBlocks => {
      let newBlocks = [...prevBlocks];
      updatedList = updatedList.map(item => {
        // If the item exists elsewhere in the tree, remove it first
        const searchResult = findAndRemoveItem(newBlocks, item.id);

        // if (searchResult.removedItem) {
        // 	newBlocks = searchResult.newBlocks;
        // 	// Preserve the original item's properties while updating parent_id
        // 	return {
        // 		...searchResult.removedItem,
        // 		parent_id: parentId,
        // 	};
        // }

        // If the item wasn't found elsewhere, it's new to this location
        return {
          ...item,
          parent_id: parentId
        };
      });

      // If this is a top-level update, return the new list
      if (parentId === null) {
        return updatedList;
      }

      // Otherwise, find the parent container and update its children
      const updateChildren = blocks => {
        return blocks.map(block => {
          if (block.id === parentId) {
            return {
              ...block,
              children: updatedList
            };
          }
          if (block.children) {
            return {
              ...block,
              children: updateChildren(block.children)
            };
          }
          return block;
        });
      };
      return updateChildren(newBlocks);
    });
  };
  var breakPointX = "Desktop";
  var myStore = wp.data.select("PostGridStore");
  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 ratingType = {
    none: {
      label: "Choose",
      value: ""
    },
    star: {
      label: "Star",
      value: "star"
    }
  };
  var elementsCategories = {
    general: {
      label: "General",
      value: "general",
      active: true
    },
    wooCommerce: {
      label: "Woo Commerce",
      value: "wooCommerce",
      active: false
    }
  };
  const handleChange = (type, value) => {
    setselectedElement({
      ...selectedElement,
      options: {
        ...selectedElement.options,
        [type]: value
      }
    });
  };
  var elementOptionsHtml = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_0__.applyFilters)("PostGridElementOptions" + selectedElement?.type, '', selectedElement, handleChange);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
    className: "flex gap-3 bg-gray-100",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
      className: "w-[400px]",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)(_components_tabs__WEBPACK_IMPORTED_MODULE_6__["default"], {
        activeTab: activeTab,
        orientation: "",
        stickyNavs: true,
        contentClass: " bg-white w-full",
        navItemClass: "bg-gray-200 px-5 py-3 gap-2 grow ",
        navItemLabelClass: "flex-col ",
        navItemSelectedClass: "!bg-white",
        activeClass: "active-tab",
        onSelect: tab => {
          setactiveTab(tab.name);
        },
        tabs: [{
          name: "elements",
          title: "Elements",
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_15__["default"],
          className: "elements"
        }, {
          name: "edit",
          title: "Edit",
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_16__["default"],
          className: "edit"
        }],
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_components_tab__WEBPACK_IMPORTED_MODULE_7__["default"], {
          name: "elements",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
            className: " p-4",
            children: Object.entries(elementsCategories).map(groupArgs => {
              var caetgoryArg = groupArgs[1];
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
                  title: caetgoryArg.label,
                  initialOpen: caetgoryArg.active,
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                    className: "flex gap-2  py-2 flex-wrap ",
                    children: Object.entries(_elements__WEBPACK_IMPORTED_MODULE_11__["default"]).map(args => {
                      var index = args[0];
                      var element = args[1];
                      var hidden = element.hidden;
                      // var inCategory = element.category.include(caetgoryArg.value);
                      var inCategory = element?.category?.includes(caetgoryArg.value);
                      var isPro = isProcustomer ? false : element.isPro;
                      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
                        children: !hidden && inCategory && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                          className: ` ${isPro ? "bg-amber-500 hover:bg-amber-600" : "text-white bg-slate-500 hover:bg-slate-600"} px-2 py-1 rounded-sm cursor-move  `,
                          title: `${isPro ? "Its Pro" : ""}`,
                          draggable: true,
                          onDragStart: () => setDraggedTemplate(element),
                          onDragEnd: () => setDraggedTemplate(null),
                          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("span", {
                            children: element.label
                          })
                        }, element.id)
                      });
                    })
                  })
                }, caetgoryArg.value)
              });
            })
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_components_tab__WEBPACK_IMPORTED_MODULE_7__["default"], {
          name: "edit",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
            className: "p-3",
            children: [selectedElement != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
              className: "py-3 flex gap-2 items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                children: "You are editing: "
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
                children: selectedElement != null ? _elements__WEBPACK_IMPORTED_MODULE_11__["default"][selectedElement.type]?.label : ""
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
              className: "my-5",
              children: elementOptionsHtml
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
              className: "my-3 font-medium text-slate-900",
              children: "Styles"
            }), selectedElement?.cssSelectors && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.Fragment, {
              children: Object.entries(selectedElement?.cssSelectors).map(([elementIndex, elementData]) => {
                function onChangeStyle(sudoScource, newVal, attr, propertyType, setProperty, elementIndex = null) {
                  let obj = structuredClone(propertyType); // Ensure deep copy
                  const path = [sudoScource, attr, breakPointX];
                  const updatedObject = myStore.updatePropertyDeep(obj, path, newVal);
                  setProperty(prev => {
                    if (elementIndex === null) {
                      return {
                        ...prev,
                        styles: updatedObject // Update styles at the root level
                      };
                    } else {
                      return {
                        ...prev,
                        cssSelectors: {
                          ...prev.cssSelectors,
                          [elementIndex]: updatedObject // Update styles inside cssSelectors
                        }
                      };
                    }
                  });
                }
                function onAddStyle(sudoScource, key, propertyType, setProperty, elementIndex) {
                  let obj = structuredClone(propertyType);
                  const path = [sudoScource, key, breakPointX];
                  const updatedObject = myStore.addPropertyDeep(obj, path, "");
                  setProperty(prev => {
                    if (elementIndex === null) {
                      return {
                        ...prev,
                        styles: updatedObject // Update styles at the root level
                      };
                    } else {
                      return {
                        ...prev,
                        cssSelectors: {
                          ...prev.cssSelectors,
                          [elementIndex]: updatedObject // Update styles inside cssSelectors
                        }
                      };
                    }
                  });
                }
                function onResetStyle(sudoSources, propertyType, setProperty, elementIndex = null) {
                  let obj = structuredClone(propertyType); // Deep copy to avoid mutations

                  Object.entries(sudoSources).forEach(([sudoSource]) => {
                    if (obj[sudoSource] !== undefined) {
                      obj[sudoSource] = {};
                    }
                  });
                  if (elementIndex === null) {
                    setProperty(obj); // Update root styles
                  } else {
                    setProperty(prev => ({
                      ...prev,
                      cssSelectors: {
                        ...prev.cssSelectors,
                        [elementIndex]: obj // Update styles inside a selector
                      }
                    }));
                  }
                }
                function onRemoveStyle(sudoScource, key, propertyType, setProperty, elementIndex = null) {
                  let obj = structuredClone(propertyType);
                  let updatedObject = myStore.deletePropertyDeep(obj, [sudoScource, key, breakPointX]);
                  let isEmpty = Object.entries(updatedObject[sudoScource] || {}).length === 0;
                  let finalObject = isEmpty ? myStore.deletePropertyDeep(updatedObject, [sudoScource]) : updatedObject;
                  if (elementIndex === null) {
                    setProperty(finalObject);
                  } else {
                    setProperty(prev => ({
                      ...prev,
                      cssSelectors: {
                        ...prev.cssSelectors,
                        [elementIndex]: finalObject
                      }
                    }));
                  }
                }
                function onBulkAddStyle(sudoSource, cssObj, propertyType, setProperty, elementIndex = null) {
                  let obj = structuredClone(propertyType);
                  obj[sudoSource] = {
                    ...obj[sudoSource],
                    ...cssObj
                  }; // Merge styles

                  if (elementIndex === null) {
                    setProperty(obj);
                  } else {
                    setProperty(prev => ({
                      ...prev,
                      cssSelectors: {
                        ...prev.cssSelectors,
                        [elementIndex]: obj
                      }
                    }));
                  }
                }
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
                  title: selectedElement?.cssSelectors[elementIndex]?.label ? selectedElement?.cssSelectors[elementIndex]?.label : elementIndex,
                  initialOpen: false,
                  children: elementData?.styles && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_styles__WEBPACK_IMPORTED_MODULE_9__["default"], {
                    obj: elementData,
                    onChange: (sudoScource, newVal, attr) => onChangeStyle(sudoScource, newVal, attr, elementData, setselectedElement, elementIndex),
                    onAdd: (sudoScource, key) => onAddStyle(sudoScource, key, elementData, setselectedElement, elementIndex),
                    onRemove: (sudoScource, key) => onRemoveStyle(sudoScource, key, elementData, setselectedElement, elementIndex),
                    onReset: sudoSources => onResetStyle(sudoSources, elementData, setselectedElement, elementIndex),
                    onBulkAdd: (sudoSource, cssObj) => onBulkAddStyle(sudoSource, cssObj, elementData, setselectedElement, elementIndex)
                  })
                }, elementIndex);
              })
            })]
          })
        })]
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsxs)("div", {
      className: "flex-1 justify-between max-w-[450px] w-full min-h-full ",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
        className: "flex items-center justify-between bg-slate-400 px-3 py-3",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
          className: "text-[20px] font-bold",
          children: "Preview"
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
        id: `post-grid-${postId}`,
        className: "p-3 overflow-hidden min-h-10",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(react_sortablejs__WEBPACK_IMPORTED_MODULE_4__.ReactSortable, {
          list: blocks,
          setList: handleBlockUpdate,
          ...parentSortableOptions,
          children: blocks.map(block => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(ElementOthers, {
            block: block,
            handleBlockUpdate: handleBlockUpdate,
            onTemplateDrop: handleTemplateAdd,
            draggedTemplate: draggedTemplate,
            setCurretnElement: setCurretnElement,
            setactiveTab: setactiveTab
          }, block.id))
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
      className: "w-[300px]",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div", {
        className: "border border-solid",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_TreeView__WEBPACK_IMPORTED_MODULE_10__["default"], {
          blocks: blocks,
          setBlocks: setBlocks,
          selected: selectedElementId,
          setSelected: setCurretnElement
        })
      })
    })]
  });
}

/***/ }),

/***/ "./src/components/layout-generator/postMetaPrams.js":
/*!**********************************************************!*\
  !*** ./src/components/layout-generator/postMetaPrams.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 postMetaPrams = {
  // wrapper: { label: "Add Wrapper", value: "wrapper", "children": [], options: {} },
  string: {
    label: "Display String",
    outputType: "string",
    enableShortcodes: true,
    enableEmbeds: true
  },
  strToNumber: {
    label: "String To Number",
    outputType: "strToNumber",
    thousandSeparator: ',',
    decimalSeparator: ".",
    decimals: 2
  },
  idToImage: {
    label: "Attachment Id to Image",
    outputType: "idToImage",
    linkTo: "",
    linkToUrl: "",
    target: "",
    enableSrcSet: true,
    thumbSize: "full"
  },
  strToLink: {
    label: "String To Link",
    outputType: "strToLink",
    target: "",
    protocol: ""
  },
  strToDateTime: {
    label: "String To DateTime",
    outputType: "strToDateTime",
    format: ""
  },
  arrayLoop: {
    label: "Array Loop",
    outputType: "arrayLoop",
    itemTag: "li",
    itemClass: ""
  }
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (postMetaPrams);

/***/ }),

/***/ "./src/components/radio-control/index.js":
/*!***********************************************!*\
  !*** ./src/components/radio-control/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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__);




function Html(props) {
  if (!props.warn) {
    return null;
  }
  var selected = props.selected;
  var label = props.label;
  var name = props.name;
  var options = props.options;
  var onChange = props.onChange;
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", {
      className: "mb-3 font-bold ",
      children: label
    }), Object.entries(options).map(args => {
      var index = args[0];
      var x = args[1];
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", {
        className: "flex items-center w-full my-1 post-grid ",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("input", {
          type: "radio",
          id: index,
          className: `!h-4 !w-4 ${x.isPro ? "!border-gray-300 " : "!border-gray-500"}  focus:ring-2 focus:ring-blue-300`,
          name: props.name,
          value: x.value,
          disabled: x.isPro ? true : false,
          checked: x.value == selected ? true : false,
          onClick: ev => {
            if (x.isPro == true) {
              alert("Sorry this feature only available in pro");
            } else {
              onChange(x, index);
            }
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("label", {
          for: index,
          className: "flex justify-between items-center w-full cursor-default ",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", {
            className: "max-w-[calc(100%_-_50px)]",
            children: x.label
          }), x.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", {
            className: " bg-orange-500 text-white text-xs px-2 rounded-sm py-1 cursor-pointer",
            onClick: ev => {
              window.open("https://comboblocks.com/pricing/", "_blank");
            },
            children: "Pro"
          })]
        })]
      });
    })]
  });
}
class PGRadioControl 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,
      // searchPlaceholder,
      options,
      //[{"label":"Select..","icon":"","value":""}]
      label,
      name,
      onChange,
      selected
      // value,
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Html, {
        selected: selected,
        label: label,
        name: name,
        options: options,
        onChange: onChange
        // buttonTitle={buttonTitle}
        // searchPlaceholder={searchPlaceholder}
        // btnClass={btnClass}
        // variant={variant}
        ,

        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGRadioControl);

/***/ }),

/***/ "./src/components/styles/css-align-content/index.js":
/*!**********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Align Content", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? 'Select...' : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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');
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Important (Enabled)', "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Important?', "post-grid"),
      checked: isImportant,
      onChange: arg => {
        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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssAlignContent);

/***/ }),

/***/ "./src/components/styles/css-align-items/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Align Items",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Important (Enabled)', "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Important?', "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssAlignItems);

/***/ }),

/***/ "./src/components/styles/css-align-self/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Align Self", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "flex items-center gap-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", {
        htmlFor: "",
        children: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
        className: "!mb-0",
        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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssAlignSelf);

/***/ }),

/***/ "./src/components/styles/css-animation-name/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/css-animation-name/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }
  var content = props.val == null || props.val == undefined ? '' : props.val.replaceAll('"', '');
  content = content.replaceAll('u0022', '');
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    className: "mt-4",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: content,
      type: "text",
      onChange: newVal => {
        //setwidthVal(newVal);
        props.onChange(newVal, 'animationName');
      }
    })
  });
}
class PGcssAnimationName 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssAnimationName);

/***/ }),

/***/ "./src/components/styles/css-aspect-ratio/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes("auto") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isAuto ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Auto', "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Auto?', "post-grid"),
      checked: isAuto,
      onChange: arg => {
        setisAuto(isAuto => !isAuto);
        props.onChange('auto', 'aspectRatio');
      }
    }), !isAuto && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "flex mt-4",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
        value: valX,
        type: "number",
        onChange: newVal => {
          props.onChange(newVal + '/' + valY, 'aspectRatio');
        }
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "mx-2",
        children: " / "
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssAspectRatio);

/***/ }),

/***/ "./src/components/styles/css-backdrop-filter/index.js":
/*!************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
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_2__.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_2__.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 argUnit = x != undefined ? x.match(/-?\d+(px|deg|%)/g)[0] : "px";
        var argId = x != undefined ? x.match(/[a-zA-Z]+/g)[0] : '';
        return {
          id: argId,
          val: argVal,
          unit: argUnit
        };
      }
    });
    setvalArgs(res);
  }, [props.val]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useEffect)(() => {
    //onChange('contrast(200%) brightness(150%) blur(10%)', 'filter');
  }, [valArgs]);
  const [filterArgs, setfilterArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
    className: "mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
      className: "flex",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_3__["default"], {
        position: "bottom right",
        variant: "secondary",
        options: filterArgs,
        buttonTitle: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Add Filter", "post-grid"),
        onChange: addFilter,
        values: ""
      })
    }), valArgs != undefined && valArgs.map((arg, i) => {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
        className: "flex my-3 items-center justify-between",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
          htmlFor: "",
          children: filterArgs[arg.id]?.label
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
          className: "flex",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
            value: arg.val,
            type: "number",
            ...(valArgs[i].id !== "blur" && {
              min: 0,
              max: 100
            }),
            onChange: newVal => {
              valArgs[i].val = newVal;
              // setvalArgs(valArgs);
              var str = '';
              valArgs.map((x, i) => {
                if (x.id == "blur") {
                  x.unit = "px";
                }
                if (x.id == "hue-rotate") {
                  x.unit = "deg";
                }
                if (x.id == "brightness" || x.id == "contrast" || x.id == "grayscale" || x.id == "invert" || x.id == "opacity" || x.id == "saturate" || x.id == "sepia") {
                  x.unit = "%";
                }
                str += x.id + '(' + x.val + x.unit + ') ';
              });
              props.onChange(str, 'backdropFilter');
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            className: "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);
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              className: "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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackdropFilter);

/***/ }),

/***/ "./src/components/styles/css-backface-visibility/index.js":
/*!****************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackfaceVisibility);

/***/ }),

/***/ "./src/components/styles/css-background-attachment/index.js":
/*!******************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Background Attachment", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundAttachment);

/***/ }),

/***/ "./src/components/styles/css-background-blend-mode/index.js":
/*!******************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Background Blend Mode", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundBlendMode);

/***/ }),

/***/ "./src/components/styles/css-background-clip/index.js":
/*!************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Background Blend Mode", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundClip);

/***/ }),

/***/ "./src/components/styles/css-background-color/index.js":
/*!*************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_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_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
const {
  Component
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(props.val.split(" "));
  const [val, setval] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(valArgs[1] == undefined ? false : true);
  const [customColor, setCustomColor] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)([]);
  const [newColorPreset, setNewColorPreset] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)([]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
    const transformedColors = customColor.map((color, index) => {
      const name = color.substring(1).toUpperCase();
      const upperCaseColor = color.toUpperCase();
      return {
        name,
        color: upperCaseColor
      };
    });
    let newColor;
    if (transformedColors.length >= 6) {
      newColor = transformedColors;
    } else {
      newColor = transformedColors.concat(_colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"].slice(0, 6 - transformedColors.length));
    }
    setNewColorPreset(newColor);
  }, [customColor]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "p-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
        className: "mb-2",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
          label: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
          checked: isImportant,
          className: "!mb-0",
          onChange: arg => {
            setImportant(isImportant => !isImportant);
            if (isImportant) {
              props.onChange(val, "backgroundColor");
            } else {
              props.onChange(val + " !important", "backgroundColor");
            }
          }
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ColorPalette, {
        value: val,
        colors: newColorPreset,
        enableAlpha: true,
        onChange: newVal => {
          //props.onChange(newVal, 'backgroundColor');
          setval(newVal);
          if (isImportant) {
            props.onChange(newVal + " !important", "backgroundColor");
          } else {
            props.onChange(newVal, "backgroundColor");
          }
        }
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
          htmlFor: "",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Global Value", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
          label: "",
          value: val,
          options: [{
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Choose", "post-grid"),
            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: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }
  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }
  render() {
    var {
      val,
      enableAlpha,
      onChange,
      label
    } = this.props;
    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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        enableAlpha: enableAlpha,
        val: val,
        onChange: onChange,
        warn: this.state.showWarning,
        handleToggleClick: this.handleToggleClick
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundColor);

/***/ }),

/***/ "./src/components/styles/css-background-image/index.js":
/*!*************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__);
/* 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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__);
const {
  Component,
  RawHTML
} = wp.element;










function Html(props) {
  if (!props.warn) {
    return null;
  }
  var typeArgs = {
    url: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Image URL', "post-grid"),
      id: 'url'
    },
    //conicGradient: { label: 'Conic Gradient', id: 'conicGradient' },
    linearGradient: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Linear Gradient', "post-grid"),
      id: 'linearGradient'
    },
    radialGradient: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Radial Gradient', "post-grid"),
      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_2__.useState)(valX.split(",  ").filter(n => n));
  var RemoveQueryPram = function ({
    index,
    arg
  }) {
    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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("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');
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
        className: "mx-2",
        children: typeName.length == 0 ? '#' + index : typeName
      })]
    });
  };
  const ALLOWED_MEDIA_TYPES = ['image'];
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
      className: "my-4",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
        position: "bottom right",
        variant: "secondary",
        options: typeArgs,
        buttonTitle: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Add", "post-grid"),
        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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
        className: "pg-setting-input-gradient",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
          initialOpen: false,
          title: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(RemoveQueryPram, {
            index: index,
            arg: x
          }),
          children: [x.includes("url") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
              className: "my-3",
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("img", {
                src: x.replace("url(", "").replace(")", ""),
                alt: ""
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_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");
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__.MediaUploadCheck, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__.MediaUpload, {
                className: "bg-gray-700 hover:bg-gray-600",
                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: ({
                  open
                }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
                  className: "my-3 bg-gray-700 hover:bg-gray-600 text-white border border-solid border-gray-300 text-center w-full",
                  onClick: open,
                  children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Open Media Library", "post-grid")
                })
              })
            })]
          }), !x.includes("url") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.GradientPicker, {
            value: x == null || x == undefined ? null : x,
            onChange: 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(",  ");
              }
              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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundImage);

/***/ }),

/***/ "./src/components/styles/css-background-origin/index.js":
/*!**************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Background Blend Mode", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundOrigin);

/***/ }),

/***/ "./src/components/styles/css-background-position/index.js":
/*!****************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.match(/-?\d+/g) == null ? false : true);
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.split(" "));
  const [position, setposition] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.includes("!important") ? true : false);
  const [ValX, setValX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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_2__.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_2__.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_2__.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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      label: isCustom ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Custom Value enabled?", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Custom Value?", "post-grid"),
      checked: isCustom,
      onChange: arg => {
        setisCustom(isCustom => !isCustom);
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "flex justify-between items-center my-3",
      children: !isCustom && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: position.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : position
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: args.map(x => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
                }
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })]
            });
          })
        })
      })
    }), isCustom && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "flex mt-4",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
          value: ValX,
          type: "number",
          onChange: newVal => {
            setValX(newVal);
            if (isImportant) {
              props.onChange(newVal + valUnitX + " " + ValY + valUnitY + " " + "!important", "backgroundPosition");
            } else {
              props.onChange(newVal + valUnitX + " " + ValY + valUnitY, "backgroundPosition");
            }
          }
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "mx-2",
        children: " / "
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
          value: ValY,
          type: "number",
          onChange: newVal => {
            setValY(newVal);
            if (isImportant) {
              props.onChange(ValX + valUnitX + " " + newVal + valUnitY + " " + "!important", "backgroundPosition");
            } else {
              props.onChange(ValX + valUnitX + " " + newVal + valUnitY, "backgroundPosition");
            }
          }
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      label: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundPosition);

/***/ }),

/***/ "./src/components/styles/css-background-repeat/index.js":
/*!**************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Background Repeat", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundRepeat);

/***/ }),

/***/ "./src/components/styles/css-background-size/index.js":
/*!************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* 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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.includes(", ") ? true : false);
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(isMultiple ? props.val.split(", ") : props.val.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.includes("!important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "flex justify-between items-center",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "cursor-pointer bg-gray-700 hover:bg-gray-600 text-white px-3 py-1 my-3",
        onClick: ev => {
          valArgs.push("auto");
          setValArgs(valArgs);
          props.onChange(valArgs.join(" "), "backgroundSize");
        },
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Add", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
        label: isMultiple ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Multiple (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Multiple?", "post-grid"),
        checked: isMultiple,
        onChange: arg => {
          setisMultiple(isMultiple => !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");
            }
          }
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: valArgs.map((item, i) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
          className: "flex items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                }
              }
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
              fill: "#fff",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
            position: "bottom",
            renderToggle: ({
              isOpen,
              onToggle
            }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
              title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Background Repeat", "post-grid"),
              onClick: onToggle,
              "aria-expanded": isOpen,
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                className: " ",
                children: args[item] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Custom", "post-grid") : args[item].label
              })
            }),
            renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              className: "w-32",
              children: Object.entries(args).map(args => {
                var index = args[0];
                var x = args[1];
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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);
                  },
                  children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                    children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
                  }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                    children: x.label
                  })]
                });
              })
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {}), item.match(/-?\d+/g) != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
            className: "flex justify-between",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
              value: item.match(/-?\d+/g) == null ? "0" : item.match(/-?\d+/g)[0],
              type: "number",
              onChange: newVal => {
                if (newVal.length > 0) {
                  valArgs[i] = newVal + item.match(/[a-zA-Z%]+/g)[0];
                  props.onChange(valArgs.join(" "), "backgroundSize");
                  setValArgs(valArgs);
                }
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
              position: "bottom left",
              renderToggle: ({
                isOpen,
                onToggle
              }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
                title: "",
                onClick: onToggle,
                "aria-expanded": isOpen,
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                  className: " ",
                  children: item.match(/[a-zA-Z%]+/g) == null ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : unitArgs[item.match(/[a-zA-Z%]+/g)[0]] == undefined ? "" : unitArgs[item.match(/[a-zA-Z%]+/g)[0]].label
                })
              }),
              renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                className: "w-32",
                children: Object.entries(unitArgs).map(y => {
                  var index = y[0];
                  var x = y[1];
                  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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);
                    },
                    children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                      children: x.label
                    })
                  });
                })
              })
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {})]
        });
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      label: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBackgroundSize);

/***/ }),

/***/ "./src/components/styles/css-border-bottom/index.js":
/*!**********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(colorVal);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Width", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
        className: "flex justify-between items-center",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
          value: widthValY,
          type: "number",
          onChange: newVal => {
            setwidthVal(newVal);
            props.onChange(newVal + widthUnitY + " " + styleVal + " " + colorVal, "borderBottom");
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
            position: "bottom right",
            renderToggle: ({
              isOpen,
              onToggle
            }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
              title: "",
              onClick: onToggle,
              "aria-expanded": isOpen,
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                className: " ",
                children: widthUnitY != undefined ? unitArgs[widthUnitY].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
              })
            }),
            renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
              className: "w-32",
              children: Object.entries(unitArgs).map(y => {
                var index = y[0];
                var x = y[1];
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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");
                  },
                  children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                    children: x.label
                  })
                });
              })
            })
          })
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2 flex justify-between items-center",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Style", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom right",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
            className: " ",
            children: outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          className: "w-32",
          children: Object.entries(outlineStyleArgs).map(arg => {
            var index = arg[0];
            var x = arg[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("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);
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                children: x.label
              })]
            });
          })
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
      htmlFor: "",
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Color", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__["default"], {
      value: outlineColorVal,
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_3__["default"],
      enableAlpha: true,
      onChange: newVal => {
        props.onChange(widthVal + " " + styleVal + " " + newVal, "borderBottom");
        setoutlineColorVal(newVal);
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderBottom);

/***/ }),

/***/ "./src/components/styles/css-border-collapse/index.js":
/*!************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component,
  RawHTML
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }
  var args = {
    separate: {
      label: "Separate",
      value: "separate"
    },
    collapse: {
      label: "Collapse",
      value: "collapse"
    },
    inherit: {
      label: "inherit",
      value: "inherit"
    },
    initial: {
      label: "initial",
      value: "initial"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Empty Cells", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
            className: "px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer",
            onClick: ev => {
              // props.onChange(x.value, 'borderCollapse');
              setalign(x.value);
              if (isImportant) {
                props.onChange(x.value + " !important", "borderCollapse");
              } else {
                props.onChange(x.value, "borderCollapse");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderCollapse);

/***/ }),

/***/ "./src/components/styles/css-border-image/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__);
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)  1 1 1 1/  10px 10px 10px 10px /  0px 0px 0px 0px  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('")', "");
  const [type, setType] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)("linear");
  const [linearGradientValue, setLinearGradientValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)("linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)");
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Source", "post-grid")
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
      className: "my-4",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
        htmlFor: "",
        className: "font-medium text-slate-900 pg-font ",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select Source", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
        options: [{
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Linear Gradient", "post-grid"),
          value: "linear"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Image", "post-grid"),
          value: "image"
        }],
        values: "",
        onChange: newVal => {
          setType(newVal);
        }
      })]
    }), type === "linear" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.GradientPicker, {
      value: linearGradientValue,
      onChange: currentGradient => {
        setLinearGradientValue(currentGradient);
        var sliceX = slice.replaceAll("px", "");
        props.onChange(currentGradient + sliceX + "/  " + width + "/  " + outset + "  " + repeat, "borderImage");
      },
      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"
      }]
    }), type === "image" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
        className: "my-3",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("img", {
          src: imageVal,
          alt: ""
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__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");
        }
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__.MediaUploadCheck, {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__.MediaUpload, {
          className: "bg-gray-700 hover:bg-gray-600",
          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: ({
            open
          }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
            className: "my-3 bg-gray-700 hover:bg-gray-600 text-white border border-solid border-gray-300 text-center w-full",
            onClick: open,
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Open Media Library", "post-grid")
          })
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Slice", "post-grid")
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__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");
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Width", "post-grid")
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__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");
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Outset", "post-grid")
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__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");
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Repeat", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
        label: "",
        value: repeat,
        options: [{
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Stretch", "post-grid"),
          value: "stretch"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Repeat", "post-grid"),
          value: "repeat"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Round", "post-grid"),
          value: "round"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Space", "post-grid"),
          value: "space"
        }, {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Fill", "post-grid"),
          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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderImage);

/***/ }),

/***/ "./src/components/styles/css-border-left/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(colorVal);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Width", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
        className: "flex justify-between items-center",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
          value: widthValY,
          type: "number",
          onChange: newVal => {
            setwidthVal(newVal);
            props.onChange(newVal + widthUnitY + " " + styleVal + " " + colorVal, "borderLeft");
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
            position: "bottom right",
            renderToggle: ({
              isOpen,
              onToggle
            }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
              title: "",
              onClick: onToggle,
              "aria-expanded": isOpen,
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                className: " ",
                children: widthUnitY != undefined ? unitArgs[widthUnitY].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
              })
            }),
            renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
              className: "w-32",
              children: Object.entries(unitArgs).map(y => {
                var index = y[0];
                var x = y[1];
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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");
                  },
                  children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                    children: x.label
                  })
                });
              })
            })
          })
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2 flex justify-between items-center",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Style", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom right",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
            className: " ",
            children: outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          className: "w-32",
          children: Object.entries(outlineStyleArgs).map(arg => {
            var index = arg[0];
            var x = arg[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("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);
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                children: x.label
              })]
            });
          })
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
      htmlFor: "",
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Color", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__["default"], {
      value: outlineColorVal,
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_3__["default"],
      enableAlpha: true,
      onChange: newVal => {
        props.onChange(widthVal + " " + styleVal + " " + newVal, "borderLeft");
        setoutlineColorVal(newVal);
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderLeft);

/***/ }),

/***/ "./src/components/styles/css-border-radius/index.js":
/*!**********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__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 _colors_presets__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)({
    top: topX,
    right: rightX,
    bottom: bottomX,
    left: leftX
  });
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valParts.includes("!important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderRadius);

/***/ }),

/***/ "./src/components/styles/css-border-right/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(colorVal);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Width", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
        className: "flex justify-between items-center",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
          value: widthValY,
          type: "number",
          onChange: newVal => {
            setwidthVal(newVal);
            props.onChange(newVal + widthUnitY + " " + styleVal + " " + colorVal, "borderRight");
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
            position: "bottom right",
            renderToggle: ({
              isOpen,
              onToggle
            }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
              title: "",
              onClick: onToggle,
              "aria-expanded": isOpen,
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                className: " ",
                children: widthUnitY != undefined ? unitArgs[widthUnitY].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
              })
            }),
            renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
              className: "w-32",
              children: Object.entries(unitArgs).map(y => {
                var index = y[0];
                var x = y[1];
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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");
                  },
                  children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                    children: x.label
                  })
                });
              })
            })
          })
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2 flex justify-between items-center",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Style", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom right",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
            className: " ",
            children: outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          className: "w-32",
          children: Object.entries(outlineStyleArgs).map(arg => {
            var index = arg[0];
            var x = arg[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("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);
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                children: x.label
              })]
            });
          })
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
      htmlFor: "",
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Color", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__["default"], {
      value: outlineColorVal,
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_3__["default"],
      enableAlpha: true,
      onChange: newVal => {
        props.onChange(widthVal + " " + styleVal + " " + newVal, "borderRight");
        setoutlineColorVal(newVal);
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderRight);

/***/ }),

/***/ "./src/components/styles/css-border-spacing/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
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_2__.useState)(horizontalValX);
  const [horizontalUnitY, sethorizontalUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(horizontalUnitX);
  const [vericalValY, setvericalVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(vericalValX);
  const [vericalUnitY, setvericalUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(vericalUnitX);
  const [outlinehorizontalVal, setoutlinehorizontalVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(horizontalVal);
  const [outlinevericalVal, setoutlinevericalVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(vericalVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(colorVal);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      className: "grid grid-cols-2 gap-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
        className: "my-2",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
          htmlFor: "",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Horizontal", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
          className: "flex justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
            value: horizontalValY,
            type: "number",
            onChange: newVal => {
              sethorizontalVal(newVal);
              props.onChange(newVal + horizontalUnitY + " " + outlinevericalVal, "borderSpacing");
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
              position: "bottom right",
              renderToggle: ({
                isOpen,
                onToggle
              }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
                title: "",
                onClick: onToggle,
                "aria-expanded": isOpen,
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
                  className: " ",
                  children: horizontalUnitY != undefined ? unitArgs[horizontalUnitY].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
                })
              }),
              renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
                className: "w-32",
                children: Object.entries(unitArgs).map(y => {
                  var index = y[0];
                  var x = y[1];
                  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("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");
                    },
                    children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                      children: x.label
                    })
                  });
                })
              })
            })
          })]
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
        className: "my-2",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
          htmlFor: "",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Verical", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
          className: "flex justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
            value: vericalValY,
            type: "number",
            onChange: newVal => {
              setvericalVal(newVal);
              props.onChange(outlinehorizontalVal + " " + newVal + vericalUnitY, "borderSpacing");
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
              position: "bottom right",
              renderToggle: ({
                isOpen,
                onToggle
              }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
                title: "",
                onClick: onToggle,
                "aria-expanded": isOpen,
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
                  className: " ",
                  children: vericalUnitY != undefined ? unitArgs[vericalUnitY].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
                })
              }),
              renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
                className: "w-32",
                children: Object.entries(unitArgs).map(y => {
                  var index = y[0];
                  var x = y[1];
                  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("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");
                    },
                    children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                      children: x.label
                    })
                  });
                })
              })
            })
          })]
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderSpacing);

/***/ }),

/***/ "./src/components/styles/css-border-top/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(colorVal);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Width", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
        className: "flex justify-between items-center",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
          value: widthValY,
          type: "number",
          onChange: newVal => {
            setwidthVal(newVal);
            props.onChange(newVal + widthUnitY + " " + styleVal + " " + colorVal, "borderTop");
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
            position: "bottom right",
            renderToggle: ({
              isOpen,
              onToggle
            }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
              title: "",
              onClick: onToggle,
              "aria-expanded": isOpen,
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                className: " ",
                children: widthUnitY != undefined ? unitArgs[widthUnitY].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
              })
            }),
            renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
              className: "w-32",
              children: Object.entries(unitArgs).map(y => {
                var index = y[0];
                var x = y[1];
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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");
                  },
                  children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                    children: x.label
                  })
                });
              })
            })
          })
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2 flex justify-between items-center",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Style", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom right",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
            className: " ",
            children: outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          className: "w-32",
          children: Object.entries(outlineStyleArgs).map(arg => {
            var index = arg[0];
            var x = arg[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("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);
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                children: x.label
              })]
            });
          })
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
      htmlFor: "",
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Color", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__["default"], {
      value: outlineColorVal,
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_3__["default"],
      enableAlpha: true,
      onChange: newVal => {
        props.onChange(widthVal + " " + styleVal + " " + newVal, "borderTop");
        setoutlineColorVal(newVal);
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorderTop);

/***/ }),

/***/ "./src/components/styles/css-border/index.js":
/*!***************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  const [outlineWidthVal, setoutlineWidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthVal);
  const [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(styleVal);
  const [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(colorVal);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Width", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
        className: "flex justify-between items-center",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
          value: widthValY,
          type: "number",
          onChange: newVal => {
            setwidthVal(newVal);
            props.onChange(newVal + widthUnitY + " " + styleVal + " " + colorVal, "border");
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
            position: "bottom right",
            renderToggle: ({
              isOpen,
              onToggle
            }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
              title: "",
              onClick: onToggle,
              "aria-expanded": isOpen,
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                className: " ",
                children: widthUnitY != undefined ? unitArgs[widthUnitY].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
              })
            }),
            renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
              className: "w-32",
              children: Object.entries(unitArgs).map(y => {
                var index = y[0];
                var x = y[1];
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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");
                  },
                  children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                    children: x.label
                  })
                });
              })
            })
          })
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2 flex justify-between items-center",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Style", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom right",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
            className: " ",
            children: outlineStyleVal ? outlineStyleArgs[outlineStyleVal].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          className: "w-32",
          children: Object.entries(outlineStyleArgs).map(arg => {
            var index = arg[0];
            var x = arg[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("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);
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                children: x.label
              })]
            });
          })
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
      htmlFor: "",
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Border Color", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__["default"], {
      value: outlineColorVal,
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_3__["default"],
      enableAlpha: true,
      onChange: newVal => {
        props.onChange(widthVal + " " + styleVal + " " + newVal, "border");
        setoutlineColorVal(newVal);
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBorder);

/***/ }),

/***/ "./src/components/styles/css-bottom/index.js":
/*!***************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBottom);

/***/ }),

/***/ "./src/components/styles/css-box-shadow/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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 _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_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__);
const {
  Component,
  RawHTML
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }
  let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_5__.applyFilters)("isProFeature", true);
  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 colorNames = ["AliceBlue", "AntiqueWhite", "Aqua", "Aquamarine", "Azure", "Beige", "Bisque", "Black", "BlanchedAlmond", "Blue", "BlueViolet", "Brown", "BurlyWood", "CadetBlue", "Chartreuse", "Chocolate", "Coral", "CornflowerBlue", "Cornsilk", "Crimson", "Cyan", "DarkBlue", "DarkCyan", "DarkGoldenRod", "DarkGray", "DarkGrey", "DarkGreen", "DarkKhaki", "DarkMagenta", "DarkOliveGreen", "Darkorange", "DarkOrchid", "DarkRed", "DarkSalmon", "DarkSeaGreen", "DarkSlateBlue", "DarkSlateGray", "DarkSlateGrey", "DarkTurquoise", "DarkViolet", "DeepPink", "DeepSkyBlue", "DimGray", "DimGrey", "DodgerBlue", "FireBrick", "FloralWhite", "ForestGreen", "Fuchsia", "Gainsboro", "GhostWhite", "Gold", "GoldenRod", "Gray", "Grey", "Green", "GreenYellow", "HoneyDew", "HotPink", "IndianRed", "Indigo", "Ivory", "Khaki", "Lavender", "LavenderBlush", "LawnGreen", "LemonChiffon", "LightBlue", "LightCoral", "LightCyan", "LightGoldenRodYellow", "LightGray", "LightGrey", "LightGreen", "LightPink", "LightSalmon", "LightSeaGreen", "LightSkyBlue", "LightSlateGray", "LightSlateGrey", "LightSteelBlue", "LightYellow", "Lime", "LimeGreen", "Linen", "Magenta", "Maroon", "MediumAquaMarine", "MediumBlue", "MediumOrchid", "MediumPurple", "MediumSeaGreen", "MediumSlateBlue", "MediumSpringGreen", "MediumTurquoise", "MediumVioletRed", "MidnightBlue", "MintCream", "MistyRose", "Moccasin", "NavajoWhite", "Navy", "OldLace", "Olive", "OliveDrab", "Orange", "OrangeRed", "Orchid", "PaleGoldenRod", "PaleGreen", "PaleTurquoise", "PaleVioletRed", "PapayaWhip", "PeachPuff", "Peru", "Pink", "Plum", "PowderBlue", "Purple", "Red", "RosyBrown", "RoyalBlue", "SaddleBrown", "Salmon", "SandyBrown", "SeaGreen", "SeaShell", "Sienna", "Silver", "SkyBlue", "SlateBlue", "SlateGray", "SlateGrey", "Snow", "SpringGreen", "SteelBlue", "Tan", "Teal", "Thistle", "Tomato", "Turquoise", "Violet", "Wheat", "White", "WhiteSmoke", "Yellow", "YellowGreen"];
  var isMulti = valZ.split(",").length > 1 ? true : false;
  var shadows = isMulti ? valZ.split(", ") : [valZ];
  const getBoxShadowObj = boxshadow => {
    var sadhow_arr = [];
    boxshadow.map(arg => {
      var inset = arg.includes("inset");
      var color = "";
      var re = /(rgba|rgb|#|hsla|hsl)/;
      var colorMatch = arg.match(re);
      var colorType = colorMatch != null ? colorMatch[0] : "";
      if (colorType == "hsl") {
        var regex = /hsl\(([^)]+)\)/;
        var matches = arg.match(regex);
        if (matches && matches.length > 1) {
          var extractedValues = matches[1];
          color = "hsl(" + extractedValues + ")";
        }
      } else if (colorType == "hsla") {
        var regex = /hsla\(([^)]+)\)/;
        var matches = arg.match(regex);
        if (matches && matches.length > 1) {
          var extractedValues = matches[1];
          color = "hsla(" + extractedValues + ")";
        }
      } else if (colorType == "rgba") {
        var regex = /rgba\(([^)]+)\)/;
        var matches = arg.match(regex);
        if (matches && matches.length > 1) {
          var extractedValues = matches[1];
          color = "rgba(" + extractedValues + ")";
        }
      } else if (colorType == "rgb") {
        var regex = /rgb\(([^)]+)\)/;
        var matches = arg.match(regex);
        if (matches && matches.length > 1) {
          var extractedValues = matches[1];
          color = "rgb(" + extractedValues + ")";
        }
      } else if (colorType == "#") {
        var regex = /#\w+/;
        var matches = arg.match(regex);
        if (matches) {
          var color = matches[0];
        }
      } else {
        var regexPattern = new RegExp(colorNames.join("|").toLocaleLowerCase(), "g");
        var matches = arg.match(regexPattern);
        if (matches && matches.length > 0) {
          color = matches[0];
        }
      }
      var placement = arg;
      if (inset) {
        placement = placement.replace("inset", "");
      }
      if (color) {
        placement = placement.replace(color, "");
      }
      var placementArr = placement.trim().split(" ");
      if (placementArr.length == 2) {
        var h = placementArr[0];
        var v = placementArr[1];
        var blur = "";
        var spread = "";
      } else if (placementArr.length == 3) {
        var h = placementArr[0];
        var v = placementArr[1];
        var blur = placementArr[2];
        var spread = "";
      } else if (placementArr.length == 4) {
        var h = placementArr[0];
        var v = placementArr[1];
        var blur = placementArr[2];
        var spread = placementArr[3];
      }
      sadhow_arr.push({
        h: h,
        v: v,
        blur: blur,
        spread: spread,
        inset: inset,
        color: color
      });
    });
    return sadhow_arr;
  };
  const [shadowObj, setShadowObj] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(getBoxShadowObj(shadows));
  // const [shadowObj, setShadowObj] = useState(isProFeature ? shadows[0] :getBoxShadowObj(shadows));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(valZ.includes(" !important") ? true : false);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
    //props.onChange(newVal + 'px ' + v + 'px ' + blur + 'px ' + spread + 'px ' + color, 'boxShadow');
    var stringArr = [];
    shadowObj.map((shadow, index) => {
      var h = shadow.h;
      var v = shadow.v;
      var blur = shadow.blur;
      var spread = shadow.spread;
      var inset = shadow.inset ? "inset" : "";
      var color = shadow.color;
      var item = [h, v, blur, spread, color, inset];
      var filtered = item.filter(function (el) {
        return el;
      });
      stringArr.push(filtered.join(" "));
    });
    stringArr = stringArr.join(",  ");
    if (isImportant) {
      stringArr = stringArr + " !important";
    } else {
      stringArr = stringArr;
    }
    props.onChange(stringArr, "boxShadow");
  }, [shadowObj, isImportant]);
  var unitArgs = [{
    label: "PX",
    value: "px"
  }, {
    label: "EM",
    value: "em"
  }, {
    label: "REM",
    value: "rem"
  }, {
    label: "%",
    value: "%"
  }, {
    label: "CM",
    value: "cm"
  }, {
    label: "MM",
    value: "mm"
  }, {
    label: "IN",
    value: "in"
  }, {
    label: "PT",
    value: "pt"
  }, {
    label: "PC",
    value: "pc"
  }, {
    label: "EX",
    value: "ex"
  }, {
    label: "CH",
    value: "ch"
  }, {
    label: "VW",
    value: "vw"
  }, {
    label: "VH",
    value: "vh"
  }, {
    label: "VMIN",
    value: "vmin"
  }, {
    label: "VMAX",
    value: "vmax"
  }];
  const [proText, setProText] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(false);
  const handleClick = () => {
    setProText(true);
    setTimeout(() => {
      setProText(false);
    }, 5000);
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("button", {
      className: "pg-font flex gap-2 justify-center my-2 cursor-pointer py-2 px-4 capitalize  bg-gray-700 text-white font-medium rounded hover:bg-gray-600 hover:text-white focus:outline-none focus:bg-gray-700",
      onClick: () => {
        if (isProFeature) {
          handleClick();
          return;
        }
        var shadowObjX = [...shadowObj];
        shadowObjX.push({
          h: "0px",
          v: "0px",
          blur: "10px",
          spread: "5px",
          inset: false,
          color: "#50547d4f"
        });
        setShadowObj(shadowObjX);
      },
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Add", "post-grid")
    }), proText && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", {
      href: "https://comboblocks.com/pricing/",
      className: "pg-text-color block py-2 px-1",
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Subscribe to add multiple shadows.", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.Fragment, {
      children: [shadowObj.map((shadow, index) => {
        var h = shadow.h;
        var v = shadow.v;
        var blur = shadow.blur;
        var spread = shadow.spread;
        var inset = shadow.inset;
        var color = shadow.color;
        var hVal = h.match(/-?\d+/g) == null ? 0 : h.match(/-?\d+/g)[0];
        var hUnit = h.match(/[a-zA-Z%]+/g) == null ? "px" : h.match(/[a-zA-Z%]+/g)[0];
        var vVal = v.match(/-?\d+/g) == null ? 0 : v.match(/-?\d+/g)[0];
        var vUnit = v.match(/[a-zA-Z%]+/g) == null ? "px" : v.match(/[a-zA-Z%]+/g)[0];
        var blurVal = blur.match(/-?\d+/g) == null ? 0 : blur.match(/-?\d+/g)[0];
        var blurUnit = blur.match(/[a-zA-Z%]+/g) == null ? "px" : blur.match(/[a-zA-Z%]+/g)[0];
        var spreadVal = spread.match(/-?\d+/g) == null ? 0 : spread.match(/-?\d+/g)[0];
        var spreadUnit = spread.match(/[a-zA-Z%]+/g) == null ? "px" : spread.match(/[a-zA-Z%]+/g)[0];
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelBody, {
          className: "font-medium text-slate-900 ",
          title: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.Fragment, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
              className: "cursor-pointer hover:bg-red-500 hover:text-white ",
              onClick: ev => {
                var shadowObjX = [...shadowObj];
                shadowObjX.splice(index, 1);
                setShadowObj(shadowObjX);
              },
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"]
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
              children: h + " " + v + " " + blur + " " + spread + " " + color + " " + (inset ? "inset" : "")
            })]
          })
          // title={
          // 	h +
          // 	" " +
          // 	v +
          // 	" " +
          // 	blur +
          // 	" " +
          // 	spread +
          // 	" " +
          // 	color +
          // 	" " +
          // 	(inset ? "inset" : "")
          // }
          ,
          initialOpen: false,
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("H-Offset", "post-grid")
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
              value: hVal,
              type: "number",
              onChange: newVal => {
                var shadowObjX = [...shadowObj];
                shadowObjX[index].h = newVal + hUnit;
                setShadowObj(shadowObjX);
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, {
              label: "",
              value: hUnit,
              options: unitArgs,
              onChange: newVal => {
                var shadowObjX = [...shadowObj];
                shadowObjX[index].h = hVal + newVal;
                setShadowObj(shadowObjX);
              }
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("V-Offset", "post-grid")
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
              value: vVal,
              type: "number",
              onChange: newVal => {
                var shadowObjX = [...shadowObj];
                shadowObjX[index].v = newVal + vUnit;
                setShadowObj(shadowObjX);
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, {
              label: "",
              value: vUnit,
              options: unitArgs,
              onChange: newVal => {
                var shadowObjX = [...shadowObj];
                shadowObjX[index].v = vVal + newVal;
                setShadowObj(shadowObjX);
              }
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Blur", "post-grid")
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
              value: blurVal,
              type: "number",
              onChange: newVal => {
                var shadowObjX = [...shadowObj];
                shadowObjX[index].blur = newVal + blurUnit;
                setShadowObj(shadowObjX);
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, {
              label: "",
              value: blurUnit,
              options: unitArgs,
              onChange: newVal => {
                var shadowObjX = [...shadowObj];
                shadowObjX[index].blur = blurVal + newVal;
                setShadowObj(shadowObjX);
              }
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Spread", "post-grid")
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
              value: spreadVal,
              type: "number",
              onChange: newVal => {
                var shadowObjX = [...shadowObj];
                shadowObjX[index].spread = newVal + spreadUnit;
                setShadowObj(shadowObjX);
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, {
              label: "",
              value: spreadUnit,
              options: unitArgs,
              onChange: newVal => {
                var shadowObjX = [...shadowObj];
                shadowObjX[index].spread = spreadVal + newVal;
                setShadowObj(shadowObjX);
              }
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Color", "post-grid")
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
            value: color,
            colors: _colors_presets__WEBPACK_IMPORTED_MODULE_1__["default"],
            enableAlpha: true,
            onChange: newVal => {
              var shadowObjX = [...shadowObj];
              shadowObjX[index].color = newVal;
              setShadowObj(shadowObjX);
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ToggleControl, {
            help: inset ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Inset Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Inset ?", "post-grid"),
            checked: inset,
            onChange: arg => {
              var shadowObjX = [...shadowObj];
              if (inset) {
                shadowObjX[index].inset = false;
              } else {
                shadowObjX[index].inset = true;
              }
              setShadowObj(shadowObjX);
            }
          })]
        });
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ToggleControl, {
        help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
        checked: isImportant,
        onChange: arg => {
          setImportant(isImportant => !isImportant);
        }
      })]
    })]
  });
}
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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBoxShadow);

/***/ }),

/***/ "./src/components/styles/css-box-sizing/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Box Sizing", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssBoxSizing);

/***/ }),

/***/ "./src/components/styles/css-caption-side/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/css-caption-side/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component,
  RawHTML
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }
  var args = {
    top: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Top", "post-grid"),
      value: "top"
    },
    bottom: {
      label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Bottom", "post-grid"),
      value: "bottom"
    },
    inherit: {
      label: "inherit",
      value: "inherit"
    },
    initial: {
      label: "initial",
      value: "initial"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Empty Cells", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
            className: "px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer",
            onClick: ev => {
              // props.onChange(x.value, 'captionSide');
              setalign(x.value);
              if (isImportant) {
                props.onChange(x.value + " !important", "captionSide");
              } else {
                props.onChange(x.value, "captionSide");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          props.onChange(align, "captionSide");
        } else {
          props.onChange(align + " !important", "captionSide");
        }
      }
    })]
  });
}
class PGcssCaptionSide 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssCaptionSide);

/***/ }),

/***/ "./src/components/styles/css-clear/index.js":
/*!**************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssClear);

/***/ }),

/***/ "./src/components/styles/css-clip/index.js":
/*!*************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__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 _colors_presets__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)({
    top: topX,
    right: rightX,
    bottom: bottomX,
    left: leftX
  });
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssClip);

/***/ }),

/***/ "./src/components/styles/css-color/index.js":
/*!**************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_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_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
const {
  Component
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(props.val.split(" "));
  const [val, setval] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(valArgs[1] == undefined ? false : true);
  const [customColor, setCustomColor] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)([]);
  const [newColorPreset, setNewColorPreset] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)([]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
    const transformedColors = customColor.map((color, index) => {
      const name = color.substring(1).toUpperCase();
      const upperCaseColor = color.toUpperCase();
      return {
        name,
        color: upperCaseColor
      };
    });
    // const newColor = transformedColors.concat(
    // 	colorsPresets.slice(0, 6 - transformedColors.length)
    // );
    let newColor;
    if (transformedColors.length >= 6) {
      newColor = transformedColors;
    } else {
      newColor = transformedColors.concat(_colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"].slice(0, 6 - transformedColors.length));
    }
    setNewColorPreset(newColor);
  }, [customColor]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "p-2 relative",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
        className: "mb-2",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
          label: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
          checked: isImportant,
          className: "!mb-0",
          onChange: arg => {
            setImportant(isImportant => !isImportant);
            if (isImportant) {
              props.onChange(val, "color");
            } else {
              props.onChange(val + " !important", "color");
            }
          }
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ColorPalette, {
        value: val,
        colors: newColorPreset,
        enableAlpha: true,
        onChange: newVal => {
          //props.onChange(newVal, 'color');
          setval(newVal);
          if (isImportant) {
            props.onChange(newVal + " !important", "color");
          } else {
            props.onChange(newVal, "color");
          }
        }
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
          htmlFor: "",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Global Value", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
          label: "",
          value: val,
          options: [{
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Choose", "post-grid"),
            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: true
    };
    this.handleToggleClick = this.handleToggleClick.bind(this);
  }
  handleToggleClick() {
    this.setState(state => ({
      showWarning: !state.showWarning
    }));
  }
  render() {
    var {
      val,
      enableAlpha,
      onChange,
      label
    } = this.props;
    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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        enableAlpha: enableAlpha,
        val: val,
        onChange: onChange,
        warn: this.state.showWarning,
        handleToggleClick: this.handleToggleClick
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssColor);

/***/ }),

/***/ "./src/components/styles/css-column-count/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssColumnCount);

/***/ }),

/***/ "./src/components/styles/css-column-gap/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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", "columnGap");
          } else {
            props.onChange(widthUnit, "columnGap");
          }
        } else {
          //props.onChange(newVal + widthUnit, 'columnGap');
          if (isImportant) {
            props.onChange(newVal + widthUnit + " !important", "columnGap");
          } else {
            props.onChange(newVal + widthUnit, "columnGap");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssColumnGap);

/***/ }),

/***/ "./src/components/styles/css-column-rule/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)(widthValX);
  const [widthUnitY, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [outlineimportantVal, setoutlineimportantVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(importantVal.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Width", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
        className: "flex justify-between items-center",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_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");
            }
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
            position: "bottom right",
            renderToggle: ({
              isOpen,
              onToggle
            }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
              title: "",
              onClick: onToggle,
              "aria-expanded": isOpen,
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                className: " ",
                children: unitArgs[widthUnitY] == undefined ? "Select..." : unitArgs[widthUnitY].label
              })
            }),
            renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
              className: "w-32",
              children: Object.entries(unitArgs).map(y => {
                var index = y[0];
                var x = y[1];
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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");
                    }
                  },
                  children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                    children: x.label
                  })
                });
              })
            })
          })
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      className: "my-2 flex justify-between items-center",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Style", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom right",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
            className: " ",
            children: outlineStyleArgs[styleVal] == undefined ? "Select..." : outlineStyleArgs[styleVal].label
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          className: "w-32",
          children: Object.entries(outlineStyleArgs).map(arg => {
            var index = arg[0];
            var x = arg[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("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");
                }
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                children: x.label
              })]
            });
          })
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
      htmlFor: "",
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Color", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__["default"], {
      value: colorVal,
      colors: _colors_presets__WEBPACK_IMPORTED_MODULE_3__["default"],
      enableAlpha: true,
      onChange: newVal => {
        if (outlineimportantVal) {
          props.onChange(widthVal + " " + styleVal + " " + newVal + " " + "!important", "columnRule");
        } else {
          props.onChange(widthVal + " " + styleVal + " " + newVal, "columnRule");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: outlineimportantVal ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssColumnRule);

/***/ }),

/***/ "./src/components/styles/css-content/index.js":
/*!****************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }
  var content = props.val == null || props.val == undefined ? " " : props.val;
  content = props.val.replaceAll('"', "");
  content = content.replaceAll("u2018", "'");
  content = content.replaceAll("u0022", "");
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    className: "mt-4",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: content,
      type: "text",
      onChange: newVal => {
        if (newVal.includes("attr")) {
          newVal = newVal.replaceAll('"', "u0022");
          newVal = newVal.replaceAll('"', "u2018");
          props.onChange(newVal, "content");
        }
        //setwidthVal(newVal);
        else {
          newVal = newVal.replaceAll('"', "u0022");
          newVal = newVal.replaceAll("'", "u2018");
          newVal = 'u0022' + newVal + 'u0022';

          // console.log(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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssContent);

/***/ }),

/***/ "./src/components/styles/css-counter-increment/index.js":
/*!**************************************************************!*\
  !*** ./src/components/styles/css-counter-increment/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }
  var content = props.val == null || props.val == undefined ? '' : props.val.replaceAll('"', '');
  content = content.replaceAll('u0022', '');
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    className: "mt-4",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: content,
      type: "text",
      onChange: newVal => {
        //setwidthVal(newVal);
        props.onChange('"' + newVal + '"', 'counterIncrement');
      }
    })
  });
}
class PGcssCounterIncrement 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssCounterIncrement);

/***/ }),

/***/ "./src/components/styles/css-counter-reset/index.js":
/*!**********************************************************!*\
  !*** ./src/components/styles/css-counter-reset/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }
  var content = props.val == null || props.val == undefined ? '' : props.val.replaceAll('"', '');
  content = content.replaceAll('u0022', '');
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    className: "mt-4",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: content,
      type: "text",
      onChange: newVal => {
        //setwidthVal(newVal);
        props.onChange('"' + newVal + '"', 'counterReset');
      }
    })
  });
}
class PGcssCounterReset 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssCounterReset);

/***/ }),

/***/ "./src/components/styles/css-counter-set/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/css-counter-set/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }
  var content = props.val == null || props.val == undefined ? '' : props.val.replaceAll('"', '');
  content = content.replaceAll('u0022', '');
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
    className: "mt-4",
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: content,
      type: "text",
      onChange: newVal => {
        //setwidthVal(newVal);
        props.onChange('"' + newVal + '"', 'counterSet');
      }
    })
  });
}
class PGcssCounterSet 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssCounterSet);

/***/ }),

/***/ "./src/components/styles/css-cursor/index.js":
/*!***************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssCursor);

/***/ }),

/***/ "./src/components/styles/css-direction/index.js":
/*!******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Align Content", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssDirection);

/***/ }),

/***/ "./src/components/styles/css-display/index.js":
/*!****************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom left",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssDisplay);

/***/ }),

/***/ "./src/components/styles/css-empty-cells/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/css-empty-cells/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component,
  RawHTML
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }
  var args = {
    show: {
      label: "Show",
      value: "show"
    },
    hide: {
      label: "Hide",
      value: "hide"
    },
    inherit: {
      label: "inherit",
      value: "inherit"
    },
    initial: {
      label: "initial",
      value: "initial"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Empty Cells", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
            className: "px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer",
            onClick: ev => {
              // props.onChange(x.value, 'emptyCells');
              setalign(x.value);
              if (isImportant) {
                props.onChange(x.value + " !important", "emptyCells");
              } else {
                props.onChange(x.value, "emptyCells");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          props.onChange(align, "emptyCells");
        } else {
          props.onChange(align + " !important", "emptyCells");
        }
      }
    })]
  });
}
class PGcssEmptyCells 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssEmptyCells);

/***/ }),

/***/ "./src/components/styles/css-filter/index.js":
/*!***************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
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_2__.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_2__.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_2__.useEffect)(() => {}, [valArgs]);
  const [filterArgs, setfilterArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
    className: "mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
      className: "flex",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_3__["default"], {
        position: "bottom right",
        variant: "secondary",
        options: filterArgs,
        buttonTitle: "Add Filter",
        onChange: addFilter,
        values: ""
      })
    }), valArgs != undefined && valArgs.map((arg, i) => {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
        className: "flex my-3 items-center justify-between",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
          htmlFor: "",
          children: filterArgs[arg.id] != undefined ? filterArgs[arg.id].label : arg.id
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
          className: "flex",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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');
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            className: "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);
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              className: "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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFilter);

/***/ }),

/***/ "./src/components/styles/css-flex-basis/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: widthVal,
      type: "number",
      onChange: newVal => {
        setwidthVal(newVal);
        props.onChange(newVal + widthUnit, "flexBasis");
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: props.val ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexBasis);

/***/ }),

/***/ "./src/components/styles/css-flex-direction/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valX.split(" "));
  const [value, setValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[value] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[value].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
              }
            },
            children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      label: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexDirection);

/***/ }),

/***/ "./src/components/styles/css-flex-flow/index.js":
/*!******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* 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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.split(" "));
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: "Select..."
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), valArgs.map((x, i) => {
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
        className: "flex items-center my-1 border hover:bg-gray-400 cursor-pointer",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
          className: "bg-red-500 mr-2 p-1",
          onClick: ev => {
            valArgs.splice(i, 1);
            setValArgs(valArgs);
            props.onChange(valArgs.join(" "), "flexFlow");
          },
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
            fill: "#fff",
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexFlow);

/***/ }),

/***/ "./src/components/styles/css-flex-grow/index.js":
/*!******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4 justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: widthVal,
      type: "number",
      onChange: newVal => {
        setwidthVal(newVal);
        props.onChange(newVal, "flexGrow");
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexGrow);

/***/ }),

/***/ "./src/components/styles/css-flex-shrink/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4 justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: widthVal,
      type: "number",
      onChange: newVal => {
        setwidthVal(newVal);
        props.onChange(newVal, "flexShrink");
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexShrink);

/***/ }),

/***/ "./src/components/styles/css-flex-wrap/index.js":
/*!******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valX.split(" "));
  const [value, setValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Clear', "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[value] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[value].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
              }
            },
            children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      label: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFlexWrap);

/***/ }),

/***/ "./src/components/styles/css-float/index.js":
/*!**************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFloat);

/***/ }),

/***/ "./src/components/styles/css-font-family/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/plus.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-sortablejs */ "./node_modules/react-sortablejs/dist/index.js");
/* harmony import */ var react_sortablejs__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_sortablejs__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch");
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
const {
  Component
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }
  var isLoaded = props.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_2__.useState)(props.val == null || props.val == undefined || props.val.length == 0 ? [] : valZ.split(","));
  const [keyword, setkeyword] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)("");
  const [fontsFiltered, setfontsFiltered] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)([]);
  const [customFonts, setCustomFonts] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)([]);
  const [fontFaceCSS, setFontFaceCSS] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)("");
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useEffect)(() => {
    if (window.postGridBlockEditor.customFonts !== undefined && window.postGridBlockEditor.customFonts.length != 0) {
      setCustomFonts(window.postGridBlockEditor.customFonts);
    }
  }, [window.postGridBlockEditor]);
  // useEffect(() => {
  // 	apiFetch({
  // 		path: "/post-grid/v2/get_options",
  // 		method: "POST",
  // 		data: { option: "post_grid_block_editor" },
  // 	}).then((res) => {
  // 		if (res.customFonts !== undefined && res.customFonts.length != 0) {
  // 			setCustomFonts(res.customFonts);
  // 		}
  // 	});
  // }, []);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useEffect)(() => {
    var str = "";
    {
      customFonts.length != 0 && customFonts.map((font, index) => {
        var fontFamily = font.family;
        var src = font.src[0]?.url;
        var fontWeight = font.weight;
        str += `@font-face {
    font-family: '${fontFamily}';
    src: url('${src}');
    font-weight: ${fontWeight};
  }`;
      });
    }
    setFontFaceCSS(str);
    var wpfooter = document.getElementById("wpfooter");
    var divWrap = document.getElementById("pg-font-face");
    if (divWrap != undefined) {
      document.getElementById("pg-font-face").outerHTML = "";
    }
    var divWrap = '<div id="pg-font-face"></div>';
    wpfooter.insertAdjacentHTML("beforeend", divWrap);
    var csswrappg = document.getElementById("pg-font-face");
    var fontFace = "<style>" + str + "</style>";
    csswrappg.insertAdjacentHTML("beforeend", fontFace);
  }, [customFonts]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    className: " mt-4",
    children: [!isLoaded && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Spinner, {})
    }), isLoaded && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_sortablejs__WEBPACK_IMPORTED_MODULE_3__.ReactSortable, {
        list: fonts,
        setList: item => {
          setfonts(item);
          props.onChange(item.toString(), "fontFamily");
        },
        children: fonts.map((font, i) => {
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
            className: "flex my-3 items-center justify-between cursor-move hover:bg-gray-300",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
              className: "flex items-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("span", {
                className: "bg-red-500 p-1 mr-2 cursor-pointer ",
                onClick: ev => {
                  fonts.splice(i, 1);
                  setfonts(fonts);
                  props.onChange(fonts.toString(), "fontFamily");
                },
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], {
                  fill: "#fff",
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"]
                })
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("span", {
                style: {
                  fontFamily: font
                },
                children: font
              })]
            }), i == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
              className: "bg-yellow-500 p-1",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Primary", "post-grid")
            })]
          }, i);
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
        className: "flex justify-between",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_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);
              }
            });
            setfontsFiltered(newOptions);
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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");
          },
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Add", "post-grid")
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
        className: "my-3 h-60 overflow-y-scroll",
        children: [keyword.length == 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
          children: [customFonts.length > 0 && customFonts.map(font => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
              className: "p-1 my-1 bg-white hover:bg-gray-300 border flex items-center cursor-pointer",
              style: {
                fontFamily: font.family
              },
              onClick: ev => {
                var fontsX = fonts.unshift(font.family);
                var fontsY = fonts.slice(0, 3);
                // var fontsY = fonts.slice(0, 3);
                setfonts(fontsY);
                props.onChange(fontsY.toString(), "fontFamily");
              },
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("span", {
                children: [" ", font.family]
              })]
            });
          }), fontsLibrary.map(font => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("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");
              },
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("span", {
                children: [" ", font]
              })]
            });
          })]
        }), keyword.length > 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
          children: fontsFiltered.map(font => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("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");
              },
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], {
                icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("span", {
                children: [" ", font]
              })]
            });
          })
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {})]
  });
}
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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning,
      isLoaded: this.state.isLoaded
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontFamily);

/***/ }),

/***/ "./src/components/styles/css-font-size/index.js":
/*!******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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;
  valZ = typeof valZ == "object" ? (valZ.val == undefined ? "px" : valZ.val) + (valZ.unit == undefined ? "px" : valZ.unit) : valZ;
  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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontSize);

/***/ }),

/***/ "./src/components/styles/css-font-stretch/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontStretch);

/***/ }),

/***/ "./src/components/styles/css-font-style/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontStyle);

/***/ }),

/***/ "./src/components/styles/css-font-variant-caps/index.js":
/*!**************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontVariantCaps);

/***/ }),

/***/ "./src/components/styles/css-font-weight/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssFontWeight);

/***/ }),

/***/ "./src/components/styles/css-gap/index.js":
/*!************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGap);

/***/ }),

/***/ "./src/components/styles/css-grid-auto-columns/index.js":
/*!**************************************************************!*\
  !*** ./src/components/styles/css-grid-auto-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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component
} = wp.element;





function Html(props) {
  if (!props.warn) {
    return null;
  }
  var unitArgs = {
    px: {
      label: "PX",
      value: "px"
    },
    fr: {
      label: "FR",
      value: "fr"
    },
    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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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", "gridAutoColumns");
          } else {
            props.onChange(widthUnit, "gridAutoColumns");
          }
        } else {
          //props.onChange(newVal + widthUnit, 'width');
          if (isImportant) {
            props.onChange(newVal + widthUnit + " !important", "gridAutoColumns");
          } else {
            props.onChange(newVal + widthUnit, "gridAutoColumns");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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", "gridAutoColumns");
                  } else {
                    props.onChange(x.value, "gridAutoColumns");
                  }
                } else {
                  if (isImportant) {
                    props.onChange(widthVal + x.value + " !important", "gridAutoColumns");
                  } else {
                    props.onChange(widthVal + x.value, "gridAutoColumns");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          if (widthUnit == "auto") {
            props.onChange(widthUnit, "gridAutoColumns");
          } else {
            props.onChange(widthVal + widthUnit, "gridAutoColumns");
          }
        } else {
          if (widthUnit == "auto") {
            props.onChange(widthUnit + " !important", "gridAutoColumns");
          } else {
            props.onChange(widthVal + widthUnit + " !important", "gridAutoColumns");
          }
        }
      }
    })]
  });
}
class PGcssGridAutoColumns 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridAutoColumns);

/***/ }),

/***/ "./src/components/styles/css-grid-auto-flow/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/css-grid-auto-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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component,
  RawHTML
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }
  var args = {
    column: {
      label: "column",
      value: "column"
    },
    row: {
      label: "row",
      value: "row"
    },
    dense: {
      label: "dense",
      value: "dense"
    },
    "column-dense": {
      label: "column dense",
      value: "column-dense"
    },
    "row-dense": {
      label: "row dense",
      value: "row-dense"
    },
    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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Place Items", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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", "gridAutoFlow");
              } else {
                props.onChange(x.value, "gridAutoFlow");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          props.onChange(align, "gridAutoFlow");
        } else {
          props.onChange(align + " !important", "gridAutoFlow");
        }
      }
    })]
  });
}
class PGcssGridAutoFlow 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridAutoFlow);

/***/ }),

/***/ "./src/components/styles/css-grid-column-end/index.js":
/*!************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4 justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridColumnEnd);

/***/ }),

/***/ "./src/components/styles/css-grid-column-start/index.js":
/*!**************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridColumnStart);

/***/ }),

/***/ "./src/components/styles/css-grid-row-end/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridRowEnd);

/***/ }),

/***/ "./src/components/styles/css-grid-row-start/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4 justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridRowStart);

/***/ }),

/***/ "./src/components/styles/css-grid-template-columns/index.js":
/*!******************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)(valParts);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useEffect)(() => {}, [props.val]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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);
        props.onChange(valArgsX.join(' '), 'gridTemplateColumns');
      },
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Add", "post-grid")
    }), 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';
      // var valNumber = (valArgs[0] == undefined || valArgs[0].match(/-?\d+/g) == null) ? 0 : valArgs[0].match(/-?\d+/g)[0];
      //   var valUnit = (valArgs[0] == undefined || valArgs[0].match(/[a-zA-Z%]+/g) == null) ? 'px' : valArgs[0].match(/[a-zA-Z%]+/g)[0];
      return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
        className: "my-2",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
          className: "flex justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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');
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], {
              fill: "#fff",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_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');
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
              position: "bottom right",
              renderToggle: ({
                isOpen,
                onToggle
              }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
                title: "",
                onClick: onToggle,
                "aria-expanded": isOpen,
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                  className: " ",
                  children: valUnit != undefined ? unitArgs[valUnit].label : 'Select...'
                })
              }),
              renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                className: "w-32",
                children: Object.entries(unitArgs).map(y => {
                  var j = y[0];
                  var x = y[1];
                  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                    className: 'px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer',
                    onClick: ev => {
                      //props.onChange(valNumber + x.value, 'border');
                      var valIndex = valNumber + x.value;
                      valArgs[index] = valIndex;
                      setvalArgs(valArgs);
                      props.onChange(valArgs.join(' '), 'gridTemplateColumns');
                    },
                    children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                      children: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridTemplateColumns);

/***/ }),

/***/ "./src/components/styles/css-grid-template-rows/index.js":
/*!***************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _components_input_color_picker__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/input-color-picker */ "./src/components/input-color-picker/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.useState)(valParts);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useEffect)(() => {}, [props.val]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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);
        props.onChange(valArgsX.join(" "), "gridTemplateRows");
      },
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Add", "post-grid")
    }), 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
        className: "my-2",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
          className: "flex justify-between items-center",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("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");
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"], {
              fill: "#fff",
              icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"]
            })
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_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");
            }
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
              position: "bottom right",
              renderToggle: ({
                isOpen,
                onToggle
              }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
                title: "",
                onClick: onToggle,
                "aria-expanded": isOpen,
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                  className: " ",
                  children: valUnit != undefined ? unitArgs[valUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
                })
              }),
              renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                className: "w-32",
                children: Object.entries(unitArgs).map(y => {
                  var j = y[0];
                  var x = y[1];
                  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
                    className: "px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer",
                    onClick: ev => {
                      //props.onChange(valNumber + x.value, 'border');
                      var valIndex = valNumber + x.value;
                      valArgs[index] = valIndex;
                      setvalArgs(valArgs);
                      props.onChange(valArgs.join(" "), "gridTemplateRows");
                    },
                    children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.Fragment, {
                      children: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssGridTemplateRows);

/***/ }),

/***/ "./src/components/styles/css-height/index.js":
/*!***************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssHeight);

/***/ }),

/***/ "./src/components/styles/css-justify-content/index.js":
/*!************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Align Content",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssJustifyContent);

/***/ }),

/***/ "./src/components/styles/css-left/index.js":
/*!*************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssLeft);

/***/ }),

/***/ "./src/components/styles/css-letter-spacing/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "Letter Spacing",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: props.val ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssLetterSpacing);

/***/ }),

/***/ "./src/components/styles/css-line-height/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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"
    },
    normal: {
      label: "Normal",
      value: "normal"
    },
    "%": {
      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_2__.useState)(valZ.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
    children: [(widthUnit != "max-content" || widthUnit != "min-content" || widthUnit != "inherit" || widthUnit != "initial" || widthUnit != "revert" || widthUnit != "revert-layer" || widthUnit != "unset") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "flex justify-between items-center",
      children: [widthUnit != "normal" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
        value: widthVal,
        type: "number",
        disabled: widthUnit == "normal" || widthUnit == "max-content" || widthUnit == "min-content" || widthUnit == "inherit" || widthUnit == "initial" || widthUnit == "revert" || widthUnit == "revert-layer" || widthUnit == "unset" ? true : false,
        onChange: newVal => {
          setwidthVal(newVal);
          if (widthUnit == "normal") {
            // props.onChange(widthUnit, 'lineHeight');
            if (isImportant) {
              props.onChange(widthUnit + " !important", "lineHeight");
            } else {
              props.onChange(widthUnit, "lineHeight");
            }
          } else {
            //props.onChange(newVal + widthUnit, 'lineHeight');
            if (isImportant) {
              props.onChange(newVal + widthUnit + " !important", "lineHeight");
            } else {
              props.onChange(newVal + widthUnit, "lineHeight");
            }
          }
        }
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
          position: "bottom left",
          renderToggle: ({
            isOpen,
            onToggle
          }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
            title: "",
            onClick: onToggle,
            "aria-expanded": isOpen,
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              className: " ",
              children: unitArgs[widthUnit] == undefined ? "Select..." : unitArgs[widthUnit].label
            })
          }),
          renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: "w-32",
            children: Object.entries(unitArgs).map(y => {
              var index = y[0];
              var x = y[1];
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                className: "px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer",
                onClick: ev => {
                  setwidthUnit(x.value);
                  if (x.value == "normal") {
                    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");
                    }
                  }
                },
                children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                  children: x.label
                })
              });
            })
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
        help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
        checked: isImportant,
        onChange: arg => {
          setImportant(isImportant => !isImportant);
          if (isImportant) {
            if (widthUnit == "normal") {
              props.onChange(widthUnit, "lineHeight");
            } else {
              props.onChange(widthVal + widthUnit, "lineHeight");
            }
          } else {
            if (widthUnit == "normal") {
              props.onChange(widthUnit + " !important", "lineHeight");
            } else {
              props.onChange(widthVal + widthUnit + " !important", "lineHeight");
            }
          }
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("label", {
          htmlFor: "",
          children: [(0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Global Value", "post-grid"), " "]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
          label: "",
          value: widthUnit,
          options: [{
            label: "Choose",
            value: "px"
          }, {
            label: "normal",
            value: "normal"
          }, {
            label: "Inherit",
            value: "inherit"
          }, {
            label: "Initial",
            value: "initial"
          }, {
            label: "Revert",
            value: "revert"
          }, {
            label: "Revert-layer",
            value: "revert-layer"
          }, {
            label: "Unset",
            value: "unset"
          }],
          onChange: newVal => {
            setwidthUnit(newVal);
            if (newVal == "normal" || newVal == "max-content" || newVal == "min-content" || newVal == "inherit" || newVal == "initial" || newVal == "revert" || newVal == "revert-layer" || newVal == "unset") {
              if (isImportant) {
                props.onChange(newVal + " !important", "lineHeight");
              } else {
                props.onChange(newVal, "lineHeight");
              }
            } else {
              if (isImportant) {
                props.onChange(widthVal + newVal + " !important", "lineHeight");
              } else {
                props.onChange(widthVal + newVal, "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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssLineHeight);

/***/ }),

/***/ "./src/components/styles/css-list-style/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../components/dropdown */ "./src/components/dropdown/index.js");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__);
const {
  Component,
  RawHTML
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }
  var valParts = props.val != undefined ? props.val.split(" ") : ['square', 'inside', 'url("")'];
  var type = valParts[0] != undefined ? valParts[0] : 'square';
  var position = valParts[1] != undefined ? valParts[1] : 'inside';
  var image = valParts[2] != undefined ? valParts[2] : 'url("")';
  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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Type", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
        position: "bottom right",
        variant: "secondary",
        options: typeArgs,
        buttonTitle: type,
        onChange: (option, index) => {
          props.onChange(option.value + ' ' + position + ' ' + image, 'listStyle');
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Position", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["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');
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
      className: "my-3",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("img", {
        src: imageVal,
        alt: ""
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__.MediaUploadCheck, {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_5__.MediaUpload, {
        className: "bg-gray-700 hover:bg-gray-600",
        onSelect: media => {
          // media.id
          props.onChange(type + ' ' + position + ' url("' + media.url + '")', 'listStyle');
        },
        onClose: () => {},
        allowedTypes: ALLOWED_MEDIA_TYPES,
        render: ({
          open
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          className: "my-3 bg-gray-700 hover:bg-gray-600 text-white border border-solid border-gray-300 text-center w-full",
          onClick: open,
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Open Media Library", "post-grid")
        })
      })
    })]
  });
}
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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssListStyle);

/***/ }),

/***/ "./src/components/styles/css-margin-bottom/index.js":
/*!**********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMarginBottom);

/***/ }),

/***/ "./src/components/styles/css-margin-left/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMarginLeft);

/***/ }),

/***/ "./src/components/styles/css-margin-right/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMarginRight);

/***/ }),

/***/ "./src/components/styles/css-margin-top/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMarginTop);

/***/ }),

/***/ "./src/components/styles/css-margin/index.js":
/*!***************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__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 _colors_presets__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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 = "";
    var valParts = [topX, rightX, bottomX, leftX, ""];
  } 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_2__.useState)({
    top: topX,
    right: rightX,
    bottom: bottomX,
    left: leftX
  });
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valParts.includes("!important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMargin);

/***/ }),

/***/ "./src/components/styles/css-max-height/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMaxHeight);

/***/ }),

/***/ "./src/components/styles/css-max-width/index.js":
/*!******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMaxWidth);

/***/ }),

/***/ "./src/components/styles/css-min-height/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes(" !important") ? true : false);
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMinHeight);

/***/ }),

/***/ "./src/components/styles/css-min-width/index.js":
/*!******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssMinWidth);

/***/ }),

/***/ "./src/components/styles/css-object-fit/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssObjectFit);

/***/ }),

/***/ "./src/components/styles/css-opacity/index.js":
/*!****************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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.toString();
  const [widthVal, setwidthVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: widthVal,
      type: "number",
      min: "0",
      max: "1",
      step: "0.01",
      onChange: newVal => {
        setwidthVal(newVal);
        if (isImportant) {
          props.onChange(newVal + " !important", "opacity");
        } else {
          props.onChange(newVal, "opacity");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          props.onChange(widthVal, "opacity");
        } else {
          props.onChange(widthVal + " !important", "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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOpacity);

/***/ }),

/***/ "./src/components/styles/css-order/index.js":
/*!**************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOrder);

/***/ }),

/***/ "./src/components/styles/css-outline-offset/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
      value: widthVal,
      type: "number",
      onChange: newVal => {
        setwidthVal(newVal);
        props.onChange(newVal + widthUnit, 'outlineOffset');
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: props.val ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)('Select...', "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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');
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOutlineOffset);

/***/ }),

/***/ "./src/components/styles/css-outline/index.js":
/*!****************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__);
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_5__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Width", "post-grid")
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.RangeControl, {
      min: "0",
      max: "100",
      step: "1",
      value: blur,
      onChange: newVal => {
        props.onChange(+newVal + "px " + style + " " + color, "outline");
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
        htmlFor: "",
        children: "Style"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
        position: "bottom right",
        variant: "secondary",
        options: styleArgs,
        buttonTitle: styleArgs[style] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Choose", "post-grid") : styleArgs[style].label,
        onChange: (option, index) => {
          props.onChange(blur + "px " + option.value + " " + color, "outline");
        },
        values: ""
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
      for: "",
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Color", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_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");
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssoutline);

/***/ }),

/***/ "./src/components/styles/css-overflow-x/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOverflowX);

/***/ }),

/***/ "./src/components/styles/css-overflow-y/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOverflowY);

/***/ }),

/***/ "./src/components/styles/css-overflow/index.js":
/*!*****************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssOverflow);

/***/ }),

/***/ "./src/components/styles/css-padding-bottom/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPaddingBottom);

/***/ }),

/***/ "./src/components/styles/css-padding-left/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPaddingLeft);

/***/ }),

/***/ "./src/components/styles/css-padding-right/index.js":
/*!**********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPaddingRight);

/***/ }),

/***/ "./src/components/styles/css-padding-top/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPaddingTop);

/***/ }),

/***/ "./src/components/styles/css-padding/index.js":
/*!****************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__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 _colors_presets__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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 = "";
    var valParts = [topX, rightX, bottomX, leftX, ""];
  } 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_2__.useState)({
    top: topX,
    right: rightX,
    bottom: bottomX,
    left: leftX
  });
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valParts == undefined ? false : valParts.includes("!important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPadding);

/***/ }),

/***/ "./src/components/styles/css-perspective/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: props.val ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPerspective);

/***/ }),

/***/ "./src/components/styles/css-place-items/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/css-place-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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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"
    },
    "self-end": {
      label: "self end	",
      value: "self-start"
    },
    "self-start": {
      label: "self start	",
      value: "self-start"
    },
    "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"
    },
    right: {
      label: "right",
      value: "right"
    },
    left: {
      label: "left",
      value: "left"
    },
    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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Place Items", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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", "placeItems");
              } else {
                props.onChange(x.value, "placeItems");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          props.onChange(align, "placeItems");
        } else {
          props.onChange(align + " !important", "placeItems");
        }
      }
    })]
  });
}
class PGcssPlaceItems 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPlaceItems);

/***/ }),

/***/ "./src/components/styles/css-position/index.js":
/*!*****************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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;
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valX.split(" "));
  const [value, setValue] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[value] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[value].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
              }
            },
            children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      label: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssPosition);

/***/ }),

/***/ "./src/components/styles/css-right/index.js":
/*!**************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssRight);

/***/ }),

/***/ "./src/components/styles/css-row-gap/index.js":
/*!****************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssRowGap);

/***/ }),

/***/ "./src/components/styles/css-table-layout/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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"
    },
    inherit: {
      label: "inherit",
      value: "inherit"
    },
    initial: {
      label: "initial",
      value: "initial"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "Empty Cells",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
            className: "px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer",
            onClick: ev => {
              // props.onChange(x.value, 'tableLayout');
              setalign(x.value);
              if (isImportant) {
                props.onChange(x.value + " !important", "tableLayout");
              } else {
                props.onChange(x.value, "tableLayout");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          props.onChange(align, "tableLayout");
        } else {
          props.onChange(align + " !important", "tableLayout");
        }
      }
    })]
  });
}
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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTableLayout);

/***/ }),

/***/ "./src/components/styles/css-text-align-last/index.js":
/*!************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__);
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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
          className: " ",
          children: props.val ? args[props.val].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", {
            className: "px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer",
            onClick: ev => {
              onChange(x.value, "textAlignLast");
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.Fragment, {
              children: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextAlignLast);

/***/ }),

/***/ "./src/components/styles/css-text-align/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
const {
  Component,
  RawHTML
} = wp.element;







function Html(props) {
  if (!props.warn) {
    return null;
  }
  var args = {
    left: {
      label: "left",
      value: "left"
    },
    center: {
      label: "center",
      value: "center"
    },
    right: {
      label: "right",
      value: "right"
    },
    justify: {
      label: "justify",
      value: "justify"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      className: "flex items-center justify-around",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: `flex items-center justify-center w-[30px] h-[30px] border cursor-pointer 
						${align === "left" ? "bg-blue-600 text-white " : ""}
					`,
        onClick: ev => {
          if (!isImportant) {
            props.onChange("left", "textAlign");
          } else {
            props.onChange("left" + " !important", "textAlign");
          }
          setalign("left");
          // props.onChange("left", "textAlign");
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("svg", {
          width: "24",
          height: "24",
          xmlns: "http://www.w3.org/2000/svg",
          viewBox: "0 0 24 24",
          "aria-hidden": "true",
          focusable: "false",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("path", {
            d: "M4 19.8h8.9v-1.5H4v1.5zm8.9-15.6H4v1.5h8.9V4.2zm-8.9 7v1.5h16v-1.5H4z"
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: `flex items-center justify-center w-[30px] h-[30px] border cursor-pointer ${align === "center" ? "bg-blue-600 text-white " : ""}`,
        onClick: ev => {
          if (!isImportant) {
            props.onChange("center", "textAlign");
          } else {
            props.onChange("center" + " !important", "textAlign");
          }
          setalign("center");
          // props.onChange("center", "textAlign");
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("svg", {
          width: "24",
          height: "24",
          xmlns: "http://www.w3.org/2000/svg",
          viewBox: "0 0 24 24",
          "aria-hidden": "true",
          focusable: "false",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("path", {
            d: "M16.4 4.2H7.6v1.5h8.9V4.2zM4 11.2v1.5h16v-1.5H4zm3.6 8.6h8.9v-1.5H7.6v1.5z"
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: `flex items-center justify-center w-[30px] h-[30px] border cursor-pointer ${align === "right" ? "bg-blue-600 text-white " : ""}`,
        onClick: ev => {
          if (!isImportant) {
            props.onChange("right", "textAlign");
          } else {
            props.onChange("right" + " !important", "textAlign");
          }
          setalign("right");
          // props.onChange("right", "textAlign");
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("svg", {
          width: "24",
          height: "24",
          xmlns: "http://www.w3.org/2000/svg",
          viewBox: "0 0 24 24",
          "aria-hidden": "true",
          focusable: "false",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("path", {
            d: "M11.1 19.8H20v-1.5h-8.9v1.5zm0-15.6v1.5H20V4.2h-8.9zM4 12.8h16v-1.5H4v1.5z"
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: `flex items-center justify-center w-[30px] h-[30px] border cursor-pointer ${align === "justify" ? "bg-blue-600 text-white " : ""}`,
        onClick: ev => {
          if (!isImportant) {
            props.onChange("justify", "textAlign");
          } else {
            props.onChange("justify" + " !important", "textAlign");
          }
          setalign("justify");
          // props.onChange("justify", "textAlign");
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("svg", {
          width: "20",
          height: "20",
          viewBox: "0 0 24 24",
          "aria-hidden": "true",
          xmlns: "http://www.w3.org/2000/svg",
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("rect", {
            width: "20",
            height: "2.35838",
            fill: "black"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("rect", {
            y: "10.8208",
            width: "20",
            height: "2.35838",
            fill: "black"
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("rect", {
            y: "21.6416",
            width: "20",
            height: "2.35838",
            fill: "black"
          })]
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          props.onChange(align, "textAlign");
        } else {
          props.onChange(align + " !important", "textAlign");
        }
      }
    })]
  });
}
class PGcssTextAlign extends Component {
  // var { onChange } = this.props;
  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;
    // function Html(prop) {
    //   var args = {
    //     left: { label: "left", value: "left" },
    //     center: { label: "center", value: "center" },
    //     right: { label: "right", value: "right" },
    //     justify: { label: "justify", value: "justify" },
    //   };
    //   const [isImportant, setImportant] = useState(
    //     valArgs[1] == undefined ? false : true
    //   );
    //   return (
    //     <>
    //       <div>
    //         <div
    //           className={[
    //             val == "left"
    //               ? "bg-gray-700 hover:bg-gray-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");
    //           }}
    //         >
    //           <svg
    //             width="24"
    //             height="24"
    //             xmlns="http://www.w3.org/2000/svg"
    //             viewBox="0 0 24 24"
    //             aria-hidden="true"
    //             focusable="false"
    //           >
    //             <path d="M4 19.8h8.9v-1.5H4v1.5zm8.9-15.6H4v1.5h8.9V4.2zm-8.9 7v1.5h16v-1.5H4z"></path>
    //           </svg>
    //         </div>
    //         <div
    //           className={[
    //             val == "center"
    //               ? "bg-gray-700 hover:bg-gray-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");
    //           }}
    //         >
    //           <svg
    //             width="24"
    //             height="24"
    //             xmlns="http://www.w3.org/2000/svg"
    //             viewBox="0 0 24 24"
    //             aria-hidden="true"
    //             focusable="false"
    //           >
    //             <path d="M16.4 4.2H7.6v1.5h8.9V4.2zM4 11.2v1.5h16v-1.5H4zm3.6 8.6h8.9v-1.5H7.6v1.5z"></path>
    //           </svg>
    //         </div>
    //         <div
    //           className={[
    //             val == "right"
    //               ? "bg-gray-700 hover:bg-gray-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");
    //           }}
    //         >
    //           <svg
    //             width="24"
    //             height="24"
    //             xmlns="http://www.w3.org/2000/svg"
    //             viewBox="0 0 24 24"
    //             aria-hidden="true"
    //             focusable="false"
    //           >
    //             <path d="M11.1 19.8H20v-1.5h-8.9v1.5zm0-15.6v1.5H20V4.2h-8.9zM4 12.8h16v-1.5H4v1.5z"></path>
    //           </svg>
    //         </div>
    //         <div
    //           className={[
    //             val == "justify"
    //               ? "bg-gray-700 hover:bg-gray-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");
    //           }}
    //         >
    //           <svg
    //             width="20"
    //             height="20"
    //             viewBox="0 0 24 24"
    //             aria-hidden="true"
    //             xmlns="http://www.w3.org/2000/svg"
    //           >
    //             <rect width="20" height="2.35838" fill="black" />
    //             <rect y="10.8208" width="20" height="2.35838" fill="black" />
    //             <rect y="21.6416" width="20" height="2.35838" fill="black" />
    //           </svg>
    //         </div>
    //       </div>
    //       {/* <ToggleControl
    //         help={isImportant ? __('Important (Enabled)',"post-grid")
    // : __('Important?',"post-grid")}
    //         checked={isImportant}
    //         onChange={(arg) => {
    //           setImportant((isImportant) => !isImportant);
    //           if (isImportant) {
    //             props.onChange(align, "textAlign");
    //           } else {
    //             props.onChange(align + " !important", "textAlign");
    //           }
    //         }}
    //       /> */}
    //     </>
    //   );
    // }
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextAlign);

/***/ }),

/***/ "./src/components/styles/css-text-decoration/index.js":
/*!************************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _colors_presets__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../colors-presets */ "./src/colors-presets.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
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_2__.useState)(thicknessValX);
  var [thicknessUnitY, setthicknessUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(thicknessUnitX);
  var [outlinelineVal, setoutlinelineVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(lineVal);
  var [outlineColorVal, setoutlineColorVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(colorVal);
  var [outlineStyleVal, setoutlineStyleVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(styleVal);
  var [outlineThicknessVal, setoutlineThicknessVal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(thicknessValY + thicknessUnitY);
  var [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  var [textDecoration, setTextDecoration] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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_2__.useEffect)(() => {}, [textDecoration]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useEffect)(() => {
    //
    var valParts = props.val != undefined ? props.val.split(" ") : ["underline", "#000000", "wavy", "1px"];
  }, [props.val]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      className: "my-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Line", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
        className: "my-3",
        children: Object.entries(lineArgs).map(arg => {
          var i = arg[0];
          var x = arg[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
            className: outlinelineVal != undefined && outlinelineVal.indexOf(x.value) !== -1 ? "!bg-gray-700 hover:bg-gray-600 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");
                }
              }
            },
            children: x.label
          });
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      className: "my-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Color", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ColorPalette, {
        value: outlineColorVal,
        colors: _colors_presets__WEBPACK_IMPORTED_MODULE_3__["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");
          }
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      className: "my-2 flex justify-between items-center pg-setting-css-components",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Style", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom right",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
            className: " ",
            children: outlineStyleVal ? styleArgs[outlineStyleVal].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(styleArgs).map(arg => {
            var index = arg[0];
            var x = arg[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("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");
                }
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                children: x.label
              })]
            });
          })
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      className: "my-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
        htmlFor: "",
        children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Thickness", "post-grid")
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
        className: "flex justify-between items-center pg-setting-css-components",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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");
            }
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
            position: "bottom right",
            renderToggle: ({
              isOpen,
              onToggle
            }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
              title: "",
              onClick: onToggle,
              "aria-expanded": isOpen,
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
                className: " ",
                children: thicknessUnitY != undefined ? unitArgs[thicknessUnitY].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
              })
            }),
            renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
              className: "w-32 pg-font",
              children: Object.entries(unitArgs).map(y => {
                var index = y[0];
                var x = y[1];
                return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("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");
                    }
                  },
                  children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                    children: x.label
                  })
                });
              })
            })
          })
        })]
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextDecoration);

/***/ }),

/***/ "./src/components/styles/css-text-indent/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4 items-center gap-[4px] pg-setting-css-components",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Text Indent", "post-grid"),
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: props.val ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextIndent);

/***/ }),

/***/ "./src/components/styles/css-text-justify/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center pg-setting-css-components",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextJustify);

/***/ }),

/***/ "./src/components/styles/css-text-overflow/index.js":
/*!**********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center pg-setting-css-components",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextOverflow);

/***/ }),

/***/ "./src/components/styles/css-text-shadow/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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 _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_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/hooks */ "@wordpress/hooks");
/* harmony import */ var _wordpress_hooks__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_wordpress_hooks__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__);
const {
  Component,
  RawHTML
} = wp.element;








function Html(props) {
  if (!props.warn) {
    return null;
  }
  let isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_5__.applyFilters)("isProFeature", true);
  var valZ = props.val == null || props.val == undefined || props.val.length == 0 ? "0px 0px 0px #000" : props.val;
  // var valZ = (props.val == null || props.val == undefined || props.val.length == 0) ? '0px' : props.val;
  var colorNames = ["AliceBlue", "AntiqueWhite", "Aqua", "Aquamarine", "Azure", "Beige", "Bisque", "Black", "BlanchedAlmond", "Blue", "BlueViolet", "Brown", "BurlyWood", "CadetBlue", "Chartreuse", "Chocolate", "Coral", "CornflowerBlue", "Cornsilk", "Crimson", "Cyan", "DarkBlue", "DarkCyan", "DarkGoldenRod", "DarkGray", "DarkGrey", "DarkGreen", "DarkKhaki", "DarkMagenta", "DarkOliveGreen", "Darkorange", "DarkOrchid", "DarkRed", "DarkSalmon", "DarkSeaGreen", "DarkSlateBlue", "DarkSlateGray", "DarkSlateGrey", "DarkTurquoise", "DarkViolet", "DeepPink", "DeepSkyBlue", "DimGray", "DimGrey", "DodgerBlue", "FireBrick", "FloralWhite", "ForestGreen", "Fuchsia", "Gainsboro", "GhostWhite", "Gold", "GoldenRod", "Gray", "Grey", "Green", "GreenYellow", "HoneyDew", "HotPink", "IndianRed", "Indigo", "Ivory", "Khaki", "Lavender", "LavenderBlush", "LawnGreen", "LemonChiffon", "LightBlue", "LightCoral", "LightCyan", "LightGoldenRodYellow", "LightGray", "LightGrey", "LightGreen", "LightPink", "LightSalmon", "LightSeaGreen", "LightSkyBlue", "LightSlateGray", "LightSlateGrey", "LightSteelBlue", "LightYellow", "Lime", "LimeGreen", "Linen", "Magenta", "Maroon", "MediumAquaMarine", "MediumBlue", "MediumOrchid", "MediumPurple", "MediumSeaGreen", "MediumSlateBlue", "MediumSpringGreen", "MediumTurquoise", "MediumVioletRed", "MidnightBlue", "MintCream", "MistyRose", "Moccasin", "NavajoWhite", "Navy", "OldLace", "Olive", "OliveDrab", "Orange", "OrangeRed", "Orchid", "PaleGoldenRod", "PaleGreen", "PaleTurquoise", "PaleVioletRed", "PapayaWhip", "PeachPuff", "Peru", "Pink", "Plum", "PowderBlue", "Purple", "Red", "RosyBrown", "RoyalBlue", "SaddleBrown", "Salmon", "SandyBrown", "SeaGreen", "SeaShell", "Sienna", "Silver", "SkyBlue", "SlateBlue", "SlateGray", "SlateGrey", "Snow", "SpringGreen", "SteelBlue", "Tan", "Teal", "Thistle", "Tomato", "Turquoise", "Violet", "Wheat", "White", "WhiteSmoke", "Yellow", "YellowGreen"];
  var isMulti = valZ.split(",").length > 1 ? true : false;
  var shadows = isMulti ? valZ.split(", ") : [valZ];
  const getBoxShadowObj = boxshadow => {
    var sadhow_arr = [];
    boxshadow.map(arg => {
      var inset = arg.includes("inset");
      var color = "";
      var re = /(rgba|rgb|#|hsla|hsl)/;
      var colorMatch = arg.match(re);
      var colorType = colorMatch != null ? colorMatch[0] : "";
      if (colorType == "hsl") {
        var regex = /hsl\(([^)]+)\)/;
        var matches = arg.match(regex);
        if (matches && matches.length > 1) {
          var extractedValues = matches[1];
          color = "hsl(" + extractedValues + ")";
        }
      } else if (colorType == "hsla") {
        var regex = /hsla\(([^)]+)\)/;
        var matches = arg.match(regex);
        if (matches && matches.length > 1) {
          var extractedValues = matches[1];
          color = "hsla(" + extractedValues + ")";
        }
      } else if (colorType == "rgba") {
        var regex = /rgba\(([^)]+)\)/;
        var matches = arg.match(regex);
        if (matches && matches.length > 1) {
          var extractedValues = matches[1];
          color = "rgba(" + extractedValues + ")";
        }
      } else if (colorType == "rgb") {
        var regex = /rgb\(([^)]+)\)/;
        var matches = arg.match(regex);
        if (matches && matches.length > 1) {
          var extractedValues = matches[1];
          color = "rgb(" + extractedValues + ")";
        }
      } else if (colorType == "#") {
        var regex = /#\w+/;
        var matches = arg.match(regex);
        if (matches) {
          var color = matches[0];
        }
      } else {
        var regexPattern = new RegExp(colorNames.join("|").toLocaleLowerCase(), "g");
        var matches = arg.match(regexPattern);
        if (matches && matches.length > 0) {
          color = matches[0];
        }
      }
      var placement = arg;
      // if (inset) {
      // 	placement = placement.replace("inset", "");
      // }
      if (color) {
        placement = placement.replace(color, "");
      }
      var placementArr = placement.trim().split(" ");
      if (placementArr.length == 2) {
        var h = placementArr[0];
        var v = placementArr[1];
        var blur = "";
      } else if (placementArr.length == 3) {
        var h = placementArr[0];
        var v = placementArr[1];
        var blur = placementArr[2];
      }
      // else if (placementArr.length == 4) {
      // 	var h = placementArr[0];
      // 	var v = placementArr[1];
      // 	var blur = placementArr[2];
      // 	var spread = placementArr[3];
      // }
      sadhow_arr.push({
        h: h,
        v: v,
        blur: blur,
        // spread: spread,
        // inset: inset,
        color: color
      });
    });
    return sadhow_arr;
  };
  const [shadowObj, setShadowObj] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(getBoxShadowObj(shadows));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(valZ.includes(" !important") ? true : false);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
    //props.onChange(newVal + 'px ' + v + 'px ' + blur + 'px ' + spread + 'px ' + color, 'boxShadow');
    var stringArr = [];
    shadowObj.map((shadow, index) => {
      var h = shadow.h;
      var v = shadow.v;
      var blur = shadow.blur;
      // var spread = shadow.spread;
      // var inset = shadow.inset ? "inset" : "";
      var color = shadow.color;
      // var item = [h, v, blur, spread, color, inset];
      var item = [h, v, blur, color];
      var filtered = item.filter(function (el) {
        return el;
      });
      stringArr.push(filtered.join(" "));
    });
    stringArr = stringArr.join(",  ");
    if (isImportant) {
      stringArr = stringArr + " !important";
    } else {
      stringArr = stringArr;
    }
    props.onChange(stringArr, "textShadow");
  }, [shadowObj, isImportant]);
  var unitArgs = [{
    label: "PX",
    value: "px"
  }, {
    label: "EM",
    value: "em"
  }, {
    label: "REM",
    value: "rem"
  }, {
    label: "%",
    value: "%"
  }, {
    label: "CM",
    value: "cm"
  }, {
    label: "MM",
    value: "mm"
  }, {
    label: "IN",
    value: "in"
  }, {
    label: "PT",
    value: "pt"
  }, {
    label: "PC",
    value: "pc"
  }, {
    label: "EX",
    value: "ex"
  }, {
    label: "CH",
    value: "ch"
  }, {
    label: "VW",
    value: "vw"
  }, {
    label: "VH",
    value: "vh"
  }, {
    label: "VMIN",
    value: "vmin"
  }, {
    label: "VMAX",
    value: "vmax"
  }];
  const [proText, setProText] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(false);
  const handleClick = () => {
    setProText(true);
    setTimeout(() => {
      setProText(false);
    }, 5000);
  };
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("button", {
      className: "pg-font flex gap-2 justify-center my-2 cursor-pointer py-2 px-4 capitalize  bg-gray-700 text-white font-medium rounded hover:bg-gray-600 hover:text-white focus:outline-none focus:bg-gray-700",
      onClick: () => {
        if (isProFeature) {
          handleClick();
          return;
        }
        var shadowObjX = [...shadowObj];
        shadowObjX.push({
          h: "0px",
          v: "0px",
          blur: "10px",
          spread: "5px",
          inset: false,
          color: "#50547d4f"
        });
        setShadowObj(shadowObjX);
      },
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Add", "post-grid")
    }), proText && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", {
      href: "https://comboblocks.com/pricing/",
      className: "pg-text-color block py-2 px-1",
      children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Subscribe to add multiple shadows.", "post-grid")
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.Fragment, {
      children: [shadowObj.map((shadow, index) => {
        var h = shadow.h;
        var v = shadow.v;
        var blur = shadow.blur;
        // var spread = shadow.spread;
        // var inset = shadow.inset;
        var color = shadow.color;
        var hVal = h.match(/-?\d+/g) == null ? 0 : h.match(/-?\d+/g)[0];
        var hUnit = h.match(/[a-zA-Z%]+/g) == null ? "px" : h.match(/[a-zA-Z%]+/g)[0];
        var vVal = v.match(/-?\d+/g) == null ? 0 : v.match(/-?\d+/g)[0];
        var vUnit = v.match(/[a-zA-Z%]+/g) == null ? "px" : v.match(/[a-zA-Z%]+/g)[0];
        var blurVal = blur.match(/-?\d+/g) == null ? 0 : blur.match(/-?\d+/g)[0];
        var blurUnit = blur.match(/[a-zA-Z%]+/g) == null ? "px" : blur.match(/[a-zA-Z%]+/g)[0];
        // var spreadVal =
        // 	spread.match(/-?\d+/g) == null ? 0 : spread.match(/-?\d+/g)[0];
        // var spreadUnit =
        // 	spread.match(/[a-zA-Z%]+/g) == null
        // 		? "px"
        // 		: spread.match(/[a-zA-Z%]+/g)[0];
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.Fragment, {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelBody, {
            className: "font-medium text-slate-900 ",
            title: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.Fragment, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                className: "cursor-pointer hover:bg-red-500 hover:text-white ",
                onClick: ev => {
                  var shadowObjX = [...shadowObj];
                  shadowObjX.splice(index, 1);
                  setShadowObj(shadowObjX);
                },
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], {
                  icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"]
                })
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", {
                children: h + " " + v + " " + blur + " " +
                // spread +
                // " " +
                color
                // + " " +
                // (inset ? "inset" : "")
              })]
            })
            // title={
            // 	h +
            // 	" " +
            // 	v +
            // 	" " +
            // 	blur +
            // 	" " +
            // 	spread +
            // 	" " +
            // 	color +
            // 	" " +
            // 	(inset ? "inset" : "")
            // }
            ,
            initialOpen: false,
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("H-Offset", "post-grid")
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
                value: hVal,
                type: "number",
                onChange: newVal => {
                  var shadowObjX = [...shadowObj];
                  shadowObjX[index].h = newVal + hUnit;
                  setShadowObj(shadowObjX);
                }
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, {
                label: "",
                value: hUnit,
                options: unitArgs,
                onChange: newVal => {
                  var shadowObjX = [...shadowObj];
                  shadowObjX[index].h = hVal + newVal;
                  setShadowObj(shadowObjX);
                }
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("V-Offset", "post-grid")
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
                value: vVal,
                type: "number",
                onChange: newVal => {
                  var shadowObjX = [...shadowObj];
                  shadowObjX[index].v = newVal + vUnit;
                  setShadowObj(shadowObjX);
                }
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, {
                label: "",
                value: vUnit,
                options: unitArgs,
                onChange: newVal => {
                  var shadowObjX = [...shadowObj];
                  shadowObjX[index].v = vVal + newVal;
                  setShadowObj(shadowObjX);
                }
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Blur", "post-grid")
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.__experimentalInputControl, {
                value: blurVal,
                type: "number",
                onChange: newVal => {
                  var shadowObjX = [...shadowObj];
                  shadowObjX[index].blur = newVal + blurUnit;
                  setShadowObj(shadowObjX);
                }
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.SelectControl, {
                label: "",
                value: blurUnit,
                options: unitArgs,
                onChange: newVal => {
                  var shadowObjX = [...shadowObj];
                  shadowObjX[index].blur = blurVal + newVal;
                  setShadowObj(shadowObjX);
                }
              })]
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.PanelRow, {
              children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("label", {
                htmlFor: "",
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Color", "post-grid")
              })
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_components_input_color_picker__WEBPACK_IMPORTED_MODULE_3__["default"], {
              value: color,
              colors: _colors_presets__WEBPACK_IMPORTED_MODULE_1__["default"],
              enableAlpha: true,
              onChange: newVal => {
                var shadowObjX = [...shadowObj];
                shadowObjX[index].color = newVal;
                setShadowObj(shadowObjX);
              }
            })]
          })
        });
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ToggleControl, {
        help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
        checked: isImportant,
        onChange: arg => {
          setImportant(isImportant => !isImportant);
        }
      })]
    })]
  });
}
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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(Html, {
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextShadow);

/***/ }),

/***/ "./src/components/styles/css-text-transform/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* 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/format-capitalize.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/format-uppercase.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/format-lowercase.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close-small.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center pg-setting-css-components",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "flex flex-1 items-center justify-around",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: `flex items-center justify-center w-[30px] h-[30px] border cursor-pointer 
						${align === "capitalize" ? "bg-blue-600 text-white " : ""}
					`,
        onClick: ev => {
          if (!isImportant) {
            props.onChange("capitalize", "textTransform");
          } else {
            props.onChange("capitalize" + " !important", "textTransform");
          }
          setalign("capitalize");
          // props.onChange("capitalize", "textTransform");
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"],
          size: 24
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: `flex items-center justify-center w-[30px] h-[30px] border cursor-pointer ${align === "uppercase" ? "bg-blue-600 text-white " : ""}`,
        onClick: ev => {
          if (!isImportant) {
            props.onChange("uppercase", "textTransform");
          } else {
            props.onChange("uppercase" + " !important", "textTransform");
          }
          setalign("uppercase");
          // props.onChange("uppercase", "textTransform");
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"],
          size: 24
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: `flex items-center justify-center w-[30px] h-[30px] border cursor-pointer ${align === "lowercase" ? "bg-blue-600 text-white " : ""}`,
        onClick: ev => {
          if (!isImportant) {
            props.onChange("lowercase", "textTransform");
          } else {
            props.onChange("lowercase" + " !important", "textTransform");
          }
          setalign("lowercase");
          // props.onChange("lowercase", "textTransform");
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"],
          size: 24
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: `flex items-center justify-center w-[30px] h-[30px] border cursor-pointer ${align === "none" ? "bg-blue-600 text-white " : ""}`,
        onClick: ev => {
          if (!isImportant) {
            props.onChange("none", "textTransform");
          } else {
            props.onChange("none" + " !important", "textTransform");
          }
          setalign("none");
          // props.onChange("none", "textTransform");
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"],
          size: 24
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTextTransform);

/***/ }),

/***/ "./src/components/styles/css-top/index.js":
/*!************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between",
    children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom left",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: valZ ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTop);

/***/ }),

/***/ "./src/components/styles/css-transform-origin/index.js":
/*!*************************************************************!*\
  !*** ./src/components/styles/css-transform-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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.match(/-?\d+/g) == null ? false : true);
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.split(" "));
  const [position, setposition] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.includes("!important") ? true : false);
  const [ValX, setValX] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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_2__.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_2__.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_2__.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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      label: isCustom ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Custom Value enabled?", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Custom Value?", "post-grid"),
      checked: isCustom,
      onChange: arg => {
        setisCustom(isCustom => !isCustom);
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: "flex justify-between items-center my-3",
      children: !isCustom && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: position.length == 0 ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : position
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32",
          children: args.map(x => {
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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", "transformOrigin");
                } else {
                  props.onChange(x.value, "transformOrigin");
                }
              },
              children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
                children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
              }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })]
            });
          })
        })
      })
    }), isCustom && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "flex mt-4",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
          value: ValX,
          type: "number",
          onChange: newVal => {
            setValX(newVal);
            if (isImportant) {
              props.onChange(newVal + valUnitX + " " + ValY + valUnitY + " " + "!important", "transformOrigin");
            } else {
              props.onChange(newVal + valUnitX + " " + ValY + valUnitY, "transformOrigin");
            }
          }
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", {
        className: "mx-2",
        children: " / "
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
          value: ValY,
          type: "number",
          onChange: newVal => {
            setValY(newVal);
            if (isImportant) {
              props.onChange(ValX + valUnitX + " " + newVal + valUnitY + " " + "!important", "transformOrigin");
            } else {
              props.onChange(ValX + valUnitX + " " + newVal + valUnitY, "transformOrigin");
            }
          }
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      label: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          if (isCustom) {
            props.onChange(ValX + valUnitX + " " + ValY + valUnitY, "transformOrigin");
          } else {
            props.onChange(position, "transformOrigin");
          }
        } else {
          if (isCustom) {
            props.onChange(ValX + valUnitX + " " + ValY + valUnitY + " " + "!important", "transformOrigin");
          } else {
            props.onChange(position + " !important", "transformOrigin");
          }
        }
      }
    })]
  });
}
class PGcssTransformOrigin 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTransformOrigin);

/***/ }),

/***/ "./src/components/styles/css-transform/index.js":
/*!******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../components/dropdown */ "./src/components/dropdown/index.js");
/* 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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__);
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_2__.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_2__.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({
    title,
    index
  }) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
      className: "flex  items-center ",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
        className: "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");
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_6__["default"]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
        children: title
      })]
    });
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
    className: "mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
      className: "flex mb-3",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_3__["default"], {
        position: "bottom right",
        variant: "secondary",
        options: propertyArgs,
        buttonTitle: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Choose", "post-grid"),
        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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
        title: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(RemoveProty, {
          title: arg.id != null && propertyArgs[arg.id] != undefined ? propertyArgs[arg.id].label : "property",
          index: i
        }),
        initialOpen: false,
        children: [(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") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Value", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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");
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
              className: "w-2/6",
              children: [(arg.id == "translateX" || arg.id == "translateY" || arg.id == "translateZ" || arg.id == "perspective") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
            className: "mt-2",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("X Value", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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");
                }
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
                className: "w-2/6",
                children: [arg.id == "translate" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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"]
              })]
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
            className: "mt-2",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Y Value", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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");
                }
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
                className: "w-2/6",
                children: [arg.id == "translate" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                  children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("X Value", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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");
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              children: arg.id == "translate3d" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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");
                  }
                })
              })
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Y Value", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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");
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
              children: [arg.id == "translate3d" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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"]
            })]
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Z Value", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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");
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("span", {
              children: [arg.id == "translate3d" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.Fragment, {
                children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", {
              htmlFor: "",
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Angle", "post-grid")
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_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");
              }
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
              children: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTransition);

/***/ }),

/***/ "./src/components/styles/css-transition/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _components_dropdown__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../components/dropdown */ "./src/components/dropdown/index.js");
/* 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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
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_2__.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
    },
    clipPath: {
      value: "clipPath",
      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_4__.applyFilters)("transitionProperties", transitionPropertiesBasic);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
    className: "mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
      className: "flex mb-3",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_3__["default"], {
        position: "bottom right",
        variant: "secondary",
        options: transitionProperties,
        buttonTitle: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Choose", "post-grid"),
        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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelBody, {
        title: arg.property != null && transitionProperties[arg.property] != undefined ? transitionProperties[arg.property].label : "property",
        initialOpen: false,
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Duration", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_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");
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Timing Function", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_3__["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");
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Delay", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_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");
            }
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          className: "flex",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("span", {
            className: "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");
            },
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("span", {
              className: "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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssTransition);

/***/ }),

/***/ "./src/components/styles/css-user-select/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/css-user-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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
const {
  Component,
  RawHTML
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }
  var args = {
    auto: {
      label: "auto",
      value: "auto"
    },
    none: {
      label: "none",
      value: "none"
    },
    text: {
      label: "text",
      value: "text"
    },
    all: {
      label: "all",
      value: "all"
    }
  };
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
            className: "px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer",
            onClick: ev => {
              // onChange(x.value, 'userSelect');
              setalign(x.value);
              if (isImportant) {
                props.onChange(x.value + " !important", "userSelect");
              } else {
                props.onChange(x.value, "userSelect");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: arg => {
        setImportant(isImportant => !isImportant);
        if (isImportant) {
          props.onChange(align, "userSelect");
        } else {
          props.onChange(align + " !important", "userSelect");
        }
      }
    })]
  });
}
class PGcssUserSelect 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssUserSelect);

/***/ }),

/***/ "./src/components/styles/css-vertical-align/index.js":
/*!***********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center pg-font",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: "",
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssVerticalAlign);

/***/ }),

/***/ "./src/components/styles/css-visibility/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center pg-font",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssVisibility);

/***/ }),

/***/ "./src/components/styles/css-webkit-text-fill-color/index.js":
/*!*******************************************************************!*\
  !*** ./src/components/styles/css-webkit-text-fill-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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_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_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__);
const {
  Component
} = wp.element;






function Html(props) {
  if (!props.warn) {
    return null;
  }
  const [valArgs, setValArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(props.val.split(" "));
  const [val, setval] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)(valArgs[1] == undefined ? false : true);
  const [customColor, setCustomColor] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)([]);
  const [newColorPreset, setNewColorPreset] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useState)([]);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
    if (window.postGridBlockEditor.colors != undefined) {
      setCustomColor(window.postGridBlockEditor.colors);
    }
  }, [window.postGridBlockEditor]);
  // useEffect(() => {
  // 	apiFetch({
  // 		path: "/post-grid/v2/get_options",
  // 		method: "POST",
  // 		data: { option: "post_grid_block_editor" },
  // 	}).then((res) => {
  // 		if (res.colors.length != 0) {
  // 			setCustomColor(res.colors);
  // 		}
  // 	});
  // }, []);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_4__.useEffect)(() => {
    const transformedColors = customColor.map((color, index) => {
      const name = color.substring(1).toUpperCase();
      const upperCaseColor = color.toUpperCase();
      return {
        name,
        color: upperCaseColor
      };
    });
    // const newColor = transformedColors.concat(
    // 	colorsPresets.slice(0, 6 - transformedColors.length)
    // );
    let newColor;
    if (transformedColors.length >= 6) {
      newColor = transformedColors;
    } else {
      newColor = transformedColors.concat(_colors_presets__WEBPACK_IMPORTED_MODULE_2__["default"].slice(0, 6 - transformedColors.length));
    }
    setNewColorPreset(newColor);
  }, [customColor]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Popover, {
      position: "bottom right",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
        className: "p-2",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
          label: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
          checked: isImportant,
          onChange: arg => {
            setImportant(isImportant => !isImportant);
            if (isImportant) {
              props.onChange(val, "-webkit-text-fill-color");
            } else {
              props.onChange(val + " !important", "-webkit-text-fill-color");
            }
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ColorPalette, {
          value: val,
          colors: newColorPreset,
          enableAlpha: true,
          onChange: newVal => {
            //props.onChange(newVal, 'color');
            setval(newVal);
            if (isImportant) {
              props.onChange(newVal + " !important", "-webkit-text-fill-color");
            } else {
              props.onChange(newVal, "-webkit-text-fill-color");
            }
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("label", {
            htmlFor: "",
            children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Global Value", "post-grid")
          }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
            label: "",
            value: val,
            options: [{
              label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Choose", "post-grid"),
              value: ""
            }, {
              label: "Inherit",
              value: "inherit"
            }, {
              label: "Initial",
              value: "initial"
            }, {
              label: "Revert",
              value: "revert"
            }, {
              label: "Transparent",
              value: "transparent"
            }, {
              label: "Revert-layer",
              value: "revert-layer"
            }, {
              label: "Unset",
              value: "unset"
            }],
            onChange: newVal => {
              setval(newVal);
              if (isImportant) {
                props.onChange(newVal + " !important", "-webkit-text-fill-color");
              } else {
                props.onChange(newVal, "-webkit-text-fill-color");
              }
            }
          })]
        })]
      })
    })
  });
}
class PGcssWebkitTextFillColor 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 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div", {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
        className: "my-4",
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
          className: "relative h-10",
          style: placeholderStyle,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("div", {
            className: "absolute w-full  h-full top-0 left-0 text-center",
            style: btnStyle,
            onClick: this.handleToggleClick,
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("span", {
              className: "w-full text-center left-0 top-1/2 -translate-y-1/2\t absolute",
              children: val == undefined ? "Set Color" : colorVal
            })
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(Html, {
        enableAlpha: enableAlpha,
        val: val,
        onChange: onChange,
        warn: this.state.showWarning
      })]
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWebkitTextFillColor);

/***/ }),

/***/ "./src/components/styles/css-white-space/index.js":
/*!********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__);
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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
    children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
          className: " ",
          children: props.val ? args[props.val].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
        className: "w-32",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", {
            className: "px-3 py-1 border-b block hover:bg-gray-400 cursor-pointer",
            onClick: ev => {
              onChange(x.value, "whiteSpace");
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.Fragment, {
              children: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWhiteSpace);

/***/ }),

/***/ "./src/components/styles/css-width/index.js":
/*!**************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.split(" "));
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
    children: [(widthUnit != "max-content" || widthUnit != "min-content" || widthUnit != "inherit" || widthUnit != "initial" || widthUnit != "revert" || widthUnit != "revert-layer" || widthUnit != "unset") && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
      className: "flex justify-between items-center flex-wrap pg-font",
      children: [widthUnit != "auto" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.__experimentalInputControl, {
        value: props.val.includes("calc") ? props.val : widthVal,
        type: widthVal.length == 0 || isNaN(widthVal) || props.val.includes("calc") ? "text" : "number",
        disabled: widthUnit == "auto" || widthUnit == "max-content" || widthUnit == "min-content" || widthUnit == "inherit" || widthUnit == "initial" || widthUnit == "revert" || widthUnit == "revert-layer" || widthUnit == "unset" ? true : false,
        onChange: newVal => {
          if (newVal.includes("calc")) {
            // props.onChange(newVal, "width");
            if (isImportant) {
              props.onChange(newVal + " !important", "width");
            } else {
              props.onChange(newVal, "width");
            }
            return;
          }
          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");
            }
          }
        }
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: `${props.val.includes("calc") ? "hidden" : ""}`,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
          position: "bottom left",
          renderToggle: ({
            isOpen,
            onToggle
          }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
            title: "",
            onClick: onToggle,
            "aria-expanded": isOpen,
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              className: " ",
              children: unitArgs[widthUnit] == undefined ? "Select..." : unitArgs[widthUnit].label
            })
          }),
          renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: "w-32 pg-font",
            children: Object.entries(unitArgs).map(y => {
              var index = y[0];
              var x = y[1];
              return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                    }
                  }
                },
                children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                  children: x.label
                })
              });
            })
          })
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
        help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
        checked: isImportant,
        onChange: arg => {
          setImportant(isImportant => !isImportant);
          if (props.val.includes("calc")) {
            // var valX  = props.val.replaceAll(" !important", "")
            // props.onChange(newVal, "width");
            if (isImportant) {
              var valX = props.val.replaceAll(" !important", "");
              props.onChange(valX, "width");
              // props.onChange(props.val + " !important", "width");
            } else {
              // var valX = props.val.replaceAll(" !important", "");
              // props.onChange(valX, "width");
              props.onChange(props.val + " !important", "width");
            }
            return;
          }
          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");
            }
          }
        }
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      className: `${props.val.includes("calc") ? "hidden" : ""}`,
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.PanelRow, {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", {
          htmlFor: "",
          children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Global Value", "post-grid")
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.SelectControl, {
          label: "",
          value: widthUnit,
          options: [{
            label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Choose", "post-grid"),
            value: "px"
          }, {
            label: "auto",
            value: "auto"
          }, {
            label: "max-content",
            value: "max-content"
          }, {
            label: "min-content",
            value: "min-content"
          }, {
            label: "Inherit",
            value: "inherit"
          }, {
            label: "Initial",
            value: "initial"
          }, {
            label: "Revert",
            value: "revert"
          }, {
            label: "Revert-layer",
            value: "revert-layer"
          }, {
            label: "Unset",
            value: "unset"
          }],
          onChange: newVal => {
            setwidthUnit(newVal);
            if (newVal == "auto" || newVal == "max-content" || newVal == "min-content" || newVal == "inherit" || newVal == "initial" || newVal == "revert" || newVal == "revert-layer" || newVal == "unset") {
              if (isImportant) {
                props.onChange(newVal + " !important", "width");
              } else {
                props.onChange(newVal, "width");
              }
            } else {
              if (isImportant) {
                props.onChange(widthVal + newVal + " !important", "width");
              } else {
                props.onChange(widthVal + newVal, "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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWidth);

/***/ }),

/***/ "./src/components/styles/css-word-break/index.js":
/*!*******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center pg-setting-css-components",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWordBreak);

/***/ }),

/***/ "./src/components/styles/css-word-spacing/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(widthValX);
  const [widthUnit, setwidthUnit] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(widthUnitX);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex gap-[4px] mt-4 items-center pg-setting-css-components pg-setting-input-text ",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
          }
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
        position: "bottom",
        renderToggle: ({
          isOpen,
          onToggle
        }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
          title: "",
          onClick: onToggle,
          "aria-expanded": isOpen,
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
            className: " ",
            children: props.val ? unitArgs[widthUnit].label : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid")
          })
        }),
        renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: "w-32 pg-font",
          children: Object.entries(unitArgs).map(y => {
            var index = y[0];
            var x = y[1];
            return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("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");
                  }
                }
              },
              children: x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
                children: x.label
              })
            });
          })
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWordSpacing);

/***/ }),

/***/ "./src/components/styles/css-word-wrap/index.js":
/*!******************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center pg-setting-css-components",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWordWrap);

/***/ }),

/***/ "./src/components/styles/css-writing-mode/index.js":
/*!*********************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(props.val.split(" "));
  const [align, setalign] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[0]);
  const [isImportant, setImportant] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(valArgs[1] == undefined ? false : true);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex justify-between items-center pg-setting-css-components",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Dropdown, {
      position: "bottom",
      renderToggle: ({
        isOpen,
        onToggle
      }) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.Button, {
        title: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Clear", "post-grid"),
        onClick: onToggle,
        "aria-expanded": isOpen,
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
          className: " ",
          children: args[align] == undefined ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Select...", "post-grid") : args[align].label
        })
      }),
      renderContent: () => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
        className: "w-32 pg-font",
        children: Object.entries(args).map(args => {
          var index = args[0];
          var x = args[1];
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("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");
              }
            },
            children: [!x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {
              children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Reset", "post-grid")
            }), x.value && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment, {
              children: x.label
            })]
          });
        })
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important (Enabled)", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssWritingMode);

/***/ }),

/***/ "./src/components/styles/css-z-index/index.js":
/*!****************************************************!*\
  !*** ./src/components/styles/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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__);
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_2__.useState)(valZ.includes(" !important") ? true : false);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", {
    className: "flex mt-4",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_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");
        }
      }
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", {}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_1__.ToggleControl, {
      help: isImportant ? (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important Enabled", "post-grid") : (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Important?", "post-grid"),
      checked: isImportant,
      onChange: 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(Html, {
      val: val,
      onChange: onChange,
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGcssZIndex);

/***/ }),

/***/ "./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_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__);
/* 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_132__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_133__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/close.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_134__ = __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_dropdown_sudo_selector__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/dropdown-sudo-selector */ "./src/components/dropdown-sudo-selector/index.js");
/* harmony import */ var _css_align_content__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./css-align-content */ "./src/components/styles/css-align-content/index.js");
/* harmony import */ var _css_align_items__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./css-align-items */ "./src/components/styles/css-align-items/index.js");
/* harmony import */ var _css_align_self__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./css-align-self */ "./src/components/styles/css-align-self/index.js");
/* harmony import */ var _css_aspect_ratio__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./css-aspect-ratio */ "./src/components/styles/css-aspect-ratio/index.js");
/* harmony import */ var _css_backface_visibility__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./css-backface-visibility */ "./src/components/styles/css-backface-visibility/index.js");
/* harmony import */ var _css_background_attachment__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./css-background-attachment */ "./src/components/styles/css-background-attachment/index.js");
/* harmony import */ var _css_background_blend_mode__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./css-background-blend-mode */ "./src/components/styles/css-background-blend-mode/index.js");
/* harmony import */ var _css_background_clip__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./css-background-clip */ "./src/components/styles/css-background-clip/index.js");
/* harmony import */ var _css_background_color__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./css-background-color */ "./src/components/styles/css-background-color/index.js");
/* harmony import */ var _css_background_image__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./css-background-image */ "./src/components/styles/css-background-image/index.js");
/* harmony import */ var _css_background_origin__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./css-background-origin */ "./src/components/styles/css-background-origin/index.js");
/* harmony import */ var _css_background_position__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./css-background-position */ "./src/components/styles/css-background-position/index.js");
/* harmony import */ var _css_background_repeat__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./css-background-repeat */ "./src/components/styles/css-background-repeat/index.js");
/* harmony import */ var _css_background_size__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./css-background-size */ "./src/components/styles/css-background-size/index.js");
/* harmony import */ var _css_border__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./css-border */ "./src/components/styles/css-border/index.js");
/* harmony import */ var _css_border_top__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./css-border-top */ "./src/components/styles/css-border-top/index.js");
/* harmony import */ var _css_border_right__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./css-border-right */ "./src/components/styles/css-border-right/index.js");
/* harmony import */ var _css_border_bottom__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./css-border-bottom */ "./src/components/styles/css-border-bottom/index.js");
/* harmony import */ var _css_border_left__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./css-border-left */ "./src/components/styles/css-border-left/index.js");
/* harmony import */ var _css_border_radius__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./css-border-radius */ "./src/components/styles/css-border-radius/index.js");
/* harmony import */ var _css_border_image__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ./css-border-image */ "./src/components/styles/css-border-image/index.js");
/* harmony import */ var _css_bottom__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ./css-bottom */ "./src/components/styles/css-bottom/index.js");
/* harmony import */ var _css_border_collapse__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ./css-border-collapse */ "./src/components/styles/css-border-collapse/index.js");
/* harmony import */ var _css_border_spacing__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ./css-border-spacing */ "./src/components/styles/css-border-spacing/index.js");
/* harmony import */ var _css_backdrop_filter__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ./css-backdrop-filter */ "./src/components/styles/css-backdrop-filter/index.js");
/* harmony import */ var _css_box_shadow__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ./css-box-shadow */ "./src/components/styles/css-box-shadow/index.js");
/* harmony import */ var _css_box_sizing__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ./css-box-sizing */ "./src/components/styles/css-box-sizing/index.js");
/* harmony import */ var _css_clear__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ./css-clear */ "./src/components/styles/css-clear/index.js");
/* harmony import */ var _css_color__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! ./css-color */ "./src/components/styles/css-color/index.js");
/* harmony import */ var _css_cursor__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! ./css-cursor */ "./src/components/styles/css-cursor/index.js");
/* harmony import */ var _css_content__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! ./css-content */ "./src/components/styles/css-content/index.js");
/* harmony import */ var _css_counter_increment__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! ./css-counter-increment */ "./src/components/styles/css-counter-increment/index.js");
/* harmony import */ var _css_counter_reset__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! ./css-counter-reset */ "./src/components/styles/css-counter-reset/index.js");
/* harmony import */ var _css_counter_set__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! ./css-counter-set */ "./src/components/styles/css-counter-set/index.js");
/* harmony import */ var _css_column_count__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! ./css-column-count */ "./src/components/styles/css-column-count/index.js");
/* harmony import */ var _css_column_rule__WEBPACK_IMPORTED_MODULE_41__ = __webpack_require__(/*! ./css-column-rule */ "./src/components/styles/css-column-rule/index.js");
/* harmony import */ var _css_clip__WEBPACK_IMPORTED_MODULE_42__ = __webpack_require__(/*! ./css-clip */ "./src/components/styles/css-clip/index.js");
/* harmony import */ var _css_display__WEBPACK_IMPORTED_MODULE_43__ = __webpack_require__(/*! ./css-display */ "./src/components/styles/css-display/index.js");
/* harmony import */ var _css_direction__WEBPACK_IMPORTED_MODULE_44__ = __webpack_require__(/*! ./css-direction */ "./src/components/styles/css-direction/index.js");
/* harmony import */ var _css_filter__WEBPACK_IMPORTED_MODULE_45__ = __webpack_require__(/*! ./css-filter */ "./src/components/styles/css-filter/index.js");
/* harmony import */ var _css_float__WEBPACK_IMPORTED_MODULE_46__ = __webpack_require__(/*! ./css-float */ "./src/components/styles/css-float/index.js");
/* harmony import */ var _css_font_family__WEBPACK_IMPORTED_MODULE_47__ = __webpack_require__(/*! ./css-font-family */ "./src/components/styles/css-font-family/index.js");
/* harmony import */ var _css_font_size__WEBPACK_IMPORTED_MODULE_48__ = __webpack_require__(/*! ./css-font-size */ "./src/components/styles/css-font-size/index.js");
/* harmony import */ var _css_font_stretch__WEBPACK_IMPORTED_MODULE_49__ = __webpack_require__(/*! ./css-font-stretch */ "./src/components/styles/css-font-stretch/index.js");
/* harmony import */ var _css_font_style__WEBPACK_IMPORTED_MODULE_50__ = __webpack_require__(/*! ./css-font-style */ "./src/components/styles/css-font-style/index.js");
/* harmony import */ var _css_font_weight__WEBPACK_IMPORTED_MODULE_51__ = __webpack_require__(/*! ./css-font-weight */ "./src/components/styles/css-font-weight/index.js");
/* harmony import */ var _css_font_variant_caps__WEBPACK_IMPORTED_MODULE_52__ = __webpack_require__(/*! ./css-font-variant-caps */ "./src/components/styles/css-font-variant-caps/index.js");
/* harmony import */ var _css_flex_wrap__WEBPACK_IMPORTED_MODULE_53__ = __webpack_require__(/*! ./css-flex-wrap */ "./src/components/styles/css-flex-wrap/index.js");
/* harmony import */ var _css_flex_direction__WEBPACK_IMPORTED_MODULE_54__ = __webpack_require__(/*! ./css-flex-direction */ "./src/components/styles/css-flex-direction/index.js");
/* harmony import */ var _css_flex_shrink__WEBPACK_IMPORTED_MODULE_55__ = __webpack_require__(/*! ./css-flex-shrink */ "./src/components/styles/css-flex-shrink/index.js");
/* harmony import */ var _css_flex_basis__WEBPACK_IMPORTED_MODULE_56__ = __webpack_require__(/*! ./css-flex-basis */ "./src/components/styles/css-flex-basis/index.js");
/* harmony import */ var _css_user_select__WEBPACK_IMPORTED_MODULE_57__ = __webpack_require__(/*! ./css-user-select */ "./src/components/styles/css-user-select/index.js");
/* harmony import */ var _css_flex_grow__WEBPACK_IMPORTED_MODULE_58__ = __webpack_require__(/*! ./css-flex-grow */ "./src/components/styles/css-flex-grow/index.js");
/* harmony import */ var _css_flex_flow__WEBPACK_IMPORTED_MODULE_59__ = __webpack_require__(/*! ./css-flex-flow */ "./src/components/styles/css-flex-flow/index.js");
/* harmony import */ var _css_grid_auto_flow__WEBPACK_IMPORTED_MODULE_60__ = __webpack_require__(/*! ./css-grid-auto-flow */ "./src/components/styles/css-grid-auto-flow/index.js");
/* harmony import */ var _css_grid_column_end__WEBPACK_IMPORTED_MODULE_61__ = __webpack_require__(/*! ./css-grid-column-end */ "./src/components/styles/css-grid-column-end/index.js");
/* harmony import */ var _css_grid_column_start__WEBPACK_IMPORTED_MODULE_62__ = __webpack_require__(/*! ./css-grid-column-start */ "./src/components/styles/css-grid-column-start/index.js");
/* harmony import */ var _css_grid_row_end__WEBPACK_IMPORTED_MODULE_63__ = __webpack_require__(/*! ./css-grid-row-end */ "./src/components/styles/css-grid-row-end/index.js");
/* harmony import */ var _css_grid_row_start__WEBPACK_IMPORTED_MODULE_64__ = __webpack_require__(/*! ./css-grid-row-start */ "./src/components/styles/css-grid-row-start/index.js");
/* harmony import */ var _css_grid_template_columns__WEBPACK_IMPORTED_MODULE_65__ = __webpack_require__(/*! ./css-grid-template-columns */ "./src/components/styles/css-grid-template-columns/index.js");
/* harmony import */ var _css_grid_template_rows__WEBPACK_IMPORTED_MODULE_66__ = __webpack_require__(/*! ./css-grid-template-rows */ "./src/components/styles/css-grid-template-rows/index.js");
/* harmony import */ var _css_grid_auto_columns__WEBPACK_IMPORTED_MODULE_67__ = __webpack_require__(/*! ./css-grid-auto-columns */ "./src/components/styles/css-grid-auto-columns/index.js");
/* harmony import */ var _css_height__WEBPACK_IMPORTED_MODULE_68__ = __webpack_require__(/*! ./css-height */ "./src/components/styles/css-height/index.js");
/* harmony import */ var _css_justify_content__WEBPACK_IMPORTED_MODULE_69__ = __webpack_require__(/*! ./css-justify-content */ "./src/components/styles/css-justify-content/index.js");
/* harmony import */ var _css_left__WEBPACK_IMPORTED_MODULE_70__ = __webpack_require__(/*! ./css-left */ "./src/components/styles/css-left/index.js");
/* harmony import */ var _css_letter_spacing__WEBPACK_IMPORTED_MODULE_71__ = __webpack_require__(/*! ./css-letter-spacing */ "./src/components/styles/css-letter-spacing/index.js");
/* harmony import */ var _css_line_height__WEBPACK_IMPORTED_MODULE_72__ = __webpack_require__(/*! ./css-line-height */ "./src/components/styles/css-line-height/index.js");
/* harmony import */ var _css_list_style__WEBPACK_IMPORTED_MODULE_73__ = __webpack_require__(/*! ./css-list-style */ "./src/components/styles/css-list-style/index.js");
/* harmony import */ var _css_margin__WEBPACK_IMPORTED_MODULE_74__ = __webpack_require__(/*! ./css-margin */ "./src/components/styles/css-margin/index.js");
/* harmony import */ var _css_margin_top__WEBPACK_IMPORTED_MODULE_75__ = __webpack_require__(/*! ./css-margin-top */ "./src/components/styles/css-margin-top/index.js");
/* harmony import */ var _css_margin_right__WEBPACK_IMPORTED_MODULE_76__ = __webpack_require__(/*! ./css-margin-right */ "./src/components/styles/css-margin-right/index.js");
/* harmony import */ var _css_margin_bottom__WEBPACK_IMPORTED_MODULE_77__ = __webpack_require__(/*! ./css-margin-bottom */ "./src/components/styles/css-margin-bottom/index.js");
/* harmony import */ var _css_margin_left__WEBPACK_IMPORTED_MODULE_78__ = __webpack_require__(/*! ./css-margin-left */ "./src/components/styles/css-margin-left/index.js");
/* harmony import */ var _css_max_height__WEBPACK_IMPORTED_MODULE_79__ = __webpack_require__(/*! ./css-max-height */ "./src/components/styles/css-max-height/index.js");
/* harmony import */ var _css_max_width__WEBPACK_IMPORTED_MODULE_80__ = __webpack_require__(/*! ./css-max-width */ "./src/components/styles/css-max-width/index.js");
/* harmony import */ var _css_min_height__WEBPACK_IMPORTED_MODULE_81__ = __webpack_require__(/*! ./css-min-height */ "./src/components/styles/css-min-height/index.js");
/* harmony import */ var _css_min_width__WEBPACK_IMPORTED_MODULE_82__ = __webpack_require__(/*! ./css-min-width */ "./src/components/styles/css-min-width/index.js");
/* harmony import */ var _css_perspective__WEBPACK_IMPORTED_MODULE_83__ = __webpack_require__(/*! ./css-perspective */ "./src/components/styles/css-perspective/index.js");
/* harmony import */ var _css_object_fit__WEBPACK_IMPORTED_MODULE_84__ = __webpack_require__(/*! ./css-object-fit */ "./src/components/styles/css-object-fit/index.js");
/* harmony import */ var _css_opacity__WEBPACK_IMPORTED_MODULE_85__ = __webpack_require__(/*! ./css-opacity */ "./src/components/styles/css-opacity/index.js");
/* harmony import */ var _css_outline__WEBPACK_IMPORTED_MODULE_86__ = __webpack_require__(/*! ./css-outline */ "./src/components/styles/css-outline/index.js");
/* harmony import */ var _css_outline_offset__WEBPACK_IMPORTED_MODULE_87__ = __webpack_require__(/*! ./css-outline-offset */ "./src/components/styles/css-outline-offset/index.js");
/* harmony import */ var _css_order__WEBPACK_IMPORTED_MODULE_88__ = __webpack_require__(/*! ./css-order */ "./src/components/styles/css-order/index.js");
/* harmony import */ var _css_overflow__WEBPACK_IMPORTED_MODULE_89__ = __webpack_require__(/*! ./css-overflow */ "./src/components/styles/css-overflow/index.js");
/* harmony import */ var _css_overflow_x__WEBPACK_IMPORTED_MODULE_90__ = __webpack_require__(/*! ./css-overflow-x */ "./src/components/styles/css-overflow-x/index.js");
/* harmony import */ var _css_overflow_y__WEBPACK_IMPORTED_MODULE_91__ = __webpack_require__(/*! ./css-overflow-y */ "./src/components/styles/css-overflow-y/index.js");
/* harmony import */ var _css_padding__WEBPACK_IMPORTED_MODULE_92__ = __webpack_require__(/*! ./css-padding */ "./src/components/styles/css-padding/index.js");
/* harmony import */ var _css_padding_top__WEBPACK_IMPORTED_MODULE_93__ = __webpack_require__(/*! ./css-padding-top */ "./src/components/styles/css-padding-top/index.js");
/* harmony import */ var _css_padding_right__WEBPACK_IMPORTED_MODULE_94__ = __webpack_require__(/*! ./css-padding-right */ "./src/components/styles/css-padding-right/index.js");
/* harmony import */ var _css_padding_bottom__WEBPACK_IMPORTED_MODULE_95__ = __webpack_require__(/*! ./css-padding-bottom */ "./src/components/styles/css-padding-bottom/index.js");
/* harmony import */ var _css_padding_left__WEBPACK_IMPORTED_MODULE_96__ = __webpack_require__(/*! ./css-padding-left */ "./src/components/styles/css-padding-left/index.js");
/* harmony import */ var _css_place_items__WEBPACK_IMPORTED_MODULE_97__ = __webpack_require__(/*! ./css-place-items */ "./src/components/styles/css-place-items/index.js");
/* harmony import */ var _css_position__WEBPACK_IMPORTED_MODULE_98__ = __webpack_require__(/*! ./css-position */ "./src/components/styles/css-position/index.js");
/* harmony import */ var _css_right__WEBPACK_IMPORTED_MODULE_99__ = __webpack_require__(/*! ./css-right */ "./src/components/styles/css-right/index.js");
/* harmony import */ var _css_gap__WEBPACK_IMPORTED_MODULE_100__ = __webpack_require__(/*! ./css-gap */ "./src/components/styles/css-gap/index.js");
/* harmony import */ var _css_column_gap__WEBPACK_IMPORTED_MODULE_101__ = __webpack_require__(/*! ./css-column-gap */ "./src/components/styles/css-column-gap/index.js");
/* harmony import */ var _css_row_gap__WEBPACK_IMPORTED_MODULE_102__ = __webpack_require__(/*! ./css-row-gap */ "./src/components/styles/css-row-gap/index.js");
/* harmony import */ var _css_text_align__WEBPACK_IMPORTED_MODULE_103__ = __webpack_require__(/*! ./css-text-align */ "./src/components/styles/css-text-align/index.js");
/* harmony import */ var _css_transform_origin__WEBPACK_IMPORTED_MODULE_104__ = __webpack_require__(/*! ./css-transform-origin */ "./src/components/styles/css-transform-origin/index.js");
/* harmony import */ var _css_text_decoration__WEBPACK_IMPORTED_MODULE_105__ = __webpack_require__(/*! ./css-text-decoration */ "./src/components/styles/css-text-decoration/index.js");
/* harmony import */ var _css_text_indent__WEBPACK_IMPORTED_MODULE_106__ = __webpack_require__(/*! ./css-text-indent */ "./src/components/styles/css-text-indent/index.js");
/* harmony import */ var _css_text_justify__WEBPACK_IMPORTED_MODULE_107__ = __webpack_require__(/*! ./css-text-justify */ "./src/components/styles/css-text-justify/index.js");
/* harmony import */ var _css_text_overflow__WEBPACK_IMPORTED_MODULE_108__ = __webpack_require__(/*! ./css-text-overflow */ "./src/components/styles/css-text-overflow/index.js");
/* harmony import */ var _css_text_shadow__WEBPACK_IMPORTED_MODULE_109__ = __webpack_require__(/*! ./css-text-shadow */ "./src/components/styles/css-text-shadow/index.js");
/* harmony import */ var _css_text_transform__WEBPACK_IMPORTED_MODULE_110__ = __webpack_require__(/*! ./css-text-transform */ "./src/components/styles/css-text-transform/index.js");
/* harmony import */ var _css_top__WEBPACK_IMPORTED_MODULE_111__ = __webpack_require__(/*! ./css-top */ "./src/components/styles/css-top/index.js");
/* harmony import */ var _css_text_align_last__WEBPACK_IMPORTED_MODULE_112__ = __webpack_require__(/*! ./css-text-align-last */ "./src/components/styles/css-text-align-last/index.js");
/* harmony import */ var _css_table_layout__WEBPACK_IMPORTED_MODULE_113__ = __webpack_require__(/*! ./css-table-layout */ "./src/components/styles/css-table-layout/index.js");
/* harmony import */ var _css_empty_cells__WEBPACK_IMPORTED_MODULE_114__ = __webpack_require__(/*! ./css-empty-cells */ "./src/components/styles/css-empty-cells/index.js");
/* harmony import */ var _css_transform__WEBPACK_IMPORTED_MODULE_115__ = __webpack_require__(/*! ./css-transform */ "./src/components/styles/css-transform/index.js");
/* harmony import */ var _css_transition__WEBPACK_IMPORTED_MODULE_116__ = __webpack_require__(/*! ./css-transition */ "./src/components/styles/css-transition/index.js");
/* harmony import */ var _css_vertical_align__WEBPACK_IMPORTED_MODULE_117__ = __webpack_require__(/*! ./css-vertical-align */ "./src/components/styles/css-vertical-align/index.js");
/* harmony import */ var _css_visibility__WEBPACK_IMPORTED_MODULE_118__ = __webpack_require__(/*! ./css-visibility */ "./src/components/styles/css-visibility/index.js");
/* harmony import */ var _css_width__WEBPACK_IMPORTED_MODULE_119__ = __webpack_require__(/*! ./css-width */ "./src/components/styles/css-width/index.js");
/* harmony import */ var _css_white_space__WEBPACK_IMPORTED_MODULE_120__ = __webpack_require__(/*! ./css-white-space */ "./src/components/styles/css-white-space/index.js");
/* harmony import */ var _css_word_break__WEBPACK_IMPORTED_MODULE_121__ = __webpack_require__(/*! ./css-word-break */ "./src/components/styles/css-word-break/index.js");
/* harmony import */ var _css_word_spacing__WEBPACK_IMPORTED_MODULE_122__ = __webpack_require__(/*! ./css-word-spacing */ "./src/components/styles/css-word-spacing/index.js");
/* harmony import */ var _css_writing_mode__WEBPACK_IMPORTED_MODULE_123__ = __webpack_require__(/*! ./css-writing-mode */ "./src/components/styles/css-writing-mode/index.js");
/* harmony import */ var _css_word_wrap__WEBPACK_IMPORTED_MODULE_124__ = __webpack_require__(/*! ./css-word-wrap */ "./src/components/styles/css-word-wrap/index.js");
/* harmony import */ var _css_z_index__WEBPACK_IMPORTED_MODULE_125__ = __webpack_require__(/*! ./css-z-index */ "./src/components/styles/css-z-index/index.js");
/* harmony import */ var _breakpoints__WEBPACK_IMPORTED_MODULE_126__ = __webpack_require__(/*! ../../breakpoints */ "./src/breakpoints.js");
/* harmony import */ var _components_icon_toggle__WEBPACK_IMPORTED_MODULE_127__ = __webpack_require__(/*! ../../components/icon-toggle */ "./src/components/icon-toggle/index.js");
/* harmony import */ var _css_animation_name__WEBPACK_IMPORTED_MODULE_128__ = __webpack_require__(/*! ./css-animation-name */ "./src/components/styles/css-animation-name/index.js");
/* harmony import */ var _css_webkit_text_fill_color__WEBPACK_IMPORTED_MODULE_129__ = __webpack_require__(/*! ./css-webkit-text-fill-color */ "./src/components/styles/css-webkit-text-fill-color/index.js");
/* harmony import */ var _css_caption_side__WEBPACK_IMPORTED_MODULE_130__ = __webpack_require__(/*! ./css-caption-side */ "./src/components/styles/css-caption-side/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__);
const {
  Component,
  RawHTML
} = wp.element;





































// import PGcssClip from './css-clip'
// import PGcssClipPath from './css-clip-path'




























































































var myStore = wp.data.select("PostGridStore");






function Html(props) {
  if (!props.warn) {
    return null;
  }
  const [isPro, setisPro] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(true);
  var sudoScourceArgsBasic = {
    styles: {
      label: "Idle",
      value: "styles"
    },
    hover: {
      label: "Hover",
      value: "hover"
    },
    after: {
      label: "After",
      value: "after"
    },
    before: {
      label: "Before",
      value: "before",
      isPro: isPro ? true : false
    },
    active: {
      label: "Active",
      value: "active",
      isPro: isPro ? true : false
    },
    focus: {
      label: "Focus",
      value: "focus",
      isPro: isPro ? true : false
    },
    "focus-within": {
      label: "Focus-within",
      value: "focus-within",
      isPro: isPro ? true : false
    },
    target: {
      label: "target",
      value: "target",
      isPro: isPro ? true : false
    },
    visited: {
      label: "Visited",
      value: "visited",
      isPro: isPro ? true : false
    },
    selection: {
      label: "Selection",
      value: "selection",
      isPro: isPro ? true : false
    },
    ":marker": {
      label: "Marker",
      value: ":marker",
      isPro: isPro ? true : false
    },
    "nth-child(even)": {
      label: "nth-child(even)",
      value: "nth-child(even)",
      isPro: isPro ? true : false
    },
    "nth-child(odd)": {
      label: "nth-child(odd)",
      value: "nth-child(odd)",
      isPro: isPro ? true : false
    },
    "nth-child(2)": {
      label: "nth-child(2)",
      value: "nth-child(2)",
      isPro: isPro ? true : false
    },
    "nth-child(3)": {
      label: "nth-child(3)",
      value: "nth-child(3)",
      isPro: isPro ? true : false
    },
    "nth-child(4)": {
      label: "nth-child(4)",
      value: "nth-child(4)",
      isPro: isPro ? true : false
    },
    "nth-child(5)": {
      label: "nth-child(5)",
      value: "nth-child(5)",
      isPro: isPro ? true : false
    },
    "first-child": {
      label: "First-child",
      value: "first-child",
      isPro: isPro ? true : false
    },
    "last-child": {
      label: "Last-child",
      value: "last-child",
      isPro: isPro ? true : false
    },
    "first-letter": {
      label: "First-letter",
      value: "first-letter",
      isPro: isPro ? true : false
    },
    "first-line": {
      label: "First-line",
      value: "first-line",
      isPro: isPro ? true : false
    },
    "hover::before": {
      label: "hover::before",
      value: "hover::before",
      isPro: isPro ? true : false
    },
    "hover::after": {
      label: "hover::after",
      value: "hover::after",
      isPro: isPro ? true : false
    },
    "hover::marker": {
      label: "hover::marker",
      value: "hover::marker",
      isPro: isPro ? true : false
    },
    "hover::first-letter": {
      label: "hover::first-letter",
      value: "hover::first-letter",
      isPro: isPro ? true : false
    },
    "hover:first-child": {
      label: "hover:first-child",
      value: "hover:first-child",
      isPro: isPro ? true : false
    },
    "hover:last-child": {
      label: "hover:last-child",
      value: "hover:last-child",
      isPro: isPro ? true : false
    },
    "hover:first-line": {
      label: "hover:first-line",
      value: "hover:first-line",
      isPro: isPro ? true : false
    },
    "hover:first-line": {
      label: "hover:first-line",
      value: "hover:first-line",
      isPro: isPro ? true : false
    },
    "hover:nth-child(odd)": {
      label: "hover:nth-child(odd)",
      value: "hover:nth-child(odd)",
      isPro: isPro ? true : false
    },
    "hover:nth-child(even)": {
      label: "hover:nth-child(even)",
      value: "hover:nth-child(even)",
      isPro: isPro ? true : false
    },
    "-webkit-slider-thumb": {
      label: "-webkit-slider-thumb",
      value: "-webkit-slider-thumb",
      isPro: isPro ? true : false
    },
    "-moz-range-thumb": {
      label: "-moz-range-thumb",
      value: "-moz-range-thumb",
      isPro: isPro ? true : false
    },
    "checked": {
      label: "checked",
      value: "checked",
      isPro: isPro ? true : false
    },
    "checked:after": {
      label: "checked:after",
      value: "checked:after",
      isPro: isPro ? true : false
    },
    "checked:before": {
      label: "checked:before",
      value: "checked:before",
      isPro: isPro ? true : false
    }
    //custom: { label: 'Custom', value: '', isPro: isPro ? true : false },
  };
  let sudoScourceArgs = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)("sudoScourceArgs", sudoScourceArgsBasic);
  // let sudoScourceArgs = sudoScourceArgsBasic;

  const [sudoScources, setSudoScources] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(sudoScourceArgs);
  const [sudoScource, setSudoScource] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)("styles");
  const [styles, setStyles] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
  const [cssAtts, setcssAtts] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({});
  const [breakPointLocal, setbreakPointLocal] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)("Desktop");
  var breakPointX = breakPointLocal;
  var isProFeature = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)("isProFeature", true);

  //breakPointX = (breakPointLocal != breakPointX) ? breakPointLocal : breakPointX;

  // useEffect(() => {
  // 	var sudoSourceX = { ...sudoScources };
  // 	Object.entries(props.obj).map((arg) => {
  // 		var sudoIndex = arg[0];
  // 		var sudoValues = arg[1];

  // 		if (sudoIndex != "options") {
  // 			sudoSourceX[sudoIndex].label = sudoScources[sudoIndex].label + " ^";
  // 		}
  // 	});

  // 	setSudoScources(sudoSourceX);
  // }, [props.obj]);

  const [extraOpt, setextraOpt] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
  const [copyArgs, setCopyArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
    isCopied: false,
    isPasted: false,
    pasteError: false,
    copyError: false,
    errorMessage: ""
  });
  const [copyRawArgs, setcopyRawArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
    isCopied: false,
    isPasted: false,
    pasteError: false,
    copyError: false,
    errorMessage: ""
  });
  const [resetArgs, setResetArgs] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useState)({
    isReset: false,
    resetError: false,
    errorMessage: ""
  });
  var cssPropsBasic = {
    animationName: {
      id: "animationName",
      label: "Animation Name"
    },
    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: isPro ? true : false
    },
    backgroundBlendMode: {
      id: "backgroundBlendMode",
      label: "Background Blend Mode",
      isPro: isPro ? true : false
    },
    backgroundClip: {
      id: "backgroundClip",
      label: "Background Clip",
      isPro: isPro ? true : false
    },
    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: isPro ? true : false
    },
    borderImage: {
      id: "borderImage",
      label: "Border Image",
      isPro: isPro ? true : false
    },
    borderRadius: {
      id: "borderRadius",
      label: "Border Radius"
    },
    borderSpacing: {
      id: "borderSpacing",
      label: "Border Spacing",
      isPro: isPro ? true : false
    },
    backdropFilter: {
      id: "backdropFilter",
      label: "Backdrop Filter"
    },
    bottom: {
      id: "bottom",
      label: "Bottom"
    },
    boxShadow: {
      id: "boxShadow",
      label: "Box Shadow"
    },
    boxSizing: {
      id: "boxSizing",
      label: "Box Sizing",
      isPro: isPro ? true : false
    },
    clear: {
      id: "clear",
      label: "Clear"
    },
    clip: {
      id: "clip",
      label: "Clip",
      isPro: isPro ? true : false
    },
    // clipPath: { id: 'clipPath', label: 'Clip Path', isPro: isPro ? true : false },
    color: {
      id: "color",
      label: "Color"
    },
    columnCount: {
      id: "columnCount",
      label: "Column Count",
      isPro: isPro ? true : false
    },
    columnRule: {
      id: "columnRule",
      label: "Column Rule",
      isPro: isPro ? true : false
    },
    content: {
      id: "content",
      label: "Content",
      isPro: isPro ? true : false
    },
    counterIncrement: {
      id: "counterIncrement",
      label: "Counter Increment",
      isPro: isPro ? true : false
    },
    counterReset: {
      id: "counterReset",
      label: "Counter Reset",
      isPro: isPro ? true : false
    },
    counterSet: {
      id: "counterSet",
      label: "Counter Set",
      isPro: isPro ? true : false
    },
    cursor: {
      id: "cursor",
      label: "Cursor",
      isPro: isPro ? true : false
    },
    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: isPro ? true : false
    },
    fontSize: {
      id: "fontSize",
      label: "Font Size"
    },
    fontFamily: {
      id: "fontFamily",
      label: "Font Family"
    },
    fontStretch: {
      id: "fontStretch",
      label: "Font Stretch",
      isPro: isPro ? true : false
    },
    fontStyle: {
      id: "fontStyle",
      label: "Font Style"
    },
    userSelect: {
      id: "userSelect",
      label: "User Select"
    },
    fontVariantCaps: {
      id: "fontVariantCaps",
      label: "Font VariantCaps",
      isPro: isPro ? true : false
    },
    fontWeight: {
      id: "fontWeight",
      label: "Font Weight"
    },
    gridAutoFlow: {
      id: "gridAutoFlow",
      label: "Grid Auto Flow"
    },
    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"
    },
    gridAutoColumns: {
      id: "gridAutoColumns",
      label: "Grid Auto Columns"
    },
    height: {
      id: "height",
      label: "Height"
    },
    left: {
      id: "left",
      label: "Left"
    },
    letterSpacing: {
      id: "letterSpacing",
      label: "Letter Spacing",
      isPro: isPro ? true : false
    },
    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: isPro ? true : false
    },
    overflow: {
      id: "overflow",
      label: "Overflow"
    },
    overflowX: {
      id: "overflowX",
      label: "OverflowX",
      isPro: isPro ? true : false
    },
    overflowY: {
      id: "overflowY",
      label: "OverflowY",
      isPro: isPro ? true : false
    },
    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: isPro ? true : false
    },
    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: isPro ? true : false
    },
    transition: {
      id: "transition",
      label: "Transition",
      isPro: isPro ? true : false
    },
    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: isPro ? true : false
    },
    textIndent: {
      id: "textIndent",
      label: "Text Indent",
      isPro: isPro ? true : false
    },
    textJustify: {
      id: "textJustify",
      label: "Text Justify",
      isPro: isPro ? true : false
    },
    textOverflow: {
      id: "textOverflow",
      label: "Text Overflow"
    },
    textShadow: {
      id: "textShadow",
      label: "Text Shadow",
      isPro: isPro ? true : false
    },
    transformOrigin: {
      id: "transformOrigin",
      label: "Transform Origin",
      isPro: isPro ? true : false
    },
    tableLayout: {
      id: "tableLayout",
      label: "Table Layout"
    },
    emptyCells: {
      id: "emptyCells",
      label: "Empty Cells"
    },
    captionSide: {
      id: "captionSide",
      label: "Caption Side"
    },
    textTransform: {
      id: "textTransform",
      label: "Text Transform",
      isPro: isPro ? true : false
    },
    wordBreak: {
      id: "wordBreak",
      label: "Word Break",
      isPro: isPro ? true : false
    },
    wordSpacing: {
      id: "wordSpacing",
      label: "Word Spacing",
      isPro: isPro ? true : false
    },
    wordWrap: {
      id: "wordWrap",
      label: "Word Wrap",
      isPro: isPro ? true : false
    },
    writingMode: {
      id: "writingMode",
      label: "Writing Mode",
      isPro: isPro ? true : false
    },
    "-webkit-text-fill-color": {
      id: "-webkit-text-fill-color",
      label: "Webkit Text Fill Color",
      isPro: isPro ? true : false
    }
  };
  let cssProps = (0,_wordpress_hooks__WEBPACK_IMPORTED_MODULE_2__.applyFilters)("cssProps", cssPropsBasic);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
    var license_key = window.PostGrid.license_key;
    setisPro(license_key ? false : true);
  }, []);
  (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
    if (props.obj[sudoScource] == undefined) {
      props.obj[sudoScource] = {};
    }
  }, [sudoScource]);
  function sudoScourceUpdate(args) {
    setSudoScources(args);
  }
  function parseRawCSS(str) {
    var obj = {};
    const myArray = str.split(";");
    myArray.map(item => {
      item = item.replaceAll(": ", ":");
      var prop = item.split(":");
      var propId = prop[0];
      var propVal = prop[1];
      propId = propId != undefined || propId != null ? propId.replaceAll("\r\n", "") : "";
      propId = propId != undefined || propId != null ? propId.replaceAll(" ", "") : "";
      propVal = propVal != undefined || propVal != null ? propVal.replaceAll("\r\n", "") : "";
      //propVal = (propVal != undefined || propVal != null) ? propVal.replaceAll(" ", "") : "";

      if (propId != undefined || propId != null) {
        propId = propId.replace(/-([a-z])/g, function (g) {
          return g[1].toUpperCase();
        });
        if (propVal.length > 0) {
          obj[propId] = {
            Desktop: propVal
          };
        }
      }
    });
    return obj;
  }
  var RemoveQueryPram = function ({
    title,
    sudoScource,
    keyX
  }) {
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("span", {
        className: "cursor-pointer hover:bg-red-500 hover:text-white px-1 py-1",
        onClick: ev => {
          props.onRemove(sudoScource, keyX, props.obj, props.extra);
        },
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_132__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_133__["default"]
        })
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("span", {
        className: "mx-2",
        children: title
      })]
    });
  };
  function setCssAttr(option, index) {
    //var objX = { ...props.obj }
    let objX = Object.assign({}, props.obj);
    if (objX[sudoScource][option.id] == undefined) {
      var path = [sudoScource, option.id];
      const object = myStore.addPropertyDeep(objX, path, {});
      props.onAdd(sudoScource, option.id, object, props.extra);

      //props.obj[sudoScource][option.id] = {};
    } else {
      //alert('Property already added');

      if (objX[sudoScource][option.id][breakPointX] == undefined) {
        var path = [sudoScource, option.id, breakPointX];
        const object = myStore.addPropertyDeep(objX, path, "");
        props.onAdd(sudoScource, option.id, object, props.extra);
      } else {
        alert("Property already added");
      }
    }
  }
  function onChangeCssVal(newVal, attr) {
    props.onChange(sudoScource, newVal, attr, props.obj, props.extra);
  }
  var breakPointList = [];
  for (var x in _breakpoints__WEBPACK_IMPORTED_MODULE_126__["default"]) {
    var item = _breakpoints__WEBPACK_IMPORTED_MODULE_126__["default"][x];
    breakPointList.push({
      label: item.name,
      icon: item.icon,
      value: item.id
    });
  }

  // copy to clipboard start

  const copyObjectToClipboard = obj => {
    var objZ = JSON.parse(obj);
    var objX = {
      ...objZ
    };
    objX.pgStyle = true;
    var objStr = JSON.stringify(objX);
    // const jsonString = JSON.stringify(obj);
    navigator.clipboard.writeText(objStr).then(() => {}).catch(err => {
      // Handle errors here
    });
  };

  // copy to clipboard end

  //paste from clipboard start

  const pasteFromClipboard = () => {
    return new Promise((resolve, reject) => {
      navigator.clipboard.readText().then(text => {
        resolve(text);
      }).catch(err => {
        reject(err);
      });
    });
  };
  const handlePasteFromClipboard = async () => {
    try {
      const clipboardData = await navigator.clipboard.readText();
      var stylesClipboard = myStore.getStylesClipboard();
      if (stylesClipboard == null && !clipboardData) {
        setCopyArgs({
          ...copyArgs,
          pasteError: true,
          errorMessage: "Paste is empty"
        });
        setTimeout(() => {
          setCopyArgs({
            ...copyArgs,
            pasteError: false,
            errorMessage: ""
          });
        }, 2000);
        return;
      } else {
        const styleObj = JSON.parse(clipboardData);
        if (typeof styleObj == "object" && styleObj.pgStyle) {
          delete styleObj.pgStyle;
          try {
            if (props.onBulkAdd) {
              props.onBulkAdd(sudoScource, styleObj, props.extra);
            }
          } catch (error) {
            setCopyArgs({
              ...copyArgs,
              pasteError: true,
              errorMessage: "Invalid data format in clipboard"
            });
            setTimeout(() => {
              setCopyArgs({
                ...copyArgs,
                pasteError: false,
                errorMessage: ""
              });
            }, 2000);
          }
        }
      }
      setCopyArgs({
        ...copyArgs,
        isPasted: true
      });
      setTimeout(() => {
        setCopyArgs({
          ...copyArgs,
          isPasted: false
        });
      }, 2000);
    } catch (error) {
      setCopyArgs({
        ...copyArgs,
        pasteError: true,
        errorMessage: "Invalid data format in clipboard"
      });
      setTimeout(() => {
        setCopyArgs({
          ...copyArgs,
          pasteError: false,
          errorMessage: ""
        });
      }, 2000);
    }
  };
  const handlePasteRawClipboard = async () => {
    const clipboardData = await navigator.clipboard.readText();
    var styleObj = parseRawCSS(clipboardData);

    //return;

    if (typeof styleObj == "object") {
      if (props.onBulkAdd) {
        props.onBulkAdd(sudoScource, styleObj, props.extra);
      }
    }
    setcopyRawArgs({
      ...copyRawArgs,
      isPasted: true
    });
    setTimeout(() => {
      setcopyRawArgs({
        ...copyRawArgs,
        isPasted: false
      });
    }, 2000);
  };

  //paste from clipboard end

  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)("div", {
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelRow, {
      className: "bg-gray-200 p-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)("div", {
        className: "flex items-center",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_components_dropdown_sudo_selector__WEBPACK_IMPORTED_MODULE_5__["default"], {
          position: "bottom right",
          variant: "secondary",
          options: sudoScources,
          sudoScourceUpdate: sudoScourceUpdate,
          obj: props.obj,
          buttonTitle: sudoScources[sudoScource] != undefined ? sudoScources[sudoScource].label : "Choose",
          onChange: (option, index) => {
            setSudoScource(option.value);
          },
          values: ""
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("div", {
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_132__["default"], {
            icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_134__["default"]
          })
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_components_dropdown__WEBPACK_IMPORTED_MODULE_4__["default"], {
          position: "bottom right",
          variant: "secondary",
          options: cssProps,
          buttonTitle: "Add Style",
          onChange: setCssAttr,
          values: ""
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)("div", {
        className: "relative",
        children: [props.onBulkAdd && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("div", {
          className: extraOpt ? "bg-gray-400 hover:bg-gray-400 cursor-pointer p-2 " : "cursor-pointer p-2 ",
          onClick: ev => {
            setextraOpt(!extraOpt);
          },
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("svg", {
            "aria-hidden": "true",
            focusable: "false",
            role: "img",
            className: "octicon octicon-ellipsis",
            viewBox: "0 0 16 16",
            width: "16",
            height: "16",
            fill: "currentColor",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("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 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.Popover, {
          position: "bottom left",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)("div", {
            className: "p-3 w-80",
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)("div", {
              className: "flex flex-wrap gap-3 justify-center",
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)("div", {
                className: "pg-font flex gap-2 justify-center my-2 cursor-pointer py-2 px-4 capitalize tracking-wide bg-gray-800 text-white text-sm rounded hover:bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700"
                // 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('PostGridStore').setStylesClipboard(styleStr)

                  if (props.onReset) {
                    props.onReset(sudoScources, props.extra);
                  }

                  // asdsdsd.then((res) => {

                  // });
                  setResetArgs({
                    ...resetArgs,
                    isReset: true
                  });
                  setTimeout(() => {
                    setResetArgs({
                      ...resetArgs,
                      isReset: false
                    });
                  }, 2000);
                },
                children: [resetArgs.isReset && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
                  children: "Reset Done!"
                }), !resetArgs.isReset && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
                  children: " Reset Styles!"
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)("div", {
                className: "pg-font flex gap-2 justify-center my-2 cursor-pointer py-2 px-4 capitalize tracking-wide bg-gray-800 text-white rounded hover:bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700"
                // 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]);
                  copyObjectToClipboard(styleStr);
                  var asdsdsd = wp.data.dispatch("PostGridStore").setStylesClipboard(styleStr);
                  asdsdsd.then(res => {});
                  setCopyArgs({
                    ...copyArgs,
                    isCopied: true
                  });
                  setTimeout(() => {
                    setCopyArgs({
                      ...copyArgs,
                      isCopied: false
                    });
                  }, 2000);
                },
                children: [copyArgs.isCopied && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
                  children: " Copied!"
                }), !copyArgs.isCopied && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
                  children: " Copy Styles!"
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)("div", {
                className: "pg-font flex gap-2 justify-center my-2 cursor-pointer py-2 px-4 capitalize tracking-wide bg-gray-800 text-white font-medium rounded hover:bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700"
                // className="px-4 inline-block m-2 py-2 bg-sky-600  text-white cursor-pointer"
                ,
                onClick: handlePasteFromClipboard,
                children: [copyArgs.isPasted && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
                  children: "Paste Done"
                }), !copyArgs.isPasted && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
                  children: "Paste Styles"
                })]
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)("div", {
                className: `pg-font flex gap-2 justify-center my-2 cursor-pointer py-2 px-4 capitalize tracking-wide ${isProFeature ? "bg-gray-200" : "bg-gray-800 hover:bg-gray-700 hover:text-white focus:outline-none focus:bg-gray-700"}  text-white font-medium rounded `
                // className="px-4 inline-block m-2 py-2 bg-sky-600  text-white cursor-pointer"
                ,
                "data-pgTooltip": isProFeature ? "Subscribe to use." : null,
                "data-pgTooltip-location": isProFeature ? "top" : "",
                onClick: ev => {
                  if (isProFeature) {
                    alert("This feature is only available in Pro Version. Want to buy the subscription?");
                    var confirmButton = confirm("Click OK to proceed to the Combo Blocks.");
                    if (confirmButton) {
                      window.open("https://comboblocks.com/pricing/", "_blank");
                    }
                    return;
                  }
                  handlePasteRawClipboard();
                },
                children: [copyRawArgs.isPasted && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
                  children: "Paste Done"
                }), !copyRawArgs.isPasted && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
                  children: "Paste Raw CSS"
                })]
              })]
            }), copyArgs.pasteError && copyArgs.errorMessage && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("div", {
              className: "text-red-800 my-3",
              children: copyArgs.errorMessage
            }), copyRawArgs.pasteError && copyRawArgs.errorMessage && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("div", {
              className: "text-red-800 my-3",
              children: copyRawArgs.errorMessage
            })]
          })
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("div", {
        children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("div", {
          className: "inline-block",
          children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_components_icon_toggle__WEBPACK_IMPORTED_MODULE_127__["default"], {
            position: "bottom",
            variant: "secondary",
            iconList: breakPointList,
            buttonTitle: "Break Point Switch",
            onChange: (x, index) => {
              var asdsdsd = wp.data.dispatch("PostGridStore").setBreakPoint(x.value);
              asdsdsd.then(res => {
                setbreakPointLocal(x.value);
              });
            },
            activeIcon: _breakpoints__WEBPACK_IMPORTED_MODULE_126__["default"][breakPointX].icon,
            value: breakPointX
          })
        })
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)("div", {
      className: "my-5 pg-setting-input-text ",
      children:
      //Object.entries(cssAtts).map(([key, value]) => (
      props.obj[sudoScource] != undefined && Object.entries(props.obj[sudoScource]).reverse().map(([key, value]) => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
        children: value[breakPointX] != undefined && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_0__.PanelBody, {
          title: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(RemoveQueryPram, {
            title: cssProps[key] != undefined ? cssProps[key].label : key,
            sudoScource: sudoScource,
            keyX: key
          }),
          initialOpen: false,
          children: [key == "alignContent" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_align_content__WEBPACK_IMPORTED_MODULE_6__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "alignItems" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_align_items__WEBPACK_IMPORTED_MODULE_7__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "animationName" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_animation_name__WEBPACK_IMPORTED_MODULE_128__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "alignSelf" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_align_self__WEBPACK_IMPORTED_MODULE_8__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "aspectRatio" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_aspect_ratio__WEBPACK_IMPORTED_MODULE_9__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backfaceVisibility" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_backface_visibility__WEBPACK_IMPORTED_MODULE_10__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backgroundAttachment" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_attachment__WEBPACK_IMPORTED_MODULE_11__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backgroundBlendMode" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_blend_mode__WEBPACK_IMPORTED_MODULE_12__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backgroundImage" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_image__WEBPACK_IMPORTED_MODULE_15__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backgroundClip" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_clip__WEBPACK_IMPORTED_MODULE_13__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "bgColor" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_color__WEBPACK_IMPORTED_MODULE_14__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backgroundColor" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_color__WEBPACK_IMPORTED_MODULE_14__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backgroundOrigin" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_origin__WEBPACK_IMPORTED_MODULE_16__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backgroundRepeat" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_repeat__WEBPACK_IMPORTED_MODULE_18__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backgroundSize" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_size__WEBPACK_IMPORTED_MODULE_19__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backgroundPosition" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_background_position__WEBPACK_IMPORTED_MODULE_17__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "boxShadow" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_box_shadow__WEBPACK_IMPORTED_MODULE_31__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "border" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_border__WEBPACK_IMPORTED_MODULE_20__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "borderTop" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_border_top__WEBPACK_IMPORTED_MODULE_21__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "borderRight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_border_right__WEBPACK_IMPORTED_MODULE_22__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "borderBottom" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_border_bottom__WEBPACK_IMPORTED_MODULE_23__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "borderLeft" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_border_left__WEBPACK_IMPORTED_MODULE_24__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "borderRadius" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_border_radius__WEBPACK_IMPORTED_MODULE_25__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "borderCollapse" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_border_collapse__WEBPACK_IMPORTED_MODULE_28__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "borderSpacing" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_border_spacing__WEBPACK_IMPORTED_MODULE_29__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "borderImage" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_border_image__WEBPACK_IMPORTED_MODULE_26__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "backdropFilter" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_backdrop_filter__WEBPACK_IMPORTED_MODULE_30__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "bottom" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_bottom__WEBPACK_IMPORTED_MODULE_27__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "cursor" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_cursor__WEBPACK_IMPORTED_MODULE_35__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "content" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_content__WEBPACK_IMPORTED_MODULE_36__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "counterIncrement" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_counter_increment__WEBPACK_IMPORTED_MODULE_37__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "counterReset" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_counter_reset__WEBPACK_IMPORTED_MODULE_38__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "counterSet" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_counter_set__WEBPACK_IMPORTED_MODULE_39__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "columnCount" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_column_count__WEBPACK_IMPORTED_MODULE_40__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "columnRule" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_column_rule__WEBPACK_IMPORTED_MODULE_41__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "clip" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_clip__WEBPACK_IMPORTED_MODULE_42__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "top" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_top__WEBPACK_IMPORTED_MODULE_111__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "left" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_left__WEBPACK_IMPORTED_MODULE_70__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "right" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_right__WEBPACK_IMPORTED_MODULE_99__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "boxSizing" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_box_sizing__WEBPACK_IMPORTED_MODULE_32__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "clear" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_clear__WEBPACK_IMPORTED_MODULE_33__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "direction" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_direction__WEBPACK_IMPORTED_MODULE_44__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "color" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_color__WEBPACK_IMPORTED_MODULE_34__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "filter" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_filter__WEBPACK_IMPORTED_MODULE_45__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "float" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_float__WEBPACK_IMPORTED_MODULE_46__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "fontFamily" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_font_family__WEBPACK_IMPORTED_MODULE_47__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "fontSize" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_font_size__WEBPACK_IMPORTED_MODULE_48__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "fontStyle" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_font_style__WEBPACK_IMPORTED_MODULE_50__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "userSelect" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_user_select__WEBPACK_IMPORTED_MODULE_57__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "fontStretch" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_font_stretch__WEBPACK_IMPORTED_MODULE_49__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "fontWeight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_font_weight__WEBPACK_IMPORTED_MODULE_51__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "fontVariantCaps" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_font_variant_caps__WEBPACK_IMPORTED_MODULE_52__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "flexWrap" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_flex_wrap__WEBPACK_IMPORTED_MODULE_53__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "flexDirection" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_flex_direction__WEBPACK_IMPORTED_MODULE_54__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "flexShrink" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_flex_shrink__WEBPACK_IMPORTED_MODULE_55__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "flexBasis" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_flex_basis__WEBPACK_IMPORTED_MODULE_56__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "flexFlow" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_flex_flow__WEBPACK_IMPORTED_MODULE_59__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "flexGrow" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_flex_grow__WEBPACK_IMPORTED_MODULE_58__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "gridAutoFlow" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_grid_auto_flow__WEBPACK_IMPORTED_MODULE_60__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "gridColumnEnd" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_grid_column_end__WEBPACK_IMPORTED_MODULE_61__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "gridColumnStart" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_grid_column_start__WEBPACK_IMPORTED_MODULE_62__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "gridRowEnd" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_grid_row_end__WEBPACK_IMPORTED_MODULE_63__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "gridRowStart" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_grid_row_start__WEBPACK_IMPORTED_MODULE_64__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "gridTemplateColumns" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_grid_template_columns__WEBPACK_IMPORTED_MODULE_65__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "gridTemplateRows" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_grid_template_rows__WEBPACK_IMPORTED_MODULE_66__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "letterSpacing" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_letter_spacing__WEBPACK_IMPORTED_MODULE_71__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "lineHeight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_line_height__WEBPACK_IMPORTED_MODULE_72__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "listStyle" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_list_style__WEBPACK_IMPORTED_MODULE_73__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "justifyContent" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_justify_content__WEBPACK_IMPORTED_MODULE_69__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "objectFit" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_object_fit__WEBPACK_IMPORTED_MODULE_84__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "opacity" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_opacity__WEBPACK_IMPORTED_MODULE_85__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "outline" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_outline__WEBPACK_IMPORTED_MODULE_86__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "outlineOffset" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_outline_offset__WEBPACK_IMPORTED_MODULE_87__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "position" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_position__WEBPACK_IMPORTED_MODULE_98__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "tableLayout" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_table_layout__WEBPACK_IMPORTED_MODULE_113__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "emptyCells" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_empty_cells__WEBPACK_IMPORTED_MODULE_114__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "captionSide" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_caption_side__WEBPACK_IMPORTED_MODULE_130__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "gap" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_gap__WEBPACK_IMPORTED_MODULE_100__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "columnGap" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_column_gap__WEBPACK_IMPORTED_MODULE_101__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "rowGap" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_row_gap__WEBPACK_IMPORTED_MODULE_102__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "transition" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_transition__WEBPACK_IMPORTED_MODULE_116__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "transform" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_transform__WEBPACK_IMPORTED_MODULE_115__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "transformOrigin" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_transform_origin__WEBPACK_IMPORTED_MODULE_104__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "textIndent" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_text_indent__WEBPACK_IMPORTED_MODULE_106__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "textJustify" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_text_justify__WEBPACK_IMPORTED_MODULE_107__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "textOverflow" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_text_overflow__WEBPACK_IMPORTED_MODULE_108__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "textTransform" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_text_transform__WEBPACK_IMPORTED_MODULE_110__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "textDecoration" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_text_decoration__WEBPACK_IMPORTED_MODULE_105__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "textShadow" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_text_shadow__WEBPACK_IMPORTED_MODULE_109__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "textAlign" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_text_align__WEBPACK_IMPORTED_MODULE_103__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "textAlignLast" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_text_align_last__WEBPACK_IMPORTED_MODULE_112__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "visibility" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_visibility__WEBPACK_IMPORTED_MODULE_118__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "wordBreak" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_word_break__WEBPACK_IMPORTED_MODULE_121__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "wordSpacing" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_word_spacing__WEBPACK_IMPORTED_MODULE_122__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "zIndex" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_z_index__WEBPACK_IMPORTED_MODULE_125__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "padding" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_padding__WEBPACK_IMPORTED_MODULE_92__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "paddingTop" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_padding_top__WEBPACK_IMPORTED_MODULE_93__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "paddingRight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_padding_right__WEBPACK_IMPORTED_MODULE_94__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "paddingBottom" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_padding_bottom__WEBPACK_IMPORTED_MODULE_95__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "paddingLeft" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_padding_left__WEBPACK_IMPORTED_MODULE_96__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "placeItems" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_place_items__WEBPACK_IMPORTED_MODULE_97__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "marginTop" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_margin_top__WEBPACK_IMPORTED_MODULE_75__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "marginRight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_margin_right__WEBPACK_IMPORTED_MODULE_76__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "marginBottom" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_margin_bottom__WEBPACK_IMPORTED_MODULE_77__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "marginLeft" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_margin_left__WEBPACK_IMPORTED_MODULE_78__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "margin" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_margin__WEBPACK_IMPORTED_MODULE_74__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "maxHeight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_max_height__WEBPACK_IMPORTED_MODULE_79__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "maxWidth" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_max_width__WEBPACK_IMPORTED_MODULE_80__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "minHeight" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_min_height__WEBPACK_IMPORTED_MODULE_81__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "minWidth" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_min_width__WEBPACK_IMPORTED_MODULE_82__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "display" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_display__WEBPACK_IMPORTED_MODULE_43__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "width" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_width__WEBPACK_IMPORTED_MODULE_119__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "height" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_height__WEBPACK_IMPORTED_MODULE_68__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "verticalAlign" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_vertical_align__WEBPACK_IMPORTED_MODULE_117__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "overflow" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_overflow__WEBPACK_IMPORTED_MODULE_89__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "order" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_order__WEBPACK_IMPORTED_MODULE_88__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "overflowX" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_overflow_x__WEBPACK_IMPORTED_MODULE_90__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "overflowY" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_overflow_y__WEBPACK_IMPORTED_MODULE_91__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "writingMode" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_writing_mode__WEBPACK_IMPORTED_MODULE_123__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "wordWrap" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_word_wrap__WEBPACK_IMPORTED_MODULE_124__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "perspective" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_perspective__WEBPACK_IMPORTED_MODULE_83__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "whiteSpace" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_white_space__WEBPACK_IMPORTED_MODULE_120__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          }), key == "-webkit-text-fill-color" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(_css_webkit_text_fill_color__WEBPACK_IMPORTED_MODULE_129__["default"], {
            val: value[breakPointX],
            onChange: onChangeCssVal
          })]
        }, key)
      }))
    })]
  });
}
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 {
      extra,
      obj,
      onChange,
      onAdd,
      onRemove,
      onBulkAdd,
      onReset
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.Fragment, {
      children: [onBulkAdd == null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(Html, {
        obj: obj,
        extra: extra,
        onAdd: onAdd,
        onRemove: onRemove,
        onChange: onChange,
        warn: this.state.showWarning,
        onReset: onReset
      }), onBulkAdd != null && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_131__.jsx)(Html, {
        obj: obj,
        extra: extra,
        onAdd: onAdd,
        onRemove: onRemove,
        onChange: onChange,
        onBulkAdd: onBulkAdd,
        onReset: onReset,
        warn: this.state.showWarning
      })]
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGStyles);

/***/ }),

/***/ "./src/components/support-ticket/index.js":
/*!************************************************!*\
  !*** ./src/components/support-ticket/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_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__);
/* 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_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__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_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");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__);
const {
  Component
} = wp.element;










function Html(props) {
  if (!props.warn) {
    return null;
  }
  const [searchPrams, setsearchPrams] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)({
    title: "",
    content: '',
    files: [],
    budget: 50,
    email: '',
    name: "",
    status: 'idle',
    statusMessage: ''
  });
  var [isLoading, setIsLoading] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.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_2__.useEffect)(() => {
    _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1___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);
    if (searchPrams.title.length == 0) {
      setsearchPrams({
        ...searchPrams,
        status: 'fail',
        statusMessage: "Subejct should not empty"
      });
      setIsLoading(false);
      return;
    }
    if (searchPrams.content.length == 0) {
      setsearchPrams({
        ...searchPrams,
        status: 'fail',
        statusMessage: "Details should not empty"
      });
      setIsLoading(false);
      return;
    }
    if (searchPrams.email.length == 0) {
      setsearchPrams({
        ...searchPrams,
        status: 'fail',
        statusMessage: "Email should not empty"
      });
      setIsLoading(false);
      return;
    }
    var htmlBody = '';
    htmlBody += '<p style="font-weight:bold;font-size:18px">' + searchPrams.title + '</p>';
    htmlBody += '<p style="font-weight:bold">Email: ' + searchPrams.email + '</p>';
    htmlBody += '<p></p>';
    htmlBody += searchPrams.content;
    var postData = {
      subject: '#Post Grid Support - ' + searchPrams.title,
      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_1___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',
          statusMessage: ""
        });
      } else {
        setsearchPrams({
          ...searchPrams,
          status: 'fail',
          statusMessage: ""
        });
      }
      setTimeout(() => {
        setsearchPrams({
          ...searchPrams,
          status: 'idle',
          statusMessage: ""
        });
      }, 4000);
      setIsLoading(false);
    });
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
    id: "requestTemplate",
    className: "pg-setting-input-text",
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
      className: "flex items-end justify-end gap-2",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("a", {
        className: "bg-slate-400 px-4 py-2 rounded-sm",
        target: "_blank",
        href: "https://wordpress.org/support/plugin/post-grid/#new-topic-0",
        children: "Create Ticket at wordpress.org"
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("a", {
        className: "bg-slate-400 px-4 py-2 rounded-sm",
        target: "_blank",
        href: "https://pickplugins.com/create-support-ticket/",
        children: "Create Ticket at our site"
      })]
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
      className: "grid grid-cols-2 gap-5 items-center",
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
          for: "",
          className: "pg-font mb-3 block  text-base",
          children: "Subjet"
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_components_input_text__WEBPACK_IMPORTED_MODULE_5__["default"], {
          className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-full ",
          type: "text",
          placeholder: "",
          value: searchPrams.title,
          onChange: newVal => {
            setsearchPrams({
              ...searchPrams,
              title: newVal
            });
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
          for: "",
          className: " pg-font  mt-5 mb-3 block  text-base",
          children: "Details"
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_3__.RichText, {
          className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid h-28",
          tagName: "div",
          value: searchPrams.content,
          allowedFormats: ["core/bold", "core/italic", "core/link"],
          onChange: content => {
            setsearchPrams({
              ...searchPrams,
              content: content
            });
          },
          placeholder: "Write details about your design..."
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
          for: "",
          className: " mb-3 mt-5 block pg-font   text-base",
          children: "Your Email"
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_components_input_text__WEBPACK_IMPORTED_MODULE_5__["default"], {
          className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-full ",
          type: "text",
          placeholder: "",
          value: searchPrams.email,
          onChange: newVal => {
            setsearchPrams({
              ...searchPrams,
              email: newVal
            });
          }
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("label", {
          for: "",
          className: " my-3 block pg-font   text-base",
          children: "Your Name"
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_components_input_text__WEBPACK_IMPORTED_MODULE_5__["default"], {
          className: "!py-1 px-2 !border-2 !border-[#8c8f94] !border-solid w-full ",
          type: "text",
          placeholder: "",
          value: searchPrams.name,
          onChange: newVal => {
            setsearchPrams({
              ...searchPrams,
              name: newVal
            });
          }
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
        className: "py-5 px-10",
        children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("p", {
          className: "text-base pg-font ",
          children: "By sending mail, you are requested to follow our support terms."
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
          className: "flex bg-blue-600 pg-font  justify-center items-center rounded-md  font-bold text-base text-center cursor-pointer hover:bg-blue-500 px-10 py-3 my-5",
          onClick: ev => {
            senMail();
          },
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
            className: "text-white",
            children: "Send Mail"
          }), isLoading && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
            className: "text-center",
            children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.Spinner, {
              className: "!m-0 !mx-3"
            })
          })]
        }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("p", {
          className: "text-xs",
          children: ["We do not collect any other information. Your mail will go to ", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("b", {
            children: "support@pickplugins.com"
          })]
        }), searchPrams.status == "success" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
          className: " pg-font  text-green-800 font-bold text-base p-2 px-4",
          children: "Mial has sent. Our team will contact soon."
        }), searchPrams.status == "fail" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
          className: " pg-font  text-red-500 font-bold text-base p-2 px-4",
          children: "Sorry, Unable to send mail."
        }), searchPrams.status == "fail" && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
          className: " pg-font  text-red-500 font-bold text-base p-2 px-4",
          children: searchPrams.statusMessage
        })]
      })]
    })]
  });
}
class PGSupportTicket 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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(Html, {
      warn: this.state.showWarning
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGSupportTicket);

/***/ }),

/***/ "./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_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 react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__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 /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
        className: "tabContent py-3",
        children: children
      });
    }
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(MyFunction, {})
    });
  }
}
/* 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_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_icons__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/icon/index.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__);
const {
  Component,
  RawHTML,
  useState,
  useEffect
} = wp.element;



function MyFunction(props) {
  if (!props.warn) {
    return null;
  }
  var navItemLabelClass = props.navItemLabelClass;
  var stickyNavs = props.stickyNavs;
  var orientation = props.orientation; // vertical, horizontal
  var tabsWrapperClass = props.tabsWrapperClass;
  var navItemsWrapClass = props.navItemsWrapClass;
  var contentClass = props.contentClass == undefined ? "py-3" : props.contentClass;
  var navItemClass = props.navItemClass == undefined ? "bg-gray-200" : props.navItemClass;
  var navItemSelectedClass = props.navItemSelectedClass == undefined ? "!bg-gray-400" : props.navItemSelectedClass;
  const [selected, setSelected] = useState(props.activeTab);
  const [scrollTo, setscrollTo] = useState(200);
  var content;
  useEffect(() => {
    setSelected(props.activeTab);
  }, [props.activeTab]);
  props.children.map(child => {
    if (selected == child.props.name) {
      content = child.props.children;
    }
  });
  function scrollPrev() {
    const tabsNavs = document.querySelector(".tabsNavs");
    if (tabsNavs == null) return;
    tabsNavs.scrollBy({
      left: -scrollTo,
      behavior: "smooth"
    });
  }
  function scrollNext() {
    const tabsNavs = document.querySelector(".tabsNavs");
    if (tabsNavs == null) return;
    tabsNavs.scrollBy({
      left: scrollTo,
      behavior: "smooth"
    });
  }
  function onWheel(ev) {
    // ev.preventDefault();
    ev.stopPropagation();
    const tabsNavs = document.querySelector(".tabsNavs");
    tabsNavs?.scrollBy({
      left: ev.deltaY,
      behavior: "smooth"
    });
  }
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("div", {
    className: orientation == "vertical" ? `flex tabsWrapper ${tabsWrapperClass}` : ` relative tabsWrapper ${tabsWrapperClass}`,
    children: [stickyNavs && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
      className: "",
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
        className: orientation == "vertical" ? "block w-[200px] " : `flex overflow-hidden  tabsNavs cursor-move ${navItemsWrapClass}`,
        onWheel: onWheel,
        children: props.tabs.map((tab, index) => {
          return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("div", {
            className: `${navItemClass} flex justify-between flex-none   items-center grow  font-medium  text-slate-900 p-2 cursor-pointer hover:bg-gray-300 ${tab.name == selected ? navItemSelectedClass : navItemClass} ${orientation == "vertical" ? "       " : ""}`,
            onClick: ev => {
              props.onSelect(tab);
              setSelected(tab.name);
            },
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("div", {
              className: `flex ${navItemLabelClass} ${orientation == "vertical" ? "" : "flex-col"} justify-center items-center`,
              children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"], {
                fill: "#404040",
                icon: tab.icon,
                size: 24
                // className="mr-2 w-[20px] text-green-500"
                ,
                className: " text-green-500"
              }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
                className: "text-sm",
                children: tab.title
              })]
            }), tab.isPro != null && tab.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
              className: "pg-bg-color text-white px-2  text-sm rounded-sm",
              onClick: ev => {
                window.open("https://comboblocks.com/pricing/", "_blank");
              },
              children: "Pro"
            })]
          }, index);
        })
      })
    }), !stickyNavs && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
      className: orientation == "vertical" ? "block w-[200px] " : `flex overflow-hidden  tabsNavs cursor-move ${navItemsWrapClass}`,
      onWheel: onWheel,
      children: props.tabs.map((tab, index) => {
        return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("div", {
          className: `${navItemClass} flex justify-between flex-none    items-center   font-medium  text-slate-900 p-2 cursor-pointer hover:bg-gray-300 ${tab.name == selected ? navItemSelectedClass : navItemClass} ${orientation == "vertical" ? "       " : ""}`,
          onClick: ev => {
            props.onSelect(tab);
            setSelected(tab.name);
          },
          children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("div", {
            className: `flex ${navItemLabelClass} ${orientation == "vertical" ? "" : ""} justify-center items-center`,
            children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_2__["default"], {
              fill: "#404040",
              icon: tab.icon,
              size: 24
              // className="mr-2 w-[20px] text-green-500"
              ,
              className: " text-green-500"
            }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
              className: "text-sm",
              children: tab.title
            })]
          }), tab.isPro != null && tab.isPro && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
            className: "pg-bg-color text-white px-2  text-sm rounded-sm",
            onClick: ev => {
              window.open("https://comboblocks.com/pricing/", "_blank");
            },
            children: "Pro"
          })]
        }, index);
      })
    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
      className: `tabContent  ${contentClass}`,
      children: 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,
      contentClass,
      stickyNavs,
      tabsWrapperClass,
      navItemsWrapClass,
      navItemClass,
      navItemLabelClass,
      navItemSelectedClass,
      onSelect,
      tabs,
      children
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(MyFunction, {
        children: children,
        tabs: tabs,
        orientation: orientation,
        contentClass: contentClass,
        stickyNavs: stickyNavs,
        tabsWrapperClass: tabsWrapperClass,
        navItemsWrapClass: navItemsWrapClass,
        navItemClass: navItemClass,
        navItemLabelClass: navItemLabelClass,
        navItemSelectedClass: navItemSelectedClass,
        onSelect: onSelect,
        activeTab: activeTab,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGtabs);

/***/ }),

/***/ "./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_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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/chevron-down.js");
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/chevron-up.js");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime");
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__);
const {
  Component,
  RawHTML,
  useState
} = wp.element;




function Html(props) {
  if (!props.warn) {
    return null;
  }
  var title = props.title;
  var opened = props.opened;
  var initialOpen = props.initialOpen;
  var beforeTitle = props.beforeTitle;
  var children = props.children;
  const [isOpen, setIsOpen] = useState(initialOpen);
  var icon = '';
  // useEffect(() => {
  // }, [keyword]);
  return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", {
    className: `${props.className} cb-setting-input-text`,
    children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", {
      className: `${isOpen ? "bg-gray-500" : "bg-gray-700"}	hover:bg-gray-500 border-0	border-b border-solid border-gray-500 px-2 py-2 items-center cursor-pointer flex justify-between `,
      onClick: ev => {
        if (opened == undefined || opened == null) {
          setIsOpen(!isOpen);
        }
      },
      children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", {
        className: "flex cursor-pointer w-full ",
        children: [beforeTitle, /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", {
          className: " flex items-center\ttext-white",
          children: title
        })]
      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
        children: isOpen ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_4__["default"]
        }) : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_3__["default"], {
          icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_5__["default"]
        })
      })]
    }), isOpen && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
      className: "p-2",
      children: children
    })]
  });
}
class PGtoggle 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 {
      title,
      opened,
      initialOpen,
      beforeTitle,
      className,
      children
    } = this.props;
    return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", {
      children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Html, {
        title: title,
        opened: opened,
        initialOpen: initialOpen,
        beforeTitle: beforeTitle,
        className: className,
        children: children,
        warn: this.state.showWarning
      })
    });
  }
}
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (PGtoggle);

/***/ }),

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

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__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__);
const {
  addFilter
} = wp.hooks;

const {
  Component,
  useState,
  useEffect
} = wp.element;


//var [customerData, setcustomerData] = useState({ id: "", isPro: false });

_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_1___default()({
  path: "/post-grid/v2/get_options",
  method: "POST",
  data: {
    option: "post_grid_settings"
  }
}).then(res => {
  if (res.length != 0) {
    var resX = {
      ...res
    };
    if (resX?.license_key) {
      //setcustomerData({ ...customerData, isPro: true })

      const sudoScourceArgsPro = {
        styles: {
          label: "Idle",
          value: "styles"
        },
        hover: {
          label: "Hover",
          value: "hover"
        },
        after: {
          label: "After",
          value: "after"
        },
        before: {
          label: "Before",
          value: "before"
        },
        active: {
          label: "Active",
          value: "active"
        },
        focus: {
          label: "Focus",
          value: "focus"
        },
        "focus-within": {
          label: "Focus-within",
          value: "focus-within"
        },
        target: {
          label: "target",
          value: "target"
        },
        visited: {
          label: "Visited",
          value: "visited"
        },
        selection: {
          label: "Selection",
          value: "selection"
        },
        ":marker": {
          label: "Marker",
          value: ":marker"
        },
        "nth-child(even)": {
          label: "nth-child(even)",
          value: "nth-child(even)"
        },
        "nth-child(odd)": {
          label: "nth-child(odd)",
          value: "nth-child(odd)"
        },
        "nth-child(1)": {
          label: "nth-child(1)",
          value: "nth-child(1)"
        },
        "nth-child(2)": {
          label: "nth-child(2)",
          value: "nth-child(2)"
        },
        "nth-child(3)": {
          label: "nth-child(3)",
          value: "nth-child(3)"
        },
        "nth-child(4)": {
          label: "nth-child(4)",
          value: "nth-child(4)"
        },
        "nth-child(5)": {
          label: "nth-child(5)",
          value: "nth-child(5)"
        },
        "first-child": {
          label: "First-child",
          value: "first-child"
        },
        "last-child": {
          label: "Last-child",
          value: "last-child"
        },
        "first-letter": {
          label: "First-letter",
          value: "first-letter"
        },
        "first-line": {
          label: "First-line",
          value: "first-line"
        },
        "hover::before": {
          label: "hover::before",
          value: "hover::before"
        },
        "hover::after": {
          label: "hover::after",
          value: "hover::after"
        },
        "hover::marker": {
          label: "hover::marker",
          value: "hover::marker"
        },
        "hover::first-letter": {
          label: "hover::first-letter",
          value: "hover::first-letter"
        },
        "hover:first-child": {
          label: "hover:first-child",
          value: "hover:first-child"
        },
        "hover:last-child": {
          label: "hover:last-child",
          value: "hover:last-child"
        },
        "hover:first-line": {
          label: "hover:first-line",
          value: "hover:first-line"
        },
        "hover:first-line": {
          label: "hover:first-line",
          value: "hover:first-line"
        },
        "hover:nth-child(odd)": {
          label: "hover:nth-child(odd)",
          value: "hover:nth-child(odd)"
        },
        "hover:nth-child(even)": {
          label: "hover:nth-child(even)",
          value: "hover:nth-child(even)"
        },
        "hover div:nth-child(1)": {
          label: "hover div:nth-child(1)",
          value: "hover div:nth-child(1)"
        },
        "hover div:nth-child(2)": {
          label: "hover div:nth-child(2)",
          value: "hover div:nth-child(2)"
        },
        "-webkit-slider-thumb": {
          label: "-webkit-slider-thumb",
          value: "-webkit-slider-thumb"
        },
        "-moz-range-thumb": {
          label: "-moz-range-thumb",
          value: "-moz-range-thumb"
        },
        checked: {
          label: "checked",
          value: "checked"
        },
        "checked:after": {
          label: "checked:after",
          value: "checked:after"
        },
        "checked:before": {
          label: "checked:before",
          value: "checked:before"
        },
        "has(> input:checked)": {
          label: "has(> input:checked)",
          value: "has(> input:checked)"
        },
        "has(> input[type=radio]:checked)": {
          label: "has(> input[type=radio]:checked)",
          value: "has(> input[type=radio]:checked)"
        },
        "has(> input[type=checkbox]:checked)": {
          label: "has(> input[type=checkbox]:checked)",
          value: "has(> input[type=checkbox]:checked)"
        }
      };
      addFilter("sudoScourceArgs", "post-grid/sudoScourceArgs", function (options) {
        return sudoScourceArgsPro;
      });
      var cssPropsPro = {
        alignContent: {
          id: "alignContent",
          label: "Align Content"
        },
        alignItems: {
          id: "alignItems",
          label: "Align Items"
        },
        alignSelf: {
          id: "alignSelf",
          label: "Align Self"
        },
        animationName: {
          id: "animationName",
          label: "Animation Name"
        },
        aspectRatio: {
          id: "aspectRatio",
          label: "Aspect Ratio"
        },
        backdropFilter: {
          id: "backdropFilter",
          label: "Backdrop Filter"
        },
        backfaceVisibility: {
          id: "backfaceVisibility",
          label: "Backface Visibility"
        },
        backgroundAttachment: {
          id: "backgroundAttachment",
          label: "Background Attachment"
        },
        backgroundBlendMode: {
          id: "backgroundBlendMode",
          label: "Background Blend Mode"
        },
        backgroundClip: {
          id: "backgroundClip",
          label: "Background Clip"
        },
        backgroundColor: {
          id: "backgroundColor",
          label: "Background Color"
        },
        backgroundImage: {
          id: "backgroundImage",
          label: "Background Image"
        },
        backgroundOrigin: {
          id: "backgroundOrigin",
          label: "Background Origin"
        },
        backgroundPosition: {
          id: "backgroundPosition",
          label: "Background Position"
        },
        backgroundRepeat: {
          id: "backgroundRepeat",
          label: "Background Repeat"
        },
        backgroundSize: {
          id: "backgroundSize",
          label: "Background Size"
        },
        border: {
          id: "border",
          label: "Border"
        },
        borderBottom: {
          id: "borderBottom",
          label: "Border Bottom"
        },
        borderCollapse: {
          id: "borderCollapse",
          label: "Border Collapse"
        },
        borderImage: {
          id: "borderImage",
          label: "Border Image"
        },
        borderLeft: {
          id: "borderLeft",
          label: "Border Left"
        },
        borderRadius: {
          id: "borderRadius",
          label: "Border Radius"
        },
        borderRight: {
          id: "borderRight",
          label: "Border Right"
        },
        borderSpacing: {
          id: "borderSpacing",
          label: "Border Spacing"
        },
        borderTop: {
          id: "borderTop",
          label: "Border Top"
        },
        bottom: {
          id: "bottom",
          label: "Bottom"
        },
        boxShadow: {
          id: "boxShadow",
          label: "Box Shadow"
        },
        boxSizing: {
          id: "boxSizing",
          label: "Box Sizing"
        },
        captionSide: {
          id: "captionSide",
          label: "Caption Side"
        },
        clear: {
          id: "clear",
          label: "Clear"
        },
        clip: {
          id: "clip",
          label: "Clip"
        },
        color: {
          id: "color",
          label: "Color"
        },
        columnCount: {
          id: "columnCount",
          label: "Column Count"
        },
        columnGap: {
          id: "columnGap",
          label: "Column gap"
        },
        columnRule: {
          id: "columnRule",
          label: "Column Rule"
        },
        content: {
          id: "content",
          label: "Content"
        },
        counterIncrement: {
          id: "counterIncrement",
          label: "Counter Increment"
        },
        counterReset: {
          id: "counterReset",
          label: "Counter Reset"
        },
        counterSet: {
          id: "counterSet",
          label: "Counter Set"
        },
        cursor: {
          id: "cursor",
          label: "Cursor"
        },
        direction: {
          id: "direction",
          label: "Direction"
        },
        display: {
          id: "display",
          label: "Display"
        },
        emptyCells: {
          id: "emptyCells",
          label: "Empty Cells"
        },
        filter: {
          id: "filter",
          label: "Filter"
        },
        flexBasis: {
          id: "flexBasis",
          label: "Flex Basis"
        },
        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"
        },
        fontFamily: {
          id: "fontFamily",
          label: "Font Family"
        },
        fontSize: {
          id: "fontSize",
          label: "Font Size"
        },
        fontStretch: {
          id: "fontStretch",
          label: "Font Stretch"
        },
        fontStyle: {
          id: "fontStyle",
          label: "Font Style"
        },
        fontVariantCaps: {
          id: "fontVariantCaps",
          label: "Font VariantCaps"
        },
        fontWeight: {
          id: "fontWeight",
          label: "Font Weight"
        },
        gap: {
          id: "gap",
          label: "Gap"
        },
        gridAutoColumns: {
          id: "gridAutoColumns",
          label: "Grid Auto Columns"
        },
        gridAutoFlow: {
          id: "gridAutoFlow",
          label: "Grid Auto Flow"
        },
        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"
        },
        justifyContent: {
          id: "justifyContent",
          label: "Justify Content"
        },
        left: {
          id: "left",
          label: "Left"
        },
        letterSpacing: {
          id: "letterSpacing",
          label: "Letter Spacing"
        },
        lineHeight: {
          id: "lineHeight",
          label: "Line Height"
        },
        listStyle: {
          id: "listStyle",
          label: "List Style"
        },
        margin: {
          id: "margin",
          label: "Margin"
        },
        marginBottom: {
          id: "marginBottom",
          label: "Margin Bottom"
        },
        marginLeft: {
          id: "marginLeft",
          label: "Margin Left"
        },
        marginRight: {
          id: "marginRight",
          label: "Margin Right"
        },
        marginTop: {
          id: "marginTop",
          label: "Margin Top"
        },
        maskImage: {
          id: "maskImage",
          label: "Mask Image"
        },
        maskMode: {
          id: "maskMode",
          label: "Mask Mode"
        },
        maskOrigin: {
          id: "maskOrigin",
          label: "Mask Origin"
        },
        maskPosition: {
          id: "maskPosition",
          label: "Mask Position"
        },
        maskRepeat: {
          id: "maskRepeat",
          label: "Mask Repeat"
        },
        maskSize: {
          id: "maskSize",
          label: "Mask Size"
        },
        maxHeight: {
          id: "maxHeight",
          label: "Max Height"
        },
        maxWidth: {
          id: "maxWidth",
          label: "Max Width"
        },
        minHeight: {
          id: "minHeight",
          label: "Min Height"
        },
        minWidth: {
          id: "minWidth",
          label: "Min Width"
        },
        objectFit: {
          id: "objectFit",
          label: "Object Fit"
        },
        opacity: {
          id: "opacity",
          label: "Opacity"
        },
        order: {
          id: "order",
          label: "Order"
        },
        outline: {
          id: "outline",
          label: "Outline"
        },
        overflow: {
          id: "overflow",
          label: "Overflow"
        },
        overflowX: {
          id: "overflowX",
          label: "OverflowX"
        },
        overflowY: {
          id: "overflowY",
          label: "OverflowY"
        },
        padding: {
          id: "padding",
          label: "Padding"
        },
        paddingBottom: {
          id: "paddingBottom",
          label: "Padding Bottom"
        },
        paddingLeft: {
          id: "paddingLeft",
          label: "Padding Left"
        },
        paddingRight: {
          id: "paddingRight",
          label: "Padding Right"
        },
        paddingTop: {
          id: "paddingTop",
          label: "Padding Top"
        },
        perspective: {
          id: "perspective",
          label: "Perspective"
        },
        position: {
          id: "position",
          label: "Position"
        },
        right: {
          id: "right",
          label: "Right"
        },
        rowGap: {
          id: "rowGap",
          label: "Row Gap"
        },
        tableLayout: {
          id: "tableLayout",
          label: "Table Layout"
        },
        textAlign: {
          id: "textAlign",
          label: "Text Align"
        },
        textDecoration: {
          id: "textDecoration",
          label: "Text Decoration"
        },
        textIndent: {
          id: "textIndent",
          label: "Text Indent"
        },
        textJustify: {
          id: "textJustify",
          label: "Text Justify"
        },
        textOverflow: {
          id: "textOverflow",
          label: "Text Overflow"
        },
        textShadow: {
          id: "textShadow",
          label: "Text Shadow"
        },
        textTransform: {
          id: "textTransform",
          label: "Text Transform"
        },
        top: {
          id: "top",
          label: "Top"
        },
        transform: {
          id: "transform",
          label: "Transform"
        },
        transformOrigin: {
          id: "transformOrigin",
          label: "Transform Origin"
        },
        transformStyle: {
          id: "transformStyle",
          label: "Transform Style"
        },
        transition: {
          id: "transition",
          label: "Transition"
        },
        verticalAlign: {
          id: "verticalAlign",
          label: "Vertical Align"
        },
        visibility: {
          id: "visibility",
          label: "Visibility"
        },
        width: {
          id: "width",
          label: "Width"
        },
        wordBreak: {
          id: "wordBreak",
          label: "Word Break"
        },
        wordSpacing: {
          id: "wordSpacing",
          label: "Word Spacing"
        },
        wordWrap: {
          id: "wordWrap",
          label: "Word Wrap"
        },
        writingMode: {
          id: "writingMode",
          label: "Writing Mode"
        },
        zIndex: {
          id: "zIndex",
          label: "Z-Index"
        },
        "-webkit-text-fill-color": {
          id: "-webkit-text-fill-color",
          label: "Webkit Text Fill Color"
        }
      };
      addFilter("cssProps", "post-grid/cssProps", function (options) {
        return cssPropsPro;
      });
      var paginationTypes = {
        none: {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("None", "post-grid"),
          value: "none"
        },
        normal: {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Normal Pagination", "post-grid"),
          value: "normal"
        },
        ajax: {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Ajax Pagination", "post-grid"),
          value: "ajax"
        },
        next_previous: {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Next-Previous", "post-grid"),
          value: "next_previous"
        },
        loadmore: {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Load More", "post-grid"),
          value: "loadmore"
        },
        infinite: {
          label: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Infinite Load", "post-grid"),
          value: "infinite"
        }
        // filterable: {
        // 	label: __("Filterable", "post-grid"),
        // 	value: "filterable"
        // },
      };
      addFilter("PostGridPaginationTypes", "post-grid/paginationTypes", function (options) {
        return paginationTypes;
      });
      var postQueryArgs = {
        postType: {
          value: ["post"],
          multiple: false,
          id: "postType",
          label: "Post types",
          description: "Select Post Types to Query"
        },
        s: {
          value: "",
          multiple: false,
          id: "s",
          label: "Keyword",
          description: "Search keyword, ex: hello"
        },
        postStatus: {
          value: [],
          multiple: false,
          id: "postStatus",
          label: "Post status",
          description: "Query post by post status"
        },
        order: {
          value: "",
          multiple: false,
          id: "order",
          label: "Order",
          description: "Post query order"
        },
        orderby: {
          value: [],
          multiple: false,
          id: "orderby",
          label: "Orderby",
          description: "Post query orderby"
        },
        metaKey: {
          value: "",
          multiple: false,
          id: "metaKey",
          label: "Meta fields key",
          description: "Post query by meta fields key"
        },
        // Category Parameters
        cat: {
          value: "",
          multiple: false,
          id: "cat",
          label: "Category ID",
          description: "Post query by Category ID"
        },
        categoryName: {
          value: "",
          multiple: false,
          id: "categoryName",
          label: "Category Name",
          description: "Post query by Category Name"
        },
        categoryAnd: {
          value: [],
          multiple: false,
          id: "categoryAnd",
          label: "Category And",
          description: "Post query by Category IDs"
        },
        categoryIn: {
          value: [],
          multiple: false,
          id: "categoryIn",
          label: "Category In",
          description: "Post query by Category IDs"
        },
        categoryNotIn: {
          value: [],
          multiple: false,
          id: "categoryNotIn",
          label: "Category Not In",
          description: "Post query by excluded Category IDs"
        },
        // Tag Parameters
        tag: {
          value: "",
          multiple: false,
          id: "tag",
          label: "Tags",
          description: "Post query by Tag slug"
        },
        tagId: {
          value: "",
          multiple: false,
          id: "tagId",
          label: "Tag Id",
          description: "Post query by Tag ID"
        },
        tagAnd: {
          value: "",
          multiple: false,
          id: "tagAnd",
          label: "Tag And",
          description: "Post query by Tag Ids"
        },
        tagIn: {
          value: "",
          multiple: false,
          id: "tagIn",
          label: "Tag In",
          description: "Post query by Tag ids"
        },
        tagNotIn: {
          value: "",
          multiple: false,
          id: "tagNotIn",
          label: "Tag Not In",
          description: "Post query by excluded Tag ids"
        },
        tagSlugAnd: {
          value: "",
          multiple: false,
          id: "tagSlugAnd",
          label: "Tag Slug And",
          description: "Post query by Tags slug"
        },
        tagSlugIn: {
          value: "",
          multiple: false,
          id: "tagSlugIn",
          label: "Tag Slug In",
          description: "Post query by excluded Tags slug"
        },
        // taxQuery: {
        // 	value: [],
        // 	multiple: false,
        // 	id: "taxQuery",
        // 	label: "Tax Query",
        // 	description: "Taxonomies query arguments",
        // 	
        // },
        taxQueryRelation: {
          value: "OR",
          multiple: false,
          id: "taxQueryRelation",
          label: "Taxonomy Query Relation",
          description: "Taxonomies query relation"
        },
        // // Date Parameters
        // dateQuery: {
        // 	value: [],

        // 	multiple: false,
        // 	id: "dateQuery",
        // 	label: "Date Query",
        // 	description: "Post query by date",
        // 	
        // },
        year: {
          value: "",
          multiple: false,
          id: "year",
          label: "Year",
          description: "Post query by year"
        },
        monthnum: {
          value: "",
          multiple: false,
          id: "monthnum",
          label: "Month",
          description: "Post query by month"
        },
        w: {
          value: "",
          multiple: false,
          id: "w",
          label: "Week",
          description: "Post query by week"
        },
        day: {
          value: "",
          multiple: false,
          id: "day",
          label: "Day",
          description: "Post query by day"
        },
        hour: {
          value: "",
          multiple: false,
          id: "hour",
          label: "Hour",
          description: "Post query by hour"
        },
        minute: {
          value: "",
          multiple: false,
          id: "minute",
          label: "Miniute",
          description: "Post query by miniute"
        },
        second: {
          value: "",
          multiple: false,
          id: "second",
          label: "Second",
          description: "Post query by second"
        },
        m: {
          value: "",
          multiple: false,
          id: "m",
          label: "Month",
          description: "Post query by month"
        },
        // // Author Parameters
        author: {
          value: "",
          multiple: false,
          id: "author",
          label: "Author",
          description: "Post query by Author ID"
        },
        authorName: {
          value: "",
          multiple: false,
          id: "authorName",
          label: "Author Name",
          description: "Post query by Author Name"
        },
        authorIn: {
          value: "",
          multiple: false,
          id: "authorIn",
          label: "Author In",
          description: "Post query by Author IDs"
        },
        authorNotIn: {
          value: "",
          multiple: false,
          id: "authorNotIn",
          label: "Author Not In",
          description: "Post query by exluded Author IDs"
        },
        p: {
          value: "",
          multiple: false,
          id: "p",
          label: "Post id",
          description: "Post query by single post id"
        },
        name: {
          value: "",
          multiple: false,
          id: "name",
          label: "Name",
          description: "Post query by post slug"
        },
        pageId: {
          value: "",
          multiple: false,
          id: "pageId",
          label: "Page Id",
          description: "Post query by single page id"
        },
        pagename: {
          value: "",
          multiple: false,
          id: "pagename",
          label: "Page name",
          description: "Post query by page slug"
        },
        postParent: {
          value: "",
          multiple: false,
          id: "postParent",
          label: "Post Parent",
          description: "Add {ID} to Post query by post parent id"
        },
        postParentIn: {
          value: "",
          multiple: false,
          id: "postParentIn",
          label: "Post Parent In",
          description: "Post query by post parent ids"
        },
        postParentNotIn: {
          value: "",
          multiple: false,
          id: "postParentNotIn",
          label: "Post Parent Not In",
          description: "Post query by excluded post parent ids"
        },
        postIn: {
          value: "",
          multiple: false,
          id: "postIn",
          label: "Post In",
          description: "Post query by multiple post ids, comma separated."
        },
        postNotIn: {
          value: "",
          multiple: false,
          id: "postNotIn",
          label: "Post Not In",
          description: "Post query by excluded post ids"
        },
        postNameIn: {
          value: [{
            slug: ""
          }],
          multiple: false,
          id: "postNameIn",
          label: "Post Name In",
          description: "Post query by post slugs"
        },
        hasPassword: {
          value: "",
          multiple: false,
          id: "hasPassword",
          label: "Has Password",
          description: "Post query for posts with passwords"
        },
        postPassword: {
          value: "",
          multiple: false,
          id: "postPassword",
          label: "Post Password",
          description: "Post query for posts with particular passwords"
        },
        commentCount: {
          value: {
            compare: "=",
            value: 10
          },
          multiple: false,
          id: "commentCount",
          label: "Comment Count",
          description: "Post query by comment count"
        },
        nopaging: {
          value: "",
          multiple: false,
          id: "nopaging",
          label: "No Paging",
          description: "Enable show all posts or use pagination"
        },
        postsPerPage: {
          value: "",
          multiple: false,
          id: "postsPerPage",
          label: "Posts Per Page",
          description: "Number of post to show per page"
        },
        paged: {
          value: "",
          multiple: false,
          id: "paged",
          label: "Paged",
          description: "Pagination start with"
        },
        offset: {
          value: "",
          multiple: false,
          id: "offset",
          label: "Offset",
          description: "Number of post to displace or pass over"
        },
        postsPerArchivePage: {
          value: "",
          multiple: false,
          id: "postsPerArchivePage",
          label: "Posts Per Archive Page",
          description: ""
        },
        ignoreStickyPosts: {
          value: "",
          multiple: false,
          id: "ignoreStickyPosts",
          label: "Ignore Sticky Posts",
          description: "Ignore post from post query"
        },
        metaKey: {
          value: "",
          multiple: false,
          id: "metaKey",
          label: "Meta Key",
          description: "Post query by custom field key"
        },
        metaValue: {
          value: "",
          multiple: false,
          id: "metaValue",
          label: "Meta Value",
          description: "Post query by custom field value"
        },
        metaValueNum: {
          value: "",
          multiple: false,
          id: "metaValueNum",
          label: "Meta Value Num",
          description: "Post query by custom field value for number types"
        },
        metaCompare: {
          value: "",
          multiple: false,
          id: "metaCompare",
          label: "Meta Compare",
          description: "Meta query compare"
        },
        // metaQuery: {
        // 	value: [],

        // 	multiple: false,
        // 	id: "metaQuery",
        // 	label: "Meta Query",
        // 	description: "Advance meta fields query",
        // 	
        // },
        perm: {
          value: "readable",
          multiple: false,
          id: "perm",
          label: "Perm",
          description: "User permission parameter"
        },
        postMimeType: {
          value: "",
          multiple: false,
          id: "postMimeType",
          label: "Post Mime Type",
          description: "Post query by allwed post mime types"
        },
        cacheResults: {
          value: false,
          multiple: false,
          id: "cacheResults",
          label: "Cache Results",
          description: "Enable Post information cache"
        },
        updatePostMetaCache: {
          value: false,
          multiple: false,
          id: "updatePostMetaCache",
          label: "Update Post Meta Cache",
          description: "Enable Post meta information cache"
        },
        updatePostTermCache: {
          value: false,
          multiple: false,
          id: "updatePostTermCache",
          label: "Update Post Term Cache",
          description: "Enable Post term information cache"
        }
      };
      addFilter("PostGridPostQueryArgs", "post-grid/postQueryArgs", function (options) {
        return postQueryArgs;
      });
    }
  }
});

/***/ }),

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

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   popupEntranceAnimateBasic: () => (/* binding */ popupEntranceAnimateBasic)
/* harmony export */ });
var popupEntranceAnimateBasic = {
  none: {
    label: "None",
    value: ""
  },
  backInDown: {
    label: "backInDown",
    value: "backInDown"
  },
  backInLeft: {
    label: "backInLeft",
    value: "backInLeft"
  },
  backInRight: {
    label: "backInRight",
    value: "backInRight"
  },
  backInUp: {
    label: "backInUp",
    value: "backInUp"
  },
  bounceIn: {
    label: "bounceIn",
    value: "bounceIn"
  },
  bounceInDown: {
    label: "bounceInDown",
    value: "bounceInDown"
  },
  bounceInLeft: {
    label: "bounceInLeft",
    value: "bounceInLeft"
  },
  bounceInRight: {
    label: "bounceInRight",
    value: "bounceInRight"
  },
  bounceInUp: {
    label: "bounceInUp",
    value: "bounceInUp"
  },
  fadeIn: {
    label: "fadeIn",
    value: "fadeIn"
  },
  fadeInDown: {
    label: "fadeInDown",
    value: "fadeInDown"
  },
  fadeInDownBig: {
    label: "fadeInDownBig",
    value: "fadeInDownBig"
  },
  fadeInLeft: {
    label: "fadeInLeft",
    value: "fadeInLeft"
  },
  fadeInLeftBig: {
    label: "fadeInLeftBig",
    value: "fadeInLeftBig"
  },
  fadeInRight: {
    label: "fadeInRight",
    value: "fadeInRight"
  },
  fadeInRightBig: {
    label: "fadeInRightBig",
    value: "fadeInRightBig"
  },
  fadeInUp: {
    label: "fadeInUp",
    value: "fadeInUp"
  },
  fadeInUpBig: {
    label: "fadeInUpBig",
    value: "fadeInUpBig"
  },
  fadeInTopLeft: {
    label: "fadeInTopLeft",
    value: "fadeInTopLeft"
  },
  fadeInTopRight: {
    label: "fadeInTopRight",
    value: "fadeInTopRight"
  },
  fadeInBottomRight: {
    label: "fadeInBottomRight",
    value: "fadeInBottomRight"
  },
  fadeInBottomLeft: {
    label: "fadeInBottomLeft",
    value: "fadeInBottomLeft"
  },
  rotateIn: {
    label: "rotateIn",
    value: "rotateIn"
  },
  rotateInDownLeft: {
    label: "rotateInDownLeft",
    value: "rotateInDownLeft"
  },
  rotateInDownRight: {
    label: "rotateInDownRight",
    value: "rotateInDownRight"
  },
  rotateInUpLeft: {
    label: "rotateInUpLeft",
    value: "rotateInUpLeft"
  },
  rotateInUpRight: {
    label: "rotateInUpRight",
    value: "rotateInUpRight"
  },
  zoomIn: {
    label: "zoomIn",
    value: "zoomIn"
  },
  zoomInDown: {
    label: "zoomInDown",
    value: "zoomInDown"
  },
  zoomInLeft: {
    label: "zoomInLeft",
    value: "zoomInLeft"
  },
  zoomInRight: {
    label: "zoomInRight",
    value: "zoomInRight"
  },
  zoomInUp: {
    label: "zoomInUp",
    value: "zoomInUp"
  },
  slideInDown: {
    label: "slideInDown",
    value: "slideInDown"
  },
  slideInLeft: {
    label: "slideInLeft",
    value: "slideInLeft"
  },
  slideInRight: {
    label: "slideInRight",
    value: "slideInRight"
  },
  slideInUp: {
    label: "slideInUp",
    value: "slideInUp"
  }
};

/***/ }),

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

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   popupCloseAnimateBasic: () => (/* binding */ popupCloseAnimateBasic)
/* harmony export */ });
var popupCloseAnimateBasic = {
  none: {
    label: "None",
    value: ""
  },
  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"
  }
};

/***/ }),

/***/ "./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: {},
  styleObjGlobal: {},
  license: {
    license_status: "",
    license_key: ""
  },
  blockCss: "",
  stylesClipboard: null
};
var selectors = {
  getBreakPoint(state) {
    const {
      breakPoint
    } = state;
    return breakPoint;
  },
  getclientdata(state) {
    const {
      clientdata
    } = state;
    return clientdata;
  },
  getstyleObjGlobal(state) {
    const {
      styleObjGlobal
    } = state;
    return styleObjGlobal;
  },
  getLicense(state) {
    const {
      license
    } = state;
    return license;
  },
  getStylesClipboard(state) {
    const {
      stylesClipboard
    } = state;
    return stylesClipboard;
  },
  parseCustomTags(state, str, tags) {
    if (str !== undefined) {
      var strArr = str?.split(" ");
      if (str?.length == 0) return;
      var newStr = strArr.map(item => {
        if (item.indexOf("currentYear") >= 0) {
          return tags.currentYear.value;
        } else if (item.indexOf("currentMonth") >= 0) {
          return tags.currentMonth.value;
        } else if (item.indexOf("currentDay") >= 0) {
          return tags.currentDay.value;
        } else if (item.indexOf("currentDate") >= 0) {
          return tags.currentDate.value;
        } else if (item.indexOf("currentTime") >= 0) {
          return tags.currentTime.value;
        } else if (item.indexOf("postPublishDate") >= 0) {
          return tags.postPublishDate.value;
        } else if (item.indexOf("postModifiedDate") >= 0) {
          return tags.postModifiedDate.value;
        } else if (item.indexOf("termId") >= 0) {
          return tags.termId.value;
        } else if (item.indexOf("termTitle") >= 0) {
          return tags.termTitle.value;
        } else if (item.indexOf("termDescription") >= 0) {
          return tags.termDescription.value;
        } else if (item.indexOf("termPostCount") >= 0) {
          return tags.termPostCount.value;
        } else if (item.indexOf("postTagTitle") >= 0) {
          return tags.postTagTitle.value;
        } else if (item.indexOf("postTagsTitle") >= 0) {
          return tags.postTagsTitle.value;
        } else if (item.indexOf("postCategoryTitle") >= 0) {
          return tags.postCategoryTitle.value;
        } else if (item.indexOf("postCategoriesTitle") >= 0) {
          return tags.postCategoriesTitle.value;
        } else if (item.indexOf("postTermTitle") >= 0) {
          return tags.postTermTitle.value;
        } else if (item.indexOf("postTermsTitle") >= 0) {
          return tags.postTermsTitle.value;
        } else if (item.indexOf("postSlug") >= 0) {
          return tags.postSlug.value;
        } else if (item.indexOf("postId") >= 0) {
          return tags.postId.value;
        } else if (item.indexOf("postStatus") >= 0) {
          return tags.postStatus.value;
        } else if (item.indexOf("authorId") >= 0) {
          return tags.authorId.value;
        } else if (item.indexOf("authorName") >= 0) {
          return tags.authorName.value;
        } else if (item.indexOf("authorFirstName") >= 0) {
          return tags.authorFirstName.value;
        } else if (item.indexOf("authorLastName") >= 0) {
          return tags.authorLastName.value;
        } else if (item.indexOf("authorDescription") >= 0) {
          return tags.authorDescription.value;
        } else if (item.indexOf("excerpt") >= 0) {
          return tags.excerpt.value;
        } else if (item.indexOf("rankmathTitle") >= 0) {
          return tags.rankmathTitle.value;
        } else if (item.indexOf("rankmathDescription") >= 0) {
          return tags.rankmathDescription.value;
        } else if (item.indexOf("rankmathFocusKeyword") >= 0) {
          return tags.rankmathFocusKeyword.value;
        } else if (item.indexOf("rankmathOrgname") >= 0) {
          return tags.rankmathOrgname.value;
        } else if (item.indexOf("rankmathOrgurl") >= 0) {
          return tags.rankmathOrgurl.value;
        } else if (item.indexOf("rankmathOrglogo") >= 0) {
          return tags.rankmathOrglogo.value;
        } else if (item.indexOf("siteTitle") >= 0) {
          return tags.siteTitle.value;
        } else if (item.indexOf("siteDescription") >= 0) {
          return tags.siteDescription.value;
        } else if (item.indexOf("postMeta") >= 0) {
          return tags.currentDay.value;
        } else if (item.indexOf("separator") >= 0) {
          return tags.separator.value;
        } else if (item.indexOf("searchTerms") >= 0) {
          return tags.searchTerms.value;
        }
        // else if (item.indexOf("counter") >= 0) {
        // 	return tags.counter.value;
        // }
        else {
          return item;
        }
      });
      return newStr.join(" ");
    }
  },
  cssAttrParse(state, key) {
    var cssProp = "";
    if (key == "alignContent") {
      cssProp = "align-content";
    } else if (key == "alignItems") {
      cssProp = "align-items";
    } else if (key == "animationName") {
      cssProp = "animation-name";
    } 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 == "counterIncrement") {
      cssProp = "counter-increment";
    } else if (key == "counterReset") {
      cssProp = "counter-reset";
    } else if (key == "counterSet") {
      cssProp = "counter-set";
    } 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 == "gridAutoFlow") {
      cssProp = "grid-auto-flow";
    } 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 == "placeItems") {
      cssProp = "place-items";
    } 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 == "transformOrigin") {
      cssProp = "transform-origin";
    } else if (key == "tableLayout") {
      cssProp = "table-layout";
    } else if (key == "emptyCells") {
      cssProp = "empty-cells";
    } else if (key == "captionSide") {
      cssProp = "caption-side";
    } else if (key == "gap") {
      cssProp = "gap";
    } else if (key == "rowGap") {
      cssProp = "row-gap";
    } else if (key == "columnGap") {
      cssProp = "column-gap";
    } else if (key == "userSelect") {
      cssProp = "user-select";
    } else if (key == "-webkit-text-fill-color") {
      cssProp = "-webkit-text-fill-color";
    } else {
      cssProp = key;
    }
    return cssProp;
  },
  flattenObject(state, input) {
    let flatArray = [];
    function recursiveFlatten(obj) {
      // Push the current object without its children
      const {
        children,
        ...current
      } = obj;
      flatArray.push(current);

      // Recurse through children if they exist
      if (children && Array.isArray(children)) {
        children.forEach(child => recursiveFlatten(child));
      }
    }

    // Start the recursive flattening for each root object
    input.forEach(item => recursiveFlatten(item));
    return flatArray;
  },
  onAddStyleItem(state, sudoScource, key, obj) {
    const {
      breakPoint
    } = state;
    var path = [sudoScource, key, breakPoint];
    let objX = Object.assign({}, obj);
    const object = selectors.addPropertyDeep(state, objX, path, "");
    return object;
  },
  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;
  // },
  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 propVal = x[1];
          var cssPropty = selectors.cssAttrParse(state, attr);
          var found = Object.entries(propVal).reduce((a, [k, v]) => v ? (a[k] = v, a) : a, {});
          if (Object.keys(found).length > 0) {
            if (cssObj[selector] == undefined) {
              cssObj[selector] = {};
            }
            if (cssObj[selector][cssPropty] == undefined) {
              cssObj[selector][cssPropty] = {};
            }
            cssObj[selector][cssPropty] = x[1];
          }
        });
      }
    });
    return cssObj;
  },
  // 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;
  // },

  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);
      Object.entries(elementCss).map(sudoCss => {
        var sudoSelector = sudoCss[0];
        var sudoVal = sudoCss[1];
        blockCssRules[sudoSelector] = sudoVal;
      });
    });
    return blockCssRules;
  },
  generateCssFromElementObject(state, obj, selector) {
    var reponsiveCssGroups = {};
  },
  generateBlockCss(state, items, blockId) {
    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] = [];
          }
          if (typeof attrValue == "string") {
            attrValue = attrValue.replaceAll("u0022", '"');
            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 + "</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 + "</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);
    return {
      type: "SET_BREAKPOINT",
      breakpoint
    };
  },
  setclientdata(clientdata) {
    return {
      type: "SET_CLIENTDATA",
      clientdata
    };
  },
  setstyleObjGlobal(styleObjGlobal) {
    return {
      type: "SET_STYLEOBJ",
      styleObjGlobal
    };
  },
  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)("PostGridStore", {
  reducer(state = DEFAULT_STATE, action) {
    switch (action.type) {
      case "SET_BREAKPOINT":
        return {
          ...state,
          breakPoint: action.breakpoint
        };
      case "SET_CLIENTDATA":
        return {
          ...state,
          clientdata: action.clientdata
        };
      case "SET_STYLEOBJ":
        return {
          ...state,
          styleObjGlobal: action.styleObjGlobal
        };
      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)(() => {});


/***/ }),

/***/ "./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/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/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/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/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/outlayer/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/node_modules/ev-emitter/ev-emitter.js":
/*!*********************************************************************!*\
  !*** ./node_modules/outlayer/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/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/outlayer/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/react-sortablejs/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/react-sortablejs/node_modules/classnames/index.js":
/*!************************************************************************!*\
  !*** ./node_modules/react-sortablejs/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/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.6
 * @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.6";

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', '');
}
function getChildContainingRectFromElement(container, options, ghostEl) {
  var rect = {};
  Array.from(container.children).forEach(function (child) {
    var _rect$left, _rect$top, _rect$right, _rect$bottom;
    if (!closest(child, options.draggable, container, false) || child.animated || child === ghostEl) return;
    var childRect = getRect(child);
    rect.left = Math.min((_rect$left = rect.left) !== null && _rect$left !== void 0 ? _rect$left : Infinity, childRect.left);
    rect.top = Math.min((_rect$top = rect.top) !== null && _rect$top !== void 0 ? _rect$top : Infinity, childRect.top);
    rect.right = Math.max((_rect$right = rect.right) !== null && _rect$right !== void 0 ? _rect$right : -Infinity, childRect.right);
    rect.bottom = Math.max((_rect$bottom = rect.bottom) !== null && _rect$bottom !== void 0 ? _rect$bottom : -Infinity, childRect.bottom);
  });
  rect.width = rect.right - rect.left;
  rect.height = rect.bottom - rect.top;
  rect.x = rect.left;
  rect.y = rect.top;
  return rect;
}
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
    },
    // Disabled on Safari: #1571; Enabled on Safari IOS: #2244
    supportPointer: Sortable.supportPointer !== false && 'PointerEvent' in window && (!Safari || IOS),
    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.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.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);
      if (options.supportPointer) {
        on(ownerDocument, 'pointerup', _this._onDrop);
        // Native D&D triggers pointercancel
        !this.nativeDraggable && on(ownerDocument, 'pointercancel', _this._onDrop);
      } else {
        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
        if (options.supportPointer) {
          on(ownerDocument, 'pointerup', _this._disableDelayedDrag);
          on(ownerDocument, 'pointercancel', _this._disableDelayedDrag);
        } else {
          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, 'pointerup', this._disableDelayedDrag);
    off(ownerDocument, 'pointercancel', 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) {
        _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 = getParentOrHost(parent));
      }
      _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;
    window.getSelection().removeAllRanges();
    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, 'pointercancel', 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 firstElRect = getRect(getChild(sortable.el, 0, sortable.options, true));
  var childContainingRect = getChildContainingRectFromElement(sortable.el, sortable.options, ghostEl);
  var spacer = 10;
  return vertical ? evt.clientX < childContainingRect.left - spacer || evt.clientY < firstElRect.top && evt.clientX < firstElRect.right : evt.clientY < childContainingRect.top - spacer || evt.clientY < firstElRect.bottom && evt.clientX < firstElRect.left;
}
function _ghostIsLast(evt, vertical, sortable) {
  var lastElRect = getRect(lastChild(sortable.el, sortable.options.draggable));
  var childContainingRect = getChildContainingRectFromElement(sortable.el, sortable.options, ghostEl);
  var spacer = 10;
  return vertical ? evt.clientX > childContainingRect.right + spacer || evt.clientY > lastElRect.bottom && evt.clientX > lastElRect.left : evt.clientY > childContainingRect.bottom + spacer || evt.clientX > lastElRect.right && evt.clientY > lastElRect.top;
}
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,
  expando: expando
};

/**
 * 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) {
              (function () {
                // 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;
                }
                var filter = options.filter;
                for (; i < n; i++) {
                  if (~multiDragElements.indexOf(children[i])) continue;
                  // Check if element is draggable
                  if (!closest(children[i], options.draggable, parentEl, false)) continue;
                  // Check if element is filtered
                  var filtered = filter && (typeof filter === 'function' ? filter.call(sortable, evt, children[i], sortable) : filter.split(',').some(function (criteria) {
                    return closest(children[i], criteria.trim(), parentEl, false);
                  }));
                  if (filtered) 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');
                dispatchSortableEvent('sort');
              }
            }
          }

          // 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);
}




/***/ }),

/***/ "react":
/*!************************!*\
  !*** external "React" ***!
  \************************/
/***/ ((module) => {

"use strict";
module.exports = window["React"];

/***/ }),

/***/ "react/jsx-runtime":
/*!**********************************!*\
  !*** external "ReactJSXRuntime" ***!
  \**********************************/
/***/ ((module) => {

"use strict";
module.exports = window["ReactJSXRuntime"];

/***/ }),

/***/ "@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/components":
/*!************************************!*\
  !*** external ["wp","components"] ***!
  \************************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["components"];

/***/ }),

/***/ "@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/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/keycodes":
/*!**********************************!*\
  !*** external ["wp","keycodes"] ***!
  \**********************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["keycodes"];

/***/ }),

/***/ "@wordpress/primitives":
/*!************************************!*\
  !*** external ["wp","primitives"] ***!
  \************************************/
/***/ ((module) => {

"use strict";
module.exports = window["wp"]["primitives"];

/***/ })

/******/ 	});
/************************************************************************/
/******/ 	// 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/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 });
/******/ 		};
/******/ 	})();
/******/ 	
/************************************************************************/
var __webpack_exports__ = {};
// This entry needs to be wrapped in an IIFE because it needs to be in strict mode.
(() => {
"use strict";
/*!**********************!*\
  !*** ./src/index.js ***!
  \**********************/
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./store */ "./src/store.js");
/* harmony import */ var _app__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./app */ "./src/app.js");
/* harmony import */ var _global__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./global */ "./src/global.js");
// import apiFetch from "@wordpress/api-fetch";
// import { addFilter } from "@wordpress/hooks";
// import { createHigherOrderComponent } from "@wordpress/compose";
// import { subscribe, select } from "@wordpress/data";




})();

/******/ })()
;
//# sourceMappingURL=index.js.map