@pingux/astro 1.27.0-alpha.25 → 1.27.0-alpha.26

package/lib/cjs/hooks/useImageUploadState/useImageUploadState.js

@@ -0,0 +1,143 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _includes = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/includes"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
+
+var _react = require("react");
+
+var useImageUploadState = function useImageUploadState() {
+  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var inputRef = arguments.length > 1 ? arguments[1] : undefined;
+  var existingImage = props.previewImage,
+      defaultPreviewNode = props.defaultPreviewImage,
+      fileTypes = props.fileTypes,
+      onChange = props.onChange,
+      previewHeight = props.previewHeight,
+      previewWidth = props.previewWidth;
+  var defaultPreviewImage = (0, _react.useMemo)(function () {
+    return typeof defaultPreviewNode === 'string' ? defaultPreviewNode : null;
+  }, [defaultPreviewNode]);
+
+  var _useState = (0, _react.useState)(existingImage || defaultPreviewImage),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      previewImage = _useState2[0],
+      setPreviewImage = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+      isMenuOpen = _useState4[0],
+      setIsMenuOpen = _useState4[1];
+
+  var _useState5 = (0, _react.useState)(true),
+      _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+      isImageType = _useState6[0],
+      setIsImageType = _useState6[1];
+
+  var _useState7 = (0, _react.useState)(''),
+      _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
+      fileName = _useState8[0],
+      setFileName = _useState8[1];
+
+  (0, _react.useEffect)(function () {
+    return setPreviewImage(existingImage || defaultPreviewImage);
+  }, [existingImage, defaultPreviewImage]);
+  var pressPreviewButton = (0, _react.useCallback)(function () {
+    if (previewImage && previewImage !== defaultPreviewImage) {
+      setIsMenuOpen(true);
+    } else {
+      inputRef.current.click();
+    }
+  }, [defaultPreviewImage, previewImage, inputRef]);
+  var handleInputChange = (0, _react.useCallback)(function (event) {
+    var _event$target, _event$target$files$, _event$target$files$$;
+
+    var eventFileType = (_event$target = event.target) === null || _event$target === void 0 ? void 0 : (_event$target$files$ = _event$target.files[0]) === null || _event$target$files$ === void 0 ? void 0 : (_event$target$files$$ = _event$target$files$.type) === null || _event$target$files$$ === void 0 ? void 0 : _event$target$files$$.split('/')[0];
+
+    if (fileTypes !== null && fileTypes !== void 0 && (0, _includes["default"])(fileTypes).call(fileTypes, eventFileType)) {
+      if (onChange && typeof onChange === 'function') {
+        onChange(event);
+      } // If existing image is not undefined, we rely on consumers to handle this themselves.
+
+
+      if (existingImage === undefined) {
+        if (eventFileType === 'image') {
+          var _event$target2;
+
+          setIsImageType(true);
+          var reader = new FileReader();
+
+          reader.onload = function (_ref) {
+            var result = _ref.target.result;
+            setPreviewImage(result);
+          };
+
+          reader.readAsDataURL((_event$target2 = event.target) === null || _event$target2 === void 0 ? void 0 : _event$target2.files[0]);
+        } else {
+          var _event$target3, _event$target3$files$;
+
+          setIsImageType(false);
+          setFileName((_event$target3 = event.target) === null || _event$target3 === void 0 ? void 0 : (_event$target3$files$ = _event$target3.files[0]) === null || _event$target3$files$ === void 0 ? void 0 : _event$target3$files$.name);
+        }
+      }
+    }
+  }, []);
+  var handleOpenMenuChange = (0, _react.useCallback)(function (isOpen) {
+    if (isOpen && previewImage && previewImage !== defaultPreviewImage) {
+      setIsMenuOpen(true);
+    } else {
+      setIsMenuOpen(false);
+    }
+  }, [defaultPreviewImage, previewImage]);
+  var removePreview = (0, _react.useCallback)(function () {
+    return setPreviewImage(defaultPreviewImage);
+  }, [defaultPreviewImage]);
+  var showFileDialog = (0, _react.useCallback)(function () {
+    var _inputRef$current;
+
+    return inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.click();
+  }, [inputRef]);
+  var handleLabelClick = (0, _react.useCallback)(function (e) {
+    e.preventDefault();
+
+    if (previewImage && previewImage !== defaultPreviewImage) {
+      setIsMenuOpen(true);
+    } else {
+      showFileDialog();
+    }
+  }, [previewImage, defaultPreviewImage]);
+  var widthHeightSx = (0, _react.useMemo)(function () {
+    return {
+      height: previewHeight,
+      width: previewWidth
+    };
+  }, [previewHeight, previewWidth]);
+  return {
+    defaultPreviewImage: defaultPreviewImage,
+    defaultPreviewNode: defaultPreviewNode,
+    fileName: fileName,
+    handleInputChange: handleInputChange,
+    handleLabelClick: handleLabelClick,
+    handleOpenMenuChange: handleOpenMenuChange,
+    isImageType: isImageType,
+    isMenuOpen: isMenuOpen,
+    pressPreviewButton: pressPreviewButton,
+    previewImage: previewImage,
+    removePreview: removePreview,
+    showFileDialog: showFileDialog,
+    widthHeightSx: widthHeightSx
+  };
+};
+
+var _default = useImageUploadState;
+exports["default"] = _default;

