@lumx/react 3.20.1-alpha.33 → 3.20.1-alpha.34

package/_internal/7d4eb1c5.js

@@ -0,0 +1,62 @@
+import classNames from 'classnames';
+import { forwardRef } from './bd8b3ec8.js';
+import { useTabProviderContext } from './e0398237.js';
+import './6af61e2f.js';
+import { handleBasicClasses } from '@lumx/core/js/utils/className';
+import { jsx } from 'react/jsx-runtime';
+import { CSS_PREFIX } from '@lumx/core/js/constants';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'TabPanel';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = `${CSS_PREFIX}-tab-panel`;
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {};
+
+/**
+ * TabPanel component.
+ *
+ * Implements WAI-ARIA `tabpanel` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const TabPanel = forwardRef((props, ref) => {
+  const {
+    children,
+    id,
+    className,
+    isActive: propIsActive,
+    ...forwardedProps
+  } = props;
+  const state = useTabProviderContext('tabPanel', id);
+  const isActive = propIsActive || state?.isActive;
+  return /*#__PURE__*/jsx("div", {
+    ref: ref,
+    ...forwardedProps,
+    id: state?.tabPanelId,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      isActive
+    })),
+    role: "tabpanel",
+    tabIndex: isActive ? 0 : -1,
+    "aria-labelledby": state?.tabId,
+    children: (!state?.isLazy || isActive) && children
+  });
+});
+TabPanel.displayName = COMPONENT_NAME;
+TabPanel.className = CLASSNAME;
+TabPanel.defaultProps = DEFAULT_PROPS;
+
+export { TabPanel };
+//# sourceMappingURL=7d4eb1c5.js.map

package/_internal/7d4eb1c5.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"7d4eb1c5.js","sources":["../../src/components/tabs/TabPanel.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useTabProviderContext } from '@lumx/react/components/tabs/state';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { handleBasicClasses } from '@lumx/core/js/utils/className';\n\n/**\n * Defines the props of the component.\n */\nexport interface TabPanelProps extends GenericProps {\n    /** Native id property */\n    id?: string;\n    /** Whether the tab is active or not. */\n    isActive?: boolean;\n    /** Children */\n    children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TabPanel';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = `${CSS_PREFIX}-tab-panel`;\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TabPanelProps> = {};\n\n/**\n * TabPanel component.\n *\n * Implements WAI-ARIA `tabpanel` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const TabPanel = forwardRef<TabPanelProps, HTMLDivElement>((props, ref) => {\n    const { children, id, className, isActive: propIsActive, ...forwardedProps } = props;\n\n    const state = useTabProviderContext('tabPanel', id);\n    const isActive = propIsActive || state?.isActive;\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            id={state?.tabPanelId}\n            className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, isActive }))}\n            role=\"tabpanel\"\n            tabIndex={isActive ? 0 : -1}\n            aria-labelledby={state?.tabId}\n        >\n            {(!state?.isLazy || isActive) && children}\n        </div>\n    );\n});\nTabPanel.displayName = COMPONENT_NAME;\nTabPanel.className = CLASSNAME;\nTabPanel.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","CSS_PREFIX","DEFAULT_PROPS","TabPanel","forwardRef","props","ref","children","id","className","isActive","propIsActive","forwardedProps","state","useTabProviderContext","_jsx","tabPanelId","classNames","handleBasicClasses","prefix","role","tabIndex","tabId","isLazy","displayName","defaultProps"],"mappings":";;;;;;;;AAoBA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,UAAU,CAAA;;AAEjC;AACA;AACA;AACA,MAAMC,SAAS,GAAG,CAAGC,EAAAA,UAAU,CAAY,UAAA,CAAA,CAAA;;AAE3C;AACA;AACA;AACA,MAAMC,aAAqC,GAAG,EAAE,CAAA;;AAEhD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,QAAQ,GAAGC,UAAU,CAAgC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC9E,MAAM;IAAEC,QAAQ;IAAEC,EAAE;IAAEC,SAAS;AAAEC,IAAAA,QAAQ,EAAEC,YAAY;IAAE,GAAGC,cAAAA;AAAe,GAAC,GAAGP,KAAK,CAAA;AAEpF,EAAA,MAAMQ,KAAK,GAAGC,qBAAqB,CAAC,UAAU,EAAEN,EAAE,CAAC,CAAA;AACnD,EAAA,MAAME,QAAQ,GAAGC,YAAY,IAAIE,KAAK,EAAEH,QAAQ,CAAA;AAEhD,EAAA,oBACIK,GAAA,CAAA,KAAA,EAAA;AACIT,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLM,cAAc;IAClBJ,EAAE,EAAEK,KAAK,EAAEG,UAAW;AACtBP,IAAAA,SAAS,EAAEQ,UAAU,CAACR,SAAS,EAAES,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEnB,SAAS;AAAEU,MAAAA,QAAAA;AAAS,KAAC,CAAC,CAAE;AACtFU,IAAAA,IAAI,EAAC,UAAU;AACfC,IAAAA,QAAQ,EAAEX,QAAQ,GAAG,CAAC,GAAG,CAAC,CAAE;IAC5B,iBAAiBG,EAAAA,KAAK,EAAES,KAAM;IAAAf,QAAA,EAE7B,CAAC,CAACM,KAAK,EAAEU,MAAM,IAAIb,QAAQ,KAAKH,QAAAA;AAAQ,GACxC,CAAC,CAAA;AAEd,CAAC,EAAC;AACFJ,QAAQ,CAACqB,WAAW,GAAGzB,cAAc,CAAA;AACrCI,QAAQ,CAACM,SAAS,GAAGT,SAAS,CAAA;AAC9BG,QAAQ,CAACsB,YAAY,GAAGvB,aAAa;;;;"}

