@reykjavik/hanna-react 0.10.89 → 0.10.90

package/CHANGELOG.md

@@ -4,13 +4,20 @@
 
 - ... <!-- Add new lines here. -->
 
+## 0.10.90
+
+_2023-06-01_
+
+- fix: Add missing named export of `Tooltip` compnent
+- fix: Update dependencies to fix esm–cjs import resolution errors
+
 ## 0.10.88 – 0.10.89
 
 _2023-05-25_
 
 - feat(ts): Export utility type `HtmlProps` from `utils` module — for adding
   HTML attributes (including `data-*`) to React components.
-- fix: Update dependencies to fix import resolution errors in node@>=18
+- fix: Update dependencies to fix esm–cjs import resolution errors
 
 ## 0.10.87
 

package/ContactBubble.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ContactBubble = exports.ensureIcon = exports.defaultTexts = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
-const focusElm_1 = tslib_1.__importDefault(require("@hugsmidjan/qj/focusElm"));
+const focusElm_1 = require("@hugsmidjan/qj/focusElm");
 const hooks_1 = require("@hugsmidjan/react/hooks");
 const getBemClass_1 = tslib_1.__importDefault(require("@hugsmidjan/react/utils/getBemClass"));
 const hanna_utils_1 = require("@reykjavik/hanna-utils");
