@economic/taco 1.25.3 → 1.26.0

package/dist/components/ButtonGroup/ButtonGroup.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { ButtonProps } from '../Button/Button';
+export declare const ButtonGroup: React.ForwardRefExoticComponent<Pick<React.HTMLAttributes<HTMLElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & {
+    children: React.ReactElement<ButtonProps>[];
+} & React.RefAttributes<HTMLDivElement>>;

package/dist/esm/packages/taco/src/components/ButtonGroup/ButtonGroup.js

@@ -0,0 +1,46 @@
+import React__default from 'react';
+import cn from 'classnames';
+import { IconButton } from '../IconButton/IconButton.js';
+import { useMergedRef } from '../../hooks/useMergedRef.js';
+import { Group } from '../Group/Group.js';
+import { Menu } from '../Menu/Menu.js';
+import { useIntersectionObserver } from '../../hooks/useIntersectionObserver.js';
+
+const sanitizeButtonPropsForMenuItem = props => {
+  const {
+    appearance: _1,
+    drawer: _2,
+    fluid: _3,
+    hanger: _4,
+    menu: _5,
+    popover: _6,
+    tooltip: _7,
+    ...attributes
+  } = props;
+  return attributes;
+};
+const OFFSET = 32 + 8;
+const ButtonGroup = /*#__PURE__*/React__default.forwardRef(function ButtonGroup(props, ref) {
+  const internalRef = useMergedRef(ref);
+  const intersectedChildIndex = useIntersectionObserver(internalRef, OFFSET);
+  const children = React__default.Children.toArray(props.children);
+  const hidden = intersectedChildIndex !== undefined ? children.slice(intersectedChildIndex) : [];
+  return /*#__PURE__*/React__default.createElement(Group, Object.assign({}, props, {
+    ref: internalRef
+  }), children.map((child, index) => /*#__PURE__*/React__default.cloneElement(child, {
+    className: cn(child.props.className, {
+      visible: intersectedChildIndex === undefined || index < intersectedChildIndex,
+      'invisible order-[100] pointer-events-none': intersectedChildIndex !== undefined && index >= intersectedChildIndex
+    })
+  })), hidden.length ? /*#__PURE__*/React__default.createElement(IconButton, {
+    className: "sticky right-0 order-[99]",
+    "data-intesection-observer": "ignore",
+    icon: "more",
+    menu: menuProps => /*#__PURE__*/React__default.createElement(Menu, Object.assign({}, menuProps), /*#__PURE__*/React__default.createElement(Menu.Content, null, hidden.map((button, index) => /*#__PURE__*/React__default.createElement(Menu.Item, Object.assign({
+      key: index
+    }, sanitizeButtonPropsForMenuItem(button.props))))))
+  }) : null);
+});
+
+export { ButtonGroup };
+//# sourceMappingURL=ButtonGroup.js.map