package/_internal/7d9c0855.js

@@ -0,0 +1,55 @@
+import { useState } from 'react';
+
+const INITIAL_STATE_ACTIVE_CHIP = -1;
+
+/**
+ * Hook that provides the necessary information to manage chips navigation.
+ * @param chips             List of chips selected.
+ * @param onChipDeleted     Callback executed when a chip must be eliminated.
+ * @param initialActiveChip Initial active chip index.
+ *
+ * @return chip navigation tools.
+ */
+const useChipGroupNavigation = (chips, onChipDeleted, initialActiveChip = INITIAL_STATE_ACTIVE_CHIP) => {
+  const [wasBackspacePressed, setWasBackspacePressed] = useState(false);
+  const [activeChip, setActiveChip] = useState(initialActiveChip);
+
+  /**
+   * Resets the active index and backspace control to their initial state
+   */
+  const resetChipNavigation = () => {
+    setWasBackspacePressed(false);
+    setActiveChip(initialActiveChip);
+  };
+
+  /**
+   * Callback to be executed when the backspace was pressed. If there are no chips
+   * selected, it will return immediately. If there are it will check if the
+   * backspace was already pressed. if it was, it means that the user wants to eliminate
+   * the chip, so we execute the `onChipDeleted` function and reset internal state.
+   *
+   * If it was not pressed before, we set the `wasBackspacePressed` flag to true and
+   * highlight the last chip.
+   */
+  const onBackspacePressed = () => {
+    if (chips.length === 0) {
+      return;
+    }
+    if (wasBackspacePressed) {
+      const chipDeleted = chips[chips.length - 1];
+      onChipDeleted(chipDeleted);
+      resetChipNavigation();
+    } else {
+      setActiveChip(chips.length - 1);
+      setWasBackspacePressed(true);
+    }
+  };
+  return {
+    activeChip,
+    onBackspacePressed,
+    resetChipNavigation
+  };
+};
+
+export { useChipGroupNavigation };
+//# sourceMappingURL=7d9c0855.js.map

package/_internal/7d9c0855.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"7d9c0855.js","sources":["../../src/hooks/useChipGroupNavigation.tsx"],"sourcesContent":["import { useState } from 'react';\n\ninterface UseChipGroupNavigation {\n    /** the current active chip index */\n    activeChip: number;\n\n    /** callback to be executed when the backspace was pressed */\n    onBackspacePressed(): void;\n\n    /** function that allows to reset the navigation */\n    resetChipNavigation(): void;\n}\n\nexport type useChipGroupNavigationType<C = any> = (\n    chips: C[],\n    onChipDeleted: (chip: C) => void,\n    initialActiveChip?: number,\n) => UseChipGroupNavigation;\n\nconst INITIAL_STATE_ACTIVE_CHIP = -1;\n\n/**\n * Hook that provides the necessary information to manage chips navigation.\n * @param chips             List of chips selected.\n * @param onChipDeleted     Callback executed when a chip must be eliminated.\n * @param initialActiveChip Initial active chip index.\n *\n * @return chip navigation tools.\n */\nexport const useChipGroupNavigation: useChipGroupNavigationType = (\n    chips,\n    onChipDeleted,\n    initialActiveChip = INITIAL_STATE_ACTIVE_CHIP,\n) => {\n    const [wasBackspacePressed, setWasBackspacePressed] = useState(false);\n    const [activeChip, setActiveChip] = useState(initialActiveChip);\n\n    /**\n     * Resets the active index and backspace control to their initial state\n     */\n    const resetChipNavigation = () => {\n        setWasBackspacePressed(false);\n        setActiveChip(initialActiveChip);\n    };\n\n    /**\n     * Callback to be executed when the backspace was pressed. If there are no chips\n     * selected, it will return immediately. If there are it will check if the\n     * backspace was already pressed. if it was, it means that the user wants to eliminate\n     * the chip, so we execute the `onChipDeleted` function and reset internal state.\n     *\n     * If it was not pressed before, we set the `wasBackspacePressed` flag to true and\n     * highlight the last chip.\n     */\n    const onBackspacePressed = () => {\n        if (chips.length === 0) {\n            return;\n        }\n\n        if (wasBackspacePressed) {\n            const chipDeleted: any = chips[chips.length - 1];\n            onChipDeleted(chipDeleted);\n            resetChipNavigation();\n        } else {\n            setActiveChip(chips.length - 1);\n            setWasBackspacePressed(true);\n        }\n    };\n\n    return {\n        activeChip,\n        onBackspacePressed,\n        resetChipNavigation,\n    };\n};\n"],"names":["INITIAL_STATE_ACTIVE_CHIP","useChipGroupNavigation","chips","onChipDeleted","initialActiveChip","wasBackspacePressed","setWasBackspacePressed","useState","activeChip","setActiveChip","resetChipNavigation","onBackspacePressed","length","chipDeleted"],"mappings":";;AAmBA,MAAMA,yBAAyB,GAAG,CAAC,CAAC,CAAA;;AAEpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,sBAAkD,GAAGA,CAC9DC,KAAK,EACLC,aAAa,EACbC,iBAAiB,GAAGJ,yBAAyB,KAC5C;EACD,MAAM,CAACK,mBAAmB,EAAEC,sBAAsB,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC,CAAA;EACrE,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGF,QAAQ,CAACH,iBAAiB,CAAC,CAAA;;AAE/D;AACJ;AACA;EACI,MAAMM,mBAAmB,GAAGA,MAAM;IAC9BJ,sBAAsB,CAAC,KAAK,CAAC,CAAA;IAC7BG,aAAa,CAACL,iBAAiB,CAAC,CAAA;GACnC,CAAA;;AAED;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACI,MAAMO,kBAAkB,GAAGA,MAAM;AAC7B,IAAA,IAAIT,KAAK,CAACU,MAAM,KAAK,CAAC,EAAE;AACpB,MAAA,OAAA;AACJ,KAAA;AAEA,IAAA,IAAIP,mBAAmB,EAAE;MACrB,MAAMQ,WAAgB,GAAGX,KAAK,CAACA,KAAK,CAACU,MAAM,GAAG,CAAC,CAAC,CAAA;MAChDT,aAAa,CAACU,WAAW,CAAC,CAAA;AAC1BH,MAAAA,mBAAmB,EAAE,CAAA;AACzB,KAAC,MAAM;AACHD,MAAAA,aAAa,CAACP,KAAK,CAACU,MAAM,GAAG,CAAC,CAAC,CAAA;MAC/BN,sBAAsB,CAAC,IAAI,CAAC,CAAA;AAChC,KAAA;GACH,CAAA;EAED,OAAO;IACHE,UAAU;IACVG,kBAAkB;AAClBD,IAAAA,mBAAAA;GACH,CAAA;AACL;;;;"}

