@reykjavik/hanna-react 0.10.59 → 0.10.60

package/esm/_abstract/_Image.js

@@ -1,27 +0,0 @@
-import React from 'react';
-import getBemClass from '@hugsmidjan/react/utils/getBemClass';
-import { useGetSVGtext } from '../utils/useGetSVGtext';
-// eslint-disable-next-line complexity
-const Image = (props) => {
-    const { src, altText = '', sources = [], preloadSrc, className, inline, placeholder, focalPoint, } = props;
-    const _src = (sources.length && preloadSrc) || src;
-    const imageSrc = _src || (sources[0] != null ? sources[0].srcset.split(' ')[0] : undefined);
-    const imgLoading = preloadSrc ? 'eager' : 'lazy';
-    const inlineSvg = useGetSVGtext(inline ? imageSrc : undefined);
-    if (!imageSrc) {
-        return placeholder ? (React.createElement("span", { className: className && getBemClass(className, 'missing') }, placeholder !== true && placeholder())) : null;
-    }
-    if (inline && inlineSvg) {
-        const __html = inlineSvg.imageSrc === imageSrc ? inlineSvg.code : '';
-        return React.createElement("span", { className: className, dangerouslySetInnerHTML: { __html } });
-    }
-    return (React.createElement("picture", { className: className, style: focalPoint ? { '--focalPoint': focalPoint } : undefined },
-        ' ',
-        sources.map((source, i) => (React.createElement(React.Fragment, null,
-            React.createElement("source", { key: i, srcSet: source.srcset, media: source.media }),
-            ' '))),
-        ' ',
-        React.createElement("img", { src: imageSrc, alt: altText, loading: imgLoading }),
-        '  '));
-};
-export default Image;

package/esm/_abstract/_Link.d.ts

@@ -1,27 +0,0 @@
-/**
- * Props object ready to be ..spread onto an anchor element
- * */
-export declare type LinkProps = JSX.IntrinsicElements['a'] & {
-    href: string;
-};
-export declare type LinkRenderer = (props: LinkProps) => JSX.Element;
-export declare let Link: LinkRenderer;
-/**
- * Allows you to set a callback function to wrapp <a href=""/> links with
- * a custom routing component.
- *
- * Example use:
- *
- * ```js
- *   import { Link } from 'remix'; // or whatever :-)
- *
- *   setLinkRenderer((linkProps) =>
- *     <Link to={linkProps.href}><a {...linkProps} /></Link>);
- * ```
- *
- * The Default linkrenderer defined as:
- * ```js
- * 	(linkProps) => React.createElement('a', linkProps);
- * ```
- */
-export declare const setLinkRenderer: (linkRenderer: LinkRenderer | undefined) => void;

package/esm/_abstract/_Link.js

@@ -1,24 +0,0 @@
-import React from 'react';
-const DefaultLinkRenderer = (props) => React.createElement('a', props);
-export let Link = DefaultLinkRenderer;
-/**
- * Allows you to set a callback function to wrapp <a href=""/> links with
- * a custom routing component.
- *
- * Example use:
- *
- * ```js
- *   import { Link } from 'remix'; // or whatever :-)
- *
- *   setLinkRenderer((linkProps) =>
- *     <Link to={linkProps.href}><a {...linkProps} /></Link>);
- * ```
- *
- * The Default linkrenderer defined as:
- * ```js
- * 	(linkProps) => React.createElement('a', linkProps);
- * ```
- */
-export const setLinkRenderer = (linkRenderer) => {
-    Link = linkRenderer || DefaultLinkRenderer;
-};

package/esm/_abstract/_Quote.d.ts

@@ -1,9 +0,0 @@
-import { ReactNode } from 'react';
-export declare type QuoteProps = {
-    children: ReactNode;
-    by?: string | JSX.Element;
-    byHref?: string;
-};
-export declare const _Quote: (props: {
-    bem: string;
-} & QuoteProps) => JSX.Element;

package/esm/_abstract/_Quote.js

@@ -1,8 +0,0 @@
-import React from 'react';
-import { Link } from './_Link';
-export const _Quote = (props) => {
-    const { bem, children, by, byHref } = props;
-    return (React.createElement("figure", { className: bem },
-        React.createElement("blockquote", { className: bem + '__quote' }, children),
-        by && (React.createElement("figcaption", { className: bem + '__by' }, byHref ? (React.createElement(Link, { href: byHref }, by)) : typeof by === 'string' ? (React.createElement("span", null, by)) : (by)))));
-};