@@ -54,7 +54,7 @@ const ContactBubble = (props) => {
         closeBubble: (setFocus) => {
             useLocalState && setLocalOpen(false);
             onToggle && onToggle(false);
-            setFocus !== false && (0, focusElm_1.default)(wrapperRef.current);
+            setFocus !== false && (0, focusElm_1.focusElm)(wrapperRef.current);
         },
     }), [useLocalState, onToggle]);
     (0, react_1.useEffect)(() => {

package/Datepicker.js

@@ -3,16 +3,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Datepicker = exports.getDateDiff = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-// Documentation: https://reactdatepicker.com/
-const react_datepicker_1 = tslib_1.__importStar(require("react-datepicker"));
+const react_datepicker_1 = require("react-datepicker"); // Docs: https://reactdatepicker.com/
 const hooks_1 = require("@hugsmidjan/react/hooks");
 const getBemClass_1 = tslib_1.__importDefault(require("@hugsmidjan/react/utils/getBemClass"));
 // For more info on localization see: https://stackoverflow.com/questions/54399084/change-locale-in-react-datepicker/58306958#58306958
-const is_1 = tslib_1.__importDefault(require("date-fns/locale/is"));
-const pl_1 = tslib_1.__importDefault(require("date-fns/locale/pl"));
-const FormField_js_1 = tslib_1.__importDefault(require("./FormField.js"));
-(0, react_datepicker_1.registerLocale)('is', is_1.default);
-(0, react_datepicker_1.registerLocale)('pl', pl_1.default);
+const index_js_1 = tslib_1.__importDefault(require("date-fns/locale/is/index.js"));
+const index_js_2 = tslib_1.__importDefault(require("date-fns/locale/pl/index.js"));
+const FormField_js_1 = require("./FormField.js");
+(0, react_datepicker_1.registerLocale)('is', index_js_1.default);
+(0, react_datepicker_1.registerLocale)('pl', index_js_2.default);
 const getDateDiff = (date, diff) => {
     const newDate = new Date(date);
     newDate.setDate(newDate.getDate() + diff);
@@ -59,14 +58,14 @@ const Datepicker = (props) => {
     const txts = i18n[localeCode] || {};
     const filled = !!value;
     const empty = !filled && !placeholder;
-    return (react_1.default.createElement(FormField_js_1.default, { className: (0, getBemClass_1.default)('Datepicker', [], className), ssr: ssr, label: label, small: small, assistText: assistText, hideLabel: hideLabel, invalid: invalid, required: required, reqText: reqText, disabled: disabled, readOnly: readOnly, filled: filled, empty: empty, errorMessage: errorMessage, renderInput: (className, inputProps, addFocusProps) => {
+    return (react_1.default.createElement(FormField_js_1.FormField, { className: (0, getBemClass_1.default)('Datepicker', [], className), ssr: ssr, label: label, small: small, assistText: assistText, hideLabel: hideLabel, invalid: invalid, required: required, reqText: reqText, disabled: disabled, readOnly: readOnly, filled: filled, empty: empty, errorMessage: errorMessage, renderInput: (className, inputProps, addFocusProps) => {
             return (react_1.default.createElement("div", Object.assign({ className: className.input, onClick: ({ target, currentTarget }) => { var _a; return target === currentTarget && ((_a = currentTarget.querySelector('input')) === null || _a === void 0 ? void 0 : _a.focus()); }, ref: inputRef &&
                     ((elm) => {
                         inputRef.current =
                             (elm === null || elm === void 0 ? void 0 : elm.querySelector('input')) || undefined;
                         return elm;
                     }) }, addFocusProps()),
-                react_1.default.createElement(react_datepicker_1.default, Object.assign({ id: domid, required: inputProps.required, disabled: inputProps.disabled, readOnly: inputProps.readOnly, selected: value, name: name, locale: localeCode, dateFormat: 
+                react_1.default.createElement(react_datepicker_1.ReactDatePicker, Object.assign({ id: domid, required: inputProps.required, disabled: inputProps.disabled, readOnly: inputProps.readOnly, selected: value, name: name, locale: localeCode, dateFormat: 
                     // NOTE: Force all dateFormat values into Array<string> to temporarily work around
                     // a bug in the current version of react-datepicker where invalid **string** values
                     // are re-parsed with `new Date()`, causing surprising (weird) false positives

package/FileInput.js

@@ -3,10 +3,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FileInput = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
-const react_dropzone_1 = require("react-dropzone"); // https://react-dropzone.js.org/#!/Dropzone
 const hooks_1 = require("@hugsmidjan/react/hooks");
 const getBemClass_1 = tslib_1.__importDefault(require("@hugsmidjan/react/utils/getBemClass"));
 const i18n_1 = require("@reykjavik/hanna-utils/i18n");
+const ReactDropzone_js_1 = require("./_mixed_export_resolution_/ReactDropzone.js");
 const _FileInput_utils_js_1 = require("./FileInput/_FileInput.utils.js");
 const _FileInputFileList_js_1 = require("./FileInput/_FileInputFileList.js");
 const FormField_js_1 = tslib_1.__importDefault(require("./FormField.js"));
@@ -37,7 +37,7 @@ const FileInput = (props) => {
     const fileInput = (0, react_1.useRef)(null);
     const files = value;
     const [isHover, setIsHover] = (0, react_1.useState)(false);
-    const { getRootProps, getInputProps, isDragReject, inputRef } = (0, react_dropzone_1.useDropzone)({
+    const { getRootProps, getInputProps, isDragReject, inputRef } = (0, ReactDropzone_js_1.useDropzone)({
         onDrop: (acceptedFiles) => {
             acceptedFiles = acceptedFiles.map((file) => {
                 (0, _FileInput_utils_js_1.addPreview)(file);

package/IframeBlock.d.ts

@@ -1,5 +1,5 @@
 import { EitherObj } from '@reykjavik/hanna-utils';
-import { ResizerOptions } from 'iframe-resizer-react';
+import { type ResizerOptions } from 'iframe-resizer-react';
 export type IframeBlockProps = {
     src: string;
     /** Accessible title attribute for the iframe (similar to alt="" on images) */

package/MainMenu.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.MainMenu = exports.defaultMainMenuTexts = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
-const focusElm_1 = tslib_1.__importDefault(require("@hugsmidjan/qj/focusElm"));
+const focusElm_1 = require("@hugsmidjan/qj/focusElm");
 const useShortState_1 = tslib_1.__importDefault(require("@hugsmidjan/react/hooks/useShortState"));
 const getBemClass_1 = tslib_1.__importDefault(require("@hugsmidjan/react/utils/getBemClass"));
 const hanna_utils_1 = require("@reykjavik/hanna-utils");
@@ -121,13 +121,13 @@ const MainMenu = (props) => {
                             // const buttonElm = menuElm.querySelector<HTMLButtonElement>(
                             // 	'button.MainMenu__link[aria-pressed="true"]'
                             // );
-                            (0, focusElm_1.default)(pressedLinkElm);
+                            (0, focusElm_1.focusElm)(pressedLinkElm);
                         }
                         else if (newActive !== activePanel) {
                             // const panelElm = menuElm.querySelector<HTMLButtonElement>(
                             // 	'.PrimaryPanel--active'
                             // );
-                            (0, focusElm_1.default)(activePanelRef.current);
+                            (0, focusElm_1.focusElm)(activePanelRef.current);
                         }
                     }, 100);
                 }

package/Tooltip.d.ts

@@ -3,5 +3,5 @@ export type TooltipProps = {
     text: string | JSX.Element;
     iconOnly?: boolean;
 };
-declare const ToolTip: (props: TooltipProps) => JSX.Element;
-export default ToolTip;
+export declare const Tooltip: (props: TooltipProps) => JSX.Element;
+export default Tooltip;

package/Tooltip.js

@@ -1,12 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tooltip = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const react_2 = require("@floating-ui/react");
 const hooks_1 = require("@hugsmidjan/react/hooks");
 const getBemClass_1 = tslib_1.__importDefault(require("@hugsmidjan/react/utils/getBemClass"));
 const getSide = (placement) => placement.split('-')[0];
-const ToolTip = (props) => {
+const Tooltip = (props) => {
     const { text, label, iconOnly } = props;
     const arrowRef = (0, react_1.useRef)(null);
     const [isOpen, setIsOpen] = (0, hooks_1.useLaggedState)(false, 300);
@@ -58,4 +59,5 @@ const ToolTip = (props) => {
             x !== null && (react_1.default.createElement("div", { "data-floating-ui-hack-plz-ignore": "", style: { position: 'absolute', display: 'none' }, ref: arrowRef })),
             text)));
 };
-exports.default = ToolTip;
+exports.Tooltip = Tooltip;
+exports.default = exports.Tooltip;

package/_abstract/_AbstractCarousel.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const A_1 = tslib_1.__importDefault(require("@hugsmidjan/qj/A"));
 const debounce_1 = tslib_1.__importDefault(require("@hugsmidjan/qj/debounce"));
-const focusElm_1 = tslib_1.__importDefault(require("@hugsmidjan/qj/focusElm"));
+const focusElm_1 = require("@hugsmidjan/qj/focusElm");
 const throttle_1 = tslib_1.__importDefault(require("@hugsmidjan/qj/throttle"));
 const getBemClass_1 = tslib_1.__importDefault(require("@hugsmidjan/react/utils/getBemClass"));
 const hanna_utils_1 = require("@reykjavik/hanna-utils");
@@ -73,7 +73,7 @@ const AbstractCarousel = (props) => {
         }
         setActiveItem(newActive);
         listElm.scrollLeft = newItem.offsetLeft || 1;
-        setTimeout(() => (0, focusElm_1.default)(newItem), 500);
+        setTimeout(() => (0, focusElm_1.focusElm)(newItem), 500);
     };
     const { delayedScrollLeft, delayedScrollRight } = (0, react_1.useMemo)(() => {
         const delayedScrollLeft = (0, debounce_1.default)((currentActive) => {

package/_mixed_export_resolution_/ReactDropzone.d.ts

@@ -0,0 +1,3 @@
+import * as reactDropzonePkg from 'react-dropzone';
+export declare const ReactDropzone: typeof reactDropzonePkg.default;
+export declare const useDropzone: typeof reactDropzonePkg.useDropzone;

package/_mixed_export_resolution_/ReactDropzone.js

@@ -0,0 +1,14 @@
+"use strict";
+// See <file://./_WAT.md> for info on why this file exists
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDropzone = exports.ReactDropzone = void 0;
+const tslib_1 = require("tslib");
+const reactDropzonePkg = tslib_1.__importStar(require("react-dropzone"));
+const _default = reactDropzonePkg.default;
+// This defensive code is required to get around the fact that react-dropzone
+// mixes default and named exports.
+// Depending whether this module is run as ESM or CJS, then `_default` may be
+// either the actual default export or an object with a default property.
+// Rejoice in the woeful borderlands of modern ESM and legacy CJS interop.
+exports.ReactDropzone = 'default' in _default ? _default.default : _default;
+exports.useDropzone = reactDropzonePkg.useDropzone;

package/esm/ContactBubble.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useMemo, useRef, useState } from 'react';
-import focusElm from '@hugsmidjan/qj/focusElm';
+import { focusElm } from '@hugsmidjan/qj/focusElm';
 import { useDomid } from '@hugsmidjan/react/hooks';
 import getBemClass from '@hugsmidjan/react/utils/getBemClass';
 import { getPageScrollElm } from '@reykjavik/hanna-utils';

package/esm/Datepicker.js

@@ -1,14 +1,11 @@
 import React from 'react';
-// Documentation: https://reactdatepicker.com/
-import ReactDatePicker, { registerLocale,
-// setDefaultLocale,
- } from 'react-datepicker';
+import { ReactDatePicker, registerLocale } from 'react-datepicker'; // Docs: https://reactdatepicker.com/
 import { useDomid } from '@hugsmidjan/react/hooks';
 import getBemClass from '@hugsmidjan/react/utils/getBemClass';
 // For more info on localization see: https://stackoverflow.com/questions/54399084/change-locale-in-react-datepicker/58306958#58306958
-import is from 'date-fns/locale/is';
-import pl from 'date-fns/locale/pl';
-import FormField from './FormField.js';
+import is from 'date-fns/locale/is/index.js';
+import pl from 'date-fns/locale/pl/index.js';
+import { FormField } from './FormField.js';
 registerLocale('is', is);
 registerLocale('pl', pl);
 export const getDateDiff = (date, diff) => {

package/esm/FileInput.js

@@ -1,9 +1,9 @@
 import { __rest } from "tslib";
 import React, { useEffect, useRef, useState } from 'react';
-import { useDropzone } from 'react-dropzone'; // https://react-dropzone.js.org/#!/Dropzone
 import { useDomid } from '@hugsmidjan/react/hooks';
 import getBemClass from '@hugsmidjan/react/utils/getBemClass';
 import { DEFAULT_LANG } from '@reykjavik/hanna-utils/i18n';
+import { useDropzone } from './_mixed_export_resolution_/ReactDropzone.js';
 import { addPreview, formatBytes, getFileListUpdate, releasePreview, } from './FileInput/_FileInput.utils.js';
 import { DefaultFileList } from './FileInput/_FileInputFileList.js';
 import FormField from './FormField.js';

package/esm/IframeBlock.d.ts

@@ -1,5 +1,5 @@
 import { EitherObj } from '@reykjavik/hanna-utils';
-import { ResizerOptions } from 'iframe-resizer-react';
+import { type ResizerOptions } from 'iframe-resizer-react';
 export type IframeBlockProps = {
     src: string;
     /** Accessible title attribute for the iframe (similar to alt="" on images) */

package/esm/MainMenu.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useMemo, useRef, useState } from 'react';
-import focusElm from '@hugsmidjan/qj/focusElm';
+import { focusElm } from '@hugsmidjan/qj/focusElm';
 import useShortState from '@hugsmidjan/react/hooks/useShortState';
 import getBemClass from '@hugsmidjan/react/utils/getBemClass';
 import { getPageScrollElm } from '@reykjavik/hanna-utils';

package/esm/Tooltip.d.ts

@@ -3,5 +3,5 @@ export type TooltipProps = {
     text: string | JSX.Element;
     iconOnly?: boolean;
 };
-declare const ToolTip: (props: TooltipProps) => JSX.Element;
-export default ToolTip;
+export declare const Tooltip: (props: TooltipProps) => JSX.Element;
+export default Tooltip;

package/esm/Tooltip.js

@@ -3,7 +3,7 @@ import { arrow as arrowPlugin, autoUpdate, flip, offset, shift, useFloating, } f
 import { useCallbackOnEsc, useLaggedState } from '@hugsmidjan/react/hooks';
 import getBemClass from '@hugsmidjan/react/utils/getBemClass';
 const getSide = (placement) => placement.split('-')[0];
-const ToolTip = (props) => {
+export const Tooltip = (props) => {
     const { text, label, iconOnly } = props;
     const arrowRef = useRef(null);
     const [isOpen, setIsOpen] = useLaggedState(false, 300);
@@ -55,4 +55,4 @@ const ToolTip = (props) => {
             x !== null && (React.createElement("div", { "data-floating-ui-hack-plz-ignore": "", style: { position: 'absolute', display: 'none' }, ref: arrowRef })),
             text)));
 };
-export default ToolTip;
+export default Tooltip;

package/esm/_abstract/_AbstractCarousel.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useMemo, useRef, useState, } from 'react';
 import A from '@hugsmidjan/qj/A';
 import debounce from '@hugsmidjan/qj/debounce';
-import focusElm from '@hugsmidjan/qj/focusElm';
+import { focusElm } from '@hugsmidjan/qj/focusElm';
 import throttle from '@hugsmidjan/qj/throttle';
 import getBemClass from '@hugsmidjan/react/utils/getBemClass';
 import { notNully } from '@reykjavik/hanna-utils';

package/esm/_mixed_export_resolution_/ReactDropzone.d.ts

@@ -0,0 +1,3 @@
+import * as reactDropzonePkg from 'react-dropzone';
+export declare const ReactDropzone: typeof reactDropzonePkg.default;
+export declare const useDropzone: typeof reactDropzonePkg.useDropzone;

package/esm/_mixed_export_resolution_/ReactDropzone.js

@@ -0,0 +1,10 @@
+// See <file://./_WAT.md> for info on why this file exists
+import * as reactDropzonePkg from 'react-dropzone';
+const _default = reactDropzonePkg.default;
+// This defensive code is required to get around the fact that react-dropzone
+// mixes default and named exports.
+// Depending whether this module is run as ESM or CJS, then `_default` may be
+// either the actual default export or an object with a default property.
+// Rejoice in the woeful borderlands of modern ESM and legacy CJS interop.
+export const ReactDropzone = 'default' in _default ? _default.default : _default;
+export const useDropzone = reactDropzonePkg.useDropzone;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@reykjavik/hanna-react",
-	"version": "0.10.89",
+	"version": "0.10.90",
 	"author": "Reykjavík (http://www.reykjavik.is)",
 	"contributors": [
 		"Hugsmiðjan ehf (http://www.hugsmidjan.is)",
@@ -14,8 +14,8 @@
 	"license": "MIT",
 	"dependencies": {
 		"@floating-ui/react": "^0.19.2",
-		"@hugsmidjan/qj": "^4.18.0",
-		"@hugsmidjan/react": "^0.4.30",
+		"@hugsmidjan/qj": "^4.19.0",
+		"@hugsmidjan/react": "^0.4.31",
 		"@reykjavik/hanna-css": "^0.4.2",
 		"@reykjavik/hanna-utils": "^0.2.5",
 		"@types/react": "^17.0.24",