package/_internal/7eca7fcd.js

@@ -0,0 +1,28 @@
+/**
+ * Parse locale code
+ * @example
+ *   parseLocale('EN') // => { code: 'en', language: 'en' }
+ *   parseLocale('en_us') // => { code: 'en-US', language: 'en', region: 'US' }
+ *   parseLocale('EN-US') // => { code: 'en-US', language: 'en', region: 'US' }
+ */
+function parseLocale(locale) {
+  const [rawLanguage, rawRegion] = locale.split(/[-_]/);
+  if (!rawLanguage) {
+    return undefined;
+  }
+  const language = rawLanguage.toLowerCase();
+  let region;
+  let code = language;
+  if (rawRegion) {
+    region = rawRegion.toUpperCase();
+    code += `-${region}`;
+  }
+  return {
+    code,
+    region,
+    language
+  };
+}
+
+export { parseLocale };
+//# sourceMappingURL=7eca7fcd.js.map

package/_internal/7eca7fcd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"7eca7fcd.js","sources":["../../src/utils/locale/parseLocale.ts"],"sourcesContent":["import { Locale } from '@lumx/react/utils/locale/types';\n\n/**\n * Parse locale code\n * @example\n *   parseLocale('EN') // => { code: 'en', language: 'en' }\n *   parseLocale('en_us') // => { code: 'en-US', language: 'en', region: 'US' }\n *   parseLocale('EN-US') // => { code: 'en-US', language: 'en', region: 'US' }\n */\nexport function parseLocale(locale: string): Locale | undefined {\n    const [rawLanguage, rawRegion] = locale.split(/[-_]/);\n    if (!rawLanguage) {\n        return undefined;\n    }\n    const language = rawLanguage.toLowerCase();\n    let region: string | undefined;\n    let code = language;\n    if (rawRegion) {\n        region = rawRegion.toUpperCase();\n        code += `-${region}`;\n    }\n    return { code, region, language };\n}\n"],"names":["parseLocale","locale","rawLanguage","rawRegion","split","undefined","language","toLowerCase","region","code","toUpperCase"],"mappings":"AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,WAAWA,CAACC,MAAc,EAAsB;EAC5D,MAAM,CAACC,WAAW,EAAEC,SAAS,CAAC,GAAGF,MAAM,CAACG,KAAK,CAAC,MAAM,CAAC,CAAA;EACrD,IAAI,CAACF,WAAW,EAAE;AACd,IAAA,OAAOG,SAAS,CAAA;AACpB,GAAA;AACA,EAAA,MAAMC,QAAQ,GAAGJ,WAAW,CAACK,WAAW,EAAE,CAAA;AAC1C,EAAA,IAAIC,MAA0B,CAAA;EAC9B,IAAIC,IAAI,GAAGH,QAAQ,CAAA;AACnB,EAAA,IAAIH,SAAS,EAAE;AACXK,IAAAA,MAAM,GAAGL,SAAS,CAACO,WAAW,EAAE,CAAA;IAChCD,IAAI,IAAI,CAAID,CAAAA,EAAAA,MAAM,CAAE,CAAA,CAAA;AACxB,GAAA;EACA,OAAO;IAAEC,IAAI;IAAED,MAAM;AAAEF,IAAAA,QAAAA;GAAU,CAAA;AACrC;;;;"}