package/esm/_abstract/_TogglerGroup.d.ts

@@ -1,31 +0,0 @@
-import { FormFieldInputProps } from '../FormField';
-import { TogglerInputProps } from './_TogglerInput';
-export declare type TogglerGroupOption = {
-    value: string;
-    label?: string | JSX.Element;
-    disabled?: boolean;
-    id?: string;
-};
-export declare type TogglerGroupOptions = Array<TogglerGroupOption>;
-declare type RestrictedInputProps = Omit<JSX.IntrinsicElements['input'], 'type' | 'value' | 'checked' | 'defaultChecked' | 'className' | 'id' | 'name' | 'children'>;
-export declare type TogglerGroupProps = {
-    options: TogglerGroupOptions;
-    className?: string;
-    name: string;
-    children?: undefined;
-    disabled?: boolean | ReadonlyArray<number>;
-    inputProps?: RestrictedInputProps;
-    onSelected?: (payload: {
-        value: string;
-        checked: boolean;
-        option: TogglerGroupOption;
-        selectedValues: Array<string>;
-    }) => void;
-} & Omit<FormFieldInputProps, 'disabled'>;
-declare type _TogglerGroupProps = {
-    bem: string;
-    Toggler: (props: TogglerInputProps) => JSX.Element;
-    value?: ReadonlyArray<string>;
-};
-declare const TogglerGroup: (props: TogglerGroupProps & _TogglerGroupProps) => JSX.Element;
-export default TogglerGroup;

package/esm/_abstract/_TogglerGroup.js

@@ -1,29 +0,0 @@
-import React from 'react';
-import getBemClass from '@hugsmidjan/react/utils/getBemClass';
-const TogglerGroup = (props) => {
-    const { 
-    // id,
-    className, bem, name, disabled, Toggler, onSelected, options, inputProps = {}, } = props;
-    const values = props.value || [];
-    return (React.createElement("ul", { className: getBemClass(bem, null, className), role: "group", "aria-labelledby": props['aria-labelledby'], "aria-describedby": props['aria-describedby'], "aria-required": props.required }, options.map((option, i) => {
-        const isDisabled = option.disabled != null
-            ? option.disabled
-            : disabled && typeof disabled !== 'boolean'
-                ? disabled.includes(i)
-                : disabled;
-        const isChecked = values.includes(option.value);
-        return (React.createElement(Toggler, Object.assign({ key: i }, inputProps, { className: bem + '__item', name: name, Wrapper: "li" }, option, { label: option.label || option.value, onChange: onSelected
-                ? (e) => {
-                    const { value } = option;
-                    const checked = e.currentTarget.checked;
-                    inputProps.onChange && inputProps.onChange(e);
-                    const selectedValues = values.filter((val) => val !== value);
-                    if (checked) {
-                        selectedValues.push(value);
-                    }
-                    onSelected({ value, checked, option, selectedValues });
-                }
-                : inputProps.onChange, disabled: isDisabled, "aria-invalid": props['aria-invalid'], checked: isChecked })));
-    })));
-};
-export default TogglerGroup;

package/esm/_abstract/_TogglerGroupField.d.ts

@@ -1,17 +0,0 @@
-import { ReactElement } from 'react';
-import { BemPropsModifier } from '@hugsmidjan/react/types';
-import { FormFieldGroupWrappingProps } from '../FormField';
-import { TogglerGroupOption, TogglerGroupOptions, TogglerGroupProps } from './_TogglerGroup';
-import { TogglerInputProps } from './_TogglerInput';
-export declare type TogglerGroupFieldProps = {
-    className?: string;
-} & FormFieldGroupWrappingProps & TogglerGroupProps;
-declare type _TogglerGroupFieldProps = {
-    Toggler: (props: TogglerInputProps) => ReactElement;
-    value?: string | ReadonlyArray<string>;
-    bem: string;
-} & BemPropsModifier;
-export declare type TogglerGroupFieldOption = TogglerGroupOption;
-export declare type TogglerGroupFieldOptions = TogglerGroupOptions;
-declare const TogglerGroupField: (props: TogglerGroupFieldProps & _TogglerGroupFieldProps) => JSX.Element;
-export default TogglerGroupField;

