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

package/_internal/{components/side-navigation-385825d4.js → packages/lumx-react/src/components/side-navigation/SideNavigationItem-2de35ba7.js}

@@ -1,53 +1,17 @@
 import { Children } from 'react';
 import classNames from 'classnames';
-import { i as isComponent } from '../isComponent-78df9309.js';
-import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
-import { u as useTheme } from '../ThemeContext-3181f000.js';
-import { f as forwardRef } from '../forwardRef-8bce732e.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
 import isEmpty from 'lodash/isEmpty';
-import { u as useId } from '../useId-3a1facc0.js';
-import { R as RawClickable } from '../RawClickable-2c2b6a89.js';
-import { Theme, Emphasis, Size } from '@lumx/core/js/constants';
-import { I as Icon } from '../index-d3e86bd8.js';
-import { I as IconButton } from '../IconButton-e11b5e74.js';
-import { m as mdiChevronUp, a as mdiChevronDown } from '../chevron-up-0b9c76cb.js';
-
-/**
- * Component display name.
- */
-const COMPONENT_NAME$1 = 'SideNavigation';
-
-/**
- * Component default class name and class prefix.
- */
-const CLASSNAME$1 = getRootClassName(COMPONENT_NAME$1);
-
-/**
- * SideNavigation component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-const SideNavigation = forwardRef((props, ref) => {
-  const defaultTheme = useTheme();
-  const {
-    children,
-    className,
-    theme = defaultTheme,
-    ...forwardedProps
-  } = props;
-  const content = Children.toArray(children).filter(isComponent(SideNavigationItem));
-  return /*#__PURE__*/jsx("ul", {
-    ref: ref,
-    ...forwardedProps,
-    className: classNames(className, theme === Theme.dark && 'lumx-color-font-light-N', CLASSNAME$1),
-    children: content
-  });
-});
-SideNavigation.displayName = COMPONENT_NAME$1;
-SideNavigation.className = CLASSNAME$1;
+import { isComponent } from '../../utils/type/isComponent-ebe24fd7.js';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { useId } from '../../hooks/useId-11687649.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { RawClickable } from '../../utils/react/RawClickable-e5e3e5c6.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Emphasis, Size } from '@lumx/core/js/constants';
+import { Icon } from '../icon/Icon-21a83e8c.js';
+import { IconButton } from '../button/IconButton-a740ce59.js';
+import { mdiChevronUp } from '../../../../lumx-icons/dist/esm/chevron-up-0846b7f3.js';
+import { mdiChevronDown } from '../../../../lumx-icons/dist/esm/chevron-down-256f8eff.js';
 
 /**
  * Component display name.
@@ -162,5 +126,5 @@ SideNavigationItem.displayName = COMPONENT_NAME;
 SideNavigationItem.className = CLASSNAME;
 SideNavigationItem.defaultProps = DEFAULT_PROPS;
 
-export { SideNavigation, SideNavigationItem };
-//# sourceMappingURL=side-navigation-385825d4.js.map
+export { SideNavigationItem };
+//# sourceMappingURL=SideNavigationItem-2de35ba7.js.map

package/_internal/packages/lumx-react/src/components/side-navigation/SideNavigationItem-2de35ba7.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideNavigationItem-2de35ba7.js","sources":["../../../../../../../src/components/side-navigation/SideNavigationItem.tsx"],"sourcesContent":["import { Children, ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isEmpty from 'lodash/isEmpty';\n\nimport { mdiChevronDown, mdiChevronUp } from '@lumx/icons';\nimport { Emphasis, Icon, Size, IconButton, IconButtonProps } from '@lumx/react';\nimport { GenericProps, HasCloseMode, isComponent } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useId } from '@lumx/react/hooks/useId';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { RawClickable } from '@lumx/react/utils/react/RawClickable';\n\n/**\n * Defines the props of the component.\n */\nexport interface SideNavigationItemProps extends GenericProps, HasCloseMode {\n    /** SideNavigationItem elements. */\n    children?: ReactNode;\n    /** Emphasis variant. */\n    emphasis?: Emphasis;\n    /** Label content. */\n    label: string | ReactNode;\n    /** Icon (SVG path). */\n    icon?: string;\n    /** Whether the component is open or not. */\n    isOpen?: boolean;\n    /** Whether the component is selected or not. */\n    isSelected?: boolean;\n    /** Custom react component for the link (can be used to inject react router Link). */\n    linkAs?: 'a' | any;\n    /** Props to pass to the link (minus those already set by the SideNavigationItem props). */\n    linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n    /** Props to pass to the toggle button (minus those already set by the SideNavigationItem props). */\n    toggleButtonProps: Pick<IconButtonProps, 'label'> &\n        Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color' | 'size'>;\n    /** On action button click callback. */\n    onActionClick?(evt: React.MouseEvent): void;\n    /** On click callback. */\n    onClick?(evt: React.MouseEvent): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SideNavigationItem';\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<SideNavigationItemProps> = {\n    emphasis: Emphasis.high,\n    closeMode: 'unmount',\n};\n\n/**\n * SideNavigationItem component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const SideNavigationItem = forwardRef<SideNavigationItemProps, HTMLLIElement>((props, ref) => {\n    const {\n        children,\n        className,\n        emphasis = DEFAULT_PROPS.emphasis,\n        icon,\n        isOpen,\n        isSelected,\n        label,\n        linkAs,\n        linkProps,\n        onActionClick,\n        onClick,\n        toggleButtonProps,\n        closeMode = DEFAULT_PROPS.closeMode,\n        ...forwardedProps\n    } = props;\n\n    const content = children && Children.toArray(children).filter(isComponent(SideNavigationItem));\n    const hasContent = !isEmpty(content);\n    const shouldSplitActions = Boolean(onActionClick);\n    const showChildren = hasContent && isOpen;\n\n    const contentId = useId();\n    const ariaProps: any = {};\n    if (hasContent) {\n        ariaProps['aria-expanded'] = !!showChildren;\n        // Associate with content ID only if in DOM (shown or hidden and not unmounted)\n        ariaProps['aria-controls'] = showChildren || closeMode === 'hide' ? contentId : undefined;\n    }\n\n    return (\n        <li\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(\n                className,\n                handleBasicClasses({\n                    emphasis,\n                    isOpen: showChildren,\n                    isSelected,\n                    prefix: CLASSNAME,\n                }),\n            )}\n        >\n            {shouldSplitActions ? (\n                <div className={`${CLASSNAME}__wrapper`}>\n                    <RawClickable\n                        as={linkAs || (linkProps?.href ? 'a' : 'button')}\n                        {...(linkProps as any)}\n                        className={`${CLASSNAME}__link`}\n                        onClick={onClick}\n                    >\n                        {icon && <Icon className={`${CLASSNAME}__icon`} icon={icon} size={Size.xs} />}\n                        <span>{label}</span>\n                    </RawClickable>\n\n                    <IconButton\n                        {...toggleButtonProps}\n                        className={`${CLASSNAME}__toggle`}\n                        icon={isOpen ? mdiChevronUp : mdiChevronDown}\n                        size={Size.m}\n                        emphasis={Emphasis.low}\n                        onClick={onActionClick}\n                        {...ariaProps}\n                    />\n                </div>\n            ) : (\n                <RawClickable\n                    as={linkAs || (linkProps?.href ? 'a' : 'button')}\n                    {...linkProps}\n                    className={`${CLASSNAME}__link`}\n                    onClick={onClick}\n                    {...ariaProps}\n                >\n                    {icon && <Icon className={`${CLASSNAME}__icon`} icon={icon} size={Size.xs} />}\n                    <span>{label}</span>\n                    {hasContent && (\n                        <Icon\n                            className={`${CLASSNAME}__chevron`}\n                            icon={isOpen ? mdiChevronUp : mdiChevronDown}\n                            size={Size.xs}\n                        />\n                    )}\n                </RawClickable>\n            )}\n\n            {(closeMode === 'hide' || showChildren) && (\n                <ul className={`${CLASSNAME}__children`} id={contentId}>\n                    {content}\n                </ul>\n            )}\n        </li>\n    );\n});\nSideNavigationItem.displayName = COMPONENT_NAME;\nSideNavigationItem.className = CLASSNAME;\nSideNavigationItem.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","emphasis","Emphasis","high","closeMode","SideNavigationItem","forwardRef","props","ref","children","className","icon","isOpen","isSelected","label","linkAs","linkProps","onActionClick","onClick","toggleButtonProps","forwardedProps","content","Children","toArray","filter","isComponent","hasContent","isEmpty","shouldSplitActions","Boolean","showChildren","contentId","useId","ariaProps","undefined","_jsxs","classNames","handleBasicClasses","prefix","RawClickable","as","href","_jsx","Icon","size","Size","xs","IconButton","mdiChevronUp","mdiChevronDown","m","low","id","displayName","defaultProps"],"mappings":"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"}

package/_internal/packages/lumx-react/src/components/skeleton/SkeletonCircle-9ff29a07.js

@@ -0,0 +1,52 @@
+import classNames from 'classnames';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { jsx } from 'react/jsx-runtime';
+import { Theme } from '@lumx/core/js/constants';
+
+const DEFAULT_PROPS = {};
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'SkeletonCircle';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * SkeletonCircle component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const SkeletonCircle = forwardRef((props, ref) => {
+  const defaultTheme = useTheme() || Theme.light;
+  const {
+    className,
+    size,
+    color,
+    theme = defaultTheme,
+    ...forwardedProps
+  } = props;
+  return /*#__PURE__*/jsx("div", {
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      size,
+      color,
+      theme
+    }))
+  });
+});
+SkeletonCircle.displayName = COMPONENT_NAME;
+SkeletonCircle.defaultProps = DEFAULT_PROPS;
+SkeletonCircle.className = CLASSNAME;
+
+export { SkeletonCircle };
+//# sourceMappingURL=SkeletonCircle-9ff29a07.js.map

