donghy 0.0.1

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

@@ -0,0 +1,117 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "BREAKPOINTS", {
+  enumerable: true,
+  get: function get() {
+    return _breakpoint.BREAKPOINTS;
+  }
+});
+Object.defineProperty(exports, "BREAKPOINT_ORDER", {
+  enumerable: true,
+  get: function get() {
+    return _breakpoint.BREAKPOINT_ORDER;
+  }
+});
+Object.defineProperty(exports, "OVERLAY_GAP", {
+  enumerable: true,
+  get: function get() {
+    return _overlay.OVERLAY_GAP;
+  }
+});
+Object.defineProperty(exports, "cn", {
+  enumerable: true,
+  get: function get() {
+    return _utils.cn;
+  }
+});
+Object.defineProperty(exports, "getAdjustedPlacement", {
+  enumerable: true,
+  get: function get() {
+    return _overlay.getAdjustedPlacement;
+  }
+});
+Object.defineProperty(exports, "getBreakpoint", {
+  enumerable: true,
+  get: function get() {
+    return _useMatchMedia.getBreakpoint;
+  }
+});
+Object.defineProperty(exports, "getPortalContainer", {
+  enumerable: true,
+  get: function get() {
+    return _portal.getPortalContainer;
+  }
+});
+Object.defineProperty(exports, "getSemanticClass", {
+  enumerable: true,
+  get: function get() {
+    return _utils.getSemanticClass;
+  }
+});
+Object.defineProperty(exports, "getSemanticProps", {
+  enumerable: true,
+  get: function get() {
+    return _utils.getSemanticProps;
+  }
+});
+Object.defineProperty(exports, "renderPortal", {
+  enumerable: true,
+  get: function get() {
+    return _portal.renderPortal;
+  }
+});
+Object.defineProperty(exports, "useClickOutside", {
+  enumerable: true,
+  get: function get() {
+    return _useClickOutside.useClickOutside;
+  }
+});
+Object.defineProperty(exports, "useControllableState", {
+  enumerable: true,
+  get: function get() {
+    return _useControllableState.useControllableState;
+  }
+});
+Object.defineProperty(exports, "useEscapeKey", {
+  enumerable: true,
+  get: function get() {
+    return _useEscapeKey.useEscapeKey;
+  }
+});
+Object.defineProperty(exports, "useFoxContext", {
+  enumerable: true,
+  get: function get() {
+    return _usePikaContext.useFoxContext;
+  }
+});
+Object.defineProperty(exports, "useMatchMedia", {
+  enumerable: true,
+  get: function get() {
+    return _useMatchMedia.useMatchMedia;
+  }
+});
+Object.defineProperty(exports, "useOverlay", {
+  enumerable: true,
+  get: function get() {
+    return _overlay.useOverlay;
+  }
+});
+Object.defineProperty(exports, "useScrollListener", {
+  enumerable: true,
+  get: function get() {
+    return _useScrollListener.useScrollListener;
+  }
+});
+var _useClickOutside = require("./hooks/useClickOutside");
+var _useScrollListener = require("./hooks/useScrollListener");
+var _useEscapeKey = require("./hooks/useEscapeKey");
+var _useMatchMedia = require("./hooks/useMatchMedia");
+var _useControllableState = require("./hooks/useControllableState");
+var _usePikaContext = require("./hooks/usePikaContext");
+var _portal = require("./utils/portal");
+var _utils = require("./utils");
+var _overlay = require("./overlay");
+var _breakpoint = require("./constants/breakpoint");

