@reykjavik/hanna-react 0.10.87 → 0.10.89

package/CHANGELOG.md

@@ -4,6 +4,14 @@
 
 - ... <!-- Add new lines here. -->
 
+## 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
+
 ## 0.10.87
 
 _2023-05-19_

package/FileInput/_FileInputFileList.d.ts

@@ -1,5 +1,5 @@
-import type { formatBytes } from './_FileInput.utils';
-import { CustomFile } from './_FileInput.utils';
+import type { formatBytes } from './_FileInput.utils.js';
+import { CustomFile } from './_FileInput.utils.js';
 export type FileListProps = {
     files: Array<CustomFile>;
     showFileSize?: boolean;

package/FileInput.js

@@ -7,7 +7,7 @@ const react_dropzone_1 = require("react-dropzone"); // https://react-dropzone.js
 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 _FileInput_utils_1 = require("./FileInput/_FileInput.utils");
+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"));
 const defaultRemoveFileText = {
@@ -40,7 +40,7 @@ const FileInput = (props) => {
     const { getRootProps, getInputProps, isDragReject, inputRef } = (0, react_dropzone_1.useDropzone)({
         onDrop: (acceptedFiles) => {
             acceptedFiles = acceptedFiles.map((file) => {
-                (0, _FileInput_utils_1.addPreview)(file);
+                (0, _FileInput_utils_js_1.addPreview)(file);
                 return file;
             });
             // eslint-disable-next-line @typescript-eslint/no-use-before-define
@@ -67,14 +67,14 @@ const FileInput = (props) => {
     });
     // Synchronoyusly add previews on incoming files
     // (NOTE: `addPreview` ignores files that already have preview.)
-    files.forEach(_FileInput_utils_1.addPreview);
+    files.forEach(_FileInput_utils_js_1.addPreview);
     (0, react_1.useEffect)(() => {
         if (fileInput.current) {
             fileInput.current.files = arrayToFileList(files);
         }
         return () => {
             // Make sure to revoke the data uris on unmount to avoid memory leaks
-            files.forEach(_FileInput_utils_1.releasePreview);
+            files.forEach(_FileInput_utils_js_1.releasePreview);
         };
     }, [files]);
     const removeFile = (removeTarget) => {
@@ -85,7 +85,7 @@ const FileInput = (props) => {
                 return true;
             }
             deleted.push(file);
-            (0, _FileInput_utils_1.releasePreview)(file);
+            (0, _FileInput_utils_js_1.releasePreview)(file);
             return false;
         });
         if (fileInput.current) {
@@ -94,7 +94,7 @@ const FileInput = (props) => {
         onFilesUpdated(fileList, { deleted });
     };
     const addFiles = (added) => {
-        const { fileList, diff } = (0, _FileInput_utils_1.getFileListUpdate)(files, added, !multiple);
+        const { fileList, diff } = (0, _FileInput_utils_js_1.getFileListUpdate)(files, added, !multiple);
         if (fileInput.current) {
             fileInput.current.files = arrayToFileList(fileList);
         }
@@ -126,7 +126,7 @@ const FileInput = (props) => {
                     showImagePreviews,
                     removeFileText,
                     removeFile,
-                    formatBytes: _FileInput_utils_1.formatBytes,
+                    formatBytes: _FileInput_utils_js_1.formatBytes,
                 })))));
         } }));
 };

package/Selectbox.d.ts

@@ -1,11 +1,10 @@
-import type { SelectboxProps as _SelectboxProps } from '@hugsmidjan/react/Selectbox';
+import type { OptionOrValue, SelectboxProps as _SelectboxProps } from '@hugsmidjan/react/Selectbox';
 import { FormFieldWrappingProps } from './FormField.js';
 export { type SelectboxOption, type SelectboxOptions as SelectboxOptionList, 
 /** @deprecated Use `SelectboxOptionList` instead  (Will be removed in v0.11) */
 type SelectboxOptions, } from '@hugsmidjan/react/Selectbox';
-type OptionOrValue = _SelectboxProps['options'][0];
 export type SelectboxProps<O extends OptionOrValue = OptionOrValue> = FormFieldWrappingProps & Omit<_SelectboxProps<O>, 'bem'> & {
     small?: boolean;
 };
-export declare const Selectbox: <O extends import("@hugsmidjan/react/__types/Selectbox.privates.js").OptionOrValue>(props: SelectboxProps<O>) => JSX.Element;
+export declare const Selectbox: <O extends OptionOrValue>(props: SelectboxProps<O>) => JSX.Element;
 export default Selectbox;

package/_abstract/_TogglerGroup.d.ts

@@ -1,4 +1,5 @@
 import { FormFieldInputProps } from '../FormField.js';
