@lumx/react 3.0.2-alpha-react-utils.2 → 3.0.2-alpha-react-utils.3

package/_internal/5babcc39.js

@@ -1,147 +0,0 @@
-import { b as _objectWithoutProperties, c as _extends } from './6340c129.js';
-import { Theme } from '../components.js';
-import React, { forwardRef, useMemo } from 'react';
-import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './fd867c9d.js';
-import { u as uid } from './fc608bd9.js';
-import { I as InputHelper } from './b0eb3a30.js';
-import { I as InputLabel } from './12ab39e4.js';
-
-/**
- * Defines the props of the component.
- */
-
-/**
- * Component display name.
- */
-var COMPONENT_NAME = 'RadioButton';
-/**
- * Component default class name and class prefix.
- */
-
-var CLASSNAME = getRootClassName(COMPONENT_NAME);
-/**
- * Component default props.
- */
-
-var DEFAULT_PROPS = {
-  theme: Theme.light
-};
-/**
- * RadioButton component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-
-var RadioButton = forwardRef(function (props, ref) {
-  var checked = props.checked,
-      className = props.className,
-      disabled = props.disabled,
-      helper = props.helper,
-      id = props.id,
-      inputRef = props.inputRef,
-      _props$isChecked = props.isChecked,
-      isChecked = _props$isChecked === void 0 ? checked : _props$isChecked,
-      _props$isDisabled = props.isDisabled,
-      isDisabled = _props$isDisabled === void 0 ? disabled : _props$isDisabled,
-      label = props.label,
-      name = props.name,
-      onChange = props.onChange,
-      theme = props.theme,
-      value = props.value,
-      forwardedProps = _objectWithoutProperties(props, ["checked", "className", "disabled", "helper", "id", "inputRef", "isChecked", "isDisabled", "label", "name", "onChange", "theme", "value"]);
-
-  var radioButtonId = useMemo(function () {
-    return id || "".concat(CLASSNAME.toLowerCase(), "-").concat(uid());
-  }, [id]);
-
-  var handleChange = function handleChange(event) {
-    if (onChange) {
-      onChange(value, name, event);
-    }
-  };
-
-  return React.createElement("div", _extends({
-    ref: ref
-  }, forwardedProps, {
-    className: classnames(className, handleBasicClasses({
-      isChecked: isChecked,
-      isDisabled: isDisabled,
-      isUnchecked: !isChecked,
-      prefix: CLASSNAME,
-      theme: theme
-    }))
-  }), React.createElement("div", {
-    className: "".concat(CLASSNAME, "__input-wrapper")
-  }, React.createElement("input", {
-    ref: inputRef,
-    className: "".concat(CLASSNAME, "__input-native"),
-    disabled: isDisabled,
-    id: radioButtonId,
-    tabIndex: isDisabled ? -1 : 0,
-    type: "radio",
-    name: name,
-    value: value,
-    checked: isChecked,
-    onChange: handleChange
-  }), React.createElement("div", {
-    className: "".concat(CLASSNAME, "__input-placeholder")
-  }, React.createElement("div", {
-    className: "".concat(CLASSNAME, "__input-background")
-  }), React.createElement("div", {
-    className: "".concat(CLASSNAME, "__input-indicator")
-  }))), React.createElement("div", {
-    className: "".concat(CLASSNAME, "__content")
-  }, label && React.createElement(InputLabel, {
-    htmlFor: radioButtonId,
-    theme: theme,
-    className: "".concat(CLASSNAME, "__label")
-  }, label), helper && React.createElement(InputHelper, {
-    theme: theme,
-    className: "".concat(CLASSNAME, "__helper")
-  }, helper)));
-});
-RadioButton.displayName = COMPONENT_NAME;
-RadioButton.className = CLASSNAME;
-RadioButton.defaultProps = DEFAULT_PROPS;
-
-/**
- * Defines the props of the component.
- */
-
-/**
- * Component display name.
- */
-var COMPONENT_NAME$1 = 'RadioGroup';
-/**
- * Component default class name and class prefix.
- */
-
-var CLASSNAME$1 = getRootClassName(COMPONENT_NAME$1);
-/**
- * RadioGroup component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-
-var RadioGroup = forwardRef(function (props, ref) {
-  var children = props.children,
-      className = props.className,
-      forwardedProps = _objectWithoutProperties(props, ["children", "className"]);
-
-  return React.createElement("div", _extends({
-    ref: ref
-  }, forwardedProps, {
-    className: classnames(className, handleBasicClasses({
-      prefix: CLASSNAME$1
-    }))
-  }), children);
-});
-RadioGroup.displayName = COMPONENT_NAME$1;
-RadioGroup.className = CLASSNAME$1;
-
-export { RadioButton as R, RadioGroup as a };
-//# sourceMappingURL=5babcc39.js.map

package/_internal/5babcc39.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"5babcc39.js","sources":["../../src/components/radio-button/RadioButton.tsx","../../src/components/radio-button/RadioGroup.tsx"],"sourcesContent":["import React, { useMemo, forwardRef, ReactNode, SyntheticEvent } from 'react';\n\nimport classNames from 'classnames';\nimport { uid } from 'uid';\n\nimport { InputHelper, InputLabel, Theme } from '@lumx/react';\n\nimport { Comp, GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';\n\n/**\n * Defines the props of the component.\n */\nexport interface RadioButtonProps extends GenericProps, HasTheme {\n    /** Helper text. */\n    helper?: string;\n    /** Native input id property. */\n    id?: string;\n    /** Native input ref. */\n    inputRef?: React.Ref<HTMLInputElement>;\n    /** Whether it is checked or not. */\n    isChecked?: boolean;\n    /** Whether the component is disabled or not. */\n    isDisabled?: boolean;\n    /** Label content. */\n    label?: ReactNode;\n    /** Native input name property. */\n    name?: string;\n    /** Native input value property. */\n    value?: string;\n    /** On change callback. */\n    onChange?(value?: string, name?: string, event?: SyntheticEvent): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'RadioButton';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<RadioButtonProps> = {\n    theme: Theme.light,\n};\n\n/**\n * RadioButton component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const RadioButton: Comp<RadioButtonProps, HTMLDivElement> = forwardRef((props, ref) => {\n    const {\n        checked,\n        className,\n        disabled,\n        helper,\n        id,\n        inputRef,\n        isChecked = checked,\n        isDisabled = disabled,\n        label,\n        name,\n        onChange,\n        theme,\n        value,\n        ...forwardedProps\n    } = props;\n    const radioButtonId = useMemo(() => id || `${CLASSNAME.toLowerCase()}-${uid()}`, [id]);\n\n    const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        if (onChange) {\n            onChange(value, name, event);\n        }\n    };\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(\n                className,\n                handleBasicClasses({\n                    isChecked,\n                    isDisabled,\n                    isUnchecked: !isChecked,\n                    prefix: CLASSNAME,\n                    theme,\n                }),\n            )}\n        >\n            <div className={`${CLASSNAME}__input-wrapper`}>\n                <input\n                    ref={inputRef}\n                    className={`${CLASSNAME}__input-native`}\n                    disabled={isDisabled}\n                    id={radioButtonId}\n                    tabIndex={isDisabled ? -1 : 0}\n                    type=\"radio\"\n                    name={name}\n                    value={value}\n                    checked={isChecked}\n                    onChange={handleChange}\n                />\n\n                <div className={`${CLASSNAME}__input-placeholder`}>\n                    <div className={`${CLASSNAME}__input-background`} />\n                    <div className={`${CLASSNAME}__input-indicator`} />\n                </div>\n            </div>\n\n            <div className={`${CLASSNAME}__content`}>\n                {label && (\n                    <InputLabel htmlFor={radioButtonId} theme={theme} className={`${CLASSNAME}__label`}>\n                        {label}\n                    </InputLabel>\n                )}\n                {helper && (\n                    <InputHelper theme={theme} className={`${CLASSNAME}__helper`}>\n                        {helper}\n                    </InputHelper>\n                )}\n            </div>\n        </div>\n    );\n});\nRadioButton.displayName = COMPONENT_NAME;\nRadioButton.className = CLASSNAME;\nRadioButton.defaultProps = DEFAULT_PROPS;\n","import React, { forwardRef, ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/react/utils/className';\n\n/**\n * Defines the props of the component.\n */\nexport interface RadioGroupProps extends GenericProps {\n    /** RadioButton elements */\n    children: ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'RadioGroup';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * RadioGroup component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const RadioGroup: Comp<RadioGroupProps, HTMLDivElement> = forwardRef((props, ref) => {\n    const { children, className, ...forwardedProps } = props;\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(\n                className,\n                handleBasicClasses({\n                    prefix: CLASSNAME,\n                }),\n            )}\n        >\n            {children}\n        </div>\n    );\n});\nRadioGroup.displayName = COMPONENT_NAME;\nRadioGroup.className = CLASSNAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","theme","Theme","light","RadioButton","forwardRef","props","ref","checked","className","disabled","helper","id","inputRef","isChecked","isDisabled","label","name","onChange","value","forwardedProps","radioButtonId","useMemo","toLowerCase","uid","handleChange","event","classNames","handleBasicClasses","isUnchecked","prefix","displayName","defaultProps","RadioGroup","children"],"mappings":";;;;;;;;AAUA;;;;AAwBA;;;AAGA,IAAMA,cAAc,GAAG,aAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;AAGA,IAAMG,aAAwC,GAAG;AAC7CC,EAAAA,KAAK,EAAEC,KAAK,CAACC;AADgC,CAAjD;AAIA;;;;;;;;IAOaC,WAAmD,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAEtFC,OAFsF,GAgBtFF,KAhBsF,CAEtFE,OAFsF;AAAA,MAGtFC,SAHsF,GAgBtFH,KAhBsF,CAGtFG,SAHsF;AAAA,MAItFC,QAJsF,GAgBtFJ,KAhBsF,CAItFI,QAJsF;AAAA,MAKtFC,MALsF,GAgBtFL,KAhBsF,CAKtFK,MALsF;AAAA,MAMtFC,EANsF,GAgBtFN,KAhBsF,CAMtFM,EANsF;AAAA,MAOtFC,QAPsF,GAgBtFP,KAhBsF,CAOtFO,QAPsF;AAAA,yBAgBtFP,KAhBsF,CAQtFQ,SARsF;AAAA,MAQtFA,SARsF,iCAQ1EN,OAR0E;AAAA,0BAgBtFF,KAhBsF,CAStFS,UATsF;AAAA,MAStFA,UATsF,kCASzEL,QATyE;AAAA,MAUtFM,KAVsF,GAgBtFV,KAhBsF,CAUtFU,KAVsF;AAAA,MAWtFC,IAXsF,GAgBtFX,KAhBsF,CAWtFW,IAXsF;AAAA,MAYtFC,QAZsF,GAgBtFZ,KAhBsF,CAYtFY,QAZsF;AAAA,MAatFjB,KAbsF,GAgBtFK,KAhBsF,CAatFL,KAbsF;AAAA,MActFkB,KAdsF,GAgBtFb,KAhBsF,CActFa,KAdsF;AAAA,MAenFC,cAfmF,4BAgBtFd,KAhBsF;;AAiB1F,MAAMe,aAAa,GAAGC,OAAO,CAAC;AAAA,WAAMV,EAAE,cAAOd,SAAS,CAACyB,WAAV,EAAP,cAAkCC,GAAG,EAArC,CAAR;AAAA,GAAD,EAAoD,CAACZ,EAAD,CAApD,CAA7B;;AAEA,MAAMa,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAAgD;AACjE,QAAIR,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAACC,KAAD,EAAQF,IAAR,EAAcS,KAAd,CAAR;AACH;AACJ,GAJD;;AAMA,SACI;AACI,IAAA,GAAG,EAAEnB;AADT,KAEQa,cAFR;AAGI,IAAA,SAAS,EAAEO,UAAU,CACjBlB,SADiB,EAEjBmB,kBAAkB,CAAC;AACfd,MAAAA,SAAS,EAATA,SADe;AAEfC,MAAAA,UAAU,EAAVA,UAFe;AAGfc,MAAAA,WAAW,EAAE,CAACf,SAHC;AAIfgB,MAAAA,MAAM,EAAEhC,SAJO;AAKfG,MAAAA,KAAK,EAALA;AALe,KAAD,CAFD;AAHzB,MAcI;AAAK,IAAA,SAAS,YAAKH,SAAL;AAAd,KACI;AACI,IAAA,GAAG,EAAEe,QADT;AAEI,IAAA,SAAS,YAAKf,SAAL,mBAFb;AAGI,IAAA,QAAQ,EAAEiB,UAHd;AAII,IAAA,EAAE,EAAEM,aAJR;AAKI,IAAA,QAAQ,EAAEN,UAAU,GAAG,CAAC,CAAJ,GAAQ,CALhC;AAMI,IAAA,IAAI,EAAC,OANT;AAOI,IAAA,IAAI,EAAEE,IAPV;AAQI,IAAA,KAAK,EAAEE,KARX;AASI,IAAA,OAAO,EAAEL,SATb;AAUI,IAAA,QAAQ,EAAEW;AAVd,IADJ,EAcI;AAAK,IAAA,SAAS,YAAK3B,SAAL;AAAd,KACI;AAAK,IAAA,SAAS,YAAKA,SAAL;AAAd,IADJ,EAEI;AAAK,IAAA,SAAS,YAAKA,SAAL;AAAd,IAFJ,CAdJ,CAdJ,EAkCI;AAAK,IAAA,SAAS,YAAKA,SAAL;AAAd,KACKkB,KAAK,IACF,oBAAC,UAAD;AAAY,IAAA,OAAO,EAAEK,aAArB;AAAoC,IAAA,KAAK,EAAEpB,KAA3C;AAAkD,IAAA,SAAS,YAAKH,SAAL;AAA3D,KACKkB,KADL,CAFR,EAMKL,MAAM,IACH,oBAAC,WAAD;AAAa,IAAA,KAAK,EAAEV,KAApB;AAA2B,IAAA,SAAS,YAAKH,SAAL;AAApC,KACKa,MADL,CAPR,CAlCJ,CADJ;AAiDH,CA1E4E;AA2E7EP,WAAW,CAAC2B,WAAZ,GAA0BlC,cAA1B;AACAO,WAAW,CAACK,SAAZ,GAAwBX,SAAxB;AACAM,WAAW,CAAC4B,YAAZ,GAA2BhC,aAA3B;;AChIA;;;;AAQA;;;AAGA,IAAMH,gBAAc,GAAG,YAAvB;AAEA;;;;AAGA,IAAMC,WAAS,GAAGC,gBAAgB,CAACF,gBAAD,CAAlC;AAEA;;;;;;;;IAOaoC,UAAiD,GAAG5B,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAChF2B,QADgF,GACrC5B,KADqC,CAChF4B,QADgF;AAAA,MACtEzB,SADsE,GACrCH,KADqC,CACtEG,SADsE;AAAA,MACxDW,cADwD,4BACrCd,KADqC;;AAGxF,SACI;AACI,IAAA,GAAG,EAAEC;AADT,KAEQa,cAFR;AAGI,IAAA,SAAS,EAAEO,UAAU,CACjBlB,SADiB,EAEjBmB,kBAAkB,CAAC;AACfE,MAAAA,MAAM,EAAEhC;AADO,KAAD,CAFD;AAHzB,MAUKoC,QAVL,CADJ;AAcH,CAjB0E;AAkB3ED,UAAU,CAACF,WAAX,GAAyBlC,gBAAzB;AACAoC,UAAU,CAACxB,SAAX,GAAuBX,WAAvB;;;;"}