package/dist/cjs/components/shared/overlay/index.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "FLIP_MAP", {
+  enumerable: true,
+  get: function get() {
+    return _placement.FLIP_MAP;
+  }
+});
+Object.defineProperty(exports, "OVERLAY_GAP", {
+  enumerable: true,
+  get: function get() {
+    return _placement.OVERLAY_GAP;
+  }
+});
+Object.defineProperty(exports, "PLACEMENT_POSITION_MAP", {
+  enumerable: true,
+  get: function get() {
+    return _placement.PLACEMENT_POSITION_MAP;
+  }
+});
+Object.defineProperty(exports, "getAdjustedPlacement", {
+  enumerable: true,
+  get: function get() {
+    return _placement.getAdjustedPlacement;
+  }
+});
+Object.defineProperty(exports, "useOverlay", {
+  enumerable: true,
+  get: function get() {
+    return _useOverlay.useOverlay;
+  }
+});
+var _placement = require("./placement");
+var _useOverlay = require("./useOverlay");

package/dist/cjs/components/shared/overlay/placement.js

@@ -0,0 +1,105 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PLACEMENT_POSITION_MAP = exports.OVERLAY_GAP = exports.FLIP_MAP = void 0;
+exports.getAdjustedPlacement = getAdjustedPlacement;
+var OVERLAY_GAP = exports.OVERLAY_GAP = 8;
+var PLACEMENT_POSITION_MAP = exports.PLACEMENT_POSITION_MAP = {
+  top: function top(trigger, popup) {
+    return {
+      top: trigger.top - popup.height - OVERLAY_GAP,
+      left: trigger.left + trigger.width / 2 - popup.width / 2
+    };
+  },
+  topLeft: function topLeft(trigger, popup) {
+    return {
+      top: trigger.top - popup.height - OVERLAY_GAP,
+      left: trigger.left
+    };
+  },
+  topRight: function topRight(trigger, popup) {
+    return {
+      top: trigger.top - popup.height - OVERLAY_GAP,
+      left: trigger.right - popup.width
+    };
+  },
+  bottom: function bottom(trigger, popup) {
+    return {
+      top: trigger.bottom + OVERLAY_GAP,
+      left: trigger.left + trigger.width / 2 - popup.width / 2
+    };
+  },
+  bottomLeft: function bottomLeft(trigger) {
+    return {
+      top: trigger.bottom + OVERLAY_GAP,
+      left: trigger.left
+    };
+  },
+  bottomRight: function bottomRight(trigger, popup) {
+    return {
+      top: trigger.bottom + OVERLAY_GAP,
+      left: trigger.right - popup.width
+    };
+  },
+  left: function left(trigger, popup) {
+    return {
+      top: trigger.top + trigger.height / 2 - popup.height / 2,
+      left: trigger.left - popup.width - OVERLAY_GAP
+    };
+  },
+  leftTop: function leftTop(trigger, popup) {
+    return {
+      top: trigger.top,
+      left: trigger.left - popup.width - OVERLAY_GAP
+    };
+  },
+  leftBottom: function leftBottom(trigger, popup) {
+    return {
+      top: trigger.bottom - popup.height,
+      left: trigger.left - popup.width - OVERLAY_GAP
+    };
+  },
+  right: function right(trigger, popup) {
+    return {
+      top: trigger.top + trigger.height / 2 - popup.height / 2,
+      left: trigger.right + OVERLAY_GAP
+    };
+  },
+  rightTop: function rightTop(trigger) {
+    return {
+      top: trigger.top,
+      left: trigger.right + OVERLAY_GAP
+    };
+  },
+  rightBottom: function rightBottom(trigger, popup) {
+    return {
+      top: trigger.bottom - popup.height,
+      left: trigger.right + OVERLAY_GAP
+    };
+  }
+};
+var FLIP_MAP = exports.FLIP_MAP = {
+  top: 'bottom',
+  topLeft: 'bottomLeft',
+  topRight: 'bottomRight',
+  bottom: 'top',
+  bottomLeft: 'topLeft',
+  bottomRight: 'topRight',
+  left: 'right',
+  leftTop: 'rightTop',
+  leftBottom: 'rightBottom',
+  right: 'left',
+  rightTop: 'leftTop',
+  rightBottom: 'leftBottom'
+};
+function getAdjustedPlacement(placement, position, popupSize) {
+  var vw = window.innerWidth;
+  var vh = window.innerHeight;
+  if (placement.startsWith('top') && position.top < 0) return FLIP_MAP[placement];
+  if (placement.startsWith('bottom') && position.top + popupSize.height > vh) return FLIP_MAP[placement];
+  if (placement.startsWith('left') && position.left < 0) return FLIP_MAP[placement];
+  if (placement.startsWith('right') && position.left + popupSize.width > vw) return FLIP_MAP[placement];
+  return placement;
+}