package/esm/_abstract/_TogglerGroupField.js

@@ -1,22 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React from 'react';
-import getBemClass from '@hugsmidjan/react/utils/getBemClass';
-import FormField from '../FormField';
-import TogglerGroup from './_TogglerGroup';
-const TogglerGroupField = (props) => {
-    const { bem, Toggler, className, modifier, label, LabelTag, assistText, hideLabel, disabled, readOnly, invalid, errorMessage, required, reqText, id, value } = props, togglerGroupProps = __rest(props, ["bem", "Toggler", "className", "modifier", "label", "LabelTag", "assistText", "hideLabel", "disabled", "readOnly", "invalid", "errorMessage", "required", "reqText", "id", "value"]);
-    return (React.createElement(FormField, { className: getBemClass(bem, modifier, className), group: true, label: label, LabelTag: LabelTag, assistText: assistText, hideLabel: hideLabel, disabled: disabled, readOnly: readOnly, invalid: invalid, errorMessage: errorMessage, required: required, reqText: reqText, id: id, renderInput: (className, inputProps) => {
-            return (React.createElement(TogglerGroup, Object.assign({ bem: className.options }, inputProps, togglerGroupProps, { value: Array.isArray(value) ? value : value != null ? [value] : undefined, Toggler: Toggler })));
-        } }));
-};
-export default TogglerGroupField;

package/esm/_abstract/_TogglerInput.d.ts

@@ -1,22 +0,0 @@
-import { BemPropsModifier } from '@hugsmidjan/react/types';
-export declare type TogglerInputProps = {
-    label: string | JSX.Element;
-    children?: undefined;
-    Wrapper?: 'div' | 'li';
-    invalid?: boolean;
-    /** Hidden label prefix text to indicate that the field is required.
-     *
-     * If your field is required but should not say so in its label
-     * then set this prop to `false`
-     *
-     * Default: `"Þarf að fylla út"`
-     * */
-    reqText?: string | false;
-    errorMessage?: string | JSX.Element;
-} & BemPropsModifier & Omit<JSX.IntrinsicElements['input'], 'type'>;
-declare type _TogglerInputProps = {
-    bem: string;
-    type: 'radio' | 'checkbox';
-};
-declare const TogglerInput: (props: TogglerInputProps & _TogglerInputProps) => JSX.Element;
-export default TogglerInput;

package/esm/_abstract/_TogglerInput.js

@@ -1,33 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React from 'react';
-import { useDomid } from '@hugsmidjan/react/hooks';
-import getBemClass from '@hugsmidjan/react/utils/getBemClass';
-const TogglerInput = (props) => {
-    const { bem, modifier, className, label, invalid, errorMessage, Wrapper = 'div', required, reqText, type, id } = props, inputProps = __rest(props, ["bem", "modifier", "className", "label", "invalid", "errorMessage", "Wrapper", "required", "reqText", "type", "id"]);
-    const domid = useDomid(id);
-    const errorId = errorMessage && 'error' + domid;
-    const reqStar = required && reqText !== false && (React.createElement("abbr", { className: bem + '__label__reqstar', 
-        // TODO: add mo-better i18n thinking
-        title: (reqText || 'Þarf að haka í') + ': ' }, "*"));
-    return (React.createElement(Wrapper, { className: getBemClass(bem, modifier, className) },
-        React.createElement("input", Object.assign({ className: bem + '__input', type: type, id: domid, "aria-invalid": invalid || !!errorMessage || undefined, "aria-describedby": errorId }, inputProps)),
-        ' ',
-        React.createElement("label", { className: bem + '__label', htmlFor: domid },
-            ' ',
-            reqStar,
-            " ",
-            label,
-            ' '),
-        errorMessage && (React.createElement("div", { className: bem + '__error', id: errorId }, errorMessage))));
-};
-export default TogglerInput;

package/esm/_abstract/breakOnNL.d.ts

@@ -1,2 +0,0 @@
-declare const breakOnNL: (text: string | undefined) => "" | (string | JSX.Element)[] | undefined;
-export default breakOnNL;

package/esm/_abstract/breakOnNL.js