package/_internal/packages/lumx-react/src/components/skeleton/SkeletonCircle-9ff29a07.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonCircle-9ff29a07.js","sources":["../../../../../../../src/components/skeleton/SkeletonCircle.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { GlobalSize, Theme, ColorPalette } 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 SkeletonCircleProps extends GenericProps, HasTheme {\n    /** Size variant. */\n    size: GlobalSize;\n    /** The color of the skeleton. */\n    color?: ColorPalette;\n}\n\nconst DEFAULT_PROPS: Partial<SkeletonCircleProps> = {};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SkeletonCircle';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * SkeletonCircle component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const SkeletonCircle = forwardRef<SkeletonCircleProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const { className, size, color, theme = defaultTheme, ...forwardedProps } = props;\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, size, color, theme }))}\n        />\n    );\n});\nSkeletonCircle.displayName = COMPONENT_NAME;\nSkeletonCircle.defaultProps = DEFAULT_PROPS;\nSkeletonCircle.className = CLASSNAME;\n"],"names":["DEFAULT_PROPS","COMPONENT_NAME","CLASSNAME","getRootClassName","SkeletonCircle","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","className","size","color","theme","forwardedProps","_jsx","classNames","handleBasicClasses","prefix","displayName","defaultProps"],"mappings":";;;;;;;AAkBA,MAAMA,aAA2C,GAAG,EAAE,CAAA;;AAEtD;AACA;AACA;AACA,MAAMC,cAAc,GAAG,gBAAgB,CAAA;;AAEvC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMG,cAAc,GAAGC,UAAU,CAAsC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC1F,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IAAEC,SAAS;IAAEC,IAAI;IAAEC,KAAK;AAAEC,IAAAA,KAAK,GAAGP,YAAY;IAAE,GAAGQ,cAAAA;AAAe,GAAC,GAAGV,KAAK,CAAA;AAEjF,EAAA,oBACIW,GAAA,CAAA,KAAA,EAAA;AACIV,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLS,cAAc;AAClBJ,IAAAA,SAAS,EAAEM,UAAU,CAACN,SAAS,EAAEO,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAElB,SAAS;MAAEW,IAAI;MAAEC,KAAK;AAAEC,MAAAA,KAAAA;AAAM,KAAC,CAAC,CAAA;AAAE,GACnG,CAAC,CAAA;AAEV,CAAC,EAAC;AACFX,cAAc,CAACiB,WAAW,GAAGpB,cAAc,CAAA;AAC3CG,cAAc,CAACkB,YAAY,GAAGtB,aAAa,CAAA;AAC3CI,cAAc,CAACQ,SAAS,GAAGV,SAAS;;;;"}

package/_internal/packages/lumx-react/src/components/skeleton/SkeletonRectangle-4d602e83.js

@@ -0,0 +1,73 @@
+import classNames from 'classnames';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { jsx } from 'react/jsx-runtime';
+import { Theme } from '@lumx/core/js/constants';
+
+const SkeletonRectangleVariant = {
+  squared: 'squared',
+  rounded: 'rounded',
+  pill: 'pill'
+};
+
+/**
+ * Defines the props of the component.
+ */
+
+const DEFAULT_PROPS = {
+  variant: SkeletonRectangleVariant.squared
+};
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'SkeletonRectangle';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * SkeletonRectangle component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const SkeletonRectangle = forwardRef((props, ref) => {
+  const defaultTheme = useTheme() || Theme.light;
+  const {
+    aspectRatio,
+    className,
+    height,
+    theme = defaultTheme,
+    variant = DEFAULT_PROPS.variant,
+    width,
+    color,
+    ...forwardedProps
+  } = props;
+  return /*#__PURE__*/jsx("div", {
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      aspectRatio,
+      height: aspectRatio ? undefined : height,
+      theme,
+      variant,
+      width,
+      color
+    })),
+    children: /*#__PURE__*/jsx("div", {
+      className: `${CLASSNAME}__inner`
+    })
+  });
+});
+SkeletonRectangle.displayName = COMPONENT_NAME;
+SkeletonRectangle.className = CLASSNAME;
+SkeletonRectangle.defaultProps = DEFAULT_PROPS;
+
+export { SkeletonRectangle, SkeletonRectangleVariant };
+//# sourceMappingURL=SkeletonRectangle-4d602e83.js.map

package/_internal/packages/lumx-react/src/components/skeleton/SkeletonRectangle-4d602e83.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonRectangle-4d602e83.js","sources":["../../../../../../../src/components/skeleton/SkeletonRectangle.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { AspectRatio, GlobalSize, Theme, ColorPalette } from '@lumx/react';\nimport { GenericProps, HasTheme, ValueOf } 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 * Skeleton variants.\n */\nexport const SkeletonRectangleVariant = { squared: 'squared', rounded: 'rounded', pill: 'pill' } as const;\nexport type SkeletonRectangleVariant = ValueOf<typeof SkeletonRectangleVariant>;\n\n/**\n * Defines the props of the component.\n */\nexport interface SkeletonRectangleProps extends GenericProps, HasTheme {\n    /** Aspect ratio (use with width and not height). */\n    aspectRatio?: Extract<AspectRatio, 'square' | 'horizontal' | 'vertical' | 'wide'>;\n    /** Height size. */\n    height?: GlobalSize;\n    /** Border variant. */\n    variant?: SkeletonRectangleVariant;\n    /** Width size. */\n    width?: GlobalSize;\n    /** The color of the skeleton. */\n    color?: ColorPalette;\n}\n\nconst DEFAULT_PROPS: Partial<SkeletonRectangleProps> = {\n    variant: SkeletonRectangleVariant.squared,\n};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SkeletonRectangle';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * SkeletonRectangle component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const SkeletonRectangle = forwardRef<SkeletonRectangleProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        aspectRatio,\n        className,\n        height,\n        theme = defaultTheme,\n        variant = DEFAULT_PROPS.variant,\n        width,\n        color,\n        ...forwardedProps\n    } = props;\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(\n                className,\n                handleBasicClasses({\n                    prefix: CLASSNAME,\n                    aspectRatio,\n                    height: aspectRatio ? undefined : height,\n                    theme,\n                    variant,\n                    width,\n                    color,\n                }),\n            )}\n        >\n            <div className={`${CLASSNAME}__inner`} />\n        </div>\n    );\n});\nSkeletonRectangle.displayName = COMPONENT_NAME;\nSkeletonRectangle.className = CLASSNAME;\nSkeletonRectangle.defaultProps = DEFAULT_PROPS;\n"],"names":["SkeletonRectangleVariant","squared","rounded","pill","DEFAULT_PROPS","variant","COMPONENT_NAME","CLASSNAME","getRootClassName","SkeletonRectangle","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","aspectRatio","className","height","theme","width","color","forwardedProps","_jsx","classNames","handleBasicClasses","prefix","undefined","children","displayName","defaultProps"],"mappings":";;;;;;;AAWO,MAAMA,wBAAwB,GAAG;AAAEC,EAAAA,OAAO,EAAE,SAAS;AAAEC,EAAAA,OAAO,EAAE,SAAS;AAAEC,EAAAA,IAAI,EAAE,MAAA;AAAO,EAAU;;AAGzG;AACA;AACA;;AAcA,MAAMC,aAA8C,GAAG;EACnDC,OAAO,EAAEL,wBAAwB,CAACC,OAAAA;AACtC,CAAC,CAAA;;AAED;AACA;AACA;AACA,MAAMK,cAAc,GAAG,mBAAmB,CAAA;;AAE1C;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMG,iBAAiB,GAAGC,UAAU,CAAyC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAChG,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IACFC,WAAW;IACXC,SAAS;IACTC,MAAM;AACNC,IAAAA,KAAK,GAAGP,YAAY;IACpBR,OAAO,GAAGD,aAAa,CAACC,OAAO;IAC/BgB,KAAK;IACLC,KAAK;IACL,GAAGC,cAAAA;AACP,GAAC,GAAGZ,KAAK,CAAA;AAET,EAAA,oBACIa,GAAA,CAAA,KAAA,EAAA;AACIZ,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLW,cAAc;AAClBL,IAAAA,SAAS,EAAEO,UAAU,CACjBP,SAAS,EACTQ,kBAAkB,CAAC;AACfC,MAAAA,MAAM,EAAEpB,SAAS;MACjBU,WAAW;AACXE,MAAAA,MAAM,EAAEF,WAAW,GAAGW,SAAS,GAAGT,MAAM;MACxCC,KAAK;MACLf,OAAO;MACPgB,KAAK;AACLC,MAAAA,KAAAA;AACJ,KAAC,CACL,CAAE;AAAAO,IAAAA,QAAA,eAEFL,GAAA,CAAA,KAAA,EAAA;MAAKN,SAAS,EAAE,GAAGX,SAAS,CAAA,OAAA,CAAA;KAAY,CAAA;AAAC,GACxC,CAAC,CAAA;AAEd,CAAC,EAAC;AACFE,iBAAiB,CAACqB,WAAW,GAAGxB,cAAc,CAAA;AAC9CG,iBAAiB,CAACS,SAAS,GAAGX,SAAS,CAAA;AACvCE,iBAAiB,CAACsB,YAAY,GAAG3B,aAAa;;;;"}