package/dist/cjs/components/shared/overlay/useOverlay.js

@@ -0,0 +1,183 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useOverlay = useOverlay;
+var _react = require("react");
+var _useClickOutside = require("../hooks/useClickOutside");
+var _useControllableState3 = require("../hooks/useControllableState");
+var _useScrollListener = require("../hooks/useScrollListener");
+var _placement = require("./placement");
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+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 _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function useOverlay(_ref) {
+  var controlledOpen = _ref.open,
+    _ref$defaultOpen = _ref.defaultOpen,
+    defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
+    onChange = _ref.onChange,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? 'top' : _ref$placement,
+    _ref$trigger = _ref.trigger,
+    trigger = _ref$trigger === void 0 ? 'hover' : _ref$trigger,
+    _ref$mouseEnterDelay = _ref.mouseEnterDelay,
+    mouseEnterDelay = _ref$mouseEnterDelay === void 0 ? 0.1 : _ref$mouseEnterDelay,
+    _ref$mouseLeaveDelay = _ref.mouseLeaveDelay,
+    mouseLeaveDelay = _ref$mouseLeaveDelay === void 0 ? 0.1 : _ref$mouseLeaveDelay,
+    _ref$arrow = _ref.arrow,
+    arrow = _ref$arrow === void 0 ? true : _ref$arrow,
+    getPopupContainer = _ref.getPopupContainer,
+    resolvePopupContainer = _ref.resolvePopupContainer;
+  var _useControllableState = (0, _useControllableState3.useControllableState)({
+      value: controlledOpen,
+      defaultValue: defaultOpen,
+      onChange: onChange
+    }),
+    _useControllableState2 = _slicedToArray(_useControllableState, 3),
+    isOpen = _useControllableState2[0],
+    setOpen = _useControllableState2[1],
+    isControlled = _useControllableState2[2];
+  var triggerRef = (0, _react.useRef)(null);
+  var popupRef = (0, _react.useRef)(null);
+  var enterTimer = (0, _react.useRef)(undefined);
+  var leaveTimer = (0, _react.useRef)(undefined);
+  var _useState = (0, _react.useState)({}),
+    _useState2 = _slicedToArray(_useState, 2),
+    popupStyle = _useState2[0],
+    setPopupStyle = _useState2[1];
+  var _useState3 = (0, _react.useState)(placement),
+    _useState4 = _slicedToArray(_useState3, 2),
+    resolvedPlacement = _useState4[0],
+    setResolvedPlacement = _useState4[1];
+  var _useState5 = (0, _react.useState)({}),
+    _useState6 = _slicedToArray(_useState5, 2),
+    arrowOffset = _useState6[0],
+    setArrowOffset = _useState6[1];
+  var triggers = Array.isArray(trigger) ? trigger : [trigger];
+  var shouldShowArrow = arrow !== false;
+  var pointAtCenter = _typeof(arrow) === 'object' && arrow.pointAtCenter;
+  var clearTimers = (0, _react.useCallback)(function () {
+    clearTimeout(enterTimer.current);
+    clearTimeout(leaveTimer.current);
+  }, []);
+  var delayOpen = (0, _react.useCallback)(function (value) {
+    clearTimers();
+    var delay = value ? mouseEnterDelay : mouseLeaveDelay;
+    var timer = setTimeout(function () {
+      return setOpen(value);
+    }, delay * 1000);
+    if (value) enterTimer.current = timer;else leaveTimer.current = timer;
+  }, [mouseEnterDelay, mouseLeaveDelay, setOpen, clearTimers]);
+  var updatePosition = (0, _react.useCallback)(function () {
+    if (!triggerRef.current || !popupRef.current) return;
+    var triggerRect = triggerRef.current.getBoundingClientRect();
+    var popupRect = popupRef.current.getBoundingClientRect();
+    var getPosition = _placement.PLACEMENT_POSITION_MAP[placement];
+    if (!getPosition) return;
+    var pos = getPosition(triggerRect, popupRect);
+    var adjusted = (0, _placement.getAdjustedPlacement)(placement, pos, popupRect);
+    if (adjusted !== placement) {
+      pos = _placement.PLACEMENT_POSITION_MAP[adjusted](triggerRect, popupRect);
+    }
+    setResolvedPlacement(function (prev) {
+      return prev === adjusted ? prev : adjusted;
+    });
+    var containerGetter = getPopupContainer !== null && getPopupContainer !== void 0 ? getPopupContainer : resolvePopupContainer;
+    var container = containerGetter === null || containerGetter === void 0 ? void 0 : containerGetter(triggerRef.current);
+    var nextStyle = container && container !== document.body ? {
+      position: 'absolute',
+      top: pos.top - container.getBoundingClientRect().top + container.scrollTop,
+      left: pos.left - container.getBoundingClientRect().left + container.scrollLeft
+    } : {
+      position: 'fixed',
+      top: pos.top,
+      left: pos.left
+    };
+    setPopupStyle(function (prev) {
+      return prev.top === nextStyle.top && prev.left === nextStyle.left && prev.position === nextStyle.position ? prev : nextStyle;
+    });
+    var nextArrowOffset = pointAtCenter ? adjusted.startsWith('top') || adjusted.startsWith('bottom') ? {
+      left: triggerRect.left + triggerRect.width / 2 - pos.left
+    } : {
+      top: triggerRect.top + triggerRect.height / 2 - pos.top
+    } : {};
+    setArrowOffset(function (prev) {
+      return prev.top === nextArrowOffset.top && prev.left === nextArrowOffset.left ? prev : nextArrowOffset;
+    });
+  }, [placement, getPopupContainer, resolvePopupContainer, pointAtCenter]);
+  (0, _react.useLayoutEffect)(function () {
+    if (isOpen) updatePosition();
+  }, [isOpen, updatePosition]);
+  (0, _useScrollListener.useScrollListener)({
+    onScroll: updatePosition,
+    onResize: updatePosition,
+    enabled: isOpen
+  });
+  (0, _react.useEffect)(function () {
+    return function () {
+      return clearTimers();
+    };
+  }, [clearTimers]);
+  (0, _useClickOutside.useClickOutside)([triggerRef, popupRef], function () {
+    return setOpen(false);
+  }, isOpen && triggers.includes('click'));
+  var handleMouseEnter = (0, _react.useCallback)(function () {
+    if (triggers.includes('hover')) delayOpen(true);
+  }, [triggers, delayOpen]);
+  var handleMouseLeave = (0, _react.useCallback)(function () {
+    if (triggers.includes('hover')) delayOpen(false);
+  }, [triggers, delayOpen]);
+  var handleClick = (0, _react.useCallback)(function () {
+    if (triggers.includes('click')) setOpen(!isOpen);
+  }, [triggers, isOpen, setOpen]);
+  var handleFocus = (0, _react.useCallback)(function () {
+    if (triggers.includes('focus')) delayOpen(true);
+  }, [triggers, delayOpen]);
+  var handleBlur = (0, _react.useCallback)(function () {
+    if (triggers.includes('focus')) delayOpen(false);
+  }, [triggers, delayOpen]);
+  var handleContextMenu = (0, _react.useCallback)(function (e) {
+    if (triggers.includes('contextMenu')) {
+      e.preventDefault();
+      setOpen(!isOpen);
+    }
+  }, [triggers, isOpen, setOpen]);
+  var getPortalContainer = (0, _react.useCallback)(function () {
+    var _getter;
+    if (!triggerRef.current) return document.body;
+    var getter = getPopupContainer !== null && getPopupContainer !== void 0 ? getPopupContainer : resolvePopupContainer;
+    return (_getter = getter === null || getter === void 0 ? void 0 : getter(triggerRef.current)) !== null && _getter !== void 0 ? _getter : document.body;
+  }, [getPopupContainer, resolvePopupContainer]);
+  var triggerProps = {
+    ref: triggerRef,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
+    onClick: handleClick,
+    onFocus: handleFocus,
+    onBlur: handleBlur,
+    onContextMenu: handleContextMenu
+  };
+  var popupProps = {
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  };
+  return {
+    isOpen: isOpen,
+    setOpen: setOpen,
+    isControlled: isControlled,
+    triggerRef: triggerRef,
+    popupRef: popupRef,
+    popupStyle: popupStyle,
+    resolvedPlacement: resolvedPlacement,
+    arrowOffset: arrowOffset,
+    shouldShowArrow: shouldShowArrow,
+    triggerProps: triggerProps,
+    popupProps: popupProps,
+    getPortalContainer: getPortalContainer
+  };
+}