@@ -1,8 +0,0 @@
-import React from 'react';
-const breakOnNL = (text) => text &&
-    text
-        .trim()
-        .replace(/(?:\n\s*)+/g, '\n\n')
-        .split(/\n/)
-        .map((bit) => bit || React.createElement("br", null));
-export default breakOnNL;

package/esm/assets.d.ts

@@ -1,42 +0,0 @@
-import type { BlingType, Efnistakn, Formheimur, Illustration } from '@reykjavik/hanna-utils/assets';
-import { blingTypes, efnistakn, getAssetUrl, getBlingUrl, getEfnistaknUrl, getFormheimurUrl, getIllustrationUrl, illustrations } from '@reykjavik/hanna-utils/assets';
-export type { 
-/** @deprecated  Instead `import type { BlingType } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-BlingType, 
-/** @deprecated  Instead `import type { Efnistakn } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-Efnistakn, 
-/** @deprecated  Instead `import type { Formheimur } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-Formheimur, 
-/** @deprecated  Instead `import type { Illustration } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-Illustration, };
-export { 
-/** @deprecated  Instead `import type { blingTypes } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-blingTypes, 
-/** @deprecated  Instead `import type { efnistakn } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-efnistakn, 
-/** @deprecated  Instead `import type { getAssetUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getAssetUrl, 
-/** @deprecated  Instead `import type { getBlingUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getBlingUrl, 
-/** @deprecated  Instead `import type { getEfnistaknUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getEfnistaknUrl, 
-/** @deprecated  Instead `import type { getFormheimurUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getFormheimurUrl, 
-/** @deprecated  Instead `import type { getIllustrationUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getIllustrationUrl, 
-/** @deprecated  Instead `import type { illustrations } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-illustrations, };
-/** @deprecated Use `getCssBundleUrl` from '@reykjavik/hanna-css' instead  (Will be reomved in v0.11) */
-export declare const getCssBundleUrl: (cssTokens: string | Array<string>, version?: string | undefined) => string;
-/** @deprecated  (Will be removed in v0.11) */
-export declare const efnistakn_menu: readonly ["menu/borgarstjori", "menu/borgarstjorn", "menu/bygg_framkv", "menu/fjarmal", "menu/fundargerdir", "menu/itrottir_aftreying", "menu/log_reglugerdir", "menu/mannaudur", "menu/menning", "menu/rad_nefndir", "menu/skipulag", "menu/skolar_fristund", "menu/svid_deildir", "menu/umhverfi_samgongur", "menu/velferd_fjolskylda"];
-/** @deprecated  (Will be removed in v0.11) */
-export declare type Efnistakn_Menu = typeof efnistakn_menu[number];
-/** @deprecated  (Will be removed in v0.11) */
-export declare const auxiliary_menu_images: Array<Illustration>;
-/** @deprecated  Instead `import type { AuxilaryPanelIllustration } from '@reykjavik/hanna-react/MainMenu';` (Will be removed in v0.11) */
-export declare type Auxilary_MenuImages = typeof auxiliary_menu_images[number];
-/** @deprecated  Instead `import type { BlingType } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-export declare type BlingTypes = BlingType;
-/** @deprecated  Instead `import type { Illustration } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-export declare type Illustrations = Illustration;

package/esm/assets.js

@@ -1,56 +0,0 @@
-import { getCssBundleUrl as _getCssBundleUrl } from '@reykjavik/hanna-css';
-import { blingTypes, efnistakn, getAssetUrl, getBlingUrl, getEfnistaknUrl, getFormheimurUrl, getIllustrationUrl, illustrations, } from '@reykjavik/hanna-utils/assets';
-export { 
-/** @deprecated  Instead `import type { blingTypes } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-blingTypes, 
-/** @deprecated  Instead `import type { efnistakn } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-efnistakn, 
-/** @deprecated  Instead `import type { getAssetUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getAssetUrl, 
-/** @deprecated  Instead `import type { getBlingUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getBlingUrl, 
-/** @deprecated  Instead `import type { getEfnistaknUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getEfnistaknUrl, 
-/** @deprecated  Instead `import type { getFormheimurUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getFormheimurUrl, 
-/** @deprecated  Instead `import type { getIllustrationUrl } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-getIllustrationUrl, 
-/** @deprecated  Instead `import type { illustrations } from '@reykjavik/hanna-utils/assets';` (Will be removed in v0.11) */
-illustrations, };
-/** @deprecated Use `getCssBundleUrl` from '@reykjavik/hanna-css' instead  (Will be reomved in v0.11) */
-export const getCssBundleUrl = (cssTokens, 
-/** If you want to pin your CSS files to a specific version */
-version) => _getCssBundleUrl(cssTokens, { version });
-// ---------------------------------------------------------------------------
-// Based on "https://styles.reykjavik.is/assets/efnistakn/menu/files.json"
-/** @deprecated  (Will be removed in v0.11) */
-export const efnistakn_menu = [
-    'menu/borgarstjori',
-    'menu/borgarstjorn',
-    'menu/bygg_framkv',
-    'menu/fjarmal',
-    'menu/fundargerdir',
-    'menu/itrottir_aftreying',
-    'menu/log_reglugerdir',
-    'menu/mannaudur',
-    'menu/menning',
-    'menu/rad_nefndir',
-    'menu/skipulag',
-    'menu/skolar_fristund',
-    'menu/svid_deildir',
-    'menu/umhverfi_samgongur',
-    'menu/velferd_fjolskylda',
-];
-// ---------------------------------------------------------------------------
-/** @deprecated  (Will be removed in v0.11) */
-export const auxiliary_menu_images = [
-    'hanna-veitiggi',
-    'hanna-vandro',
-    'hanna-hugsi',
-    'hanna-hissa',
-    'hanna-hahaha',
-    'hanna-hae',
-    'hanna-god_spurning',
-    'hanna-gjuggiborg',
-    'hanna-benda',
-];

