@chayns-components/core 5.3.9 → 5.3.11-alpha.0

package/lib/cjs/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemSubtitle.js","names":["_react","_interopRequireWildcard","require","_ListItemSubtitle","_accordion","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemSubtitle","rightElements","subtitle","isOpen","handlePreventClick","event","stopPropagation","preventDefault","bottomElement","useMemo","bottom","undefined","shouldPreventRightElementClick","getElementClickEvent","createElement","StyledListItemSubtitle","StyledListItemHeadSubtitleText","$isOpen","StyledListItemBottomRightElement","onClick","displayName","_default","exports"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.tsx"],"sourcesContent":["import React, { FC, ReactNode, useMemo } from 'react';\nimport type { IListItemRightElement, IListItemRightElements } from '../../../../../types/list';\nimport {\n    StyledListItemHeadSubtitleText,\n    StyledListItemSubtitle,\n    StyledListItemBottomRightElement,\n} from './ListItemSubtitle.styles';\nimport { getElementClickEvent } from '../../../../../utils/accordion';\n\ntype ListItemSubtitleProps = {\n    rightElements?: IListItemRightElements;\n    subtitle?: ReactNode;\n    isOpen: boolean;\n};\n\nconst ListItemSubtitle: FC<ListItemSubtitleProps> = ({ rightElements, subtitle, isOpen }) => {\n    const handlePreventClick = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        event.preventDefault();\n    };\n\n    const bottomElement = useMemo(() => {\n        if (typeof rightElements === 'object' && rightElements && 'bottom' in rightElements) {\n            return (rightElements as unknown as IListItemRightElement).bottom;\n        }\n\n        return undefined;\n    }, [rightElements]);\n\n    const shouldPreventRightElementClick = useMemo(() => {\n        if (bottomElement) {\n            return getElementClickEvent(bottomElement);\n        }\n\n        return false;\n    }, [bottomElement]);\n\n    return (\n        <StyledListItemSubtitle>\n            <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n                {subtitle}\n            </StyledListItemHeadSubtitleText>\n            {bottomElement && (\n                <StyledListItemBottomRightElement\n                    onClick={shouldPreventRightElementClick ? handlePreventClick : undefined}\n                >\n                    {bottomElement}\n                </StyledListItemBottomRightElement>\n            )}\n        </StyledListItemSubtitle>\n    );\n};\n\nListItemSubtitle.displayName = 'ListItemSubtitle';\n\nexport default ListItemSubtitle;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAEA,IAAAC,iBAAA,GAAAD,OAAA;AAKA,IAAAE,UAAA,GAAAF,OAAA;AAAsE,SAAAD,wBAAAI,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAN,uBAAA,YAAAA,CAAAI,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAQtE,MAAMkB,gBAA2C,GAAGA,CAAC;EAAEC,aAAa;EAAEC,QAAQ;EAAEC;AAAO,CAAC,KAAK;EACzF,MAAMC,kBAAkB,GAAIC,KAAuB,IAAK;IACpDA,KAAK,CAACC,eAAe,CAAC,CAAC;IACvBD,KAAK,CAACE,cAAc,CAAC,CAAC;EAC1B,CAAC;EAED,MAAMC,aAAa,GAAG,IAAAC,cAAO,EAAC,MAAM;IAChC,IAAI,OAAOR,aAAa,KAAK,QAAQ,IAAIA,aAAa,IAAI,QAAQ,IAAIA,aAAa,EAAE;MACjF,OAAQA,aAAa,CAAsCS,MAAM;IACrE;IAEA,OAAOC,SAAS;EACpB,CAAC,EAAE,CAACV,aAAa,CAAC,CAAC;EAEnB,MAAMW,8BAA8B,GAAG,IAAAH,cAAO,EAAC,MAAM;IACjD,IAAID,aAAa,EAAE;MACf,OAAO,IAAAK,+BAAoB,EAACL,aAAa,CAAC;IAC9C;IAEA,OAAO,KAAK;EAChB,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;EAEnB,oBACIhC,MAAA,CAAAe,OAAA,CAAAuB,aAAA,CAACnC,iBAAA,CAAAoC,sBAAsB,qBACnBvC,MAAA,CAAAe,OAAA,CAAAuB,aAAA,CAACnC,iBAAA,CAAAqC,8BAA8B;IAACC,OAAO,EAAEd;EAAO,GAC3CD,QAC2B,CAAC,EAChCM,aAAa,iBACVhC,MAAA,CAAAe,OAAA,CAAAuB,aAAA,CAACnC,iBAAA,CAAAuC,gCAAgC;IAC7BC,OAAO,EAAEP,8BAA8B,GAAGR,kBAAkB,GAAGO;EAAU,GAExEH,aAC6B,CAElB,CAAC;AAEjC,CAAC;AAEDR,gBAAgB,CAACoB,WAAW,GAAG,kBAAkB;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA/B,OAAA,GAEnCS,gBAAgB","ignoreList":[]}
+{"version":3,"file":"ListItemSubtitle.js","names":["_react","_interopRequireWildcard","require","_ListItemSubtitle","_accordion","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemSubtitle","rightElements","subtitle","isOpen","shouldAllowRightElementFocus","bottomElementRef","useRef","handlePreventClick","event","stopPropagation","preventDefault","bottomElement","useMemo","bottom","undefined","shouldPreventRightElementClick","getElementClickEvent","useEffect","bottomElementWrapper","current","focusableElements","Array","from","querySelectorAll","forEach","element","currentElement","datasetKey","originalTabIndex","dataset","removeAttribute","setAttribute","getAttribute","createElement","StyledListItemSubtitle","StyledListItemHeadSubtitleText","$isOpen","StyledListItemBottomRightElement","ref","onClick","displayName","_default","exports"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.tsx"],"sourcesContent":["import React, { FC, ReactNode, useEffect, useMemo, useRef } from 'react';\nimport type { IListItemRightElement, IListItemRightElements } from '../../../../../types/list';\nimport {\n    StyledListItemHeadSubtitleText,\n    StyledListItemSubtitle,\n    StyledListItemBottomRightElement,\n} from './ListItemSubtitle.styles';\nimport { getElementClickEvent } from '../../../../../utils/accordion';\n\ntype ListItemSubtitleProps = {\n    rightElements?: IListItemRightElements;\n    subtitle?: ReactNode;\n    isOpen: boolean;\n    shouldAllowRightElementFocus?: boolean;\n};\n\nconst ListItemSubtitle: FC<ListItemSubtitleProps> = ({\n    rightElements,\n    subtitle,\n    isOpen,\n    shouldAllowRightElementFocus = true,\n}) => {\n    const bottomElementRef = useRef<HTMLDivElement>(null);\n\n    const handlePreventClick = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        event.preventDefault();\n    };\n\n    const bottomElement = useMemo(() => {\n        if (typeof rightElements === 'object' && rightElements && 'bottom' in rightElements) {\n            return (rightElements as unknown as IListItemRightElement).bottom;\n        }\n\n        return undefined;\n    }, [rightElements]);\n\n    const shouldPreventRightElementClick = useMemo(() => {\n        if (bottomElement) {\n            return getElementClickEvent(bottomElement);\n        }\n\n        return false;\n    }, [bottomElement]);\n\n    useEffect(() => {\n        const bottomElementWrapper = bottomElementRef.current;\n\n        if (!bottomElementWrapper) {\n            return;\n        }\n\n        const focusableElements = Array.from(\n            bottomElementWrapper.querySelectorAll<HTMLElement>(\n                'a[href], button, input, select, textarea, [tabindex], [contenteditable=\"true\"]',\n            ),\n        );\n\n        focusableElements.forEach((element) => {\n            const currentElement = element;\n            const datasetKey = 'listItemRightElementOriginalTabIndex';\n\n            if (shouldAllowRightElementFocus) {\n                const originalTabIndex = currentElement.dataset[datasetKey];\n\n                if (typeof originalTabIndex === 'string') {\n                    if (originalTabIndex === '') {\n                        currentElement.removeAttribute('tabindex');\n                    } else {\n                        currentElement.setAttribute('tabindex', originalTabIndex);\n                    }\n\n                    delete currentElement.dataset[datasetKey];\n                }\n            } else {\n                if (typeof currentElement.dataset[datasetKey] !== 'string') {\n                    currentElement.dataset[datasetKey] =\n                        currentElement.getAttribute('tabindex') ?? '';\n                }\n\n                currentElement.setAttribute('tabindex', '-1');\n            }\n        });\n    }, [bottomElement, shouldAllowRightElementFocus]);\n\n    return (\n        <StyledListItemSubtitle>\n            <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n                {subtitle}\n            </StyledListItemHeadSubtitleText>\n            {bottomElement && (\n                <StyledListItemBottomRightElement\n                    data-right-element=\"true\"\n                    ref={bottomElementRef}\n                    onClick={shouldPreventRightElementClick ? handlePreventClick : undefined}\n                >\n                    {bottomElement}\n                </StyledListItemBottomRightElement>\n            )}\n        </StyledListItemSubtitle>\n    );\n};\n\nListItemSubtitle.displayName = 'ListItemSubtitle';\n\nexport default ListItemSubtitle;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js

@@ -15,7 +15,8 @@ const ListItemTitle = ({
   shouldShowMultilineTitle,
   isOpen,
   onResize,
-  onTitleWidthChange
+  onTitleWidthChange,
+  shouldAllowRightElementFocus = true
 }) => {
   const titleWrapperRef = (0, _react.useRef)(null);
   const wrapperRef = (0, _react.useRef)(null);
@@ -60,6 +61,33 @@ const ListItemTitle = ({
     }
     return false;
   }, [topElement]);
+  (0, _react.useEffect)(() => {
+    const topElementWrapper = topElementWrapperRef.current;
+    if (!topElementWrapper) {
+      return;
+    }
+    const focusableElements = Array.from(topElementWrapper.querySelectorAll('a[href], button, input, select, textarea, [tabindex], [contenteditable="true"]'));
+    focusableElements.forEach(element => {
+      const currentElement = element;
+      const datasetKey = 'listItemRightElementOriginalTabIndex';
+      if (shouldAllowRightElementFocus) {
+        const originalTabIndex = currentElement.dataset[datasetKey];
+        if (typeof originalTabIndex === 'string') {
+          if (originalTabIndex === '') {
+            currentElement.removeAttribute('tabindex');
+          } else {
+            currentElement.setAttribute('tabindex', originalTabIndex);
+          }
+          delete currentElement.dataset[datasetKey];
+        }
+      } else {
+        if (typeof currentElement.dataset[datasetKey] !== 'string') {
+          currentElement.dataset[datasetKey] = currentElement.getAttribute('tabindex') ?? '';
+        }
+        currentElement.setAttribute('tabindex', '-1');
+      }
+    });
+  }, [shouldAllowRightElementFocus, topElement]);
   return /*#__PURE__*/_react.default.createElement(_ListItemTitle.StyledListItemTitle, {
     ref: wrapperRef
   }, /*#__PURE__*/_react.default.createElement(_ListItemTitle.StyledListItemTitleLeftWrapper, null, /*#__PURE__*/_react.default.createElement(_ListItemTitle.StyledListItemHeadTitleText, {
@@ -69,6 +97,7 @@ const ListItemTitle = ({
   }, title), /*#__PURE__*/_react.default.createElement(_ListItemTitle.StyledListItemHeadTitleElement, {
     ref: elementWrapperRef
   }, titleElement)), topElement && /*#__PURE__*/_react.default.createElement(_ListItemTitle.StyledListItemTopRightElement, {
+    "data-right-element": "true",
     ref: topElementWrapperRef,
     onClick: shouldPreventRightElementClick ? handlePreventClick : undefined
   }, topElement));

package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemTitle.js","names":["_react","_interopRequireWildcard","require","_ListItemTitle","_accordion","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemTitle","rightElements","titleElement","title","shouldShowMultilineTitle","isOpen","onResize","onTitleWidthChange","titleWrapperRef","useRef","wrapperRef","elementWrapperRef","topElementWrapperRef","useEffect","element","current","undefined","resizeObserver","ResizeObserver","observe","disconnect","_topElementWrapperRef","fullWidth","clientWidth","rightElementWidth","topElementWidth","width","handlePreventClick","event","stopPropagation","preventDefault","topElement","useMemo","top","shouldPreventRightElementClick","getElementClickEvent","createElement","StyledListItemTitle","ref","StyledListItemTitleLeftWrapper","StyledListItemHeadTitleText","$isEllipsis","$shouldShowMultilineTitle","StyledListItemHeadTitleElement","StyledListItemTopRightElement","onClick","displayName","_default","exports"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-title/ListItemTitle.tsx"],"sourcesContent":["import React, { FC, ReactNode, useEffect, useMemo, useRef } from 'react';\nimport type { IListItemRightElement, IListItemRightElements } from '../../../../../types/list';\nimport {\n    StyledListItemHeadTitleElement,\n    StyledListItemHeadTitleText,\n    StyledListItemTitle,\n    StyledListItemTitleLeftWrapper,\n    StyledListItemTopRightElement,\n} from './ListItemTitle.styles';\nimport { getElementClickEvent } from '../../../../../utils/accordion';\n\ntype ListItemTitleProps = {\n    rightElements?: IListItemRightElements;\n    title: ReactNode;\n    titleElement?: ReactNode;\n    shouldShowMultilineTitle: boolean;\n    isOpen: boolean;\n    onResize?: (entries: ResizeObserverEntry[]) => void;\n    onTitleWidthChange: (width: number) => void;\n};\n\nconst ListItemTitle: FC<ListItemTitleProps> = ({\n    rightElements,\n    titleElement,\n    title,\n    shouldShowMultilineTitle,\n    isOpen,\n    onResize,\n    onTitleWidthChange,\n}) => {\n    const titleWrapperRef = useRef<HTMLDivElement>(null);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const elementWrapperRef = useRef<HTMLDivElement>(null);\n    const topElementWrapperRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        const element = titleWrapperRef?.current;\n        if (!element || typeof onResize !== 'function') return undefined;\n\n        const resizeObserver = new ResizeObserver(onResize);\n        resizeObserver.observe(element);\n\n        return () => resizeObserver.disconnect();\n    }, [onResize]);\n\n    useEffect(() => {\n        if (wrapperRef.current && elementWrapperRef.current) {\n            const fullWidth = wrapperRef.current.clientWidth;\n            const rightElementWidth = elementWrapperRef.current.clientWidth;\n            const topElementWidth = topElementWrapperRef.current?.clientWidth;\n\n            let width = fullWidth;\n\n            if (rightElementWidth > 0) {\n                width -= rightElementWidth + 8;\n            }\n\n            if (topElementWidth) {\n                width -= topElementWidth + 12;\n            }\n\n            onTitleWidthChange(width);\n        }\n    }, [onTitleWidthChange]);\n\n    const handlePreventClick = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        event.preventDefault();\n    };\n\n    const topElement = useMemo(() => {\n        if (typeof rightElements === 'object' && rightElements && 'top' in rightElements) {\n            return (rightElements as unknown as IListItemRightElement).top;\n        }\n\n        return undefined;\n    }, [rightElements]);\n\n    const shouldPreventRightElementClick = useMemo(() => {\n        if (topElement) {\n            return getElementClickEvent(topElement);\n        }\n\n        return false;\n    }, [topElement]);\n\n    return (\n        <StyledListItemTitle ref={wrapperRef}>\n            <StyledListItemTitleLeftWrapper>\n                <StyledListItemHeadTitleText\n                    $isEllipsis={!isOpen}\n                    ref={titleWrapperRef}\n                    $shouldShowMultilineTitle={shouldShowMultilineTitle}\n                >\n                    {title}\n                </StyledListItemHeadTitleText>\n                <StyledListItemHeadTitleElement ref={elementWrapperRef}>\n                    {titleElement}\n                </StyledListItemHeadTitleElement>\n            </StyledListItemTitleLeftWrapper>\n            {topElement && (\n                <StyledListItemTopRightElement\n                    ref={topElementWrapperRef}\n                    onClick={shouldPreventRightElementClick ? handlePreventClick : undefined}\n                >\n                    {topElement}\n                </StyledListItemTopRightElement>\n            )}\n        </StyledListItemTitle>\n    );\n};\n\nListItemTitle.displayName = 'ListItemTitle';\n\nexport default ListItemTitle;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ListItemTitle.js","names":["_react","_interopRequireWildcard","require","_ListItemTitle","_accordion","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemTitle","rightElements","titleElement","title","shouldShowMultilineTitle","isOpen","onResize","onTitleWidthChange","shouldAllowRightElementFocus","titleWrapperRef","useRef","wrapperRef","elementWrapperRef","topElementWrapperRef","useEffect","element","current","undefined","resizeObserver","ResizeObserver","observe","disconnect","_topElementWrapperRef","fullWidth","clientWidth","rightElementWidth","topElementWidth","width","handlePreventClick","event","stopPropagation","preventDefault","topElement","useMemo","top","shouldPreventRightElementClick","getElementClickEvent","topElementWrapper","focusableElements","Array","from","querySelectorAll","forEach","currentElement","datasetKey","originalTabIndex","dataset","removeAttribute","setAttribute","getAttribute","createElement","StyledListItemTitle","ref","StyledListItemTitleLeftWrapper","StyledListItemHeadTitleText","$isEllipsis","$shouldShowMultilineTitle","StyledListItemHeadTitleElement","StyledListItemTopRightElement","onClick","displayName","_default","exports"],"sources":["../../../../../../../src/components/list/list-item/list-item-head/list-item-title/ListItemTitle.tsx"],"sourcesContent":["import React, { FC, ReactNode, useEffect, useMemo, useRef } from 'react';\nimport type { IListItemRightElement, IListItemRightElements } from '../../../../../types/list';\nimport {\n    StyledListItemHeadTitleElement,\n    StyledListItemHeadTitleText,\n    StyledListItemTitle,\n    StyledListItemTitleLeftWrapper,\n    StyledListItemTopRightElement,\n} from './ListItemTitle.styles';\nimport { getElementClickEvent } from '../../../../../utils/accordion';\n\ntype ListItemTitleProps = {\n    rightElements?: IListItemRightElements;\n    title: ReactNode;\n    titleElement?: ReactNode;\n    shouldShowMultilineTitle: boolean;\n    isOpen: boolean;\n    onResize?: (entries: ResizeObserverEntry[]) => void;\n    onTitleWidthChange: (width: number) => void;\n    shouldAllowRightElementFocus?: boolean;\n};\n\nconst ListItemTitle: FC<ListItemTitleProps> = ({\n    rightElements,\n    titleElement,\n    title,\n    shouldShowMultilineTitle,\n    isOpen,\n    onResize,\n    onTitleWidthChange,\n    shouldAllowRightElementFocus = true,\n}) => {\n    const titleWrapperRef = useRef<HTMLDivElement>(null);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const elementWrapperRef = useRef<HTMLDivElement>(null);\n    const topElementWrapperRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        const element = titleWrapperRef?.current;\n        if (!element || typeof onResize !== 'function') return undefined;\n\n        const resizeObserver = new ResizeObserver(onResize);\n        resizeObserver.observe(element);\n\n        return () => resizeObserver.disconnect();\n    }, [onResize]);\n\n    useEffect(() => {\n        if (wrapperRef.current && elementWrapperRef.current) {\n            const fullWidth = wrapperRef.current.clientWidth;\n            const rightElementWidth = elementWrapperRef.current.clientWidth;\n            const topElementWidth = topElementWrapperRef.current?.clientWidth;\n\n            let width = fullWidth;\n\n            if (rightElementWidth > 0) {\n                width -= rightElementWidth + 8;\n            }\n\n            if (topElementWidth) {\n                width -= topElementWidth + 12;\n            }\n\n            onTitleWidthChange(width);\n        }\n    }, [onTitleWidthChange]);\n\n    const handlePreventClick = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        event.preventDefault();\n    };\n\n    const topElement = useMemo(() => {\n        if (typeof rightElements === 'object' && rightElements && 'top' in rightElements) {\n            return (rightElements as unknown as IListItemRightElement).top;\n        }\n\n        return undefined;\n    }, [rightElements]);\n\n    const shouldPreventRightElementClick = useMemo(() => {\n        if (topElement) {\n            return getElementClickEvent(topElement);\n        }\n\n        return false;\n    }, [topElement]);\n\n    useEffect(() => {\n        const topElementWrapper = topElementWrapperRef.current;\n\n        if (!topElementWrapper) {\n            return;\n        }\n\n        const focusableElements = Array.from(\n            topElementWrapper.querySelectorAll<HTMLElement>(\n                'a[href], button, input, select, textarea, [tabindex], [contenteditable=\"true\"]',\n            ),\n        );\n\n        focusableElements.forEach((element) => {\n            const currentElement = element;\n            const datasetKey = 'listItemRightElementOriginalTabIndex';\n\n            if (shouldAllowRightElementFocus) {\n                const originalTabIndex = currentElement.dataset[datasetKey];\n\n                if (typeof originalTabIndex === 'string') {\n                    if (originalTabIndex === '') {\n                        currentElement.removeAttribute('tabindex');\n                    } else {\n                        currentElement.setAttribute('tabindex', originalTabIndex);\n                    }\n\n                    delete currentElement.dataset[datasetKey];\n                }\n            } else {\n                if (typeof currentElement.dataset[datasetKey] !== 'string') {\n                    currentElement.dataset[datasetKey] =\n                        currentElement.getAttribute('tabindex') ?? '';\n                }\n\n                currentElement.setAttribute('tabindex', '-1');\n            }\n        });\n    }, [shouldAllowRightElementFocus, topElement]);\n\n    return (\n        <StyledListItemTitle ref={wrapperRef}>\n            <StyledListItemTitleLeftWrapper>\n                <StyledListItemHeadTitleText\n                    $isEllipsis={!isOpen}\n                    ref={titleWrapperRef}\n                    $shouldShowMultilineTitle={shouldShowMultilineTitle}\n                >\n                    {title}\n                </StyledListItemHeadTitleText>\n                <StyledListItemHeadTitleElement ref={elementWrapperRef}>\n                    {titleElement}\n                </StyledListItemHeadTitleElement>\n            </StyledListItemTitleLeftWrapper>\n            {topElement && (\n                <StyledListItemTopRightElement\n                    data-right-element=\"true\"\n                    ref={topElementWrapperRef}\n                    onClick={shouldPreventRightElementClick ? handlePreventClick : undefined}\n                >\n                    {topElement}\n                </StyledListItemTopRightElement>\n            )}\n        </StyledListItemTitle>\n    );\n};\n\nListItemTitle.displayName = 'ListItemTitle';\n\nexport default ListItemTitle;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/list/list-item/useListItemFocus.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useListItemFocus = void 0;
+var _react = require("react");
+const useListItemFocus = ({
+  uuid,
+  listGroupUuid,
+  isInKeyboardNavigationGroup,
+  updateActiveListItemUuid
+}) => {
+  const [isFocusWithinListItem, setIsFocusWithinListItem] = (0, _react.useState)(false);
+  const handleFocus = (0, _react.useCallback)(event => {
+    setIsFocusWithinListItem(true);
+    if (event.currentTarget === event.target && isInKeyboardNavigationGroup && typeof updateActiveListItemUuid === 'function') {
+      updateActiveListItemUuid(uuid);
+    }
+  }, [isInKeyboardNavigationGroup, updateActiveListItemUuid, uuid]);
+  const handleBlur = (0, _react.useCallback)(event => {
+    const nextFocusedElement = event.relatedTarget;
+    const currentListItemElement = event.currentTarget;
+    if (nextFocusedElement && currentListItemElement.contains(nextFocusedElement)) {
+      return;
+    }
+    setIsFocusWithinListItem(false);
+    if (!isInKeyboardNavigationGroup || typeof updateActiveListItemUuid !== 'function' || typeof listGroupUuid !== 'string') {
+      return;
+    }
+    if (!nextFocusedElement) {
+      updateActiveListItemUuid(undefined);
+      return;
+    }
+    const nextFocusedListItem = nextFocusedElement.closest(`[data-uuid^="${listGroupUuid}---"]`);
+    if (!nextFocusedListItem) {
+      updateActiveListItemUuid(undefined);
+    }
+  }, [isInKeyboardNavigationGroup, listGroupUuid, updateActiveListItemUuid]);
+  return {
+    isFocusWithinListItem,
+    handleFocus,
+    handleBlur
+  };
+};
+exports.useListItemFocus = useListItemFocus;
+//# sourceMappingURL=useListItemFocus.js.map

package/lib/cjs/components/list/list-item/useListItemFocus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useListItemFocus.js","names":["_react","require","useListItemFocus","uuid","listGroupUuid","isInKeyboardNavigationGroup","updateActiveListItemUuid","isFocusWithinListItem","setIsFocusWithinListItem","useState","handleFocus","useCallback","event","currentTarget","target","handleBlur","nextFocusedElement","relatedTarget","currentListItemElement","contains","undefined","nextFocusedListItem","closest","exports"],"sources":["../../../../../src/components/list/list-item/useListItemFocus.ts"],"sourcesContent":["import { type FocusEvent, useCallback, useState } from 'react';\n\ntype UseListItemFocusParams = {\n    uuid: string;\n    listGroupUuid?: string;\n    isInKeyboardNavigationGroup: boolean;\n    updateActiveListItemUuid?: (uuid?: string) => void;\n};\n\nexport const useListItemFocus = ({\n    uuid,\n    listGroupUuid,\n    isInKeyboardNavigationGroup,\n    updateActiveListItemUuid,\n}: UseListItemFocusParams) => {\n    const [isFocusWithinListItem, setIsFocusWithinListItem] = useState(false);\n\n    const handleFocus = useCallback(\n        (event: FocusEvent<HTMLDivElement>) => {\n            setIsFocusWithinListItem(true);\n\n            if (\n                event.currentTarget === event.target &&\n                isInKeyboardNavigationGroup &&\n                typeof updateActiveListItemUuid === 'function'\n            ) {\n                updateActiveListItemUuid(uuid);\n            }\n        },\n        [isInKeyboardNavigationGroup, updateActiveListItemUuid, uuid],\n    );\n\n    const handleBlur = useCallback(\n        (event: FocusEvent<HTMLDivElement>) => {\n            const nextFocusedElement = event.relatedTarget as HTMLElement | null;\n            const currentListItemElement = event.currentTarget as HTMLElement;\n\n            if (nextFocusedElement && currentListItemElement.contains(nextFocusedElement)) {\n                return;\n            }\n\n            setIsFocusWithinListItem(false);\n\n            if (\n                !isInKeyboardNavigationGroup ||\n                typeof updateActiveListItemUuid !== 'function' ||\n                typeof listGroupUuid !== 'string'\n            ) {\n                return;\n            }\n\n            if (!nextFocusedElement) {\n                updateActiveListItemUuid(undefined);\n                return;\n            }\n\n            const nextFocusedListItem = nextFocusedElement.closest<HTMLElement>(\n                `[data-uuid^=\"${listGroupUuid}---\"]`,\n            );\n\n            if (!nextFocusedListItem) {\n                updateActiveListItemUuid(undefined);\n            }\n        },\n        [isInKeyboardNavigationGroup, listGroupUuid, updateActiveListItemUuid],\n    );\n\n    return {\n        isFocusWithinListItem,\n        handleFocus,\n        handleBlur,\n    };\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AASO,MAAMC,gBAAgB,GAAGA,CAAC;EAC7BC,IAAI;EACJC,aAAa;EACbC,2BAA2B;EAC3BC;AACoB,CAAC,KAAK;EAC1B,MAAM,CAACC,qBAAqB,EAAEC,wBAAwB,CAAC,GAAG,IAAAC,eAAQ,EAAC,KAAK,CAAC;EAEzE,MAAMC,WAAW,GAAG,IAAAC,kBAAW,EAC1BC,KAAiC,IAAK;IACnCJ,wBAAwB,CAAC,IAAI,CAAC;IAE9B,IACII,KAAK,CAACC,aAAa,KAAKD,KAAK,CAACE,MAAM,IACpCT,2BAA2B,IAC3B,OAAOC,wBAAwB,KAAK,UAAU,EAChD;MACEA,wBAAwB,CAACH,IAAI,CAAC;IAClC;EACJ,CAAC,EACD,CAACE,2BAA2B,EAAEC,wBAAwB,EAAEH,IAAI,CAChE,CAAC;EAED,MAAMY,UAAU,GAAG,IAAAJ,kBAAW,EACzBC,KAAiC,IAAK;IACnC,MAAMI,kBAAkB,GAAGJ,KAAK,CAACK,aAAmC;IACpE,MAAMC,sBAAsB,GAAGN,KAAK,CAACC,aAA4B;IAEjE,IAAIG,kBAAkB,IAAIE,sBAAsB,CAACC,QAAQ,CAACH,kBAAkB,CAAC,EAAE;MAC3E;IACJ;IAEAR,wBAAwB,CAAC,KAAK,CAAC;IAE/B,IACI,CAACH,2BAA2B,IAC5B,OAAOC,wBAAwB,KAAK,UAAU,IAC9C,OAAOF,aAAa,KAAK,QAAQ,EACnC;MACE;IACJ;IAEA,IAAI,CAACY,kBAAkB,EAAE;MACrBV,wBAAwB,CAACc,SAAS,CAAC;MACnC;IACJ;IAEA,MAAMC,mBAAmB,GAAGL,kBAAkB,CAACM,OAAO,CAClD,gBAAgBlB,aAAa,OACjC,CAAC;IAED,IAAI,CAACiB,mBAAmB,EAAE;MACtBf,wBAAwB,CAACc,SAAS,CAAC;IACvC;EACJ,CAAC,EACD,CAACf,2BAA2B,EAAED,aAAa,EAAEE,wBAAwB,CACzE,CAAC;EAED,OAAO;IACHC,qBAAqB;IACrBG,WAAW;IACXK;EACJ,CAAC;AACL,CAAC;AAACQ,OAAA,CAAArB,gBAAA,GAAAA,gBAAA","ignoreList":[]}

package/lib/cjs/components/masonry/Masonry.context.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMasonryContext = exports.MasonryContext = void 0;
+var _react = require("react");
+const MasonryContext = exports.MasonryContext = /*#__PURE__*/(0, _react.createContext)(undefined);
+const useMasonryContext = () => {
+  const context = (0, _react.useContext)(MasonryContext);
+  if (!context) {
+    throw new Error('Masonry.Item must be used inside Masonry.');
+  }
+  return context;
+};
+exports.useMasonryContext = useMasonryContext;
+//# sourceMappingURL=Masonry.context.js.map

package/lib/cjs/components/masonry/Masonry.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Masonry.context.js","names":["_react","require","MasonryContext","exports","createContext","undefined","useMasonryContext","context","useContext","Error"],"sources":["../../../../src/components/masonry/Masonry.context.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport { MasonryContextValue } from './Masonry.types';\n\nexport const MasonryContext = createContext<MasonryContextValue | undefined>(undefined);\n\nexport const useMasonryContext = () => {\n    const context = useContext(MasonryContext);\n\n    if (!context) {\n        throw new Error('Masonry.Item must be used inside Masonry.');\n    }\n\n    return context;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAGO,MAAMC,cAAc,GAAAC,OAAA,CAAAD,cAAA,gBAAG,IAAAE,oBAAa,EAAkCC,SAAS,CAAC;AAEhF,MAAMC,iBAAiB,GAAGA,CAAA,KAAM;EACnC,MAAMC,OAAO,GAAG,IAAAC,iBAAU,EAACN,cAAc,CAAC;EAE1C,IAAI,CAACK,OAAO,EAAE;IACV,MAAM,IAAIE,KAAK,CAAC,2CAA2C,CAAC;EAChE;EAEA,OAAOF,OAAO;AAClB,CAAC;AAACJ,OAAA,CAAAG,iBAAA,GAAAA,iBAAA","ignoreList":[]}

package/lib/cjs/components/masonry/Masonry.hooks.js

@@ -0,0 +1,53 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMasonryLayout = exports.useMasonryItems = exports.useMasonryColumnCount = void 0;
+var _react = require("react");
+var _Masonry = require("./Masonry.utils");
+const useMasonryItems = ({
+  children
+}) => (0, _react.useMemo)(() => _react.Children.toArray(children), [children]);
+exports.useMasonryItems = useMasonryItems;
+const useMasonryLayout = ({
+  items,
+  itemHeights,
+  columnCount,
+  columnWidth,
+  rowHeight,
+  gap
+}) => (0, _react.useMemo)(() => {
+  const layoutItems = items.map((item, index) => {
+    const key = (0, _Masonry.getMasonryItemKey)(item, index);
+    const height = itemHeights[key] ?? rowHeight;
+    return {
+      key,
+      columns: item.props.columns ?? 1,
+      rows: (0, _Masonry.calculateRowSpan)({
+        height,
+        rowHeight,
+        gap
+      })
+    };
+  });
+  return (0, _Masonry.packMasonryGrid)({
+    items: layoutItems,
+    columnCount,
+    columnWidth,
+    rowHeight,
+    gap
+  });
+}, [items, itemHeights, columnCount, columnWidth, rowHeight, gap]);
+exports.useMasonryLayout = useMasonryLayout;
+const useMasonryColumnCount = ({
+  containerWidth,
+  columnWidth,
+  gap
+}) => (0, _react.useMemo)(() => (0, _Masonry.calculateColumnCount)({
+  containerWidth,
+  columnWidth,
+  gap
+}), [containerWidth, columnWidth, gap]);
+exports.useMasonryColumnCount = useMasonryColumnCount;
+//# sourceMappingURL=Masonry.hooks.js.map

package/lib/cjs/components/masonry/Masonry.hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Masonry.hooks.js","names":["_react","require","_Masonry","useMasonryItems","children","useMemo","Children","toArray","exports","useMasonryLayout","items","itemHeights","columnCount","columnWidth","rowHeight","gap","layoutItems","map","item","index","key","getMasonryItemKey","height","columns","props","rows","calculateRowSpan","packMasonryGrid","useMasonryColumnCount","containerWidth","calculateColumnCount"],"sources":["../../../../src/components/masonry/Masonry.hooks.ts"],"sourcesContent":["import { Children, ReactNode, useMemo } from 'react';\nimport { MasonryChild, MasonryItemProps, MasonryLayoutItem } from './Masonry.types';\nimport {\n    calculateColumnCount,\n    calculateRowSpan,\n    getMasonryItemKey,\n    packMasonryGrid,\n} from './Masonry.utils';\n\ninterface UseMasonryItemsParams {\n    children: ReactNode;\n}\n\nexport const useMasonryItems = ({ children }: UseMasonryItemsParams) =>\n    useMemo(() => Children.toArray(children) as MasonryChild[], [children]);\n\ninterface UseMasonryLayoutParams {\n    items: MasonryChild[];\n    itemHeights: Record<string, number>;\n    columnCount: number;\n    columnWidth: number;\n    rowHeight: number;\n    gap: number;\n}\n\nexport const useMasonryLayout = ({\n    items,\n    itemHeights,\n    columnCount,\n    columnWidth,\n    rowHeight,\n    gap,\n}: UseMasonryLayoutParams) =>\n    useMemo(() => {\n        const layoutItems: MasonryLayoutItem[] = items.map((item, index) => {\n            const key = getMasonryItemKey(item as React.ReactElement<MasonryItemProps>, index);\n\n            const height = itemHeights[key] ?? rowHeight;\n\n            return {\n                key,\n                columns: item.props.columns ?? 1,\n                rows: calculateRowSpan({\n                    height,\n                    rowHeight,\n                    gap,\n                }),\n            };\n        });\n\n        return packMasonryGrid({\n            items: layoutItems,\n            columnCount,\n            columnWidth,\n            rowHeight,\n            gap,\n        });\n    }, [items, itemHeights, columnCount, columnWidth, rowHeight, gap]);\n\ninterface UseMasonryColumnCountParams {\n    containerWidth: number;\n    columnWidth: number;\n    gap: number;\n}\n\nexport const useMasonryColumnCount = ({\n    containerWidth,\n    columnWidth,\n    gap,\n}: UseMasonryColumnCountParams) =>\n    useMemo(\n        () =>\n            calculateColumnCount({\n                containerWidth,\n                columnWidth,\n                gap,\n            }),\n        [containerWidth, columnWidth, gap],\n    );\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,QAAA,GAAAD,OAAA;AAWO,MAAME,eAAe,GAAGA,CAAC;EAAEC;AAAgC,CAAC,KAC/D,IAAAC,cAAO,EAAC,MAAMC,eAAQ,CAACC,OAAO,CAACH,QAAQ,CAAmB,EAAE,CAACA,QAAQ,CAAC,CAAC;AAACI,OAAA,CAAAL,eAAA,GAAAA,eAAA;AAWrE,MAAMM,gBAAgB,GAAGA,CAAC;EAC7BC,KAAK;EACLC,WAAW;EACXC,WAAW;EACXC,WAAW;EACXC,SAAS;EACTC;AACoB,CAAC,KACrB,IAAAV,cAAO,EAAC,MAAM;EACV,MAAMW,WAAgC,GAAGN,KAAK,CAACO,GAAG,CAAC,CAACC,IAAI,EAAEC,KAAK,KAAK;IAChE,MAAMC,GAAG,GAAG,IAAAC,0BAAiB,EAACH,IAAI,EAA0CC,KAAK,CAAC;IAElF,MAAMG,MAAM,GAAGX,WAAW,CAACS,GAAG,CAAC,IAAIN,SAAS;IAE5C,OAAO;MACHM,GAAG;MACHG,OAAO,EAAEL,IAAI,CAACM,KAAK,CAACD,OAAO,IAAI,CAAC;MAChCE,IAAI,EAAE,IAAAC,yBAAgB,EAAC;QACnBJ,MAAM;QACNR,SAAS;QACTC;MACJ,CAAC;IACL,CAAC;EACL,CAAC,CAAC;EAEF,OAAO,IAAAY,wBAAe,EAAC;IACnBjB,KAAK,EAAEM,WAAW;IAClBJ,WAAW;IACXC,WAAW;IACXC,SAAS;IACTC;EACJ,CAAC,CAAC;AACN,CAAC,EAAE,CAACL,KAAK,EAAEC,WAAW,EAAEC,WAAW,EAAEC,WAAW,EAAEC,SAAS,EAAEC,GAAG,CAAC,CAAC;AAACP,OAAA,CAAAC,gBAAA,GAAAA,gBAAA;AAQhE,MAAMmB,qBAAqB,GAAGA,CAAC;EAClCC,cAAc;EACdhB,WAAW;EACXE;AACyB,CAAC,KAC1B,IAAAV,cAAO,EACH,MACI,IAAAyB,6BAAoB,EAAC;EACjBD,cAAc;EACdhB,WAAW;EACXE;AACJ,CAAC,CAAC,EACN,CAACc,cAAc,EAAEhB,WAAW,EAAEE,GAAG,CACrC,CAAC;AAACP,OAAA,CAAAoB,qBAAA,GAAAA,qBAAA","ignoreList":[]}

package/lib/cjs/components/masonry/Masonry.js

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _react2 = require("motion/react");
+var _element = require("../../hooks/element");
+var _Masonry = require("./Masonry.context");
+var _Masonry2 = require("./Masonry.styles");
+var _Masonry3 = require("./Masonry.hooks");
+var _Masonry4 = require("./Masonry.utils");
+var _MasonryItem = _interopRequireWildcard(require("./masonry-item/MasonryItem"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const MasonryBase = ({
+  children,
+  gap = 8,
+  columnWidth = 80,
+  rowHeight = 80
+}) => {
+  const ref = (0, _react.useRef)(null);
+  const size = (0, _element.useElementSize)(ref);
+  const containerWidth = (size === null || size === void 0 ? void 0 : size.width) ?? 0;
+  const [itemHeights, setItemHeights] = (0, _react.useState)({});
+  const items = (0, _Masonry3.useMasonryItems)({
+    children
+  });
+  const columnCount = (0, _Masonry3.useMasonryColumnCount)({
+    containerWidth,
+    columnWidth,
+    gap
+  });
+  const layout = (0, _Masonry3.useMasonryLayout)({
+    items,
+    itemHeights,
+    columnCount,
+    columnWidth,
+    rowHeight,
+    gap
+  });
+  const registerItem = (0, _react.useCallback)((key, height) => {
+    setItemHeights(currentHeights => {
+      if (currentHeights[key] === height) {
+        return currentHeights;
+      }
+      return {
+        ...currentHeights,
+        [key]: height
+      };
+    });
+  }, []);
+  const contextValue = (0, _react.useMemo)(() => ({
+    registerItem
+  }), [registerItem]);
+  return /*#__PURE__*/_react.default.createElement(_Masonry.MasonryContext.Provider, {
+    value: contextValue
+  }, /*#__PURE__*/_react.default.createElement(_Masonry2.StyledMasonry, {
+    ref: ref,
+    $height: layout.height
+  }, /*#__PURE__*/_react.default.createElement(_react2.AnimatePresence, null, items.map((item, index) => {
+    const key = (0, _Masonry4.getMasonryItemKey)(item, index);
+    const packedItem = layout.items[key];
+    if (!packedItem) {
+      return null;
+    }
+    return /*#__PURE__*/_react.default.createElement(_MasonryItem.InternalMasonryItem, {
+      key: key,
+      itemKey: key,
+      x: packedItem.x,
+      y: packedItem.y,
+      width: packedItem.width
+    }, item.props.children);
+  }))));
+};
+MasonryBase.displayName = 'Masonry';
+const Masonry = Object.assign(MasonryBase, {
+  Item: _MasonryItem.default
+});
+var _default = exports.default = Masonry;
+//# sourceMappingURL=Masonry.js.map

package/lib/cjs/components/masonry/Masonry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Masonry.js","names":["_react","_interopRequireWildcard","require","_react2","_element","_Masonry","_Masonry2","_Masonry3","_Masonry4","_MasonryItem","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","MasonryBase","children","gap","columnWidth","rowHeight","ref","useRef","size","useElementSize","containerWidth","width","itemHeights","setItemHeights","useState","items","useMasonryItems","columnCount","useMasonryColumnCount","layout","useMasonryLayout","registerItem","useCallback","key","height","currentHeights","contextValue","useMemo","createElement","MasonryContext","Provider","value","StyledMasonry","$height","AnimatePresence","map","item","index","getMasonryItemKey","packedItem","InternalMasonryItem","itemKey","x","y","props","displayName","Masonry","assign","Item","MasonryItem","_default","exports"],"sources":["../../../../src/components/masonry/Masonry.tsx"],"sourcesContent":["import React, { FC, useCallback, useMemo, useRef, useState } from 'react';\nimport { AnimatePresence } from 'motion/react';\nimport { useElementSize } from '../../hooks/element';\nimport { MasonryComponent, MasonryItemProps, MasonryProps } from './Masonry.types';\nimport { MasonryContext } from './Masonry.context';\nimport { StyledMasonry } from './Masonry.styles';\nimport { useMasonryColumnCount, useMasonryItems, useMasonryLayout } from './Masonry.hooks';\nimport { getMasonryItemKey } from './Masonry.utils';\nimport MasonryItem, { InternalMasonryItem } from './masonry-item/MasonryItem';\n\nconst MasonryBase: FC<MasonryProps> = ({ children, gap = 8, columnWidth = 80, rowHeight = 80 }) => {\n    const ref = useRef<HTMLDivElement | null>(null);\n    const size = useElementSize(ref);\n\n    const containerWidth = size?.width ?? 0;\n\n    const [itemHeights, setItemHeights] = useState<Record<string, number>>({});\n\n    const items = useMasonryItems({ children });\n\n    const columnCount = useMasonryColumnCount({\n        containerWidth,\n        columnWidth,\n        gap,\n    });\n\n    const layout = useMasonryLayout({\n        items,\n        itemHeights,\n        columnCount,\n        columnWidth,\n        rowHeight,\n        gap,\n    });\n\n    const registerItem = useCallback((key: string, height: number) => {\n        setItemHeights((currentHeights) => {\n            if (currentHeights[key] === height) {\n                return currentHeights;\n            }\n\n            return {\n                ...currentHeights,\n                [key]: height,\n            };\n        });\n    }, []);\n\n    const contextValue = useMemo(\n        () => ({\n            registerItem,\n        }),\n        [registerItem],\n    );\n\n    return (\n        <MasonryContext.Provider value={contextValue}>\n            <StyledMasonry ref={ref} $height={layout.height}>\n                <AnimatePresence>\n                    {items.map((item, index) => {\n                        const key = getMasonryItemKey(\n                            item as React.ReactElement<MasonryItemProps>,\n                            index,\n                        );\n\n                        const packedItem = layout.items[key];\n\n                        if (!packedItem) {\n                            return null;\n                        }\n\n                        return (\n                            <InternalMasonryItem\n                                key={key}\n                                itemKey={key}\n                                x={packedItem.x}\n                                y={packedItem.y}\n                                width={packedItem.width}\n                            >\n                                {item.props.children}\n                            </InternalMasonryItem>\n                        );\n                    })}\n                </AnimatePresence>\n            </StyledMasonry>\n        </MasonryContext.Provider>\n    );\n};\n\nMasonryBase.displayName = 'Masonry';\n\nconst Masonry = Object.assign(MasonryBase, {\n    Item: MasonryItem,\n}) as MasonryComponent;\n\nexport default Masonry;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/masonry/Masonry.styles.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledMasonry = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const StyledMasonry = exports.StyledMasonry = _styledComponents.default.div`
+    position: relative;
+    width: 100%;
+    height: ${({
+  $height
+}) => $height}px;
+`;
+//# sourceMappingURL=Masonry.styles.js.map

package/lib/cjs/components/masonry/Masonry.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Masonry.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledMasonry","exports","styled","div","$height"],"sources":["../../../../src/components/masonry/Masonry.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledMasonry = styled.div<{ $height: number }>`\n    position: relative;\n    width: 100%;\n    height: ${({ $height }) => $height}px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAGE,yBAAM,CAACC,GAAwB;AAC5D;AACA;AACA,cAAc,CAAC;EAAEC;AAAQ,CAAC,KAAKA,OAAO;AACtC,CAAC","ignoreList":[]}

package/lib/cjs/components/masonry/Masonry.types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=Masonry.types.js.map

package/lib/cjs/components/masonry/Masonry.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Masonry.types.js","names":[],"sources":["../../../../src/components/masonry/Masonry.types.ts"],"sourcesContent":["import { ReactElement, ReactNode } from 'react';\n\nexport interface MasonryProps {\n    children: ReactNode;\n    gap?: number;\n    columnWidth?: number;\n    rowHeight?: number;\n}\n\nexport interface MasonryItemProps {\n    children: ReactNode;\n    columns?: number;\n}\n\nexport interface MasonryContextValue {\n    registerItem: (key: string, height: number) => void;\n}\n\nexport interface MasonryLayoutItem {\n    key: string;\n    columns: number;\n    rows: number;\n}\n\nexport interface PackedMasonryItem {\n    key: string;\n    x: number;\n    y: number;\n    width: number;\n}\n\nexport interface PackedMasonryGrid {\n    items: Record<string, PackedMasonryItem>;\n    height: number;\n}\n\nexport interface InternalMasonryItemProps {\n    children: ReactNode;\n    itemKey: string;\n    x: number;\n    y: number;\n    width: number;\n}\n\nexport type MasonryChild = ReactElement<MasonryItemProps>;\n\nexport type MasonryComponent = React.FC<MasonryProps> & {\n    Item: React.FC<MasonryItemProps>;\n};\n"],"mappings":"","ignoreList":[]}

package/lib/cjs/components/masonry/Masonry.utils.js

@@ -0,0 +1,121 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.packMasonryGrid = exports.getMasonryItemKey = exports.calculateRowSpan = exports.calculateColumnCount = void 0;
+const getMasonryItemKey = (item, index) => item.key != null ? String(item.key) : String(index);
+exports.getMasonryItemKey = getMasonryItemKey;
+const isAreaFree = ({
+  grid,
+  startColumn,
+  startRow,
+  columns,
+  rows,
+  columnCount
+}) => {
+  if (startColumn + columns > columnCount) {
+    return false;
+  }
+  for (let row = startRow; row < startRow + rows; row += 1) {
+    for (let column = startColumn; column < startColumn + columns; column += 1) {
+      var _grid$row;
+      if ((_grid$row = grid[row]) !== null && _grid$row !== void 0 && _grid$row[column]) {
+        return false;
+      }
+    }
+  }
+  return true;
+};
+const occupyArea = ({
+  grid,
+  startColumn,
+  startRow,
+  columns,
+  rows
+}) => {
+  for (let row = startRow; row < startRow + rows; row += 1) {
+    if (!grid[row]) {
+      // eslint-disable-next-line no-param-reassign
+      grid[row] = [];
+    }
+    for (let column = startColumn; column < startColumn + columns; column += 1) {
+      // eslint-disable-next-line no-param-reassign
+      grid[row][column] = true;
+    }
+  }
+};
+const packMasonryGrid = ({
+  items,
+  columnCount,
+  columnWidth,
+  rowHeight,
+  gap
+}) => {
+  const grid = [];
+  const packedItems = {};
+  let maxRow = 0;
+  items.forEach(item => {
+    const columns = Math.min(Math.max(item.columns, 1), columnCount);
+    const rows = Math.max(item.rows, 1);
+    let placed = false;
+    let row = 0;
+    while (!placed) {
+      for (let column = 0; column < columnCount; column += 1) {
+        const canPlaceItem = isAreaFree({
+          grid,
+          startColumn: column,
+          startRow: row,
+          columns,
+          rows,
+          columnCount
+        });
+        if (!canPlaceItem) {
+          continue;
+        }
+        occupyArea({
+          grid,
+          startColumn: column,
+          startRow: row,
+          columns,
+          rows
+        });
+        packedItems[item.key] = {
+          key: item.key,
+          x: column * (columnWidth + gap),
+          y: row * (rowHeight + gap),
+          width: columns * columnWidth + (columns - 1) * gap
+        };
+        maxRow = Math.max(maxRow, row + rows);
+        placed = true;
+        break;
+      }
+      if (!placed) {
+        row += 1;
+      }
+    }
+  });
+  return {
+    items: packedItems,
+    height: maxRow * rowHeight + Math.max(0, maxRow - 1) * gap
+  };
+};
+exports.packMasonryGrid = packMasonryGrid;
+const calculateColumnCount = ({
+  containerWidth,
+  columnWidth,
+  gap
+}) => {
+  if (!containerWidth) {
+    return 1;
+  }
+  return Math.max(1, Math.floor((containerWidth + gap) / (columnWidth + gap)));
+};
+exports.calculateColumnCount = calculateColumnCount;
+const calculateRowSpan = ({
+  height,
+  rowHeight,
+  gap
+}) => Math.max(1, Math.ceil((height + gap) / (rowHeight + gap)));
+exports.calculateRowSpan = calculateRowSpan;
+//# sourceMappingURL=Masonry.utils.js.map

package/lib/cjs/components/masonry/Masonry.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Masonry.utils.js","names":["getMasonryItemKey","item","index","key","String","exports","isAreaFree","grid","startColumn","startRow","columns","rows","columnCount","row","column","_grid$row","occupyArea","packMasonryGrid","items","columnWidth","rowHeight","gap","packedItems","maxRow","forEach","Math","min","max","placed","canPlaceItem","x","y","width","height","calculateColumnCount","containerWidth","floor","calculateRowSpan","ceil"],"sources":["../../../../src/components/masonry/Masonry.utils.ts"],"sourcesContent":["import { ReactElement } from 'react';\nimport {\n    MasonryItemProps,\n    MasonryLayoutItem,\n    PackedMasonryGrid,\n    PackedMasonryItem,\n} from './Masonry.types';\n\nexport const getMasonryItemKey = (item: ReactElement<MasonryItemProps>, index: number) =>\n    item.key != null ? String(item.key) : String(index);\n\ninterface IsAreaFreeParams {\n    grid: boolean[][];\n    startColumn: number;\n    startRow: number;\n    columns: number;\n    rows: number;\n    columnCount: number;\n}\n\nconst isAreaFree = ({\n    grid,\n    startColumn,\n    startRow,\n    columns,\n    rows,\n    columnCount,\n}: IsAreaFreeParams) => {\n    if (startColumn + columns > columnCount) {\n        return false;\n    }\n\n    for (let row = startRow; row < startRow + rows; row += 1) {\n        for (let column = startColumn; column < startColumn + columns; column += 1) {\n            if (grid[row]?.[column]) {\n                return false;\n            }\n        }\n    }\n\n    return true;\n};\n\ninterface OccupyAreaParams {\n    grid: boolean[][];\n    startColumn: number;\n    startRow: number;\n    columns: number;\n    rows: number;\n}\n\nconst occupyArea = ({ grid, startColumn, startRow, columns, rows }: OccupyAreaParams) => {\n    for (let row = startRow; row < startRow + rows; row += 1) {\n        if (!grid[row]) {\n            // eslint-disable-next-line no-param-reassign\n            grid[row] = [];\n        }\n\n        for (let column = startColumn; column < startColumn + columns; column += 1) {\n            // eslint-disable-next-line no-param-reassign\n            (grid[row] as boolean[])[column] = true;\n        }\n    }\n};\n\ninterface PackMasonryGridParams {\n    items: MasonryLayoutItem[];\n    columnCount: number;\n    columnWidth: number;\n    rowHeight: number;\n    gap: number;\n}\n\nexport const packMasonryGrid = ({\n    items,\n    columnCount,\n    columnWidth,\n    rowHeight,\n    gap,\n}: PackMasonryGridParams): PackedMasonryGrid => {\n    const grid: boolean[][] = [];\n    const packedItems: Record<string, PackedMasonryItem> = {};\n\n    let maxRow = 0;\n\n    items.forEach((item) => {\n        const columns = Math.min(Math.max(item.columns, 1), columnCount);\n        const rows = Math.max(item.rows, 1);\n\n        let placed = false;\n        let row = 0;\n\n        while (!placed) {\n            for (let column = 0; column < columnCount; column += 1) {\n                const canPlaceItem = isAreaFree({\n                    grid,\n                    startColumn: column,\n                    startRow: row,\n                    columns,\n                    rows,\n                    columnCount,\n                });\n\n                if (!canPlaceItem) {\n                    continue;\n                }\n\n                occupyArea({\n                    grid,\n                    startColumn: column,\n                    startRow: row,\n                    columns,\n                    rows,\n                });\n\n                packedItems[item.key] = {\n                    key: item.key,\n                    x: column * (columnWidth + gap),\n                    y: row * (rowHeight + gap),\n                    width: columns * columnWidth + (columns - 1) * gap,\n                };\n\n                maxRow = Math.max(maxRow, row + rows);\n                placed = true;\n                break;\n            }\n\n            if (!placed) {\n                row += 1;\n            }\n        }\n    });\n\n    return {\n        items: packedItems,\n        height: maxRow * rowHeight + Math.max(0, maxRow - 1) * gap,\n    };\n};\n\nexport const calculateColumnCount = ({\n    containerWidth,\n    columnWidth,\n    gap,\n}: {\n    containerWidth: number;\n    columnWidth: number;\n    gap: number;\n}) => {\n    if (!containerWidth) {\n        return 1;\n    }\n\n    return Math.max(1, Math.floor((containerWidth + gap) / (columnWidth + gap)));\n};\n\nexport const calculateRowSpan = ({\n    height,\n    rowHeight,\n    gap,\n}: {\n    height: number;\n    rowHeight: number;\n    gap: number;\n}) => Math.max(1, Math.ceil((height + gap) / (rowHeight + gap)));\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/masonry/masonry-item/MasonryItem.js

@@ -0,0 +1,77 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.InternalMasonryItem = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Masonry = require("../Masonry.context");
+var _MasonryItem = require("./MasonryItem.styles");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const MasonryItem = ({
+  children
+}) => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children);
+const InternalMasonryItem = ({
+  children,
+  itemKey,
+  x,
+  y,
+  width
+}) => {
+  const ref = (0, _react.useRef)(null);
+  const {
+    registerItem
+  } = (0, _Masonry.useMasonryContext)();
+  (0, _react.useEffect)(() => {
+    const element = ref.current;
+    if (!element) {
+      return undefined;
+    }
+    let frameId;
+    const updateHeight = () => {
+      if (frameId) {
+        window.cancelAnimationFrame(frameId);
+      }
+      frameId = window.requestAnimationFrame(() => {
+        registerItem(itemKey, element.getBoundingClientRect().height);
+      });
+    };
+    updateHeight();
+    const observer = new ResizeObserver(updateHeight);
+    observer.observe(element);
+    return () => {
+      if (frameId) {
+        window.cancelAnimationFrame(frameId);
+      }
+      observer.disconnect();
+    };
+  }, [itemKey, registerItem, width]);
+  return /*#__PURE__*/_react.default.createElement(_MasonryItem.StyledMasonryItem, {
+    ref: ref,
+    initial: {
+      opacity: 0,
+      scale: 0.96
+    },
+    animate: {
+      opacity: 1,
+      scale: 1,
+      x,
+      y,
+      width
+    },
+    exit: {
+      opacity: 0,
+      scale: 0.96
+    },
+    transition: {
+      type: 'spring',
+      stiffness: 320,
+      damping: 34,
+      mass: 0.85
+    }
+  }, children);
+};
+exports.InternalMasonryItem = InternalMasonryItem;
+MasonryItem.displayName = 'Masonry.Item';
+var _default = exports.default = MasonryItem;
+//# sourceMappingURL=MasonryItem.js.map