package/_internal/81a6a29a.js

@@ -0,0 +1,55 @@
+import React__default from 'react';
+import classNames from 'classnames';
+import { mergeRefs } from './27df0cb6.js';
+import { getRootClassName } from '@lumx/core/js/utils/className';
+import { forwardRef } from './bd8b3ec8.js';
+import { useSlideFocusManagement } from './730f75dc.js';
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'SlideshowItemGroup';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+const buildSlideShowGroupId = (slidesId, index) => `${slidesId}-slide-${index}`;
+
+/**
+ * SlideshowItemGroup component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const SlideshowItemGroup = forwardRef((props, ref) => {
+  const {
+    className,
+    children,
+    role = 'group',
+    label,
+    isDisplayed,
+    ...forwardedProps
+  } = props;
+  const groupRef = React__default.useRef(null);
+  useSlideFocusManagement({
+    isSlideDisplayed: isDisplayed,
+    slideRef: groupRef
+  });
+  return /*#__PURE__*/jsx("div", {
+    ref: mergeRefs(groupRef, ref),
+    role: role,
+    className: classNames(className, CLASSNAME),
+    "aria-roledescription": "slide",
+    "aria-label": label,
+    ...forwardedProps,
+    children: children
+  });
+});
+SlideshowItemGroup.displayName = COMPONENT_NAME;
+SlideshowItemGroup.className = CLASSNAME;
+
+export { CLASSNAME, SlideshowItemGroup, buildSlideShowGroupId };
+//# sourceMappingURL=81a6a29a.js.map

package/_internal/81a6a29a.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"81a6a29a.js","sources":["../../src/components/slideshow/SlideshowItemGroup.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\nimport { mergeRefs } from '@lumx/react/utils/react/mergeRefs';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useSlideFocusManagement } from './useSlideFocusManagement';\n\n/**\n * Defines the props of the component.\n */\nexport interface SlideshowItemGroupProps extends GenericProps {\n    role?: 'tabpanel' | 'group';\n    label?: string;\n    isDisplayed?: boolean;\n    children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SlideshowItemGroup';\n\n/**\n * Component default class name and class prefix.\n */\nexport const CLASSNAME = getRootClassName(COMPONENT_NAME);\n\nexport const buildSlideShowGroupId = (slidesId: string, index: number) => `${slidesId}-slide-${index}`;\n\n/**\n * SlideshowItemGroup component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const SlideshowItemGroup = forwardRef<SlideshowItemGroupProps, HTMLDivElement>((props, ref) => {\n    const { className, children, role = 'group', label, isDisplayed, ...forwardedProps } = props;\n    const groupRef = React.useRef<HTMLDivElement>(null);\n\n    useSlideFocusManagement({ isSlideDisplayed: isDisplayed, slideRef: groupRef });\n\n    return (\n        <div\n            ref={mergeRefs(groupRef, ref)}\n            role={role}\n            className={classNames(className, CLASSNAME)}\n            aria-roledescription=\"slide\"\n            aria-label={label}\n            {...forwardedProps}\n        >\n            {children}\n        </div>\n    );\n});\n\nSlideshowItemGroup.displayName = COMPONENT_NAME;\nSlideshowItemGroup.className = CLASSNAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","buildSlideShowGroupId","slidesId","index","SlideshowItemGroup","forwardRef","props","ref","className","children","role","label","isDisplayed","forwardedProps","groupRef","React","useRef","useSlideFocusManagement","isSlideDisplayed","slideRef","_jsx","mergeRefs","classNames","displayName"],"mappings":";;;;;;;;AAmBA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,oBAAoB,CAAA;;AAE3C;AACA;AACA;MACaC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,EAAC;AAE5CG,MAAAA,qBAAqB,GAAGA,CAACC,QAAgB,EAAEC,KAAa,KAAK,CAAGD,EAAAA,QAAQ,CAAUC,OAAAA,EAAAA,KAAK,CAAE,EAAA;;AAEtG;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,kBAAkB,GAAGC,UAAU,CAA0C,CAACC,KAAK,EAAEC,GAAG,KAAK;EAClG,MAAM;IAAEC,SAAS;IAAEC,QAAQ;AAAEC,IAAAA,IAAI,GAAG,OAAO;IAAEC,KAAK;IAAEC,WAAW;IAAE,GAAGC,cAAAA;AAAe,GAAC,GAAGP,KAAK,CAAA;AAC5F,EAAA,MAAMQ,QAAQ,GAAGC,cAAK,CAACC,MAAM,CAAiB,IAAI,CAAC,CAAA;AAEnDC,EAAAA,uBAAuB,CAAC;AAAEC,IAAAA,gBAAgB,EAAEN,WAAW;AAAEO,IAAAA,QAAQ,EAAEL,QAAAA;AAAS,GAAC,CAAC,CAAA;AAE9E,EAAA,oBACIM,GAAA,CAAA,KAAA,EAAA;AACIb,IAAAA,GAAG,EAAEc,SAAS,CAACP,QAAQ,EAAEP,GAAG,CAAE;AAC9BG,IAAAA,IAAI,EAAEA,IAAK;AACXF,IAAAA,SAAS,EAAEc,UAAU,CAACd,SAAS,EAAET,SAAS,CAAE;AAC5C,IAAA,sBAAA,EAAqB,OAAO;AAC5B,IAAA,YAAA,EAAYY,KAAM;AAAA,IAAA,GACdE,cAAc;AAAAJ,IAAAA,QAAA,EAEjBA,QAAAA;AAAQ,GACR,CAAC,CAAA;AAEd,CAAC,EAAC;AAEFL,kBAAkB,CAACmB,WAAW,GAAGzB,cAAc,CAAA;AAC/CM,kBAAkB,CAACI,SAAS,GAAGT,SAAS;;;;"}