package/esm/constants.d.ts

@@ -1,39 +0,0 @@
-/** @depcrecated import `colorFamilies` from  `@reykjavik/hanna-css` instead  (Will be removed in v0.11) */
-export declare const colorFamilies: readonly ["esja", "faxafloi", "nautholsvik", "heidmork", "ellidaardalur", "blafjoll", "sund", "rokkur", "suld"] & {
-    readonly esja: "esja";
-    readonly faxafloi: "faxafloi";
-    readonly nautholsvik: "nautholsvik";
-    readonly heidmork: "heidmork";
-    readonly ellidaardalur: "ellidaardalur";
-    readonly blafjoll: "blafjoll";
-    readonly sund: "sund";
-    readonly rokkur: "rokkur";
-    readonly suld: "suld";
-} & {
-    /** @deprecated  This is a typo  (Will be removed in v0.11) */
-    ellidarardalur: string;
-};
-/** @depcrecated import type `ColorFamily` from `@reykjavik/hanna-css` instead  (Will be removed in v0.11) */
-export type { ColorFamily } from '@reykjavik/hanna-css';
-/** @depcrecated import `colorThemes` from  `@reykjavik/hanna-css` instead  (Will be removed in v0.11) */
-export declare const themeOptions: readonly ["trustworthy", "dependable", "friendly", "lively", "colorful"] & {
-    readonly trustworthy: "trustworthy";
-    readonly dependable: "dependable";
-    readonly friendly: "friendly";
-    readonly lively: "lively";
-    readonly colorful: "colorful";
-};
-/** @depcrecated import type `HannaColorTheme` from `@reykjavik/hanna-css` instead  (Will be removed in v0.11) */
-export type { HannaColorTheme as ThemeOption } from '@reykjavik/hanna-css';
-export declare type Alignment = 'right' | 'left';
-export declare const aligns: Record<string, true | undefined>;
-export declare type ComponentLayoutProps<Align extends string = 'right'> = {
-    wide?: undefined;
-    align?: undefined;
-} | {
-    wide: boolean;
-    align?: undefined;
-} | {
-    wide?: undefined;
-    align: Align;
-};

package/esm/constants.js

@@ -1,22 +0,0 @@
-import { colorFamilies as _colorFamilies, colorThemes } from '@reykjavik/hanna-css';
-/** @depcrecated import `colorFamilies` from  `@reykjavik/hanna-css` instead  (Will be removed in v0.11) */
-export const colorFamilies = Object.assign([
-    'esja',
-    'faxafloi',
-    'nautholsvik',
-    'heidmork',
-    'ellidaardalur',
-    'blafjoll',
-    'sund',
-    'rokkur',
-    'suld',
-], _colorFamilies, {
-    /** @deprecated  This is a typo  (Will be removed in v0.11) */
-    ellidarardalur: 'ellidaardalur',
-});
-/** @depcrecated import `colorThemes` from  `@reykjavik/hanna-css` instead  (Will be removed in v0.11) */
-export const themeOptions = Object.assign(['trustworthy', 'dependable', 'friendly', 'lively', 'colorful'], colorThemes);
-export const aligns = {
-    right: true,
-    left: true,
-};