package/_internal/packages/lumx-react/src/components/skeleton/SkeletonTypography-2b402be3.js

@@ -0,0 +1,60 @@
+import classNames from 'classnames';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { jsx } from 'react/jsx-runtime';
+import { Theme } from '@lumx/core/js/constants';
+
+const DEFAULT_PROPS = {};
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'SkeletonTypography';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * SkeletonTypography component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const SkeletonTypography = forwardRef((props, ref) => {
+  const defaultTheme = useTheme() || Theme.light;
+  const {
+    className,
+    theme = defaultTheme,
+    typography,
+    width,
+    color,
+    ...forwardedProps
+  } = props;
+  return /*#__PURE__*/jsx("div", {
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      theme,
+      typography,
+      color
+    })),
+    style: {
+      ...forwardedProps.style,
+      width
+    },
+    children: /*#__PURE__*/jsx("div", {
+      className: `${CLASSNAME}__inner`
+    })
+  });
+});
+SkeletonTypography.displayName = COMPONENT_NAME;
+SkeletonTypography.defaultProps = DEFAULT_PROPS;
+SkeletonTypography.className = CLASSNAME;
+
+export { SkeletonTypography };
+//# sourceMappingURL=SkeletonTypography-2b402be3.js.map

package/_internal/packages/lumx-react/src/components/skeleton/SkeletonTypography-2b402be3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonTypography-2b402be3.js","sources":["../../../../../../../src/components/skeleton/SkeletonTypography.tsx"],"sourcesContent":["import { CSSProperties } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Theme, TypographyInterface, ColorPalette } 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 SkeletonTypographyProps extends GenericProps, HasTheme {\n    /** Typography variant. */\n    typography: TypographyInterface;\n    /** Width CSS property. */\n    width?: CSSProperties['width'];\n    /** The color of the skeleton. */\n    color?: ColorPalette;\n}\n\nconst DEFAULT_PROPS: Partial<SkeletonTypographyProps> = {};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'SkeletonTypography';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * SkeletonTypography component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const SkeletonTypography = forwardRef<SkeletonTypographyProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const { className, theme = defaultTheme, typography, width, color, ...forwardedProps } = props;\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, theme, typography, color }))}\n            style={{ ...forwardedProps.style, width }}\n        >\n            <div className={`${CLASSNAME}__inner`} />\n        </div>\n    );\n});\nSkeletonTypography.displayName = COMPONENT_NAME;\nSkeletonTypography.defaultProps = DEFAULT_PROPS;\nSkeletonTypography.className = CLASSNAME;\n"],"names":["DEFAULT_PROPS","COMPONENT_NAME","CLASSNAME","getRootClassName","SkeletonTypography","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","className","theme","typography","width","color","forwardedProps","_jsx","classNames","handleBasicClasses","prefix","style","children","displayName","defaultProps"],"mappings":";;;;;;;AAsBA,MAAMA,aAA+C,GAAG,EAAE,CAAA;;AAE1D;AACA;AACA;AACA,MAAMC,cAAc,GAAG,oBAAoB,CAAA;;AAE3C;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMG,kBAAkB,GAAGC,UAAU,CAA0C,CAACC,KAAK,EAAEC,GAAG,KAAK;EAClG,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IAAEC,SAAS;AAAEC,IAAAA,KAAK,GAAGL,YAAY;IAAEM,UAAU;IAAEC,KAAK;IAAEC,KAAK;IAAE,GAAGC,cAAAA;AAAe,GAAC,GAAGX,KAAK,CAAA;AAE9F,EAAA,oBACIY,GAAA,CAAA,KAAA,EAAA;AACIX,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLU,cAAc;AAClBL,IAAAA,SAAS,EAAEO,UAAU,CAACP,SAAS,EAAEQ,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEnB,SAAS;MAAEW,KAAK;MAAEC,UAAU;AAAEE,MAAAA,KAAAA;AAAM,KAAC,CAAC,CAAE;AACtGM,IAAAA,KAAK,EAAE;MAAE,GAAGL,cAAc,CAACK,KAAK;AAAEP,MAAAA,KAAAA;KAAQ;AAAAQ,IAAAA,QAAA,eAE1CL,GAAA,CAAA,KAAA,EAAA;MAAKN,SAAS,EAAE,GAAGV,SAAS,CAAA,OAAA,CAAA;KAAY,CAAA;AAAC,GACxC,CAAC,CAAA;AAEd,CAAC,EAAC;AACFE,kBAAkB,CAACoB,WAAW,GAAGvB,cAAc,CAAA;AAC/CG,kBAAkB,CAACqB,YAAY,GAAGzB,aAAa,CAAA;AAC/CI,kBAAkB,CAACQ,SAAS,GAAGV,SAAS;;;;"}

package/_internal/{components/slider-78cfaa67.js → packages/lumx-react/src/components/slider/Slider-59996a75.js}

@@ -1,48 +1,16 @@
-import React__default, { useMemo, useRef } from 'react';
+import { useMemo, useRef } from 'react';
 import classNames from 'classnames';
+import useEventCallback from '../../hooks/useEventCallback-a7abe967.js';
 import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