package/_internal/82159c03.js

@@ -0,0 +1,146 @@
+import React__default from 'react';
+import classNames from 'classnames';
+import isEmpty from 'lodash/isEmpty';
+import set from 'lodash/set';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { forwardRef } from './bd8b3ec8.js';
+import { useTheme } from './d8ee966d.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Orientation, Size, Theme, ColorPalette } from '@lumx/core/js/constants';
+import { Avatar } from './ffb2f7fa.js';
+import { Link } from './69eb2393.js';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'UserBlock';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {
+  orientation: Orientation.horizontal,
+  size: Size.m
+};
+
+/**
+ * UserBlock component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const UserBlock = forwardRef((props, ref) => {
+  const defaultTheme = useTheme() || Theme.light;
+  const {
+    avatarProps,
+    className,
+    fields,
+    linkProps,
+    linkAs,
+    multipleActions,
+    name,
+    nameProps,
+    onClick,
+    onMouseEnter,
+    onMouseLeave,
+    orientation = DEFAULT_PROPS.orientation,
+    simpleAction,
+    size = DEFAULT_PROPS.size,
+    theme = defaultTheme,
+    children,
+    additionalFields,
+    after,
+    ...forwardedProps
+  } = props;
+  let componentSize = size;
+
+  // Special case - When using vertical orientation force the size to be Sizes.l.
+  if (orientation === Orientation.vertical) {
+    componentSize = Size.l;
+  }
+  const shouldDisplayActions = orientation === Orientation.vertical;
+  const isLink = Boolean(linkProps?.href || linkAs);
+  const isClickable = !!onClick || isLink;
+  const nameBlock = React__default.useMemo(() => {
+    if (isEmpty(name)) {
+      return null;
+    }
+    let NameComponent = 'span';
+    const nProps = {
+      ...nameProps,
+      className: classNames(`${CLASSNAME}__name`, linkProps?.className, nameProps?.className)
+    };
+    if (isClickable) {
+      NameComponent = Link;
+      Object.assign(nProps, {
+        ...linkProps,
+        onClick,
+        linkAs,
+        color: ColorPalette.dark
+      });
+    }
+    // Disable avatar focus since the name block is the same link / same button.
+    if (avatarProps) {
+      set(avatarProps, ['thumbnailProps', 'tabIndex'], -1);
+    }
+    return /*#__PURE__*/jsx(NameComponent, {
+      ...nProps,
+      children: name
+    });
+  }, [avatarProps, isClickable, linkAs, linkProps, name, nameProps, onClick]);
+  const shouldDisplayFields = componentSize !== Size.s && componentSize !== Size.xs;
+  const fieldsBlock = fields && shouldDisplayFields && /*#__PURE__*/jsx("div", {
+    className: `${CLASSNAME}__fields`,
+    children: fields.map((field, idx) => /*#__PURE__*/jsx("span", {
+      className: `${CLASSNAME}__field`,
+      children: field
+    }, idx))
+  });
+  return /*#__PURE__*/jsxs("div", {
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      orientation,
+      size: componentSize,
+      theme,
+      isClickable
+    })),
+    onMouseLeave: onMouseLeave,
+    onMouseEnter: onMouseEnter,
+    children: [avatarProps && /*#__PURE__*/jsx(Avatar, {
+      linkAs: linkAs,
+      linkProps: linkProps,
+      alt: "",
+      ...avatarProps,
+      className: classNames(`${CLASSNAME}__avatar`, avatarProps.className),
+      size: componentSize,
+      onClick: onClick,
+      theme: theme
+    }), (fields || name || children || additionalFields) && /*#__PURE__*/jsxs("div", {
+      className: `${CLASSNAME}__wrapper`,
+      children: [children || nameBlock, fieldsBlock, shouldDisplayFields ? additionalFields : null]
+    }), shouldDisplayActions && simpleAction && /*#__PURE__*/jsx("div", {
+      className: `${CLASSNAME}__action`,
+      children: simpleAction
+    }), shouldDisplayActions && multipleActions && /*#__PURE__*/jsx("div", {
+      className: `${CLASSNAME}__actions`,
+      children: multipleActions
+    }), after ? /*#__PURE__*/jsx("div", {
+      className: `${CLASSNAME}__after`,
+      children: after
+    }) : null]
+  });
+});
+UserBlock.displayName = COMPONENT_NAME;
+UserBlock.className = CLASSNAME;
+UserBlock.defaultProps = DEFAULT_PROPS;
+
+export { UserBlock };
+//# sourceMappingURL=82159c03.js.map