package/lib/cjs/hooks/useLabelHeight/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+_Object$defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _useLabelHeight["default"];
+  }
+});
+
+var _useLabelHeight = _interopRequireDefault(require("./useLabelHeight"));

package/lib/cjs/hooks/useLabelHeight/useLabelHeight.js

@@ -0,0 +1,43 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
+
+var _react = require("react");
+
+var useLabelHeight = function useLabelHeight(_ref) {
+  var _labelRef$current2, _inputRef$current2;
+
+  var labelRef = _ref.labelRef,
+      inputRef = _ref.inputRef;
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      isLabelHigher = _useState2[0],
+      setIsLabelHigher = _useState2[1];
+
+  (0, _react.useEffect)(function () {
+    var _labelRef$current, _inputRef$current;
+
+    if ((labelRef === null || labelRef === void 0 ? void 0 : (_labelRef$current = labelRef.current) === null || _labelRef$current === void 0 ? void 0 : _labelRef$current.offsetHeight) > (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.offsetHeight)) {
+      setIsLabelHigher(true);
+    } else {
+      setIsLabelHigher(false);
+    }
+  }, [labelRef === null || labelRef === void 0 ? void 0 : (_labelRef$current2 = labelRef.current) === null || _labelRef$current2 === void 0 ? void 0 : _labelRef$current2.offsetHeight, inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.offsetHeight]);
+  return {
+    isLabelHigher: isLabelHigher
+  };
+};
+
+var _default = useLabelHeight;
+exports["default"] = _default;

package/lib/cjs/hooks/useModalState/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+_Object$defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _useModalState["default"];
+  }
+});
+
+var _useModalState = _interopRequireDefault(require("./useModalState"));

package/lib/cjs/hooks/useModalState/useModalState.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _overlays = require("@react-stately/overlays");
+
+/**
+ * Returns state-related data and functions for use with a Modal component.
+ * @param {Object} [props] Properties provided to the state
+ * @param {Boolean} [props.isDefaultOpen] Whether the modal is open by default (uncontrolled).
+ * @param {Boolean} [props.isOpen] Whether the modal is currently open (controlled).
+ * @param {Function} [props.onOpenChange] Handler that is called when the open state changes.
+ * `(isOpen: boolean) => void`
+ * @returns {Object} `{ isOpen: Boolean, open: Function, close: Function, toggle: Function }`
+ */
+var useModalState = function useModalState() {
+  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var isDefaultOpen = props.isDefaultOpen,
+      isOpen = props.isOpen,
+      onOpenChange = props.onOpenChange;
+  return (0, _overlays.useOverlayTriggerState)({
+    defaultOpen: isDefaultOpen,
+    isOpen: isOpen,
+    onOpenChange: onOpenChange
+  });
+};
+
+var _default = useModalState;
+exports["default"] = _default;

package/lib/cjs/hooks/useModalState/useModalState.test.js