+import { HTMLProps } from '../utils.js';
 import { TogglerInputProps } from './_TogglerInput.js';
 export type TogglerGroupOption = {
     value: string;
@@ -7,7 +8,7 @@ export type TogglerGroupOption = {
     id?: string;
 };
 export type TogglerGroupOptions = Array<TogglerGroupOption>;
-type RestrictedInputProps = Omit<JSX.IntrinsicElements['input'], 'type' | 'value' | 'defaultValue' | 'checked' | 'defaultChecked' | 'className' | 'id' | 'name' | 'children'>;
+type RestrictedInputProps = Omit<HTMLProps<'input'>, 'type' | 'value' | 'defaultValue' | 'checked' | 'defaultChecked' | 'className' | 'id' | 'name' | 'children'>;
 export type TogglerGroupProps = {
     options: TogglerGroupOptions;
     className?: string;

package/esm/FileInput/_FileInputFileList.d.ts

@@ -1,5 +1,5 @@
-import type { formatBytes } from './_FileInput.utils';
-import { CustomFile } from './_FileInput.utils';
+import type { formatBytes } from './_FileInput.utils.js';
+import { CustomFile } from './_FileInput.utils.js';
 export type FileListProps = {
     files: Array<CustomFile>;
     showFileSize?: boolean;

package/esm/FileInput.js

@@ -4,7 +4,7 @@ import { useDropzone } from 'react-dropzone'; // https://react-dropzone.js.org/#
 import { useDomid } from '@hugsmidjan/react/hooks';
 import getBemClass from '@hugsmidjan/react/utils/getBemClass';
 import { DEFAULT_LANG } from '@reykjavik/hanna-utils/i18n';
-import { addPreview, formatBytes, getFileListUpdate, releasePreview, } from './FileInput/_FileInput.utils';
+import { addPreview, formatBytes, getFileListUpdate, releasePreview, } from './FileInput/_FileInput.utils.js';
 import { DefaultFileList } from './FileInput/_FileInputFileList.js';
 import FormField from './FormField.js';
 const defaultRemoveFileText = {

package/esm/Selectbox.d.ts

@@ -1,11 +1,10 @@
-import type { SelectboxProps as _SelectboxProps } from '@hugsmidjan/react/Selectbox';
+import type { OptionOrValue, SelectboxProps as _SelectboxProps } from '@hugsmidjan/react/Selectbox';
 import { FormFieldWrappingProps } from './FormField.js';
 export { type SelectboxOption, type SelectboxOptions as SelectboxOptionList, 
 /** @deprecated Use `SelectboxOptionList` instead  (Will be removed in v0.11) */
 type SelectboxOptions, } from '@hugsmidjan/react/Selectbox';
-type OptionOrValue = _SelectboxProps['options'][0];
 export type SelectboxProps<O extends OptionOrValue = OptionOrValue> = FormFieldWrappingProps & Omit<_SelectboxProps<O>, 'bem'> & {
     small?: boolean;
 };
-export declare const Selectbox: <O extends import("@hugsmidjan/react/__types/Selectbox.privates.js").OptionOrValue>(props: SelectboxProps<O>) => JSX.Element;
+export declare const Selectbox: <O extends OptionOrValue>(props: SelectboxProps<O>) => JSX.Element;
 export default Selectbox;

package/esm/_abstract/_TogglerGroup.d.ts

@@ -1,4 +1,5 @@
 import { FormFieldInputProps } from '../FormField.js';
+import { HTMLProps } from '../utils.js';
 import { TogglerInputProps } from './_TogglerInput.js';
 export type TogglerGroupOption = {
     value: string;
@@ -7,7 +8,7 @@ export type TogglerGroupOption = {
     id?: string;
 };
 export type TogglerGroupOptions = Array<TogglerGroupOption>;
-type RestrictedInputProps = Omit<JSX.IntrinsicElements['input'], 'type' | 'value' | 'defaultValue' | 'checked' | 'defaultChecked' | 'className' | 'id' | 'name' | 'children'>;
+type RestrictedInputProps = Omit<HTMLProps<'input'>, 'type' | 'value' | 'defaultValue' | 'checked' | 'defaultChecked' | 'className' | 'id' | 'name' | 'children'>;
 export type TogglerGroupProps = {
     options: TogglerGroupOptions;
     className?: string;

package/esm/utils.d.ts

@@ -6,3 +6,10 @@ export * from './utils/useFormatMonitor.js';
 export * from './utils/useGetSVGtext.js';
 export * from './utils/useMixedControlState.js';
 export * from './utils/useScrollbarWidthCSSVar.js';
+/**
+ * Helper type to add HTML element props to a component, **including**
+ * `data-*` attributes
+ */
+export type HTMLProps<T extends keyof JSX.IntrinsicElements> = JSX.IntrinsicElements[T] & {
+    [dataAttr: `data-${string}`]: unknown;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@reykjavik/hanna-react",
-	"version": "0.10.87",
+	"version": "0.10.89",
 	"author": "Reykjavík (http://www.reykjavik.is)",
 	"contributors": [
 		"Hugsmiðjan ehf (http://www.hugsmidjan.is)",
@@ -14,10 +14,10 @@
 	"license": "MIT",
 	"dependencies": {
 		"@floating-ui/react": "^0.19.2",
-		"@hugsmidjan/qj": "^4.10.2",
-		"@hugsmidjan/react": "^0.4.25",
-		"@reykjavik/hanna-css": "^0.4.1",
-		"@reykjavik/hanna-utils": "^0.2.3",
+		"@hugsmidjan/qj": "^4.18.0",
+		"@hugsmidjan/react": "^0.4.30",
+		"@reykjavik/hanna-css": "^0.4.2",
+		"@reykjavik/hanna-utils": "^0.2.5",
 		"@types/react": "^17.0.24",
 		"@types/react-autosuggest": "^10.1.0",
 		"@types/react-datepicker": "^4.8.0",

package/utils.d.ts

@@ -6,3 +6,10 @@ export * from './utils/useFormatMonitor.js';
 export * from './utils/useGetSVGtext.js';
 export * from './utils/useMixedControlState.js';
 export * from './utils/useScrollbarWidthCSSVar.js';
+/**
+ * Helper type to add HTML element props to a component, **including**
+ * `data-*` attributes
+ */
+export type HTMLProps<T extends keyof JSX.IntrinsicElements> = JSX.IntrinsicElements[T] & {
+    [dataAttr: `data-${string}`]: unknown;
+};