-import { u as useId } from '../useId-3a1facc0.js';
-import { u as useTheme } from '../ThemeContext-3181f000.js';
-import { f as forwardRef } from '../forwardRef-8bce732e.js';
-import { u as useDisableStateProps } from '../useDisableStateProps-69e16b7c.js';
+import { clamp } from '../../utils/number/clamp-c3ccd387.js';
+import { useId } from '../../hooks/useId-11687649.js';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { useDisableStateProps } from '../../utils/disabled/useDisableStateProps-2391c02d.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { Theme } from '@lumx/core/js/constants';
-import { InputLabel } from './input-label-30d199c3.js';
-import { InputHelper } from './input-helper-2e4e49fd.js';
-
-const useEnhancedEffect = typeof window !== 'undefined' ? React__default.useLayoutEffect : React__default.useEffect;
-
-/**
- * https://github.com/facebook/react/issues/14099#issuecomment-440013892
- *
- * @param fn A function to run
- * @return A React callback
- */
-function useEventCallback(fn) {
-  const ref = React__default.useRef(fn);
-  useEnhancedEffect(() => {
-    ref.current = fn;
-  });
-  return React__default.useCallback(event => ref.current(event), []);
-}
-
-/**
- * Clamp value in range.
- *
- * @param value Value to clamp.
- * @param min   Minimum value.
- * @param max   Maximum value.
- * @return Clamped value.
- */
-const clamp = (value, min, max) => {
-  if (value < min) {
-    return min;
-  }
-  if (value > max) {
-    return max;
-  }
-  return value;
-};
+import { InputLabel } from '../input-label/InputLabel-7ce8e604.js';
+import { InputHelper } from '../input-helper/InputHelper-a6c7ec2d.js';
 
 /* eslint-disable jsx-a11y/no-static-element-interactions */
 /**
@@ -308,5 +276,5 @@ Slider.displayName = COMPONENT_NAME;
 Slider.className = CLASSNAME;
 Slider.defaultProps = DEFAULT_PROPS;
 
-export { Slider, clamp };
-//# sourceMappingURL=slider-78cfaa67.js.map
+export { Slider };
+//# sourceMappingURL=Slider-59996a75.js.map

package/_internal/packages/lumx-react/src/components/slider/Slider-59996a75.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider-59996a75.js","sources":["../../../../../../../src/components/slider/Slider.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport { SyntheticEvent, useMemo, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { InputHelper, InputLabel, Theme } from '@lumx/react';\nimport useEventCallback from '@lumx/react/hooks/useEventCallback';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { clamp } from '@lumx/react/utils/number/clamp';\nimport { useId } from '@lumx/react/hooks/useId';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useDisableStateProps } from '@lumx/react/utils/disabled/useDisableStateProps';\n\n/**\n * Defines the props of the component.\n */\nexport interface SliderProps extends GenericProps, HasTheme {\n    /** Helper text. */\n    helper?: string;\n    /** Whether the min and max labels should be hidden or not. */\n    hideMinMaxLabel?: boolean;\n    /** Whether the component is disabled or not. */\n    isDisabled?: boolean;\n    /** Label text. */\n    label?: string;\n    /** Maximum value on the range. */\n    max: number;\n    /** Minimum value of the range. */\n    min: number;\n    /** Native input name property. */\n    name?: string;\n    /** Number of digits in the fractional part of the selected value. */\n    precision?: number;\n    /** Range step value. */\n    steps?: number;\n    /** Selected ranged value. */\n    value: number;\n    /** On change callback. */\n    onChange(value: number, name?: string, event?: SyntheticEvent): void;\n    /** On click callback. */\n    onMouseDown?(event: React.SyntheticEvent): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Slider';\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<SliderProps> = {\n    precision: 0,\n    steps: 0,\n};\n\n/**\n * Convert a percent value to a value in range min - max.\n *\n * @param percent   Value to convert.\n * @param min       Minimum value.\n * @param max       Maximum value.\n * @param precision Precision.\n * @return Value in range min - max\n */\nconst computeValueFromPercent = (percent: number, min: number, max: number, precision = 0): number =>\n    Number((min + percent * (max - min)).toFixed(precision));\n\n/**\n * Convert a value in range min - max to a percent value.\n *\n * @param value Value to convert.\n * @param min   Minimum value.\n * @param max   Maximum value.\n * @return Value in percent\n */\nconst computePercentFromValue = (value: number, min: number, max: number): number =>\n    Number((value - min) / (max - min));\n\n/**\n * Slider component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const Slider = forwardRef<SliderProps, HTMLDivElement>((props, ref) => {\n    const { isAnyDisabled, disabledStateProps, otherProps } = useDisableStateProps(props);\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        className,\n        helper,\n        hideMinMaxLabel,\n        id,\n        label,\n        max,\n        min,\n        name,\n        onChange,\n        onMouseDown,\n        precision = DEFAULT_PROPS.precision,\n        steps = DEFAULT_PROPS.steps,\n        theme = defaultTheme,\n        value,\n        ...forwardedProps\n    } = otherProps;\n    const generatedId = useId();\n    const sliderId = id || generatedId;\n    const sliderLabelId = useMemo(() => `label-${sliderId}`, [sliderId]);\n    const sliderRef = useRef<HTMLDivElement>(null);\n\n    // build a lookup array for the steps.\n    const availableSteps = useMemo((): number[] => {\n        if (!steps) return [];\n\n        const available = [0];\n        const percentStep = 1 / ((max - min) / steps);\n        let ptr = 0;\n        while (ptr + percentStep < 1) {\n            ptr += percentStep;\n            available.push(ptr);\n        }\n        return available;\n    }, [steps, min, max]);\n\n    /**\n     * Try to find the closest step to the current slider position.\n     *\n     * @param percentValue Reference value\n     * @return The closest step value\n     */\n    const findClosestStep = (percentValue: number): number => {\n        const closest = availableSteps.reduce(\n            (acc, step) => {\n                const aDst = Math.abs(percentValue - step);\n                if (aDst < acc.dst) {\n                    return { dst: aDst, val: step };\n                }\n                return acc;\n            },\n            { dst: Infinity, val: -1 },\n        );\n        return closest.val;\n    };\n\n    /**\n     * Convert slider's handle position to percent.\n     *\n     * @param event The interaction event\n     * @param slider the slider element\n     * @return The computed percent value\n     */\n    const getPercentValue = (event: React.MouseEvent, slider: HTMLDivElement): number => {\n        const { width, left } = slider.getBoundingClientRect();\n        let percent = (event.pageX - left - window.pageXOffset) / width;\n        percent = clamp(percent, 0, 1);\n        if (steps) {\n            percent = findClosestStep(percent);\n        }\n        return percent;\n    };\n\n    /**\n     * Register a handler for the mouse move event.\n     */\n    const handleMove = useEventCallback((event: React.MouseEvent) => {\n        const { current: slider } = sliderRef;\n        if (!slider || !onChange) return;\n        const newValue = getPercentValue(event, slider);\n        onChange(computeValueFromPercent(newValue, min, max, precision), name, event);\n    });\n\n    /**\n     * Register a handler for the mouse up event.\n     * Clean a all listeners.\n     */\n    const handleEnd = useEventCallback(() => {\n        document.body.removeEventListener('mousemove', handleMove);\n        document.body.removeEventListener('mouseup', handleEnd);\n        document.body.removeEventListener('touchmove', handleMove);\n        document.body.removeEventListener('touchend', handleEnd);\n    });\n\n    /**\n     * Move to the next or previous value (i.e. + or - 10%) or next step\n     * @param previous Should seek the previous value.\n     */\n    const hopToValue = (previous = false) => {\n        const oldPercent = computePercentFromValue(value, min, max);\n        let percent = clamp(oldPercent + (previous ? -0.1 : 0.1), 0, 1);\n        if (steps) {\n            percent = oldPercent + availableSteps[1] * (previous ? -1 : 1);\n            percent = findClosestStep(percent);\n        }\n        if (onChange) {\n            onChange(computeValueFromPercent(percent, min, max, precision), name);\n        }\n    };\n\n    /**\n     * Register a handler for keyboard interactions\n     */\n    const handleKeyDown = useEventCallback((event: React.KeyboardEvent) => {\n        if (event.key === 'ArrowRight') {\n            hopToValue();\n        } else if (event.key === 'ArrowLeft') {\n            hopToValue(true);\n        }\n    });\n\n    /**\n     * Register a handler for the mouseDown event.\n     */\n    const handleMouseDown = useEventCallback((event: React.MouseEvent) => {\n        onMouseDown?.(event);\n\n        const { current: slider } = sliderRef;\n        if (isAnyDisabled || !slider) return;\n        const newValue = getPercentValue(event, slider);\n        if (onChange) {\n            onChange(computeValueFromPercent(newValue, min, max, precision), name, event);\n        }\n\n        document.body.addEventListener('mousemove', handleMove);\n        document.body.addEventListener('mouseup', handleEnd);\n    });\n\n    const percentString = `${computePercentFromValue(value, min, max) * 100}%`;\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(\n                className,\n                handleBasicClasses({ prefix: CLASSNAME, theme, hasLabel: Boolean(label) }),\n            )}\n            onMouseDown={handleMouseDown}\n        >\n            {label && (\n                <InputLabel id={sliderLabelId} htmlFor={sliderId} className={`${CLASSNAME}__label`} theme={theme}>\n                    {label}\n                </InputLabel>\n            )}\n\n            {helper && (\n                <InputHelper className={`${CLASSNAME}__helper`} theme={theme}>\n                    {helper}\n                </InputHelper>\n            )}\n\n            <div className={`${CLASSNAME}__ui-wrapper`}>\n                {!hideMinMaxLabel && (\n                    <span className={`${CLASSNAME}__value-label ${CLASSNAME}__value-label--min`}>{min}</span>\n                )}\n                <div className={`${CLASSNAME}__wrapper`} ref={sliderRef}>\n                    <div className={`${CLASSNAME}__track ${CLASSNAME}__track--background`} />\n                    <div\n                        className={`${CLASSNAME}__track ${CLASSNAME}__track--active`}\n                        style={{ width: percentString }}\n                    />\n                    {steps ? (\n                        <div className={`${CLASSNAME}__ticks`}>\n                            {availableSteps.map((step, idx) => (\n                                <div\n                                    key={`tick_${idx}`}\n                                    className={`${CLASSNAME}__tick`}\n                                    style={{ left: `${step * 100}%` }}\n                                />\n                            ))}\n                        </div>\n                    ) : null}\n                    <button\n                        type=\"button\"\n                        aria-labelledby={sliderLabelId}\n                        name={name}\n                        id={sliderId}\n                        className={`${CLASSNAME}__handle`}\n                        style={{ left: percentString }}\n                        onKeyDown={isAnyDisabled ? undefined : handleKeyDown}\n                        {...disabledStateProps}\n                    />\n                </div>\n                {!hideMinMaxLabel && (\n                    <span className={`${CLASSNAME}__value-label ${CLASSNAME}__value-label--max`}>{max}</span>\n                )}\n            </div>\n        </div>\n    );\n});\nSlider.displayName = COMPONENT_NAME;\nSlider.className = CLASSNAME;\nSlider.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","precision","steps","computeValueFromPercent","percent","min","max","Number","toFixed","computePercentFromValue","value","Slider","forwardRef","props","ref","isAnyDisabled","disabledStateProps","otherProps","useDisableStateProps","defaultTheme","useTheme","Theme","light","className","helper","hideMinMaxLabel","id","label","name","onChange","onMouseDown","theme","forwardedProps","generatedId","useId","sliderId","sliderLabelId","useMemo","sliderRef","useRef","availableSteps","available","percentStep","ptr","push","findClosestStep","percentValue","closest","reduce","acc","step","aDst","Math","abs","dst","val","Infinity","getPercentValue","event","slider","width","left","getBoundingClientRect","pageX","window","pageXOffset","clamp","handleMove","useEventCallback","current","newValue","handleEnd","document","body","removeEventListener","hopToValue","previous","oldPercent","handleKeyDown","key","handleMouseDown","addEventListener","percentString","_jsxs","classNames","handleBasicClasses","prefix","hasLabel","Boolean","children","_jsx","InputLabel","htmlFor","InputHelper","style","map","idx","type","onKeyDown","undefined","displayName","defaultProps"],"mappings":";;;;;;;;;;;;;;AAAA;AA6CA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,QAAQ,CAAA;;AAE/B;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAmC,GAAG;AACxCC,EAAAA,SAAS,EAAE,CAAC;AACZC,EAAAA,KAAK,EAAE,CAAA;AACX,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,uBAAuB,GAAGA,CAACC,OAAe,EAAEC,GAAW,EAAEC,GAAW,EAAEL,SAAS,GAAG,CAAC,KACrFM,MAAM,CAAC,CAACF,GAAG,GAAGD,OAAO,IAAIE,GAAG,GAAGD,GAAG,CAAC,EAAEG,OAAO,CAACP,SAAS,CAAC,CAAC,CAAA;;AAE5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMQ,uBAAuB,GAAGA,CAACC,KAAa,EAAEL,GAAW,EAAEC,GAAW,KACpEC,MAAM,CAAC,CAACG,KAAK,GAAGL,GAAG,KAAKC,GAAG,GAAGD,GAAG,CAAC,CAAC,CAAA;;AAEvC;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMM,MAAM,GAAGC,UAAU,CAA8B,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC1E,MAAM;IAAEC,aAAa;IAAEC,kBAAkB;AAAEC,IAAAA,UAAAA;AAAW,GAAC,GAAGC,oBAAoB,CAACL,KAAK,CAAC,CAAA;EACrF,MAAMM,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IACFC,SAAS;IACTC,MAAM;IACNC,eAAe;IACfC,EAAE;IACFC,KAAK;IACLrB,GAAG;IACHD,GAAG;IACHuB,IAAI;IACJC,QAAQ;IACRC,WAAW;IACX7B,SAAS,GAAGD,aAAa,CAACC,SAAS;IACnCC,KAAK,GAAGF,aAAa,CAACE,KAAK;AAC3B6B,IAAAA,KAAK,GAAGZ,YAAY;IACpBT,KAAK;IACL,GAAGsB,cAAAA;AACP,GAAC,GAAGf,UAAU,CAAA;AACd,EAAA,MAAMgB,WAAW,GAAGC,KAAK,EAAE,CAAA;AAC3B,EAAA,MAAMC,QAAQ,GAAGT,EAAE,IAAIO,WAAW,CAAA;AAClC,EAAA,MAAMG,aAAa,GAAGC,OAAO,CAAC,MAAM,CAAA,MAAA,EAASF,QAAQ,CAAA,CAAE,EAAE,CAACA,QAAQ,CAAC,CAAC,CAAA;AACpE,EAAA,MAAMG,SAAS,GAAGC,MAAM,CAAiB,IAAI,CAAC,CAAA;;AAE9C;AACA,EAAA,MAAMC,cAAc,GAAGH,OAAO,CAAC,MAAgB;AAC3C,IAAA,IAAI,CAACnC,KAAK,EAAE,OAAO,EAAE,CAAA;AAErB,IAAA,MAAMuC,SAAS,GAAG,CAAC,CAAC,CAAC,CAAA;IACrB,MAAMC,WAAW,GAAG,CAAC,IAAI,CAACpC,GAAG,GAAGD,GAAG,IAAIH,KAAK,CAAC,CAAA;IAC7C,IAAIyC,GAAG,GAAG,CAAC,CAAA;AACX,IAAA,OAAOA,GAAG,GAAGD,WAAW,GAAG,CAAC,EAAE;AAC1BC,MAAAA,GAAG,IAAID,WAAW,CAAA;AAClBD,MAAAA,SAAS,CAACG,IAAI,CAACD,GAAG,CAAC,CAAA;AACvB,KAAA;AACA,IAAA,OAAOF,SAAS,CAAA;GACnB,EAAE,CAACvC,KAAK,EAAEG,GAAG,EAAEC,GAAG,CAAC,CAAC,CAAA;;AAErB;AACJ;AACA;AACA;AACA;AACA;EACI,MAAMuC,eAAe,GAAIC,YAAoB,IAAa;IACtD,MAAMC,OAAO,GAAGP,cAAc,CAACQ,MAAM,CACjC,CAACC,GAAG,EAAEC,IAAI,KAAK;MACX,MAAMC,IAAI,GAAGC,IAAI,CAACC,GAAG,CAACP,YAAY,GAAGI,IAAI,CAAC,CAAA;AAC1C,MAAA,IAAIC,IAAI,GAAGF,GAAG,CAACK,GAAG,EAAE;QAChB,OAAO;AAAEA,UAAAA,GAAG,EAAEH,IAAI;AAAEI,UAAAA,GAAG,EAAEL,IAAAA;SAAM,CAAA;AACnC,OAAA;AACA,MAAA,OAAOD,GAAG,CAAA;AACd,KAAC,EACD;AAAEK,MAAAA,GAAG,EAAEE,QAAQ;AAAED,MAAAA,GAAG,EAAE,CAAC,CAAA;AAAE,KAC7B,CAAC,CAAA;IACD,OAAOR,OAAO,CAACQ,GAAG,CAAA;GACrB,CAAA;;AAED;AACJ;AACA;AACA;AACA;AACA;AACA;AACI,EAAA,MAAME,eAAe,GAAGA,CAACC,KAAuB,EAAEC,MAAsB,KAAa;IACjF,MAAM;MAAEC,KAAK;AAAEC,MAAAA,IAAAA;AAAK,KAAC,GAAGF,MAAM,CAACG,qBAAqB,EAAE,CAAA;AACtD,IAAA,IAAI1D,OAAO,GAAG,CAACsD,KAAK,CAACK,KAAK,GAAGF,IAAI,GAAGG,MAAM,CAACC,WAAW,IAAIL,KAAK,CAAA;IAC/DxD,OAAO,GAAG8D,KAAK,CAAC9D,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;AAC9B,IAAA,IAAIF,KAAK,EAAE;AACPE,MAAAA,OAAO,GAAGyC,eAAe,CAACzC,OAAO,CAAC,CAAA;AACtC,KAAA;AACA,IAAA,OAAOA,OAAO,CAAA;GACjB,CAAA;;AAED;AACJ;AACA;AACI,EAAA,MAAM+D,UAAU,GAAGC,gBAAgB,CAAEV,KAAuB,IAAK;IAC7D,MAAM;AAAEW,MAAAA,OAAO,EAAEV,MAAAA;AAAO,KAAC,GAAGrB,SAAS,CAAA;AACrC,IAAA,IAAI,CAACqB,MAAM,IAAI,CAAC9B,QAAQ,EAAE,OAAA;AAC1B,IAAA,MAAMyC,QAAQ,GAAGb,eAAe,CAACC,KAAK,EAAEC,MAAM,CAAC,CAAA;AAC/C9B,IAAAA,QAAQ,CAAC1B,uBAAuB,CAACmE,QAAQ,EAAEjE,GAAG,EAAEC,GAAG,EAAEL,SAAS,CAAC,EAAE2B,IAAI,EAAE8B,KAAK,CAAC,CAAA;AACjF,GAAC,CAAC,CAAA;;AAEF;AACJ;AACA;AACA;AACI,EAAA,MAAMa,SAAS,GAAGH,gBAAgB,CAAC,MAAM;IACrCI,QAAQ,CAACC,IAAI,CAACC,mBAAmB,CAAC,WAAW,EAAEP,UAAU,CAAC,CAAA;IAC1DK,QAAQ,CAACC,IAAI,CAACC,mBAAmB,CAAC,SAAS,EAAEH,SAAS,CAAC,CAAA;IACvDC,QAAQ,CAACC,IAAI,CAACC,mBAAmB,CAAC,WAAW,EAAEP,UAAU,CAAC,CAAA;IAC1DK,QAAQ,CAACC,IAAI,CAACC,mBAAmB,CAAC,UAAU,EAAEH,SAAS,CAAC,CAAA;AAC5D,GAAC,CAAC,CAAA;;AAEF;AACJ;AACA;AACA;AACI,EAAA,MAAMI,UAAU,GAAGA,CAACC,QAAQ,GAAG,KAAK,KAAK;IACrC,MAAMC,UAAU,GAAGpE,uBAAuB,CAACC,KAAK,EAAEL,GAAG,EAAEC,GAAG,CAAC,CAAA;AAC3D,IAAA,IAAIF,OAAO,GAAG8D,KAAK,CAACW,UAAU,IAAID,QAAQ,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;AAC/D,IAAA,IAAI1E,KAAK,EAAE;AACPE,MAAAA,OAAO,GAAGyE,UAAU,GAAGrC,cAAc,CAAC,CAAC,CAAC,IAAIoC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAA;AAC9DxE,MAAAA,OAAO,GAAGyC,eAAe,CAACzC,OAAO,CAAC,CAAA;AACtC,KAAA;AACA,IAAA,IAAIyB,QAAQ,EAAE;AACVA,MAAAA,QAAQ,CAAC1B,uBAAuB,CAACC,OAAO,EAAEC,GAAG,EAAEC,GAAG,EAAEL,SAAS,CAAC,EAAE2B,IAAI,CAAC,CAAA;AACzE,KAAA;GACH,CAAA;;AAED;AACJ;AACA;AACI,EAAA,MAAMkD,aAAa,GAAGV,gBAAgB,CAAEV,KAA0B,IAAK;AACnE,IAAA,IAAIA,KAAK,CAACqB,GAAG,KAAK,YAAY,EAAE;AAC5BJ,MAAAA,UAAU,EAAE,CAAA;AAChB,KAAC,MAAM,IAAIjB,KAAK,CAACqB,GAAG,KAAK,WAAW,EAAE;MAClCJ,UAAU,CAAC,IAAI,CAAC,CAAA;AACpB,KAAA;AACJ,GAAC,CAAC,CAAA;;AAEF;AACJ;AACA;AACI,EAAA,MAAMK,eAAe,GAAGZ,gBAAgB,CAAEV,KAAuB,IAAK;IAClE5B,WAAW,GAAG4B,KAAK,CAAC,CAAA;IAEpB,MAAM;AAAEW,MAAAA,OAAO,EAAEV,MAAAA;AAAO,KAAC,GAAGrB,SAAS,CAAA;AACrC,IAAA,IAAIvB,aAAa,IAAI,CAAC4C,MAAM,EAAE,OAAA;AAC9B,IAAA,MAAMW,QAAQ,GAAGb,eAAe,CAACC,KAAK,EAAEC,MAAM,CAAC,CAAA;AAC/C,IAAA,IAAI9B,QAAQ,EAAE;AACVA,MAAAA,QAAQ,CAAC1B,uBAAuB,CAACmE,QAAQ,EAAEjE,GAAG,EAAEC,GAAG,EAAEL,SAAS,CAAC,EAAE2B,IAAI,EAAE8B,KAAK,CAAC,CAAA;AACjF,KAAA;IAEAc,QAAQ,CAACC,IAAI,CAACQ,gBAAgB,CAAC,WAAW,EAAEd,UAAU,CAAC,CAAA;IACvDK,QAAQ,CAACC,IAAI,CAACQ,gBAAgB,CAAC,SAAS,EAAEV,SAAS,CAAC,CAAA;AACxD,GAAC,CAAC,CAAA;AAEF,EAAA,MAAMW,aAAa,GAAG,CAAGzE,EAAAA,uBAAuB,CAACC,KAAK,EAAEL,GAAG,EAAEC,GAAG,CAAC,GAAG,GAAG,CAAG,CAAA,CAAA,CAAA;AAC1E,EAAA,oBACI6E,IAAA,CAAA,KAAA,EAAA;AACIrE,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLkB,cAAc;AAClBT,IAAAA,SAAS,EAAE6D,UAAU,CACjB7D,SAAS,EACT8D,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAExF,SAAS;MAAEiC,KAAK;MAAEwD,QAAQ,EAAEC,OAAO,CAAC7D,KAAK,CAAA;AAAE,KAAC,CAC7E,CAAE;AACFG,IAAAA,WAAW,EAAEkD,eAAgB;AAAAS,IAAAA,QAAA,EAE5B9D,CAAAA,KAAK,iBACF+D,GAAA,CAACC,UAAU,EAAA;AAACjE,MAAAA,EAAE,EAAEU,aAAc;AAACwD,MAAAA,OAAO,EAAEzD,QAAS;MAACZ,SAAS,EAAE,CAAGzB,EAAAA,SAAS,CAAU,OAAA,CAAA;AAACiC,MAAAA,KAAK,EAAEA,KAAM;AAAA0D,MAAAA,QAAA,EAC5F9D,KAAAA;AAAK,KACE,CACf,EAEAH,MAAM,iBACHkE,GAAA,CAACG,WAAW,EAAA;MAACtE,SAAS,EAAE,CAAGzB,EAAAA,SAAS,CAAW,QAAA,CAAA;AAACiC,MAAAA,KAAK,EAAEA,KAAM;AAAA0D,MAAAA,QAAA,EACxDjE,MAAAA;KACQ,CAChB,eAED2D,IAAA,CAAA,KAAA,EAAA;MAAK5D,SAAS,EAAE,CAAGzB,EAAAA,SAAS,CAAe,YAAA,CAAA;AAAA2F,MAAAA,QAAA,EACtC,CAAA,CAAChE,eAAe,iBACbiE,GAAA,CAAA,MAAA,EAAA;AAAMnE,QAAAA,SAAS,EAAE,CAAA,EAAGzB,SAAS,CAAA,cAAA,EAAiBA,SAAS,CAAqB,kBAAA,CAAA;AAAA2F,QAAAA,QAAA,EAAEpF,GAAAA;OAAU,CAC3F,eACD8E,IAAA,CAAA,KAAA,EAAA;QAAK5D,SAAS,EAAE,CAAGzB,EAAAA,SAAS,CAAY,SAAA,CAAA;AAACgB,QAAAA,GAAG,EAAEwB,SAAU;AAAAmD,QAAAA,QAAA,gBACpDC,GAAA,CAAA,KAAA,EAAA;AAAKnE,UAAAA,SAAS,EAAE,CAAA,EAAGzB,SAAS,CAAA,QAAA,EAAWA,SAAS,CAAA,mBAAA,CAAA;SAAwB,CAAC,eACzE4F,GAAA,CAAA,KAAA,EAAA;AACInE,UAAAA,SAAS,EAAE,CAAA,EAAGzB,SAAS,CAAA,QAAA,EAAWA,SAAS,CAAkB,eAAA,CAAA;AAC7DgG,UAAAA,KAAK,EAAE;AAAElC,YAAAA,KAAK,EAAEsB,aAAAA;AAAc,WAAA;AAAE,SACnC,CAAC,EACDhF,KAAK,gBACFwF,GAAA,CAAA,KAAA,EAAA;UAAKnE,SAAS,EAAE,CAAGzB,EAAAA,SAAS,CAAU,OAAA,CAAA;UAAA2F,QAAA,EACjCjD,cAAc,CAACuD,GAAG,CAAC,CAAC7C,IAAI,EAAE8C,GAAG,kBAC1BN,GAAA,CAAA,KAAA,EAAA;YAEInE,SAAS,EAAE,CAAGzB,EAAAA,SAAS,CAAS,MAAA,CAAA;AAChCgG,YAAAA,KAAK,EAAE;AAAEjC,cAAAA,IAAI,EAAE,CAAA,EAAGX,IAAI,GAAG,GAAG,CAAA,CAAA,CAAA;AAAI,aAAA;WAF3B,EAAA,CAAA,KAAA,EAAQ8C,GAAG,CAAA,CAGnB,CACJ,CAAA;AAAC,SACD,CAAC,GACN,IAAI,eACRN,GAAA,CAAA,QAAA,EAAA;AACIO,UAAAA,IAAI,EAAC,QAAQ;AACb,UAAA,iBAAA,EAAiB7D,aAAc;AAC/BR,UAAAA,IAAI,EAAEA,IAAK;AACXF,UAAAA,EAAE,EAAES,QAAS;UACbZ,SAAS,EAAE,CAAGzB,EAAAA,SAAS,CAAW,QAAA,CAAA;AAClCgG,UAAAA,KAAK,EAAE;AAAEjC,YAAAA,IAAI,EAAEqB,aAAAA;WAAgB;AAC/BgB,UAAAA,SAAS,EAAEnF,aAAa,GAAGoF,SAAS,GAAGrB,aAAc;UAAA,GACjD9D,kBAAAA;AAAkB,SACzB,CAAC,CAAA;AAAA,OACD,CAAC,EACL,CAACS,eAAe,iBACbiE,GAAA,CAAA,MAAA,EAAA;AAAMnE,QAAAA,SAAS,EAAE,CAAA,EAAGzB,SAAS,CAAA,cAAA,EAAiBA,SAAS,CAAqB,kBAAA,CAAA;AAAA2F,QAAAA,QAAA,EAAEnF,GAAAA;AAAG,OAAO,CAC3F,CAAA;AAAA,KACA,CAAC,CAAA;AAAA,GACL,CAAC,CAAA;AAEd,CAAC,EAAC;AACFK,MAAM,CAACyF,WAAW,GAAGvG,cAAc,CAAA;AACnCc,MAAM,CAACY,SAAS,GAAGzB,SAAS,CAAA;AAC5Ba,MAAM,CAAC0F,YAAY,GAAGrG,aAAa;;;;"}