@@ -0,0 +1,124 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _reactHooks = require("@testing-library/react-hooks");
+
+var _useModalState = _interopRequireDefault(require("./useModalState"));
+
+test('default return', function () {
+  var _renderHook = (0, _reactHooks.renderHook)(function () {
+    return (0, _useModalState["default"])();
+  }),
+      result = _renderHook.result;
+
+  expect(result.current).toEqual(expect.objectContaining({
+    isOpen: false,
+    open: expect.any(Function),
+    close: expect.any(Function),
+    toggle: expect.any(Function)
+  }));
+});
+test('isDefaultOpen returns uncontrolled state', function () {
+  var _renderHook2 = (0, _reactHooks.renderHook)(function () {
+    return (0, _useModalState["default"])({
+      isDefaultOpen: true
+    });
+  }),
+      result = _renderHook2.result;
+
+  expect(result.current).toEqual(expect.objectContaining({
+    isOpen: true,
+    open: expect.any(Function),
+    close: expect.any(Function),
+    toggle: expect.any(Function)
+  }));
+  (0, _reactHooks.act)(function () {
+    return result.current.close();
+  });
+  expect(result.current.isOpen).toBe(false);
+  (0, _reactHooks.act)(function () {
+    return result.current.open();
+  });
+  expect(result.current.isOpen).toBe(true);
+  (0, _reactHooks.act)(function () {
+    return result.current.toggle();
+  });
+  expect(result.current.isOpen).toBe(false);
+});
+test('isOpen when true returns controlled state', function () {
+  var _renderHook3 = (0, _reactHooks.renderHook)(function () {
+    return (0, _useModalState["default"])({
+      isOpen: true
+    });
+  }),
+      result = _renderHook3.result;
+
+  expect(result.current).toEqual(expect.objectContaining({
+    isOpen: true,
+    open: expect.any(Function),
+    close: expect.any(Function),
+    toggle: expect.any(Function)
+  }));
+  (0, _reactHooks.act)(function () {
+    return result.current.close();
+  });
+  expect(result.current.isOpen).not.toBe(false);
+  (0, _reactHooks.act)(function () {
+    return result.current.toggle();
+  });
+  expect(result.current.isOpen).not.toBe(false);
+});
+test('isOpen when false returns controlled state', function () {
+  var _renderHook4 = (0, _reactHooks.renderHook)(function () {
+    return (0, _useModalState["default"])({
+      isOpen: false
+    });
+  }),
+      result = _renderHook4.result;
+
+  expect(result.current).toEqual(expect.objectContaining({
+    isOpen: false,
+    open: expect.any(Function),
+    close: expect.any(Function),
+    toggle: expect.any(Function)
+  }));
+  (0, _reactHooks.act)(function () {
+    return result.current.open();
+  });
+  expect(result.current.isOpen).not.toBe(true);
+  (0, _reactHooks.act)(function () {
+    return result.current.toggle();
+  });
+  expect(result.current.isOpen).not.toBe(true);
+});
+test('onOpenChange callback is triggered', function () {
+  var onOpenChange = jest.fn();
+
+  var _renderHook5 = (0, _reactHooks.renderHook)(function () {
+    return (0, _useModalState["default"])({
+      onOpenChange: onOpenChange
+    });
+  }),
+      result = _renderHook5.result;
+
+  expect(result.current).toEqual(expect.objectContaining({
+    isOpen: false,
+    open: expect.any(Function),
+    close: expect.any(Function),
+    toggle: expect.any(Function)
+  }));
+  expect(onOpenChange).not.toHaveBeenCalled();
+  (0, _reactHooks.act)(function () {
+    return result.current.open();
+  });
+  expect(onOpenChange).toHaveBeenNthCalledWith(1, true);
+  (0, _reactHooks.act)(function () {
+    return result.current.close();
+  });
+  expect(onOpenChange).toHaveBeenNthCalledWith(2, false);
+  (0, _reactHooks.act)(function () {
+    return result.current.toggle();
+  });
+  expect(onOpenChange).toHaveBeenNthCalledWith(3, true);
+});

package/lib/cjs/hooks/useNavBarPress/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+_Object$defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _useNavBarPress["default"];
+  }
+});
+
+var _useNavBarPress = _interopRequireDefault(require("./useNavBarPress"));

package/lib/cjs/hooks/useNavBarPress/useNavBarPress.js

@@ -0,0 +1,38 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+/**
+ * A custom hook that will call an onPressCallback function, if the function is provided.
+ * @param {Object} params The accepted parameters object
+ * @param {string} props.key The unique identifier that is assigned to the element being pressed
+ * @param {Object} state The state object tracking selected keys
+ * @param {function} state.setSelectedKey The function that sets the selected keys
+ * @callback props.onPressCallback The callback that will be called only if provided
+ */
+var useNavBarPress = function useNavBarPress(_ref, state) {
+  var key = _ref.key,
+      onPressCallback = _ref.onPressCallback;
+  var setSelectedKey = state.setSelectedKey;
+
+  var onNavPress = function onNavPress() {
+    setSelectedKey(key);
+
+    if (onPressCallback) {
+      onPressCallback();
+    }
+  };
+
+  return {
+    onNavPress: onNavPress
+  };
+};
+
+var _default = useNavBarPress;
+exports["default"] = _default;

package/lib/cjs/hooks/useNavBarPress/useNavBarPress.test.js