package/esm/focus-visible.d.ts

@@ -1 +0,0 @@
-import '@reykjavik/hanna-utils/focus-visible';

package/esm/focus-visible.js

@@ -1 +0,0 @@
-import '@reykjavik/hanna-utils/focus-visible';

package/esm/package.json

@@ -1 +0,0 @@
-{"type":"module"}

package/esm/utils/env.d.ts

@@ -1 +0,0 @@
-export declare const isPreact: true | undefined;

package/esm/utils/env.js

@@ -1,8 +0,0 @@
-import React from 'react';
-export const isPreact = 
-// imported from 'preact'
-'h' in React ||
-    // imported from 'preact/compat' (has all of `react-dom` bundled)
-    ('hydrate' in React && 'render' in React) ||
-    // `undefined` instead of `false` for nicer prop usage
-    undefined;

package/esm/utils/seenEffect.d.ts

@@ -1,28 +0,0 @@
-import { RefObject } from 'react';
-export declare const DATA_ATTR_NAME = "is-seen";
-export declare const getObserver: {
-    (target: Element, callback?: ((target: Element) => void) | undefined): (() => void) | undefined;
-    DATA_ATTR_NAME: string;
-};
-export declare const seenEffectOptOut: (target: Element, setFlag?: boolean) => void;
-declare const effects: {
-    readonly fadein: 1;
-    readonly fadeup: 1;
-    readonly fadeleft: 1;
-};
-export declare type SeenEffectType = keyof typeof effects;
-export declare type EffectProp = {
-    /** Should the component appear instantly, and not transition-in once seen */
-    effectType?: SeenEffectType | 'none';
-};
-/** Asserts that a prop value is a SeenEffectType and returns undefined otherwise */
-export declare const assertEffectType: (maybeType?: string | undefined) => SeenEffectType | undefined;
-export declare const getEffectAttr: (maybeType?: string | undefined) => {
-    'data-seen-effect': string | undefined;
-};
-export declare type SeenProp = {
-    /** Should the component appear instantly, and not transition-in once seen */
-    startSeen?: boolean;
-};
-export declare const useSeenEffect: <E extends Element = HTMLDivElement>(startSeen?: boolean | undefined, customRef?: RefObject<E> | undefined) => [RefObject<E> | undefined, true | undefined];
-export {};

package/esm/utils/seenEffect.js

@@ -1,73 +0,0 @@
-import { useEffect, useRef, useState } from 'react';
-export const DATA_ATTR_NAME = 'is-seen';
-const STACKING_DELAY = 400; // ms
-const dataAttr = 'data-' + DATA_ATTR_NAME;
-const inTargetSourceOrder = (a, b) => a.target.compareDocumentPosition(b.target) & Node.DOCUMENT_POSITION_PRECEDING ? 1 : -1;
-const options = {
-    // root: window
-    rootMargin: '-100px 0px 0px 0px',
-    threshold: 0, // 0
-};
-let observer;
-export const getObserver = (target, callback) => {
-    if (target.hasAttribute(dataAttr)) {
-        return;
-    }
-    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-    if (!observer) {
-        observer = new IntersectionObserver((entries, observer) => entries
-            .filter((e) => e.isIntersecting)
-            .sort(inTargetSourceOrder)
-            .forEach(({ target }, i) => {
-            setTimeout(() => {
-                target.setAttribute(dataAttr, 'true');
-                callback && callback(target);
-                observer.unobserve(target);
-            }, STACKING_DELAY * i);
-        }), options);
-    }
-    if (target.matches('[' + dataAttr + '] *')) {
-        // opt out if target is contained by another "seen-effect" element
-        target.setAttribute(dataAttr, '');
-        return;
-    }
-    target.setAttribute(dataAttr, 'false');
-    observer.observe(target);
-    return () => observer.unobserve(target);
-};
-export const seenEffectOptOut = (target, setFlag = true) => {
-    setFlag ? target.setAttribute(dataAttr, '') : target.removeAttribute(dataAttr);
-};
-getObserver.DATA_ATTR_NAME = DATA_ATTR_NAME;
-// ---------------------------------------------------------------------------
-// ---------------------------------------------------------------------------
-const effects = {
-    fadein: 1,
-    fadeup: 1,
-    fadeleft: 1,
-};
-/** Asserts that a prop value is a SeenEffectType and returns undefined otherwise */
-export const assertEffectType = (maybeType) => maybeType && maybeType in effects ? maybeType : undefined;
-export const getEffectAttr = (maybeType) => ({
-    'data-seen-effect': maybeType === 'none' ? undefined : assertEffectType(maybeType) || '',
-});
-export const useSeenEffect = (
-/** Should the component appear instantly, and not transition-in once seen */
-startSeen, 
-/** Bring Your Own RefObject */
-customRef) => {
-    const localRef = useRef(null);
-    const [isSeen, setSeen] = useState(startSeen || undefined);
-    const ref = !startSeen && (customRef || localRef);
-    useEffect(() => {
-        setSeen(startSeen || undefined);
-        if (ref && ref.current) {
-            // NOTE: Given that `ref` is defined, then
-            // `startSeen` is implicily `false | undefined` at
-            // this point.
-            seenEffectOptOut(ref.current, false);
-            return getObserver(ref.current, () => setSeen(true));
-        }
-    }, [ref, startSeen]);
-    return [ref || undefined, isSeen];
-};