package/_internal/5c1bf4d4.d.ts

@@ -1,81 +0,0 @@
-import React from 'react';
-import { l as GenericProps, k as Comp } from './eca6d4dc.js';
-import { a as PopoverProps, O as Offset, P as Placement } from './599e250a.js';
-
-/**
- * Defines the props of the component.
- */
-interface DropdownProps extends GenericProps {
-    /**
-     * Reference to the element around which the dropdown is placed.
-     * @see {@link PopoverProps#anchorRef}
-     */
-    anchorRef: PopoverProps['anchorRef'];
-    /** Dropdown content. */
-    children: React.ReactNode;
-    /**
-     * Whether a click anywhere out of the Dropdown would close it or not.
-     * @see {@link PopoverProps#closeOnClickAway}
-     */
-    closeOnClickAway?: boolean;
-    /**
-     * Whether to close the Dropdown when clicking in it or not.
-     */
-    closeOnClick?: boolean;
-    /**
-     * Whether an escape key press would close the Dropdown or not.
-     * @see {@link PopoverProps#closeOnEscape}
-     */
-    closeOnEscape?: boolean;
-    /**
-     * Whether the dropdown should fit to the anchor width (if dropdown is smaller) or not.
-     * @see {@link PopoverProps#fitToAnchorWidth}
-     */
-    fitToAnchorWidth?: boolean;
-    /**
-     * Whether the dropdown should shrink to fit within the viewport height or not.
-     * @see {@link PopoverProps#fitWithinViewportHeight}
-     */
-    fitWithinViewportHeight?: boolean;
-    /**
-     * Whether the dropdown should be displayed or not. Useful to control the Dropdown from outside the component.
-     * @see {@link PopoverProps#isOpen}
-     */
-    isOpen: boolean;
-    /**
-     * Offset applied to the Dropdown position.
-     * @see {@link PopoverProps#offset}
-     */
-    offset?: Offset;
-    /**
-     * Preferred Dropdown placement against the anchor element.
-     * @see {@link PopoverProps#placement}
-     */
-    placement?: Placement;
-    /** Whether the focus should be set on the list when the dropdown is open or not. */
-    shouldFocusOnOpen?: boolean;
-    /** Whether the focus should go back on the anchor when dropdown closes and focus is within. */
-    focusAnchorOnClose?: boolean;
-    /**
-     * Z-axis position.
-     * @see {@link PopoverProps#zIndex}
-     */
-    zIndex?: number;
-    /**
-     * On close callback.
-     * @see {@link PopoverProps#onClose}
-     */
-    onClose?(): void;
-    /** On scroll end callback. */
-    onInfiniteScroll?(): void;
-}
-/**
- * Dropdown component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-declare const Dropdown: Comp<DropdownProps, HTMLDivElement>;
-
-export { DropdownProps as D, Dropdown as a };

package/_internal/5d8ed4ee.js

@@ -1,113 +0,0 @@
-import { useEffect } from 'react';
-import { f as onEscapePressed } from './fd867c9d.js';
-import { D as DOCUMENT } from './288dfd0f.js';
-import last from 'lodash/last';
-import pull from 'lodash/pull';
-
-/** CSS selector listing all tabbable elements. */
-var TABBABLE_ELEMENTS_SELECTOR = "a[href], button, textarea, input:not([type=\"hidden\"]):not([hidden]), [tabindex]";
-/** CSS selector matching element that are disabled (should not receive focus). */
-
-var DISABLED_SELECTOR = "[hidden], [tabindex=\"-1\"], [disabled]:not([disabled=\"false\"]), [aria-disabled]:not([aria-disabled=\"false\"])";
-
-var isNotDisabled = function isNotDisabled(element) {
-  return !element.matches(DISABLED_SELECTOR);
-};
-
-function getFocusableElements(element) {
-  return Array.from(element.querySelectorAll(TABBABLE_ELEMENTS_SELECTOR)).filter(isNotDisabled);
-}
-
-/**
- * Get first and last elements focusable in an element.
- *
- * @param parentElement The element in which to search focusable elements.
- * @return first and last focusable elements
- */
-
-function getFirstAndLastFocusable(parentElement) {
-  var focusableElements = getFocusableElements(parentElement); // First non disabled element.
-
-  var first = focusableElements[0]; // Last non disabled element.
-
-  var last = focusableElements[focusableElements.length - 1];
-
-  if (last && first) {
-    return {
-      first: first,
-      last: last
-    };
-  }
-
-  return {};
-}
-
-/**
- * Keep track of listeners, only the last registered listener gets activated at any point (previously registered
- * listener are disabled).
- * When a listener gets unregistered, the previously registered listener gets enabled again.
- */
-function makeListenerTowerContext() {
-  var LISTENERS = [];
-  return {
-    register: function register(listener) {
-      var _last;
-
-      // Disable previous listener.
-      (_last = last(LISTENERS)) === null || _last === void 0 ? void 0 : _last.disable(); // Keep track of current listener.
-
-      LISTENERS.push(listener); // Enable current listener.
-
-      listener.enable();
-    },
-    unregister: function unregister(listener) {
-      var _last2;
-
-      // Disable current listener.
-      listener.disable(); // Remove current listener.
-
-      pull(LISTENERS, listener); // Enable previous listener.
-
-      (_last2 = last(LISTENERS)) === null || _last2 === void 0 ? void 0 : _last2.enable();
-    }
-  };
-}
-
-var LISTENERS = makeListenerTowerContext();
-/**
- * Register a global listener on 'Escape' key pressed.
- *
- * If multiple listener are registered, only the last one is maintained. When a listener is unregistered, the previous
- * one gets activated again.
- *
- * @param callback      Callback
- * @param closeOnEscape Disables the hook when false
- */
-
-function useCallbackOnEscape(callback) {
-  var closeOnEscape = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-  useEffect(function () {
-    var rootElement = DOCUMENT === null || DOCUMENT === void 0 ? void 0 : DOCUMENT.body;
-
-    if (!closeOnEscape || !callback || !rootElement) {
-      return undefined;
-    }
-
-    var onKeyDown = onEscapePressed(callback);
-    var listener = {
-      enable: function enable() {
-        return rootElement.addEventListener('keydown', onKeyDown);
-      },
-      disable: function disable() {
-        return rootElement.removeEventListener('keydown', onKeyDown);
-      }
-    };
-    LISTENERS.register(listener);
-    return function () {
-      return LISTENERS.unregister(listener);
-    };
-  }, [callback, closeOnEscape]);
-}
-
-export { getFocusableElements as a, getFirstAndLastFocusable as g, makeListenerTowerContext as m, useCallbackOnEscape as u };
-//# sourceMappingURL=5d8ed4ee.js.map