package/_internal/82159c03.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"82159c03.js","sources":["../../src/components/user-block/UserBlock.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isEmpty from 'lodash/isEmpty';\nimport set from 'lodash/set';\n\nimport { Avatar, ColorPalette, Link, Orientation, Size, Theme } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { AvatarProps } from '../avatar/Avatar';\n\n/**\n * User block sizes.\n */\nexport type UserBlockSize = Extract<Size, 'xs' | 's' | 'm' | 'l'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface UserBlockProps extends GenericProps, HasTheme {\n    /** Props to pass to the avatar. */\n    avatarProps?: Omit<AvatarProps, 'alt'>;\n    /** Additional fields used to describe the user. */\n    fields?: string[];\n    /** Props to pass to the link wrapping the avatar thumbnail. */\n    linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n    /** Custom react component for the link (can be used to inject react router Link). */\n    linkAs?: 'a' | any;\n    /** Multiple action toolbar content. */\n    multipleActions?: ReactNode;\n    /** User name. */\n    name?: React.ReactNode;\n    /** Props to pass to the name block. */\n    nameProps?: GenericProps;\n    /** Orientation. */\n    orientation?: Orientation;\n    /** Simple action toolbar content. */\n    simpleAction?: ReactNode;\n    /** Size variant. */\n    size?: UserBlockSize;\n    /** On click callback. */\n    onClick?(): void;\n    /** On mouse enter callback. */\n    onMouseEnter?(): void;\n    /** On mouse leave callback. */\n    onMouseLeave?(): void;\n    /** Display additional fields below the original name and fields */\n    additionalFields?: React.ReactNode;\n    /** Display an additional element after the entire component. (to the right if orientation is horizontal, at the bottom if orientation is vertical) */\n    after?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'UserBlock';\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<UserBlockProps> = {\n    orientation: Orientation.horizontal,\n    size: Size.m,\n};\n\n/**\n * UserBlock component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const UserBlock = forwardRef<UserBlockProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        avatarProps,\n        className,\n        fields,\n        linkProps,\n        linkAs,\n        multipleActions,\n        name,\n        nameProps,\n        onClick,\n        onMouseEnter,\n        onMouseLeave,\n        orientation = DEFAULT_PROPS.orientation,\n        simpleAction,\n        size = DEFAULT_PROPS.size,\n        theme = defaultTheme,\n        children,\n        additionalFields,\n        after,\n        ...forwardedProps\n    } = props;\n    let componentSize = size;\n\n    // Special case - When using vertical orientation force the size to be Sizes.l.\n    if (orientation === Orientation.vertical) {\n        componentSize = Size.l;\n    }\n\n    const shouldDisplayActions: boolean = orientation === Orientation.vertical;\n\n    const isLink = Boolean(linkProps?.href || linkAs);\n    const isClickable = !!onClick || isLink;\n\n    const nameBlock: ReactNode = React.useMemo(() => {\n        if (isEmpty(name)) {\n            return null;\n        }\n        let NameComponent: any = 'span';\n        const nProps: any = {\n            ...nameProps,\n            className: classNames(`${CLASSNAME}__name`, linkProps?.className, nameProps?.className),\n        };\n        if (isClickable) {\n            NameComponent = Link;\n            Object.assign(nProps, {\n                ...linkProps,\n                onClick,\n                linkAs,\n                color: ColorPalette.dark,\n            });\n        }\n        // Disable avatar focus since the name block is the same link / same button.\n        if (avatarProps) {\n            set(avatarProps, ['thumbnailProps', 'tabIndex'], -1);\n        }\n        return <NameComponent {...nProps}>{name}</NameComponent>;\n    }, [avatarProps, isClickable, linkAs, linkProps, name, nameProps, onClick]);\n\n    const shouldDisplayFields = componentSize !== Size.s && componentSize !== Size.xs;\n\n    const fieldsBlock: ReactNode = fields && shouldDisplayFields && (\n        <div className={`${CLASSNAME}__fields`}>\n            {fields.map((field: string, idx: number) => (\n                <span key={idx} className={`${CLASSNAME}__field`}>\n                    {field}\n                </span>\n            ))}\n        </div>\n    );\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(\n                className,\n                handleBasicClasses({ prefix: CLASSNAME, orientation, size: componentSize, theme, isClickable }),\n            )}\n            onMouseLeave={onMouseLeave}\n            onMouseEnter={onMouseEnter}\n        >\n            {avatarProps && (\n                <Avatar\n                    linkAs={linkAs}\n                    linkProps={linkProps}\n                    alt=\"\"\n                    {...(avatarProps as any)}\n                    className={classNames(`${CLASSNAME}__avatar`, avatarProps.className)}\n                    size={componentSize}\n                    onClick={onClick}\n                    theme={theme}\n                />\n            )}\n            {(fields || name || children || additionalFields) && (\n                <div className={`${CLASSNAME}__wrapper`}>\n                    {children || nameBlock}\n                    {fieldsBlock}\n                    {shouldDisplayFields ? additionalFields : null}\n                </div>\n            )}\n            {shouldDisplayActions && simpleAction && <div className={`${CLASSNAME}__action`}>{simpleAction}</div>}\n            {shouldDisplayActions && multipleActions && (\n                <div className={`${CLASSNAME}__actions`}>{multipleActions}</div>\n            )}\n            {after ? <div className={`${CLASSNAME}__after`}>{after}</div> : null}\n        </div>\n    );\n});\nUserBlock.displayName = COMPONENT_NAME;\nUserBlock.className = CLASSNAME;\nUserBlock.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","orientation","Orientation","horizontal","size","Size","m","UserBlock","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","avatarProps","className","fields","linkProps","linkAs","multipleActions","name","nameProps","onClick","onMouseEnter","onMouseLeave","simpleAction","theme","children","additionalFields","after","forwardedProps","componentSize","vertical","l","shouldDisplayActions","isLink","Boolean","href","isClickable","nameBlock","React","useMemo","isEmpty","NameComponent","nProps","classNames","Link","Object","assign","color","ColorPalette","dark","set","_jsx","shouldDisplayFields","s","xs","fieldsBlock","map","field","idx","_jsxs","handleBasicClasses","prefix","Avatar","alt","displayName","defaultProps"],"mappings":"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"}