package/_internal/packages/lumx-react/src/components/slideshow/Slides-c8517dcb.js

@@ -0,0 +1,95 @@
+import React__default, { Children } from 'react';
+import chunk from 'lodash/chunk';
+import classNames from 'classnames';
+import { FULL_WIDTH_PERCENT } from './constants-e50f2a75.js';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { SlideshowItemGroup, buildSlideShowGroupId } from './SlideshowItemGroup-ce6a30cd.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'Slideshow';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * Slides component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const Slides = forwardRef((props, ref) => {
+  const defaultTheme = useTheme();
+  const {
+    activeIndex,
+    id,
+    className,
+    theme = defaultTheme,
+    fillHeight,
+    groupBy,
+    isAutoPlaying,
+    toggleAutoPlay,
+    slidesId,
+    children,
+    afterSlides,
+    hasControls,
+    slideGroupLabel,
+    ...forwardedProps
+  } = props;
+  const wrapperRef = React__default.useRef(null);
+  const startIndexVisible = activeIndex;
+  const endIndexVisible = startIndexVisible + 1;
+
+  // Inline style of wrapper element.
+  const wrapperStyle = {
+    transform: `translateX(-${FULL_WIDTH_PERCENT * activeIndex}%)`
+  };
+  const groups = React__default.useMemo(() => {
+    const childrenArray = Children.toArray(children);
+    return groupBy && groupBy > 1 ? chunk(childrenArray, groupBy) : childrenArray;
+  }, [children, groupBy]);
+  return /*#__PURE__*/jsxs("section", {
+    id: id,
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      theme
+    }), {
+      [`${CLASSNAME}--fill-height`]: fillHeight,
+      [`${CLASSNAME}--group-by-${groupBy}`]: Boolean(groupBy)
+    }),
+    "aria-roledescription": "carousel",
+    children: [/*#__PURE__*/jsx("div", {
+      id: slidesId,
+      className: `${CLASSNAME}__slides`,
+      onMouseEnter: toggleAutoPlay,
+      onMouseLeave: toggleAutoPlay,
+      "aria-live": isAutoPlaying ? 'off' : 'polite',
+      children: /*#__PURE__*/jsx("div", {
+        ref: wrapperRef,
+        className: `${CLASSNAME}__wrapper`,
+        style: wrapperStyle,
+        children: groups.map((group, index) => /*#__PURE__*/jsx(SlideshowItemGroup, {
+          id: slidesId && buildSlideShowGroupId(slidesId, index),
+          role: hasControls ? 'tabpanel' : 'group',
+          label: slideGroupLabel ? slideGroupLabel(index + 1, groups.length) : undefined,
+          isDisplayed: index >= startIndexVisible && index < endIndexVisible,
+          children: group
+        }, index))
+      })
+    }), afterSlides]
+  });
+});
+Slides.displayName = COMPONENT_NAME;
+Slides.className = CLASSNAME;
+
+export { Slides };
+//# sourceMappingURL=Slides-c8517dcb.js.map