package/_internal/5d8ed4ee.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"5d8ed4ee.js","sources":["../../src/utils/focus/constants.ts","../../src/utils/focus/getFocusableElements.ts","../../src/utils/focus/getFirstAndLastFocusable.ts","../../src/utils/makeListenerTowerContext.ts","../../src/hooks/useCallbackOnEscape.ts"],"sourcesContent":["/** CSS selector listing all tabbable elements. */\nexport const TABBABLE_ELEMENTS_SELECTOR = `a[href], button, textarea, input:not([type=\"hidden\"]):not([hidden]), [tabindex]`;\n\n/** CSS selector matching element that are disabled (should not receive focus). */\nexport const DISABLED_SELECTOR = `[hidden], [tabindex=\"-1\"], [disabled]:not([disabled=\"false\"]), [aria-disabled]:not([aria-disabled=\"false\"])`;\n","import { DISABLED_SELECTOR, TABBABLE_ELEMENTS_SELECTOR } from './constants';\n\nconst isNotDisabled = (element: HTMLElement) => !element.matches(DISABLED_SELECTOR);\n\nexport function getFocusableElements(element: HTMLElement): HTMLElement[] {\n    return Array.from(element.querySelectorAll<HTMLElement>(TABBABLE_ELEMENTS_SELECTOR)).filter(isNotDisabled);\n}\n","import { getFocusableElements } from './getFocusableElements';\n\n/**\n * Get first and last elements focusable in an element.\n *\n * @param parentElement The element in which to search focusable elements.\n * @return first and last focusable elements\n */\nexport function getFirstAndLastFocusable(parentElement: HTMLElement) {\n    const focusableElements = getFocusableElements(parentElement);\n\n    // First non disabled element.\n    const first = focusableElements[0];\n    // Last non disabled element.\n    const last = focusableElements[focusableElements.length - 1];\n\n    if (last && first) {\n        return { first, last };\n    }\n    return {};\n}\n","import last from 'lodash/last';\nimport pull from 'lodash/pull';\n\nexport type Listener = { enable(): void; disable(): void };\n\n/**\n * Keep track of listeners, only the last registered listener gets activated at any point (previously registered\n * listener are disabled).\n * When a listener gets unregistered, the previously registered listener gets enabled again.\n */\nexport function makeListenerTowerContext() {\n    const LISTENERS: Listener[] = [];\n\n    return {\n        register(listener: Listener) {\n            // Disable previous listener.\n            last(LISTENERS)?.disable();\n            // Keep track of current listener.\n            LISTENERS.push(listener);\n            // Enable current listener.\n            listener.enable();\n        },\n        unregister(listener: Listener) {\n            // Disable current listener.\n            listener.disable();\n            // Remove current listener.\n            pull(LISTENERS, listener);\n            // Enable previous listener.\n            last(LISTENERS)?.enable();\n        },\n    };\n}\n","import { DOCUMENT } from '@lumx/react/constants';\nimport { Callback } from '@lumx/react/utils/type';\nimport { onEscapePressed } from '@lumx/react/utils/event';\nimport { useEffect } from 'react';\nimport { Listener, makeListenerTowerContext } from '@lumx/react/utils/makeListenerTowerContext';\n\nconst LISTENERS = makeListenerTowerContext();\n\n/**\n * Register a global listener on 'Escape' key pressed.\n *\n * If multiple listener are registered, only the last one is maintained. When a listener is unregistered, the previous\n * one gets activated again.\n *\n * @param callback      Callback\n * @param closeOnEscape Disables the hook when false\n */\nexport function useCallbackOnEscape(callback: Callback | undefined, closeOnEscape = true) {\n    useEffect(() => {\n        const rootElement = DOCUMENT?.body;\n        if (!closeOnEscape || !callback || !rootElement) {\n            return undefined;\n        }\n        const onKeyDown = onEscapePressed(callback);\n\n        const listener: Listener = {\n            enable: () => rootElement.addEventListener('keydown', onKeyDown),\n            disable: () => rootElement.removeEventListener('keydown', onKeyDown),\n        };\n\n        LISTENERS.register(listener);\n        return () => LISTENERS.unregister(listener);\n    }, [callback, closeOnEscape]);\n}\n"],"names":["TABBABLE_ELEMENTS_SELECTOR","DISABLED_SELECTOR","isNotDisabled","element","matches","getFocusableElements","Array","from","querySelectorAll","filter","getFirstAndLastFocusable","parentElement","focusableElements","first","last","length","makeListenerTowerContext","LISTENERS","register","listener","disable","push","enable","unregister","pull","useCallbackOnEscape","callback","closeOnEscape","useEffect","rootElement","DOCUMENT","body","undefined","onKeyDown","onEscapePressed","addEventListener","removeEventListener"],"mappings":";;;;;;AAAA;AACO,IAAMA,0BAA0B,sFAAhC;AAEP;;AACO,IAAMC,iBAAiB,sHAAvB;;ACFP,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,OAAD;AAAA,SAA0B,CAACA,OAAO,CAACC,OAAR,CAAgBH,iBAAhB,CAA3B;AAAA,CAAtB;;AAEO,SAASI,oBAAT,CAA8BF,OAA9B,EAAmE;AACtE,SAAOG,KAAK,CAACC,IAAN,CAAWJ,OAAO,CAACK,gBAAR,CAAsCR,0BAAtC,CAAX,EAA8ES,MAA9E,CAAqFP,aAArF,CAAP;AACH;;ACJD;;;;;;;AAMO,SAASQ,wBAAT,CAAkCC,aAAlC,EAA8D;AACjE,MAAMC,iBAAiB,GAAGP,oBAAoB,CAACM,aAAD,CAA9C,CADiE;;AAIjE,MAAME,KAAK,GAAGD,iBAAiB,CAAC,CAAD,CAA/B,CAJiE;;AAMjE,MAAME,IAAI,GAAGF,iBAAiB,CAACA,iBAAiB,CAACG,MAAlB,GAA2B,CAA5B,CAA9B;;AAEA,MAAID,IAAI,IAAID,KAAZ,EAAmB;AACf,WAAO;AAAEA,MAAAA,KAAK,EAALA,KAAF;AAASC,MAAAA,IAAI,EAAJA;AAAT,KAAP;AACH;;AACD,SAAO,EAAP;AACH;;ACfD;;;;;AAKO,SAASE,wBAAT,GAAoC;AACvC,MAAMC,SAAqB,GAAG,EAA9B;AAEA,SAAO;AACHC,IAAAA,QADG,oBACMC,QADN,EAC0B;AAAA;;AACzB;AACA,eAAAL,IAAI,CAACG,SAAD,CAAJ,gDAAiBG,OAAjB,GAFyB;;AAIzBH,MAAAA,SAAS,CAACI,IAAV,CAAeF,QAAf,EAJyB;;AAMzBA,MAAAA,QAAQ,CAACG,MAAT;AACH,KARE;AASHC,IAAAA,UATG,sBASQJ,QATR,EAS4B;AAAA;;AAC3B;AACAA,MAAAA,QAAQ,CAACC,OAAT,GAF2B;;AAI3BI,MAAAA,IAAI,CAACP,SAAD,EAAYE,QAAZ,CAAJ,CAJ2B;;AAM3B,gBAAAL,IAAI,CAACG,SAAD,CAAJ,kDAAiBK,MAAjB;AACH;AAhBE,GAAP;AAkBH;;ACzBD,IAAML,SAAS,GAAGD,wBAAwB,EAA1C;AAEA;;;;;;;;;;AASO,SAASS,mBAAT,CAA6BC,QAA7B,EAAmF;AAAA,MAAtBC,aAAsB,uEAAN,IAAM;AACtFC,EAAAA,SAAS,CAAC,YAAM;AACZ,QAAMC,WAAW,GAAGC,QAAH,aAAGA,QAAH,uBAAGA,QAAQ,CAAEC,IAA9B;;AACA,QAAI,CAACJ,aAAD,IAAkB,CAACD,QAAnB,IAA+B,CAACG,WAApC,EAAiD;AAC7C,aAAOG,SAAP;AACH;;AACD,QAAMC,SAAS,GAAGC,eAAe,CAACR,QAAD,CAAjC;AAEA,QAAMP,QAAkB,GAAG;AACvBG,MAAAA,MAAM,EAAE;AAAA,eAAMO,WAAW,CAACM,gBAAZ,CAA6B,SAA7B,EAAwCF,SAAxC,CAAN;AAAA,OADe;AAEvBb,MAAAA,OAAO,EAAE;AAAA,eAAMS,WAAW,CAACO,mBAAZ,CAAgC,SAAhC,EAA2CH,SAA3C,CAAN;AAAA;AAFc,KAA3B;AAKAhB,IAAAA,SAAS,CAACC,QAAV,CAAmBC,QAAnB;AACA,WAAO;AAAA,aAAMF,SAAS,CAACM,UAAV,CAAqBJ,QAArB,CAAN;AAAA,KAAP;AACH,GAdQ,EAcN,CAACO,QAAD,EAAWC,aAAX,CAdM,CAAT;AAeH;;;;"}