package/dist/cjs/components/shared/types/common.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/components/shared/types/css.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/components/shared/types/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/components/shared/utils/classNames.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.cn = cn;
+function cn() {
+  for (var _len = arguments.length, parts = new Array(_len), _key = 0; _key < _len; _key++) {
+    parts[_key] = arguments[_key];
+  }
+  return parts.filter(Boolean).join(' ');
+}

package/dist/cjs/components/shared/utils/index.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "cn", {
+  enumerable: true,
+  get: function get() {
+    return _classNames.cn;
+  }
+});
+Object.defineProperty(exports, "getPortalContainer", {
+  enumerable: true,
+  get: function get() {
+    return _portal.getPortalContainer;
+  }
+});
+Object.defineProperty(exports, "getSemanticClass", {
+  enumerable: true,
+  get: function get() {
+    return _semantic.getSemanticClass;
+  }
+});
+Object.defineProperty(exports, "getSemanticProps", {
+  enumerable: true,
+  get: function get() {
+    return _semantic.getSemanticProps;
+  }
+});
+Object.defineProperty(exports, "renderPortal", {
+  enumerable: true,
+  get: function get() {
+    return _portal.renderPortal;
+  }
+});
+var _portal = require("./portal");
+var _classNames = require("./classNames");
+var _semantic = require("./semantic");