package/dist/esm/packages/taco/src/components/ButtonGroup/ButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.js","sources":["../../../../../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { ButtonProps } from '../Button/Button';\nimport { Group } from '../Group/Group';\nimport { Menu } from '../Menu/Menu';\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { IconButton } from '../IconButton/IconButton';\n\nconst sanitizeButtonPropsForMenuItem = props => {\n    const { appearance: _1, drawer: _2, fluid: _3, hanger: _4, menu: _5, popover: _6, tooltip: _7, ...attributes } = props;\n    return attributes;\n};\n\ntype ButtonGroupProps = Omit<React.HTMLAttributes<HTMLElement>, 'children'> & {\n    children: React.ReactElement<ButtonProps>[];\n};\n\nconst OFFSET = 32 + 8;\n\nexport const ButtonGroup = React.forwardRef(function ButtonGroup(props: ButtonGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const internalRef = useMergedRef<HTMLDivElement>(ref);\n    const intersectedChildIndex = useIntersectionObserver(internalRef, OFFSET);\n    const children = React.Children.toArray(props.children) as React.ReactElement<ButtonProps>[];\n\n    const hidden = intersectedChildIndex !== undefined ? children.slice(intersectedChildIndex) : [];\n\n    return (\n        <Group {...props} ref={internalRef}>\n            {children.map((child, index) =>\n                React.cloneElement(child, {\n                    className: cn(child.props.className, {\n                        visible: intersectedChildIndex === undefined || index < intersectedChildIndex,\n                        'invisible order-[100] pointer-events-none':\n                            intersectedChildIndex !== undefined && index >= intersectedChildIndex,\n                    }),\n                })\n            )}\n            {hidden.length ? (\n                <IconButton\n                    className=\"sticky right-0 order-[99]\"\n                    data-intesection-observer=\"ignore\"\n                    icon=\"more\"\n                    menu={menuProps => (\n                        <Menu {...menuProps}>\n                            <Menu.Content>\n                                {hidden.map((button, index) => (\n                                    <Menu.Item key={index} {...sanitizeButtonPropsForMenuItem(button.props)} />\n                                ))}\n                            </Menu.Content>\n                        </Menu>\n                    )}\n                />\n            ) : null}\n        </Group>\n    );\n});\n"],"names":["sanitizeButtonPropsForMenuItem","props","appearance","_1","drawer","_2","fluid","_3","hanger","_4","menu","_5","popover","_6","tooltip","_7","attributes","OFFSET","ButtonGroup","React","forwardRef","ref","internalRef","useMergedRef","intersectedChildIndex","useIntersectionObserver","children","Children","toArray","hidden","undefined","slice","Group","map","child","index","cloneElement","className","cn","visible","length","IconButton","icon","menuProps","Menu","Content","button","Item","key"],"mappings":";;;;;;;;AASA,MAAMA,8BAA8B,GAAGC,KAAK;EACxC,MAAM;IAAEC,UAAU,EAAEC,EAAE;IAAEC,MAAM,EAAEC,EAAE;IAAEC,KAAK,EAAEC,EAAE;IAAEC,MAAM,EAAEC,EAAE;IAAEC,IAAI,EAAEC,EAAE;IAAEC,OAAO,EAAEC,EAAE;IAAEC,OAAO,EAAEC,EAAE;IAAE,GAAGC;GAAY,GAAGf,KAAK;EACtH,OAAOe,UAAU;AACrB,CAAC;AAMD,MAAMC,MAAM,GAAG,EAAE,GAAG,CAAC;MAERC,WAAW,gBAAGC,cAAK,CAACC,UAAU,CAAC,SAASF,WAAW,CAACjB,KAAuB,EAAEoB,GAA8B;EACpH,MAAMC,WAAW,GAAGC,YAAY,CAAiBF,GAAG,CAAC;EACrD,MAAMG,qBAAqB,GAAGC,uBAAuB,CAACH,WAAW,EAAEL,MAAM,CAAC;EAC1E,MAAMS,QAAQ,GAAGP,cAAK,CAACQ,QAAQ,CAACC,OAAO,CAAC3B,KAAK,CAACyB,QAAQ,CAAsC;EAE5F,MAAMG,MAAM,GAAGL,qBAAqB,KAAKM,SAAS,GAAGJ,QAAQ,CAACK,KAAK,CAACP,qBAAqB,CAAC,GAAG,EAAE;EAE/F,oBACIL,6BAACa,KAAK,oBAAK/B,KAAK;IAAEoB,GAAG,EAAEC;MAClBI,QAAQ,CAACO,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,kBACvBhB,cAAK,CAACiB,YAAY,CAACF,KAAK,EAAE;IACtBG,SAAS,EAAEC,EAAE,CAACJ,KAAK,CAACjC,KAAK,CAACoC,SAAS,EAAE;MACjCE,OAAO,EAAEf,qBAAqB,KAAKM,SAAS,IAAIK,KAAK,GAAGX,qBAAqB;MAC7E,2CAA2C,EACvCA,qBAAqB,KAAKM,SAAS,IAAIK,KAAK,IAAIX;KACvD;GACJ,CAAC,CACL,EACAK,MAAM,CAACW,MAAM,gBACVrB,6BAACsB,UAAU;IACPJ,SAAS,EAAC,2BAA2B;iCACX,QAAQ;IAClCK,IAAI,EAAC,MAAM;IACXhC,IAAI,EAAEiC,SAAS,iBACXxB,6BAACyB,IAAI,oBAAKD,SAAS,gBACfxB,6BAACyB,IAAI,CAACC,OAAO,QACRhB,MAAM,CAACI,GAAG,CAAC,CAACa,MAAM,EAAEX,KAAK,kBACtBhB,6BAACyB,IAAI,CAACG,IAAI;MAACC,GAAG,EAAEb;OAAWnC,8BAA8B,CAAC8C,MAAM,CAAC7C,KAAK,CAAC,EAC1E,CAAC,CACS;IAGzB,GACF,IAAI,CACJ;AAEhB,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/Combobox/useCombobox.js

@@ -1,6 +1,6 @@
 import { useRef, useState, useMemo, useEffect } from 'react';
-import { v4 } from 'uuid';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
+import { v4 } from 'uuid';
 import debounce from 'lodash-es/debounce';
 import { getId } from '../Listbox/ScrollableList.js';
 import { createCustomKeyboardEvent } from '../../utils/input.js';

package/dist/esm/packages/taco/src/components/Drawer/Drawer.js

@@ -1,9 +1,9 @@
 import { forwardRef, useState, useMemo, useCallback, useEffect, createElement } from 'react';
 import cn from 'classnames';
+import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { Root } from '@radix-ui/react-dialog';
 import { DrawerContext } from './Context.js';
 import { Content, InnerContent, Title, Footer, Close, Actions } from './components/Content.js';
-import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { Trigger } from './components/Trigger.js';
 
 const Outlet = /*#__PURE__*/forwardRef(function Outlet(props, ref) {

package/dist/esm/packages/taco/src/components/Drawer/components/Content.js

@@ -4,10 +4,10 @@ import { Backdrop } from '../../Backdrop/Backdrop.js';
 import { IconButton } from '../../IconButton/IconButton.js';
 import { useLocalization } from '../../Provider/Localization.js';
 import { useMergedRef } from '../../../hooks/useMergedRef.js';
-import { Title as Title$1, Close as Close$1, Portal as Portal$1, Overlay, Content as Content$1 } from '@radix-ui/react-dialog';
-import { useDraggable } from '../../../utils/hooks/useDraggable.js';
 import { Group } from '../../Group/Group.js';
 import { useCurrentMenu } from '../../Menu/Context.js';
+import { Title as Title$1, Close as Close$1, Portal as Portal$1, Overlay, Content as Content$1 } from '@radix-ui/react-dialog';
+import { useDraggable } from '../../../utils/hooks/useDraggable.js';
 import { useCurrentDrawer } from '../Context.js';
 import { getBackdropClassNames, getDrawerContainerClassNames, getDrawerContentClassNames, getDrawerDragHandlerClassNames } from '../util.js';
 import { useGlobalKeyboardShortcut } from '../../../hooks/useGlobalKeyboardShortcut.js';

package/dist/esm/packages/taco/src/components/Group/Group.js

@@ -7,7 +7,7 @@ const Group = /*#__PURE__*/forwardRef(function Group(props, ref) {
     orientation = 'horizontal',
     ...otherProps
   } = props;
-  const className = cn('flex ', 'gap-2', {
+  const className = cn('flex gap-2', {
     'flex-col ': orientation === 'vertical'
   }, props.className);
   return /*#__PURE__*/createElement(Tag, Object.assign({}, otherProps, {

package/dist/esm/packages/taco/src/components/Group/Group.js.map

@@ -1 +1 @@
-{"version":3,"file":"Group.js","sources":["../../../../../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { Orientation } from '../../types';\n\nexport type GroupProps = React.HTMLAttributes<HTMLElement> & {\n    /**\n     * Change what html tag element will render.\n     * Default value is `span`\n     */\n    as?: 'div' | 'span' | 'nav';\n    /** Content should be composed of other Taco elements */\n    children: React.ReactNode;\n    /**\n     * Define orientation of grouping.\n     * @defaultValue horizontal\n     */\n    orientation?: Orientation;\n};\n\nexport const Group = React.forwardRef(function Group(props: GroupProps, ref: React.Ref<HTMLDivElement>) {\n    const { as: Tag = 'span', orientation = 'horizontal', ...otherProps } = props;\n    const className = cn('flex ', 'gap-2', { 'flex-col ': orientation === 'vertical' }, props.className);\n    return <Tag {...otherProps} className={className} data-taco=\"group\" ref={ref} />;\n});\n"],"names":["Group","React","props","ref","as","Tag","orientation","otherProps","className","cn"],"mappings":";;;MAmBaA,KAAK,gBAAGC,UAAgB,CAAC,SAASD,KAAK,CAACE,KAAiB,EAAEC,GAA8B;EAClG,MAAM;IAAEC,EAAE,EAAEC,GAAG,GAAG,MAAM;IAAEC,WAAW,GAAG,YAAY;IAAE,GAAGC;GAAY,GAAGL,KAAK;EAC7E,MAAMM,SAAS,GAAGC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE;IAAE,WAAW,EAAEH,WAAW,KAAK;GAAY,EAAEJ,KAAK,CAACM,SAAS,CAAC;EACpG,oBAAOP,cAACI,GAAG,oBAAKE,UAAU;IAAEC,SAAS,EAAEA,SAAS;iBAAY,OAAO;IAACL,GAAG,EAAEA;KAAO;AACpF,CAAC;;;;"}
+{"version":3,"file":"Group.js","sources":["../../../../../../../src/components/Group/Group.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { Orientation } from '../../types';\n\nexport type GroupProps = React.HTMLAttributes<HTMLElement> & {\n    /**\n     * Change what html tag element will render.\n     * Default value is `span`\n     */\n    as?: 'div' | 'span' | 'nav';\n    /** Content should be composed of other Taco elements */\n    children: React.ReactNode;\n    /**\n     * Define orientation of grouping.\n     * @defaultValue horizontal\n     */\n    orientation?: Orientation;\n};\n\nexport const Group = React.forwardRef(function Group(props: GroupProps, ref: React.Ref<HTMLDivElement>) {\n    const { as: Tag = 'span', orientation = 'horizontal', ...otherProps } = props;\n    const className = cn('flex gap-2', { 'flex-col ': orientation === 'vertical' }, props.className);\n    return <Tag {...otherProps} className={className} data-taco=\"group\" ref={ref} />;\n});\n"],"names":["Group","React","props","ref","as","Tag","orientation","otherProps","className","cn"],"mappings":";;;MAmBaA,KAAK,gBAAGC,UAAgB,CAAC,SAASD,KAAK,CAACE,KAAiB,EAAEC,GAA8B;EAClG,MAAM;IAAEC,EAAE,EAAEC,GAAG,GAAG,MAAM;IAAEC,WAAW,GAAG,YAAY;IAAE,GAAGC;GAAY,GAAGL,KAAK;EAC7E,MAAMM,SAAS,GAAGC,EAAE,CAAC,YAAY,EAAE;IAAE,WAAW,EAAEH,WAAW,KAAK;GAAY,EAAEJ,KAAK,CAACM,SAAS,CAAC;EAChG,oBAAOP,cAACI,GAAG,oBAAKE,UAAU;IAAEC,SAAS,EAAEA,SAAS;iBAAY,OAAO;IAACL,GAAG,EAAEA;KAAO;AACpF,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/Header/components/AgreementSelector.js

@@ -2,9 +2,9 @@ import React__default from 'react';
 import { Icon } from '../../Icon/Icon.js';
 import { useLocalization } from '../../Provider/Localization.js';
 import { Button } from '../../Button/Button.js';
+import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { Root, Trigger, Content } from '@radix-ui/react-popover';
 import { createCustomKeyboardEvent } from '../../../utils/input.js';
-import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { SearchInput } from '../../SearchInput/SearchInput.js';
 import { Root as Root$1 } from '../../../primitives/Collection/components/Root.js';
 import '../../../primitives/Collection/Collection.js';

package/dist/esm/packages/taco/src/components/Header/components/PrimaryNavigation.js

@@ -2,9 +2,9 @@ import React__default from 'react';
 import cn from 'classnames';
 import { useLocalization } from '../../Provider/Localization.js';
 import { Button } from '../../Button/Button.js';
-import { useBoundingClientRectListener } from '../../../hooks/useBoundingClientRectListener.js';
 import { useMergedRef } from '../../../hooks/useMergedRef.js';
 import { Menu } from '../../Menu/Menu.js';
+import { useBoundingClientRectListener } from '../../../hooks/useBoundingClientRectListener.js';
 import { getLinkClasses } from './Link.js';
 import { Portal } from '@radix-ui/react-portal';
 

package/dist/esm/packages/taco/src/components/Input/Input.js

@@ -1,9 +1,9 @@
 import { forwardRef, createElement, useRef, memo, cloneElement } from 'react';
 import cn from 'classnames';
 import { Icon } from '../Icon/Icon.js';
+import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { getButtonStateClasses, getInputClasses } from './util.js';
 import { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener.js';
-import { useMergedRef } from '../../hooks/useMergedRef.js';
 
 const validSetSelectionRangeTypes = ['text', 'search', 'url', 'tel', 'password'];
 const InputWithoutDeprecatedFeatures = /*#__PURE__*/forwardRef(function InputWithoutDeprecatedFeatures(props, ref) {

package/dist/esm/packages/taco/src/components/Listbox/ScrollableList.js

@@ -1,9 +1,9 @@
 import { forwardRef, useMemo, createRef, useEffect, createElement } from 'react';
 import cn from 'classnames';
 import { useLocalization } from '../Provider/Localization.js';
+import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { Checkbox } from '../Checkbox/Checkbox.js';
 import { getInputClasses } from '../Input/util.js';
-import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { getNextIndexFromKey } from '../../utils/hooks/useListKeyboardNavigation.js';
 import { useListScrollTo } from '../../utils/hooks/useListScrollTo.js';
 import { Spinner } from '../Spinner/Spinner.js';

package/dist/esm/packages/taco/src/components/Listbox/useListbox.js

@@ -1,6 +1,6 @@
 import { useMemo, useEffect } from 'react';
-import { v4 } from 'uuid';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
+import { v4 } from 'uuid';
 import { useFlattenedData, getIndexFromValue, getActiveDescendant, setInputValueByRef, findByValue, sanitizeItem } from './util.js';
 import { useTypeahead } from './useTypeahead.js';
 

package/dist/esm/packages/taco/src/components/Listbox/useMultiListbox.js

@@ -1,7 +1,7 @@
 import { useMemo, useState, useEffect } from 'react';
 import { useLocalization } from '../Provider/Localization.js';
-import { v4 } from 'uuid';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
+import { v4 } from 'uuid';
 import { getIndexFromValue, getSelectedIndexesFromValue, setInputValueByRef, getActiveDescendant, findByValue } from './util.js';
 import { useTypeahead } from './useTypeahead.js';
 

package/dist/esm/packages/taco/src/components/Menu/Menu.js

@@ -1,7 +1,7 @@
 import { forwardRef, useState, useMemo, createElement } from 'react';
-import { MenuContext } from './Context.js';
-import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { Root } from '@radix-ui/react-dropdown-menu';
+import { useControllableState } from '@radix-ui/react-use-controllable-state';
+import { MenuContext } from './Context.js';
 import { Content } from './components/Content.js';
 import { Item } from './components/Item.js';
 import { Link } from './components/Link.js';

package/dist/esm/packages/taco/src/components/Menu/components/Content.js

@@ -1,8 +1,8 @@
 import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
 import { useMergedRef } from '../../../hooks/useMergedRef.js';
-import { useCurrentMenu } from '../Context.js';
 import { Portal, Content as Content$1 } from '@radix-ui/react-dropdown-menu';
+import { useCurrentMenu } from '../Context.js';
 
 const Content = /*#__PURE__*/forwardRef(function MenuContent(props, ref) {
   const internalRef = useMergedRef(ref);

package/dist/esm/packages/taco/src/components/Menu/components/Header.js

@@ -1,7 +1,7 @@
 import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
-import { useCurrentMenu } from '../Context.js';
 import { Label } from '@radix-ui/react-dropdown-menu';
+import { useCurrentMenu } from '../Context.js';
 
 const Header = /*#__PURE__*/forwardRef(function MenuHeader(props, ref) {
   const menu = useCurrentMenu();

package/dist/esm/packages/taco/src/components/Menu/components/Item.js

@@ -1,8 +1,8 @@
 import { forwardRef, createElement, useEffect } from 'react';
 import cn from 'classnames';
 import { Icon as Icon$1 } from '../../Icon/Icon.js';
-import { useCurrentMenu } from '../Context.js';
 import { Item as Item$1 } from '@radix-ui/react-dropdown-menu';
+import { useCurrentMenu } from '../Context.js';
 
 const Icon = ({
   name

package/dist/esm/packages/taco/src/components/Menu/components/Link.js

@@ -1,6 +1,6 @@
 import { forwardRef, createElement } from 'react';
-import { useCurrentMenu } from '../Context.js';
 import { Item } from '@radix-ui/react-dropdown-menu';
+import { useCurrentMenu } from '../Context.js';
 import { useItemStyling, Icon } from './Item.js';
 
 const Link = /*#__PURE__*/forwardRef(function MenuLink(props, ref) {

package/dist/esm/packages/taco/src/components/Menu/components/Trigger.js

@@ -1,7 +1,7 @@
 import { forwardRef, useEffect, createElement } from 'react';
 import { useMergedRef } from '../../../hooks/useMergedRef.js';
-import { useCurrentMenu } from '../Context.js';
 import { Trigger as Trigger$1 } from '@radix-ui/react-dropdown-menu';
+import { useCurrentMenu } from '../Context.js';
 
 const Trigger = /*#__PURE__*/forwardRef(function MenuTrigger(props, ref) {
   const menu = useCurrentMenu();

package/dist/esm/packages/taco/src/components/Select/useSelect.js

@@ -1,8 +1,8 @@
 import { useState, useMemo, useRef, useEffect, createElement, Fragment, cloneElement } from 'react';
 import cn from 'classnames';
 import { useLocalization } from '../Provider/Localization.js';
-import { v4 } from 'uuid';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
+import { v4 } from 'uuid';
 import { createCustomEvent } from '../../utils/input.js';
 import { useFlattenedData, findByValue, setInputValueByRef, sanitizeItem } from '../Listbox/util.js';
 

package/dist/esm/packages/taco/src/components/Select2/Select2.js

@@ -1,11 +1,11 @@
 import React__default from 'react';
 import cn from 'classnames';
 import { useLocalization } from '../Provider/Localization.js';
+import { useMergedRef } from '../../hooks/useMergedRef.js';
+import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { Root, Trigger, Portal, Content } from '@radix-ui/react-popover';
 import { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener.js';
-import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { createCustomKeyboardEvent } from '../../utils/input.js';
-import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { isAriaDirectionKey } from '../../utils/aria.js';
 import { Root as Root$1, createListboxValueSetter } from '../../primitives/Listbox2/components/Root.js';
 import '../../primitives/Listbox2/components/Option.js';

package/dist/esm/packages/taco/src/components/Select2/components/Edit.js

@@ -4,11 +4,11 @@ import { AVAILABLE_COLORS, getSubtleColorShadeClasses } from '../../../utils/tai
 import { Icon } from '../../Icon/Icon.js';
 import { useLocalization } from '../../Provider/Localization.js';
 import { Button } from '../../Button/Button.js';
+import { Group } from '../../Group/Group.js';
+import { Root, Item, Indicator } from '@radix-ui/react-radio-group';
 import { Input } from '../../Input/Input.js';
 import { Popover } from '../../Popover/Popover.js';
-import { Group } from '../../Group/Group.js';
 import { Field } from '../../Field/Field.js';
-import { Root, Item, Indicator } from '@radix-ui/react-radio-group';
 import { useSelect2Context } from './Context.js';
 import { _catch } from '../../../../../../node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js';
 

package/dist/esm/packages/taco/src/components/Select2/components/Trigger.js

@@ -3,8 +3,8 @@ import cn from 'classnames';
 import { Icon } from '../../Icon/Icon.js';
 import { Badge } from '../../Badge/Badge.js';
 import { Tooltip } from '../../Tooltip/Tooltip.js';
-import { getInputClasses } from '../../Input/util.js';
 import { useMergedRef } from '../../../hooks/useMergedRef.js';
+import { getInputClasses } from '../../Input/util.js';
 import { ScrollArea } from '../../ScrollArea/ScrollArea.js';
 import { Tag } from '../../Tag/Tag.js';
 import { useSelect2Context } from './Context.js';

package/dist/esm/packages/taco/src/components/Table/components/WindowedTable.js

@@ -1,8 +1,8 @@
 import React__default from 'react';
 import cn from 'classnames';
 import { useLocalization } from '../../Provider/Localization.js';
-import { useBoundingClientRectListener } from '../../../hooks/useBoundingClientRectListener.js';
 import { useMergedRef } from '../../../hooks/useMergedRef.js';
+import { useBoundingClientRectListener } from '../../../hooks/useBoundingClientRectListener.js';
 import { useTable } from '../hooks/useTable.js';
 import { Row } from '../util/renderRow.js';
 import { BaseTable, DefaultEmptyState } from './BaseTable.js';

package/dist/esm/packages/taco/src/components/Table/hooks/useTableKeyboardNavigation.js

@@ -1,6 +1,6 @@
 import React__default from 'react';
-import { getNextIndexFromKey } from '../../../utils/hooks/useListKeyboardNavigation.js';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
+import { getNextIndexFromKey } from '../../../utils/hooks/useListKeyboardNavigation.js';
 import { sanitizeRowProps } from '../util.js';
 
 const useTableKeyboardNavigation = (props, rows, rowProps, ref) => {

package/dist/esm/packages/taco/src/components/Table2/components/filters/FiltersButton.js

@@ -3,8 +3,8 @@ import cn from 'classnames';
 import { Icon } from '../../../Icon/Icon.js';
 import { useLocalization } from '../../../Provider/Localization.js';
 import { Button } from '../../../Button/Button.js';
-import { Popover } from '../../../Popover/Popover.js';
 import { Group } from '../../../Group/Group.js';
+import { Popover } from '../../../Popover/Popover.js';
 import { useGlobalKeyboardShortcut } from '../../../../hooks/useGlobalKeyboardShortcut.js';
 import { Shortcut } from '../../../Shortcut/Shortcut.js';
 import { isInternalColumn } from '../../utilities/columns.js';

package/dist/esm/packages/taco/src/components/Table2/utilities/columns.js

@@ -3,8 +3,8 @@ import cn from 'classnames';
 import { Icon } from '../../Icon/Icon.js';
 import { Tooltip } from '../../Tooltip/Tooltip.js';
 import { IconButton } from '../../IconButton/IconButton.js';
-import { Checkbox } from '../../Checkbox/Checkbox.js';
 import { Menu } from '../../Menu/Menu.js';
+import { Checkbox } from '../../Checkbox/Checkbox.js';
 import { Shortcut } from '../../Shortcut/Shortcut.js';
 import { useRowContext } from '../components/row/Context.js';
 

package/dist/esm/packages/taco/src/hooks/useIntersectionObserver.js

@@ -0,0 +1,48 @@
+import React__default from 'react';
+
+const useIntersectionObserver = (ref, offset) => {
+  const [intersectedIndexes, setIntersectedIndexes] = React__default.useState({});
+  const handleIntersection = (entries, observer) => {
+    if (observer.root) {
+      const children = Array.from(observer.root.children);
+      const map = {};
+      entries.forEach(entry => {
+        // entries only contains the items being intersected not all children of the ref
+        // so use root and the the entry being intersected to find its real index
+        // on first mount this is different - all children are present
+        map[children.indexOf(entry.target)] = entry.isIntersecting;
+      });
+      setIntersectedIndexes(prev => ({
+        ...prev,
+        ...map
+      }));
+    }
+  };
+  const intersectedChildIndex = React__default.useMemo(() => {
+    const index = Object.values(intersectedIndexes).indexOf(false);
+    return index > -1 ? index : undefined;
+  }, [intersectedIndexes]);
+  const hasRootMargin = intersectedChildIndex !== undefined && offset;
+  React__default.useEffect(() => {
+    const observer = new IntersectionObserver(handleIntersection, {
+      root: ref.current,
+      // offset the button, but only after the first item has been intersected
+      rootMargin: hasRootMargin ? `0px -${offset}px 0px 0px` : undefined,
+      threshold: 1
+    });
+    if (observer.root) {
+      Array.from(observer.root.children).forEach(item => {
+        if (item.getAttribute('data-intersection-observer') !== 'ignore') {
+          observer.observe(item);
+        }
+      });
+    }
+    return () => {
+      observer.disconnect();
+    };
+  }, [hasRootMargin]);
+  return intersectedChildIndex;
+};
+
+export { useIntersectionObserver };
+//# sourceMappingURL=useIntersectionObserver.js.map

package/dist/esm/packages/taco/src/hooks/useIntersectionObserver.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIntersectionObserver.js","sources":["../../../../../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import React from 'react';\n\nexport const useIntersectionObserver = (ref: React.RefObject<HTMLElement>, offset?: number) => {\n    const [intersectedIndexes, setIntersectedIndexes] = React.useState({});\n\n    const handleIntersection = (entries: IntersectionObserverEntry[], observer: IntersectionObserver) => {\n        if (observer.root) {\n            const children = Array.from((observer.root as Element).children);\n            const map = {};\n\n            entries.forEach(entry => {\n                // entries only contains the items being intersected not all children of the ref\n                // so use root and the the entry being intersected to find its real index\n                // on first mount this is different - all children are present\n                map[children.indexOf(entry.target)] = entry.isIntersecting;\n            });\n\n            setIntersectedIndexes(prev => ({ ...prev, ...map }));\n        }\n    };\n\n    const intersectedChildIndex = React.useMemo(() => {\n        const index = Object.values(intersectedIndexes).indexOf(false);\n        return index > -1 ? index : undefined;\n    }, [intersectedIndexes]);\n\n    const hasRootMargin = intersectedChildIndex !== undefined && offset;\n\n    React.useEffect(() => {\n        const observer = new IntersectionObserver(handleIntersection, {\n            root: ref.current,\n            // offset the button, but only after the first item has been intersected\n            rootMargin: hasRootMargin ? `0px -${offset}px 0px 0px` : undefined,\n            threshold: 1,\n        });\n\n        if (observer.root) {\n            Array.from(observer.root.children).forEach(item => {\n                if (item.getAttribute('data-intersection-observer') !== 'ignore') {\n                    observer.observe(item);\n                }\n            });\n        }\n\n        return () => {\n            observer.disconnect();\n        };\n    }, [hasRootMargin]);\n\n    return intersectedChildIndex;\n};\n"],"names":["useIntersectionObserver","ref","offset","intersectedIndexes","setIntersectedIndexes","React","useState","handleIntersection","entries","observer","root","children","Array","from","map","forEach","entry","indexOf","target","isIntersecting","prev","intersectedChildIndex","useMemo","index","Object","values","undefined","hasRootMargin","useEffect","IntersectionObserver","current","rootMargin","threshold","item","getAttribute","observe","disconnect"],"mappings":";;MAEaA,uBAAuB,GAAG,CAACC,GAAiC,EAAEC,MAAe;EACtF,MAAM,CAACC,kBAAkB,EAAEC,qBAAqB,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAC,EAAE,CAAC;EAEtE,MAAMC,kBAAkB,GAAG,CAACC,OAAoC,EAAEC,QAA8B;IAC5F,IAAIA,QAAQ,CAACC,IAAI,EAAE;MACf,MAAMC,QAAQ,GAAGC,KAAK,CAACC,IAAI,CAAEJ,QAAQ,CAACC,IAAgB,CAACC,QAAQ,CAAC;MAChE,MAAMG,GAAG,GAAG,EAAE;MAEdN,OAAO,CAACO,OAAO,CAACC,KAAK;;;;QAIjBF,GAAG,CAACH,QAAQ,CAACM,OAAO,CAACD,KAAK,CAACE,MAAM,CAAC,CAAC,GAAGF,KAAK,CAACG,cAAc;OAC7D,CAAC;MAEFf,qBAAqB,CAACgB,IAAI,KAAK;QAAE,GAAGA,IAAI;QAAE,GAAGN;OAAK,CAAC,CAAC;;GAE3D;EAED,MAAMO,qBAAqB,GAAGhB,cAAK,CAACiB,OAAO,CAAC;IACxC,MAAMC,KAAK,GAAGC,MAAM,CAACC,MAAM,CAACtB,kBAAkB,CAAC,CAACc,OAAO,CAAC,KAAK,CAAC;IAC9D,OAAOM,KAAK,GAAG,CAAC,CAAC,GAAGA,KAAK,GAAGG,SAAS;GACxC,EAAE,CAACvB,kBAAkB,CAAC,CAAC;EAExB,MAAMwB,aAAa,GAAGN,qBAAqB,KAAKK,SAAS,IAAIxB,MAAM;EAEnEG,cAAK,CAACuB,SAAS,CAAC;IACZ,MAAMnB,QAAQ,GAAG,IAAIoB,oBAAoB,CAACtB,kBAAkB,EAAE;MAC1DG,IAAI,EAAET,GAAG,CAAC6B,OAAO;;MAEjBC,UAAU,EAAEJ,aAAa,WAAWzB,kBAAkB,GAAGwB,SAAS;MAClEM,SAAS,EAAE;KACd,CAAC;IAEF,IAAIvB,QAAQ,CAACC,IAAI,EAAE;MACfE,KAAK,CAACC,IAAI,CAACJ,QAAQ,CAACC,IAAI,CAACC,QAAQ,CAAC,CAACI,OAAO,CAACkB,IAAI;QAC3C,IAAIA,IAAI,CAACC,YAAY,CAAC,4BAA4B,CAAC,KAAK,QAAQ,EAAE;UAC9DzB,QAAQ,CAAC0B,OAAO,CAACF,IAAI,CAAC;;OAE7B,CAAC;;IAGN,OAAO;MACHxB,QAAQ,CAAC2B,UAAU,EAAE;KACxB;GACJ,EAAE,CAACT,aAAa,CAAC,CAAC;EAEnB,OAAON,qBAAqB;AAChC;;;;"}

package/dist/esm/packages/taco/src/index.js

@@ -13,11 +13,16 @@ export { Base, IconButton } from './components/IconButton/IconButton.js';
 export { LocalizationContext, LocalizationProvider, defaultLocalisationTexts, useLocalization } from './components/Provider/Localization.js';
 export { Banner } from './components/Banner/Banner.js';
 export { Button } from './components/Button/Button.js';
+export { useMergedRef } from './hooks/useMergedRef.js';
+export { Group } from './components/Group/Group.js';
+export { RadioGroup, findByValue, getRadioGroupItemValueAsString, useRadioGroup } from './components/RadioGroup/RadioGroup.js';
+export { Menu } from './components/Menu/Menu.js';
+export { useIntersectionObserver } from './hooks/useIntersectionObserver.js';
+export { ButtonGroup } from './components/ButtonGroup/ButtonGroup.js';
 export { Calendar } from './components/Calendar/Calendar.js';
 export { Card } from './components/Card/Card.js';
 export { Checkbox } from './components/Checkbox/Checkbox.js';
 export { useBoundingClientRectListener } from './hooks/useBoundingClientRectListener.js';
-export { useMergedRef } from './hooks/useMergedRef.js';
 export { Input } from './components/Input/Input.js';
 export { getNextIndexFromKey, useListKeyboardNavigation } from './utils/hooks/useListKeyboardNavigation.js';
 export { useListScrollTo } from './utils/hooks/useListScrollTo.js';
@@ -27,7 +32,6 @@ export { format, isWeakEqual, parseFromCustomString, parseFromISOString } from '
 export { Popover } from './components/Popover/Popover.js';
 export { Datepicker } from './components/Datepicker/Datepicker.js';
 export { Dialog } from './components/Dialog/Dialog.js';
-export { Group } from './components/Group/Group.js';
 export { Drawer } from './components/Drawer/Drawer.js';
 export { Field } from './components/Field/Field.js';
 export { Form } from './components/Form/Form.js';
@@ -35,8 +39,6 @@ export { Hanger, Title } from './components/Hanger/Hanger.js';
 export { HoverCard } from './components/HoverCard/HoverCard.js';
 export { SearchInput } from './components/SearchInput/SearchInput.js';
 export { Listbox, MultiListbox } from './components/Listbox/Listbox.js';
-export { RadioGroup, findByValue, getRadioGroupItemValueAsString, useRadioGroup } from './components/RadioGroup/RadioGroup.js';
-export { Menu } from './components/Menu/Menu.js';
 export { Treeview } from './components/Treeview/Treeview.js';
 export { useDropTarget } from './utils/hooks/useDropTarget.js';
 export { Navigation } from './components/Navigation/Navigation.js';

package/dist/esm/packages/taco/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/hooks/useIntersectionObserver.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const useIntersectionObserver: (ref: React.RefObject<HTMLElement>, offset?: number | undefined) => number | undefined;

package/dist/index.d.ts

@@ -7,6 +7,7 @@ export * from './components/Badge/Badge';
 export * from './components/BadgeIcon/BadgeIcon';
 export * from './components/Banner/Banner';
 export * from './components/Button/Button';
+export * from './components/ButtonGroup/ButtonGroup';
 export * from './components/Calendar/Calendar';
 export * from './components/Card/Card';
 export * from './components/Checkbox/Checkbox';
@@ -55,6 +56,7 @@ export * from './utils/date';
 export * from './utils/mergeRefs';
 export * from './hooks/useBoundaryOverflowDetection';
 export * from './hooks/useBoundingClientRectListener';
+export * from './hooks/useIntersectionObserver';
 export * from './hooks/useIsLargeScreen';
 export * from './hooks/useMatchMedia';
 export * from './hooks/useMergedRef';