package/_internal/616f2912.js

@@ -1,301 +0,0 @@
-import { d as _slicedToArray, b as _objectWithoutProperties, _ as _objectSpread2, c as _extends } from './6340c129.js';
-import { AspectRatio, Size, Theme } from '../components.js';
-import React, { useState, useEffect, useMemo, forwardRef } from 'react';
-import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './fd867c9d.js';
-import { I as Icon, t as mdiImageBroken } from './a521723d.js';
-import { m as mergeRefs } from './853713cd.js';
-
-function getState(img, event) {
-  // Error event occurred or image loaded empty.
-  if ((event === null || event === void 0 ? void 0 : event.type) === 'error' || (img === null || img === void 0 ? void 0 : img.complete) && ((img === null || img === void 0 ? void 0 : img.naturalWidth) === 0 || (img === null || img === void 0 ? void 0 : img.naturalHeight) === 0)) {
-    return 'hasError';
-  } // Image is undefined or incomplete.
-
-
-  if (!img || !img.complete) {
-    return 'isLoading';
-  } // Else loaded.
-
-
-  return 'isLoaded';
-}
-
-function useImageLoad(imageURL, imgRef) {
-  var _useState = useState(getState(imgRef)),
-      _useState2 = _slicedToArray(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1]; // Update state when changing image URL or DOM reference.
-
-
-  useEffect(function () {
-    setState(getState(imgRef));
-  }, [imageURL, imgRef]); // Listen to `load` and `error` event on image
-
-  useEffect(function () {
-    var img = imgRef;
-    if (!img) return undefined;
-
-    var update = function update(event) {
-      return setState(getState(img, event));
-    };
-
-    img.addEventListener('load', update);
-    img.addEventListener('error', update);
-    return function () {
-      img.removeEventListener('load', update);
-      img.removeEventListener('error', update);
-    };
-  }, [imgRef, imgRef === null || imgRef === void 0 ? void 0 : imgRef.src]);
-  return state;
-}
-
-// Calculate shift to center the focus point in the container.
-function shiftPosition(_ref) {
-  var scale = _ref.scale,
-      focusPoint = _ref.focusPoint,
-      imageSize = _ref.imageSize,
-      containerSize = _ref.containerSize;
-  var scaledSize = imageSize / scale;
-  if (scaledSize === containerSize) return 0;
-  var scaledFocusHeight = focusPoint * scaledSize;
-  var startFocus = scaledFocusHeight - containerSize / 2;
-  var shift = startFocus / (scaledSize - containerSize);
-  return Math.floor(Math.max(Math.min(shift, 1), 0) * 100);
-}
-// Compute CSS properties to apply the focus point.
-var useFocusPointStyle = function useFocusPointStyle(_ref2, element, isLoaded) {
-  var image = _ref2.image,
-      aspectRatio = _ref2.aspectRatio,
-      focusPoint = _ref2.focusPoint,
-      _ref2$imgProps = _ref2.imgProps;
-  _ref2$imgProps = _ref2$imgProps === void 0 ? {} : _ref2$imgProps;
-  var width = _ref2$imgProps.width,
-      height = _ref2$imgProps.height;
-  // Get natural image size from imgProps or img element.
-  var imageSize = useMemo(function () {
-    // Focus point is not applicable => exit early
-    if (!image || aspectRatio === AspectRatio.original || !(focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.x) && !(focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.y)) return undefined;
-    if (typeof width === 'number' && typeof height === 'number') return {
-      width: width,
-      height: height
-    };
-    if (element && isLoaded) return {
-      width: element.naturalWidth,
-      height: element.naturalHeight
-    };
-    return undefined;
-  }, [aspectRatio, element, focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.x, focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.y, height, image, isLoaded, width]); // Get container size (dependant on imageSize).
-
-  var _useState = useState(undefined),
-      _useState2 = _slicedToArray(_useState, 2),
-      containerSize = _useState2[0],
-      setContainerSize = _useState2[1];
-
-  useEffect(function updateContainerSize() {
-    var cWidth = element === null || element === void 0 ? void 0 : element.offsetWidth;
-    var cHeight = element === null || element === void 0 ? void 0 : element.offsetHeight;
-
-    if (cWidth && cHeight) {
-      // Update only if needed.
-      setContainerSize(function (oldContainerSize) {
-        return (oldContainerSize === null || oldContainerSize === void 0 ? void 0 : oldContainerSize.width) === cWidth && oldContainerSize.height === cHeight ? oldContainerSize : {
-          width: cWidth,
-          height: cHeight
-        };
-      });
-    } else if (imageSize) {
-      // Wait for a render (in case the container size is dependent on the image size).
-      requestAnimationFrame(updateContainerSize);
-    }
-  }, [element === null || element === void 0 ? void 0 : element.offsetHeight, element === null || element === void 0 ? void 0 : element.offsetWidth, imageSize]); // Compute style.
-
-  var _useState3 = useState({}),
-      _useState4 = _slicedToArray(_useState3, 2),
-      style = _useState4[0],
-      setStyle = _useState4[1];
-
-  useEffect(function () {
-    // Focus point is not applicable => exit early
-    if (!image || aspectRatio === AspectRatio.original || !(focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.x) && !(focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.y)) {
-      return;
-    }
-
-    if (!element || !imageSize) {
-      // Focus point can be computed but now right now (image size unknown).
-      setStyle({
-        visibility: 'hidden'
-      });
-      return;
-    }
-
-    if (!containerSize) {
-      // Missing container size abort focus point compute.
-      setStyle({});
-      return;
-    }
-
-    var heightScale = imageSize.height / containerSize.height;
-    var widthScale = imageSize.width / containerSize.width;
-    var scale = Math.min(widthScale, heightScale); // Focus Y relative to the top (instead of the center)
-
-    var focusPointFromTop = Math.abs(((focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.y) || 0) - 1) / 2;
-    var y = shiftPosition({
-      scale: scale,
-      focusPoint: focusPointFromTop,
-      imageSize: imageSize.height,
-      containerSize: containerSize.height
-    }); // Focus X relative to the left (instead of the center)
-
-    var focusPointFromLeft = Math.abs(((focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.x) || 0) + 1) / 2;
-    var x = shiftPosition({
-      scale: scale,
-      focusPoint: focusPointFromLeft,
-      imageSize: imageSize.width,
-      containerSize: containerSize.width
-    });
-    var objectPosition = "".concat(x, "% ").concat(y, "%"); // Update only if needed.
-
-    setStyle(function (oldStyle) {
-      return oldStyle.objectPosition === objectPosition ? oldStyle : {
-        objectPosition: objectPosition
-      };
-    });
-  }, [aspectRatio, containerSize, element, focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.x, focusPoint === null || focusPoint === void 0 ? void 0 : focusPoint.y, image, imageSize]);
-  return style;
-};
-
-/**
- * Component display name.
- */
-var COMPONENT_NAME = 'Thumbnail';
-/**
- * Component default class name and class prefix.
- */
-
-var CLASSNAME = getRootClassName(COMPONENT_NAME);
-/**
- * Component default props.
- */
-
-var DEFAULT_PROPS = {
-  fallback: mdiImageBroken,
-  loading: 'lazy',
-  theme: Theme.light
-};
-/**
- * Thumbnail component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-
-var Thumbnail = forwardRef(function (props, ref) {
-  var align = props.align,
-      alt = props.alt,
-      _props$aspectRatio = props.aspectRatio,
-      aspectRatio = _props$aspectRatio === void 0 ? AspectRatio.original : _props$aspectRatio,
-      badge = props.badge,
-      className = props.className,
-      crossOrigin = props.crossOrigin,
-      fallback = props.fallback,
-      fillHeight = props.fillHeight,
-      focusPoint = props.focusPoint,
-      image = props.image,
-      imgProps = props.imgProps,
-      propImgRef = props.imgRef,
-      isLoadingProp = props.isLoading,
-      loading = props.loading,
-      size = props.size,
-      theme = props.theme,
-      variant = props.variant,
-      linkProps = props.linkProps,
-      linkAs = props.linkAs,
-      forwardedProps = _objectWithoutProperties(props, ["align", "alt", "aspectRatio", "badge", "className", "crossOrigin", "fallback", "fillHeight", "focusPoint", "image", "imgProps", "imgRef", "isLoading", "loading", "size", "theme", "variant", "linkProps", "linkAs"]);
-
-  var _useState = useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      imgElement = _useState2[0],
-      setImgElement = _useState2[1]; // Image loading state.
-
-
-  var loadingState = useImageLoad(image, imgElement);
-  var isLoaded = loadingState === 'isLoaded';
-  var isLoading = isLoadingProp || loadingState === 'isLoading';
-  var hasError = loadingState === 'hasError'; // Focus point.
-
-  var focusPointStyle = useFocusPointStyle(props, imgElement, isLoaded);
-  var hasIconErrorFallback = hasError && typeof fallback === 'string';
-  var hasCustomErrorFallback = hasError && !hasIconErrorFallback;
-  var imageErrorStyle = {};
-
-  if (hasIconErrorFallback) {
-    // Keep the image layout on icon fallback.
-    imageErrorStyle.visibility = 'hidden';
-  } else if (hasCustomErrorFallback) {
-    // Remove the image on custom fallback.
-    imageErrorStyle.display = 'none';
-  }
-
-  var isLink = Boolean((linkProps === null || linkProps === void 0 ? void 0 : linkProps.href) || linkAs);
-  var isButton = !!forwardedProps.onClick;
-  var isClickable = isButton || isLink;
-  var Wrapper = 'div';
-
-  var wrapperProps = _objectSpread2({}, forwardedProps);
-
-  if (isLink) {
-    Wrapper = linkAs || 'a';
-    Object.assign(wrapperProps, linkProps);
-  } else if (isButton) {
-    Wrapper = 'button';
-    wrapperProps.type = forwardedProps.type || 'button';
-    wrapperProps['aria-label'] = forwardedProps['aria-label'] || alt;
-  }
-
-  return React.createElement(Wrapper, _extends({}, wrapperProps, {
-    ref: ref,
-    className: classnames(linkProps === null || linkProps === void 0 ? void 0 : linkProps.className, className, handleBasicClasses({
-      align: align,
-      aspectRatio: aspectRatio,
-      prefix: CLASSNAME,
-      size: size,
-      theme: theme,
-      variant: variant,
-      isClickable: isClickable,
-      hasError: hasError,
-      hasIconErrorFallback: hasIconErrorFallback,
-      hasCustomErrorFallback: hasCustomErrorFallback,
-      isLoading: isLoading,
-      hasBadge: !!badge
-    }), fillHeight && "".concat(CLASSNAME, "--fill-height"))
-  }), React.createElement("div", {
-    className: "".concat(CLASSNAME, "__background")
-  }, React.createElement("img", _extends({}, imgProps, {
-    style: _objectSpread2({}, imgProps === null || imgProps === void 0 ? void 0 : imgProps.style, {}, imageErrorStyle, {}, focusPointStyle),
-    ref: mergeRefs(setImgElement, propImgRef),
-    className: classnames(handleBasicClasses({
-      prefix: "".concat(CLASSNAME, "__image"),
-      isLoading: isLoading,
-      hasDefinedSize: Boolean((imgProps === null || imgProps === void 0 ? void 0 : imgProps.height) && imgProps.width)
-    }), imgProps === null || imgProps === void 0 ? void 0 : imgProps.className),
-    crossOrigin: crossOrigin,
-    src: image,
-    alt: alt,
-    loading: loading
-  })), !isLoading && hasError && React.createElement("div", {
-    className: "".concat(CLASSNAME, "__fallback")
-  }, hasIconErrorFallback ? React.createElement(Icon, {
-    icon: fallback,
-    size: Size.xxs,
-    theme: theme
-  }) : fallback)), badge && React.cloneElement(badge, {
-    className: classnames("".concat(CLASSNAME, "__badge"), badge.props.className)
-  }));
-});
-Thumbnail.displayName = COMPONENT_NAME;
-Thumbnail.className = CLASSNAME;
-Thumbnail.defaultProps = DEFAULT_PROPS;
-
-export { Thumbnail as T, useFocusPointStyle as u };
-//# sourceMappingURL=616f2912.js.map