package/dist/cjs/components/shared/utils/portal.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getPortalContainer = getPortalContainer;
+exports.renderPortal = renderPortal;
+var _reactDom = require("react-dom");
+function getPortalContainer(getPopupContainer, triggerNode) {
+  if (getPopupContainer && triggerNode) {
+    return getPopupContainer(triggerNode);
+  }
+  if (getPopupContainer) {
+    return getPopupContainer();
+  }
+  return document.body;
+}
+function renderPortal(content, container) {
+  return /*#__PURE__*/(0, _reactDom.createPortal)(content, container);
+}

package/dist/cjs/components/shared/utils/semantic.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getSemanticClass = getSemanticClass;
+exports.getSemanticProps = getSemanticProps;
+var _classNames = require("./classNames");
+function getSemanticClass(defaultClass, customClass) {
+  return (0, _classNames.cn)(defaultClass, customClass);
+}
+function getSemanticProps(part, defaultClass, classNames, styles) {
+  var _styles$part;
+  return {
+    className: (0, _classNames.cn)(defaultClass, classNames === null || classNames === void 0 ? void 0 : classNames[part]),
+    style: (_styles$part = styles === null || styles === void 0 ? void 0 : styles[part]) !== null && _styles$part !== void 0 ? _styles$part : {}
+  };
+}