package/_internal/82c6852b.js

@@ -0,0 +1,19 @@
+import { Typography } from '@lumx/core/js/constants';
+
+/** The maximum authorized heading level. */
+const MAX_HEADING_LEVEL = 6;
+
+/**
+ * Typography to use by default depending on the heading level.
+ */
+const DEFAULT_TYPOGRAPHY_BY_LEVEL = {
+  h1: Typography.display1,
+  h2: Typography.headline,
+  h3: Typography.title,
+  h4: Typography.subtitle2,
+  h5: Typography.subtitle1,
+  h6: Typography.body2
+};
+
+export { DEFAULT_TYPOGRAPHY_BY_LEVEL, MAX_HEADING_LEVEL };
+//# sourceMappingURL=82c6852b.js.map

package/_internal/82c6852b.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"82c6852b.js","sources":["../../src/components/heading/constants.ts"],"sourcesContent":["import { Typography } from '@lumx/core/js/constants';\n\n/** The maximum authorized heading level. */\nexport const MAX_HEADING_LEVEL = 6;\n\n/**\n * Typography to use by default depending on the heading level.\n */\nexport const DEFAULT_TYPOGRAPHY_BY_LEVEL = {\n    h1: Typography.display1,\n    h2: Typography.headline,\n    h3: Typography.title,\n    h4: Typography.subtitle2,\n    h5: Typography.subtitle1,\n    h6: Typography.body2,\n};\n"],"names":["MAX_HEADING_LEVEL","DEFAULT_TYPOGRAPHY_BY_LEVEL","h1","Typography","display1","h2","headline","h3","title","h4","subtitle2","h5","subtitle1","h6","body2"],"mappings":";;AAEA;AACO,MAAMA,iBAAiB,GAAG,EAAC;;AAElC;AACA;AACA;AACO,MAAMC,2BAA2B,GAAG;EACvCC,EAAE,EAAEC,UAAU,CAACC,QAAQ;EACvBC,EAAE,EAAEF,UAAU,CAACG,QAAQ;EACvBC,EAAE,EAAEJ,UAAU,CAACK,KAAK;EACpBC,EAAE,EAAEN,UAAU,CAACO,SAAS;EACxBC,EAAE,EAAER,UAAU,CAACS,SAAS;EACxBC,EAAE,EAAEV,UAAU,CAACW,KAAAA;AACnB;;;;"}

package/_internal/840e9690.js

@@ -0,0 +1,52 @@
+import classNames from 'classnames';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { useTheme } from './d8ee966d.js';
+import { forwardRef } from './bd8b3ec8.js';
+import { jsx } from 'react/jsx-runtime';
+import { mdiDragVertical } from './c72d4f8b.js';
+import { Icon } from './595d0e66.js';
+import { Theme, ColorPalette, Size } from '@lumx/core/js/constants';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'DragHandle';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * DragHandle component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const DragHandle = forwardRef((props, ref) => {
+  const defaultTheme = useTheme();
+  const {
+    className,
+    theme = defaultTheme,
+    ...forwardedProps
+  } = props;
+  return /*#__PURE__*/jsx("div", {
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      theme
+    })),
+    children: /*#__PURE__*/jsx(Icon, {
+      icon: mdiDragVertical,
+      color: theme === Theme.dark ? ColorPalette.light : ColorPalette.dark,
+      size: Size.xs
+    })
+  });
+});
+DragHandle.displayName = COMPONENT_NAME;
+DragHandle.className = CLASSNAME;
+
+export { DragHandle };
+//# sourceMappingURL=840e9690.js.map