package/_internal/packages/lumx-react/src/components/slideshow/Slides-c8517dcb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slides-c8517dcb.js","sources":["../../../../../../../src/components/slideshow/Slides.tsx"],"sourcesContent":["import React, { Children, CSSProperties } from 'react';\n\nimport chunk from 'lodash/chunk';\nimport classNames from 'classnames';\n\nimport { FULL_WIDTH_PERCENT } from '@lumx/react/components/slideshow/constants';\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\nimport { buildSlideShowGroupId, SlideshowItemGroup } from './SlideshowItemGroup';\n\nexport interface SlidesProps extends GenericProps, HasTheme {\n    /** current slide active */\n    activeIndex: number;\n    /** slides id to be added to the wrapper */\n    id?: string;\n    /** Whether the automatic rotation of the slideshow is enabled or not. */\n    autoPlay?: boolean;\n    /** Whether the image has to fill its container height or not. */\n    fillHeight?: boolean;\n    /** Number of slides to group together. */\n    groupBy?: number;\n    /** whether the slides are currently playing or not */\n    isAutoPlaying?: boolean;\n    /** id to be passed in into the slides */\n    slidesId?: string;\n    /** callback to change whether the slideshow is playing or not */\n    toggleAutoPlay: () => void;\n    /** component to be rendered after the slides */\n    afterSlides?: React.ReactNode;\n    /** Whether the slides have controls linked */\n    hasControls?: boolean;\n    /**\n     * Accessible label to set on a slide group.\n     * Receives the group position starting from 1 and the total number of groups.\n     * */\n    slideGroupLabel?: (groupPosition: number, groupTotal: number) => string;\n    /** Children */\n    children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Slideshow';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Slides component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const Slides = forwardRef<SlidesProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme();\n    const {\n        activeIndex,\n        id,\n        className,\n        theme = defaultTheme,\n        fillHeight,\n        groupBy,\n        isAutoPlaying,\n        toggleAutoPlay,\n        slidesId,\n        children,\n        afterSlides,\n        hasControls,\n        slideGroupLabel,\n        ...forwardedProps\n    } = props;\n    const wrapperRef = React.useRef<HTMLDivElement>(null);\n    const startIndexVisible = activeIndex;\n    const endIndexVisible = startIndexVisible + 1;\n\n    // Inline style of wrapper element.\n    const wrapperStyle: CSSProperties = { transform: `translateX(-${FULL_WIDTH_PERCENT * activeIndex}%)` };\n\n    const groups = React.useMemo(() => {\n        const childrenArray = Children.toArray(children);\n        return groupBy && groupBy > 1 ? chunk(childrenArray, groupBy) : childrenArray;\n    }, [children, groupBy]);\n\n    return (\n        <section\n            id={id}\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, theme }), {\n                [`${CLASSNAME}--fill-height`]: fillHeight,\n                [`${CLASSNAME}--group-by-${groupBy}`]: Boolean(groupBy),\n            })}\n            aria-roledescription=\"carousel\"\n        >\n            <div\n                id={slidesId}\n                className={`${CLASSNAME}__slides`}\n                onMouseEnter={toggleAutoPlay}\n                onMouseLeave={toggleAutoPlay}\n                aria-live={isAutoPlaying ? 'off' : 'polite'}\n            >\n                <div ref={wrapperRef} className={`${CLASSNAME}__wrapper`} style={wrapperStyle}>\n                    {groups.map((group, index) => (\n                        <SlideshowItemGroup\n                            key={index}\n                            id={slidesId && buildSlideShowGroupId(slidesId, index)}\n                            role={hasControls ? 'tabpanel' : 'group'}\n                            label={slideGroupLabel ? slideGroupLabel(index + 1, groups.length) : undefined}\n                            isDisplayed={index >= startIndexVisible && index < endIndexVisible}\n                        >\n                            {group}\n                        </SlideshowItemGroup>\n                    ))}\n                </div>\n            </div>\n\n            {afterSlides}\n        </section>\n    );\n});\n\nSlides.displayName = COMPONENT_NAME;\nSlides.className = CLASSNAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","Slides","forwardRef","props","ref","defaultTheme","useTheme","activeIndex","id","className","theme","fillHeight","groupBy","isAutoPlaying","toggleAutoPlay","slidesId","children","afterSlides","hasControls","slideGroupLabel","forwardedProps","wrapperRef","React","useRef","startIndexVisible","endIndexVisible","wrapperStyle","transform","FULL_WIDTH_PERCENT","groups","useMemo","childrenArray","Children","toArray","chunk","_jsxs","classNames","handleBasicClasses","prefix","Boolean","_jsx","onMouseEnter","onMouseLeave","style","map","group","index","SlideshowItemGroup","buildSlideShowGroupId","role","label","length","undefined","isDisplayed","displayName"],"mappings":"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"}

package/_internal/{components/slideshow-e0880d40.js → packages/lumx-react/src/components/slideshow/Slideshow-a21bfd66.js}

@@ -1,35 +1,14 @@
-import React__default, { useEffect } from 'react';
-import { a as SlideshowControls, b as Slides, c as buildSlideShowGroupId, D as DEFAULT_OPTIONS } from '../Slides-68a7d0e6.js';
-export { S as SlideshowItem } from '../Slides-68a7d0e6.js';
-import { m as mergeRefs } from '../mergeRefs-f0d7d6ea.js';
-import { u as useTheme } from '../ThemeContext-3181f000.js';
-import { f as forwardRef } from '../forwardRef-8bce732e.js';
+import React__default from 'react';
+import { DEFAULT_OPTIONS } from '../../hooks/useSlideshowControls-9c881480.js';
+import { useFocusWithin } from '../../hooks/useFocusWithin-9976fe9a.js';
+import { mergeRefs } from '../../utils/react/mergeRefs-27df0cb6.js';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { buildSlideShowGroupId } from './SlideshowItemGroup-ce6a30cd.js';
 import { jsx } from 'react/jsx-runtime';
 import { Theme } from '@lumx/core/js/constants';
-
-/**
- * Hook that allows to control when there is a focus event within a given element, meaning
- * that any element within the given target will trigger the focus in and focus out events.
- * @param options - UseFocusWithinOptions
- */
-const useFocusWithin = ({
-  element,
-  onFocusIn,
-  onFocusOut
-}) => {
-  useEffect(() => {
-    if (element) {
-      element.addEventListener('focusin', onFocusIn);
-      element.addEventListener('focusout', onFocusOut);
-    }
-    return () => {
-      if (element) {
-        element.removeEventListener('focusin', onFocusIn);
-        element.removeEventListener('focusout', onFocusOut);
-      }
-    };
-  }, [onFocusIn, element, onFocusOut]);
-};
+import { SlideshowControls } from './SlideshowControls-ecca54c4.js';
+import { Slides } from './Slides-c8517dcb.js';
 
 /**
  * Component default props.
@@ -147,5 +126,5 @@ const Slideshow = forwardRef((props, ref) => {
 Slideshow.displayName = 'Slideshow';
 Slideshow.defaultProps = DEFAULT_PROPS;
 
-export { Slides, Slideshow, SlideshowControls };
-//# sourceMappingURL=slideshow-e0880d40.js.map
+export { Slideshow };
+//# sourceMappingURL=Slideshow-a21bfd66.js.map

package/_internal/packages/lumx-react/src/components/slideshow/Slideshow-a21bfd66.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slideshow-a21bfd66.js","sources":["../../../../../../../src/components/slideshow/Slideshow.tsx"],"sourcesContent":["import React from 'react';\n\nimport { SlideshowControls, SlideshowControlsProps, Theme, Slides, SlidesProps } from '@lumx/react';\nimport { DEFAULT_OPTIONS } from '@lumx/react/hooks/useSlideshowControls';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { useFocusWithin } from '@lumx/react/hooks/useFocusWithin';\nimport { mergeRefs } from '@lumx/react/utils/react/mergeRefs';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { buildSlideShowGroupId } from './SlideshowItemGroup';\n\n/**\n * Defines the props of the component.\n */\nexport interface SlideshowProps\n    extends GenericProps,\n        Pick<SlidesProps, 'autoPlay' | 'slidesId' | 'id' | 'theme' | 'fillHeight' | 'groupBy' | 'slideGroupLabel'> {\n    /** current slide active */\n    activeIndex?: SlidesProps['activeIndex'];\n    /** Interval between each slide when automatic rotation is enabled. */\n    interval?: number;\n    /** Props to pass to the slideshow controls (minus those already set by the Slideshow props). */\n    slideshowControlsProps?: Pick<\n        SlideshowControlsProps,\n        'nextButtonProps' | 'previousButtonProps' | 'paginationItemProps'\n    > &\n        Omit<\n            SlideshowControlsProps,\n            | 'activeIndex'\n            | 'onPaginationClick'\n            | 'onNextClick'\n            | 'onPreviousClick'\n            | 'slidesCount'\n            | 'parentRef'\n            | 'theme'\n        >;\n    /** Callback when slide changes */\n    onChange?(index: number): void;\n    /** Children */\n    children?: React.ReactNode;\n}\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<SlideshowProps> = DEFAULT_OPTIONS;\n\n/**\n * Slideshow component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const Slideshow = forwardRef<SlideshowProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        activeIndex,\n        autoPlay = DEFAULT_PROPS.autoPlay,\n        children,\n        className,\n        fillHeight,\n        groupBy = DEFAULT_OPTIONS.groupBy,\n        interval = DEFAULT_PROPS.interval,\n        onChange,\n        slideshowControlsProps,\n        theme = defaultTheme,\n        id,\n        slidesId,\n        slideGroupLabel,\n        ...forwardedProps\n    } = props;\n    // Number of slideshow items.\n    const itemsCount = React.Children.count(children);\n\n    const {\n        activeIndex: currentIndex,\n        slideshowId,\n        setSlideshow,\n        isAutoPlaying,\n        slideshowSlidesId,\n        slidesCount,\n        onNextClick,\n        onPaginationClick,\n        onPreviousClick,\n        slideshow,\n        stopAutoPlay,\n        startAutoPlay,\n        toggleAutoPlay,\n        toggleForcePause,\n    } = SlideshowControls.useSlideshowControls({\n        activeIndex,\n        defaultActiveIndex: DEFAULT_PROPS.activeIndex as number,\n        autoPlay: Boolean(autoPlay),\n        itemsCount,\n        groupBy,\n        id,\n        interval,\n        onChange,\n        slidesId,\n    });\n\n    useFocusWithin({\n        element: slideshow,\n        onFocusIn: stopAutoPlay,\n        onFocusOut: startAutoPlay,\n    });\n\n    const showControls = slideshowControlsProps && slidesCount > 1;\n\n    return (\n        <Slides\n            activeIndex={currentIndex}\n            id={slideshowId}\n            className={className}\n            theme={theme}\n            fillHeight={fillHeight}\n            groupBy={groupBy}\n            isAutoPlaying={isAutoPlaying}\n            autoPlay={autoPlay}\n            slidesId={slideshowSlidesId}\n            toggleAutoPlay={toggleAutoPlay}\n            ref={mergeRefs(ref, setSlideshow)}\n            hasControls={showControls}\n            slideGroupLabel={slideGroupLabel}\n            afterSlides={\n                slideshowControlsProps && slidesCount > 1 ? (\n                    <div className={`${Slides.className}__controls`}>\n                        <SlideshowControls\n                            {...slideshowControlsProps}\n                            activeIndex={currentIndex}\n                            onPaginationClick={onPaginationClick}\n                            onNextClick={onNextClick}\n                            onPreviousClick={onPreviousClick}\n                            slidesCount={slidesCount}\n                            parentRef={slideshow}\n                            theme={theme}\n                            isAutoPlaying={isAutoPlaying}\n                            nextButtonProps={{\n                                'aria-controls': slideshowSlidesId,\n                                ...slideshowControlsProps.nextButtonProps,\n                            }}\n                            previousButtonProps={{\n                                'aria-controls': slideshowSlidesId,\n                                ...slideshowControlsProps.previousButtonProps,\n                            }}\n                            playButtonProps={\n                                autoPlay\n                                    ? {\n                                          'aria-controls': slideshowSlidesId,\n                                          onClick: toggleForcePause,\n                                          ...slideshowControlsProps.playButtonProps,\n                                      }\n                                    : undefined\n                            }\n                            paginationItemProps={(index) => ({\n                                'aria-controls': buildSlideShowGroupId(slideshowSlidesId, index),\n                                ...slideshowControlsProps.paginationItemProps?.(index),\n                            })}\n                        />\n                    </div>\n                ) : undefined\n            }\n            {...forwardedProps}\n        >\n            {children}\n        </Slides>\n    );\n});\n\nSlideshow.displayName = 'Slideshow';\nSlideshow.defaultProps = DEFAULT_PROPS;\n"],"names":["DEFAULT_PROPS","DEFAULT_OPTIONS","Slideshow","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","activeIndex","autoPlay","children","className","fillHeight","groupBy","interval","onChange","slideshowControlsProps","theme","id","slidesId","slideGroupLabel","forwardedProps","itemsCount","React","Children","count","currentIndex","slideshowId","setSlideshow","isAutoPlaying","slideshowSlidesId","slidesCount","onNextClick","onPaginationClick","onPreviousClick","slideshow","stopAutoPlay","startAutoPlay","toggleAutoPlay","toggleForcePause","SlideshowControls","useSlideshowControls","defaultActiveIndex","Boolean","useFocusWithin","element","onFocusIn","onFocusOut","showControls","_jsx","Slides","mergeRefs","hasControls","afterSlides","parentRef","nextButtonProps","previousButtonProps","playButtonProps","onClick","undefined","paginationItemProps","index","buildSlideShowGroupId","displayName","defaultProps"],"mappings":"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"}