package/esm/utils/useFormatMonitor.d.ts

@@ -1,38 +0,0 @@
-/**
- * Pass a callback that gets called whenever the browser window
- * resizes past one of the preconfigured "media-format" breakpoints.
- *
- * Exmple use:
- *
- * ```ts
- * useFormatMonitor((media) => {
- *   if (media.is === 'phone') {
- *     // do something clever because the window
- *     // just became "phone" sized.
- *   }
- *   if (media.was === 'phone') {
- *     // do something clever because the window
- *     // just stopped being "phone" sized.
- *   }
- * })
- * ```
- *
- * The `media` argument has the following properties:
- *
- * ```ts
- *  // type Formats = 'phone' | 'phablet' | 'tablet' | 'netbook' | 'wide'
- *  media.is //: Format
- *  media.was //?: Format
- *  // Category/mode boolean flags
- *  // (Hamburger refers to the "mobile menu" mode)
- *  media.isTopmenu
- *  media.isHamburger
- *  media.wasTopmenu
- *  media.wasHamburger
- *  media.becameTopmenu
- *  media.becameHamburger
- *  media.leftTopmenu
- *  media.leftHamburger
- * ```
- */
-export declare const useFormatMonitor: (callback: (media: import("formatchange").BaseMedia & Record<"isHamburger" | "isTopmenu" | "wasHamburger" | "wasTopmenu" | "becameHamburger" | "becameTopmenu" | "leftHamburger" | "leftTopmenu", boolean>) => void) => void;

package/esm/utils/useFormatMonitor.js

@@ -1,41 +0,0 @@
-import { formatMonitor } from '@reykjavik/hanna-utils';
-import { makeFormatMonitorHook } from 'formatchange/react';
-// ==================================================
-/**
- * Pass a callback that gets called whenever the browser window
- * resizes past one of the preconfigured "media-format" breakpoints.
- *
- * Exmple use:
- *
- * ```ts
- * useFormatMonitor((media) => {
- *   if (media.is === 'phone') {
- *     // do something clever because the window
- *     // just became "phone" sized.
- *   }
- *   if (media.was === 'phone') {
- *     // do something clever because the window
- *     // just stopped being "phone" sized.
- *   }
- * })
- * ```
- *
- * The `media` argument has the following properties:
- *
- * ```ts
- *  // type Formats = 'phone' | 'phablet' | 'tablet' | 'netbook' | 'wide'
- *  media.is //: Format
- *  media.was //?: Format
- *  // Category/mode boolean flags
- *  // (Hamburger refers to the "mobile menu" mode)
- *  media.isTopmenu
- *  media.isHamburger
- *  media.wasTopmenu
- *  media.wasHamburger
- *  media.becameTopmenu
- *  media.becameHamburger
- *  media.leftTopmenu
- *  media.leftHamburger
- * ```
- */
-export const useFormatMonitor = makeFormatMonitorHook(formatMonitor);