package/_internal/840e9690.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"840e9690.js","sources":["../../src/components/drag-handle/DragHandle.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { mdiDragVertical } from '@lumx/icons';\nimport { ColorPalette, Icon, Size, Theme } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface DragHandleProps extends GenericProps, HasTheme {}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'DragHandle';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * DragHandle component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const DragHandle = forwardRef<DragHandleProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme();\n    const { className, theme = defaultTheme, ...forwardedProps } = props;\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, theme }))}\n        >\n            <Icon\n                icon={mdiDragVertical}\n                color={theme === Theme.dark ? ColorPalette.light : ColorPalette.dark}\n                size={Size.xs}\n            />\n        </div>\n    );\n});\nDragHandle.displayName = COMPONENT_NAME;\nDragHandle.className = CLASSNAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DragHandle","forwardRef","props","ref","defaultTheme","useTheme","className","theme","forwardedProps","_jsx","classNames","handleBasicClasses","prefix","children","Icon","icon","mdiDragVertical","color","Theme","dark","ColorPalette","light","size","Size","xs","displayName"],"mappings":";;;;;;;;;AAcA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,YAAY,CAAA;;AAEnC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMG,UAAU,GAAGC,UAAU,CAAkC,CAACC,KAAK,EAAEC,GAAG,KAAK;AAClF,EAAA,MAAMC,YAAY,GAAGC,QAAQ,EAAE,CAAA;EAC/B,MAAM;IAAEC,SAAS;AAAEC,IAAAA,KAAK,GAAGH,YAAY;IAAE,GAAGI,cAAAA;AAAe,GAAC,GAAGN,KAAK,CAAA;AAEpE,EAAA,oBACIO,GAAA,CAAA,KAAA,EAAA;AACIN,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLK,cAAc;AAClBF,IAAAA,SAAS,EAAEI,UAAU,CAACJ,SAAS,EAAEK,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEd,SAAS;AAAES,MAAAA,KAAAA;AAAM,KAAC,CAAC,CAAE;IAAAM,QAAA,eAEnFJ,GAAA,CAACK,IAAI,EAAA;AACDC,MAAAA,IAAI,EAAEC,eAAgB;AACtBC,MAAAA,KAAK,EAAEV,KAAK,KAAKW,KAAK,CAACC,IAAI,GAAGC,YAAY,CAACC,KAAK,GAAGD,YAAY,CAACD,IAAK;MACrEG,IAAI,EAAEC,IAAI,CAACC,EAAAA;KACd,CAAA;AAAC,GACD,CAAC,CAAA;AAEd,CAAC,EAAC;AACFxB,UAAU,CAACyB,WAAW,GAAG5B,cAAc,CAAA;AACvCG,UAAU,CAACM,SAAS,GAAGR,SAAS;;;;"}

package/_internal/841c2303.js

@@ -0,0 +1,19 @@
+import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+const DEFAULT_VALUE = {};
+
+/**
+ * Tooltip react context simply used as a marker to know when parent react node have a tooltip
+ */
+const TooltipContext = /*#__PURE__*/React__default.createContext(undefined);
+const TooltipContextProvider = ({
+  children
+}) => /*#__PURE__*/jsx(TooltipContext.Provider, {
+  value: DEFAULT_VALUE,
+  children: children
+});
+const useTooltipContext = () => React__default.useContext(TooltipContext);
+
+export { TooltipContextProvider, useTooltipContext };
+//# sourceMappingURL=841c2303.js.map

package/_internal/841c2303.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"841c2303.js","sources":["../../src/components/tooltip/context.tsx"],"sourcesContent":["import React from 'react';\n\n/** Empty object */\ntype TooltipContextValue = NonNullable<unknown>;\n\nconst DEFAULT_VALUE = {};\n\n/**\n * Tooltip react context simply used as a marker to know when parent react node have a tooltip\n */\nconst TooltipContext = React.createContext<TooltipContextValue | undefined>(undefined);\n\nexport const TooltipContextProvider: React.FC<{ children?: React.ReactNode }> = ({ children }) => (\n    <TooltipContext.Provider value={DEFAULT_VALUE}>{children}</TooltipContext.Provider>\n);\n\nexport const useTooltipContext = () => React.useContext(TooltipContext);\n"],"names":["DEFAULT_VALUE","TooltipContext","React","createContext","undefined","TooltipContextProvider","children","_jsx","Provider","value","useTooltipContext","useContext"],"mappings":";;;AAKA,MAAMA,aAAa,GAAG,EAAE,CAAA;;AAExB;AACA;AACA;AACA,MAAMC,cAAc,gBAAGC,cAAK,CAACC,aAAa,CAAkCC,SAAS,CAAC,CAAA;AAE/E,MAAMC,sBAAgE,GAAGA,CAAC;AAAEC,EAAAA,QAAAA;AAAS,CAAC,kBACzFC,GAAA,CAACN,cAAc,CAACO,QAAQ,EAAA;AAACC,EAAAA,KAAK,EAAET,aAAc;AAAAM,EAAAA,QAAA,EAAEA,QAAAA;AAAQ,CAA0B,EACrF;AAEM,MAAMI,iBAAiB,GAAGA,MAAMR,cAAK,CAACS,UAAU,CAACV,cAAc;;;;"}