@@ -0,0 +1,42 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _reactHooks = require("@testing-library/react-hooks");
+
+var _ = _interopRequireDefault(require("./"));
+
+var key = 'testKey';
+test('using the onPress prop works as a callback', function () {
+  var onPress = jest.fn();
+  var setSelectedKey = jest.fn();
+
+  var _renderHook = (0, _reactHooks.renderHook)(function () {
+    return (0, _["default"])({
+      key: key,
+      onPressCallback: onPress
+    }, {
+      setSelectedKey: setSelectedKey
+    });
+  }),
+      result = _renderHook.result;
+
+  result.current.onNavPress();
+  expect(onPress).toHaveBeenCalled();
+});
+test('if no onPress prop there is no callback', function () {
+  var onPress = jest.fn();
+  var setSelectedKey = jest.fn();
+
+  var _renderHook2 = (0, _reactHooks.renderHook)(function () {
+    return (0, _["default"])({
+      key: key
+    }, {
+      setSelectedKey: setSelectedKey
+    });
+  }),
+      result = _renderHook2.result;
+
+  result.current.onNavPress();
+  expect(onPress).not.toHaveBeenCalled();
+});

package/lib/cjs/hooks/useOverlayPanelState/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+_Object$defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _useOverlayPanelState["default"];
+  }
+});
+
+var _useOverlayPanelState = _interopRequireDefault(require("./useOverlayPanelState"));

package/lib/cjs/hooks/useOverlayPanelState/useOverlayPanelState.js

@@ -0,0 +1,54 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _overlays = require("@react-stately/overlays");
+
+/**
+ * Returns state-related data and functions for use with a Modal component.
+ * @param {Object} [props] Properties provided to the state
+ * @param {Boolean} [props.isDefaultOpen] Whether the modal is open by default (uncontrolled).
+ * @param {Boolean} [props.isOpen] Whether the modal is currently open (controlled).
+ * @param {Function} [props.onOpenChange] Handler that is called when the open state changes.
+ * `(isOpen: boolean) => void`
+ * @returns {Object} `{ isOpen: Boolean, open: Function, close: Function, toggle: Function }`
+ */
+var useOverlayPanelState = function useOverlayPanelState() {
+  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var isDefaultOpen = props.isDefaultOpen,
+      isOpen = props.isOpen,
+      onOpenChange = props.onOpenChange;
+  var state = (0, _overlays.useOverlayTriggerState)({
+    defaultOpen: isDefaultOpen,
+    isOpen: isOpen,
+    onOpenChange: onOpenChange
+  });
+
+  var onClose = function onClose(stateProp, triggerRef, onCloseProp) {
+    if (stateProp) {
+      stateProp.close();
+    }
+
+    if (triggerRef !== null && triggerRef !== void 0 && triggerRef.current) {
+      triggerRef.current.focus();
+    }
+
+    if (onCloseProp) {
+      onCloseProp();
+    }
+  };
+
+  return {
+    state: state,
+    onClose: onClose
+  };
+};
+
+var _default = useOverlayPanelState;
+exports["default"] = _default;

package/lib/cjs/hooks/useOverlayPanelState/useOverlayPanelState.test.js

@@ -0,0 +1,25 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _reactHooks = require("@testing-library/react-hooks");
+
+var _useOverlayPanelState = _interopRequireDefault(require("./useOverlayPanelState"));
+
+test('default useOverlayPanelState', function () {
+  var _renderHook = (0, _reactHooks.renderHook)(function () {
+    return (0, _useOverlayPanelState["default"])();
+  }),
+      result = _renderHook.result;
+
+  var obj = {
+    state: {
+      open: expect.any(Function),
+      close: expect.any(Function),
+      toggle: expect.any(Function),
+      isOpen: expect.any(Boolean)
+    },
+    onClose: expect.any(Function)
+  };
+  expect(result.current).toEqual(obj);
+});

package/lib/cjs/hooks/useProgressiveState/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+_Object$defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _useProgressiveState["default"];
+  }
+});
+
+var _useProgressiveState = _interopRequireDefault(require("./useProgressiveState"));

package/lib/cjs/hooks/useProgressiveState/useProgressiveState.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _react = require("react");
+
+/**
+ * A custom hook that provides stateful capabilities when the associated prop is not supplied
+ * @param {*} prop The intended prop to be controlled by state
+ * @param {*} initial The initial state value, used only if the given prop is undefined
+ */
+var useProgressiveState = function useProgressiveState(prop, initial) {
+  var controlledState = (0, _react.useState)(initial);
+
+  if (prop === undefined) {
+    return controlledState;
+  }
+
+  return [prop, function () {}];
+};
+
+var _default = useProgressiveState;
+exports["default"] = _default;