@basic-ui/material 1.0.0-alpha.0 → 1.0.0-alpha.3

package/build/esm/Tab/Tab.d.ts

@@ -1,5 +1,5 @@
-import type * as React from 'react';
-import { TabProps as TabPropsCore } from '@basic-ui/core';
-import { RippleBoxProps } from '../Ripple';
+import * as React from 'react';
+import type { TabProps as TabPropsCore } from '@basic-ui/core';
+import type { RippleBoxProps } from '../Ripple';
 export declare type TabProps = TabPropsCore & RippleBoxProps<HTMLButtonElement, React.ButtonHTMLAttributes<HTMLButtonElement>>;
-export declare const Tab: React.ForwardRefExoticComponent<Pick<TabProps, "form" | "p" | "slot" | "style" | "title" | "bottom" | "top" | "hidden" | "center" | "left" | "right" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "margin" | "mt" | "marginTop" | "mr" | "marginRight" | "mb" | "marginBottom" | "ml" | "marginLeft" | "mx" | "marginX" | "my" | "marginY" | "padding" | "pt" | "paddingTop" | "pr" | "paddingRight" | "pb" | "paddingBottom" | "pl" | "paddingLeft" | "px" | "paddingX" | "py" | "paddingY" | "width" | "height" | "minWidth" | "minHeight" | "maxWidth" | "maxHeight" | "display" | "verticalAlign" | "size" | "overflow" | "overflowX" | "overflowY" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "letterSpacing" | "fontStyle" | "textAlign" | "color" | "bg" | "backgroundColor" | "opacity" | "alignItems" | "alignContent" | "justifyItems" | "justifyContent" | "flexWrap" | "flexDirection" | "flex" | "flexGrow" | "flexShrink" | "flexBasis" | "justifySelf" | "alignSelf" | "order" | "border" | "borderX" | "borderY" | "borderWidth" | "borderTopWidth" | "borderBottomWidth" | "borderLeftWidth" | "borderRightWidth" | "borderStyle" | "borderTopStyle" | "borderBottomStyle" | "borderLeftStyle" | "borderRightStyle" | "borderColor" | "borderTopColor" | "borderBottomColor" | "borderLeftColor" | "borderRightColor" | "borderRadius" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "gridGap" | "gridColumnGap" | "gridRowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "background" | "backgroundImage" | "backgroundSize" | "backgroundPosition" | "backgroundRepeat" | "position" | "zIndex" | "boxShadow" | "textShadow" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "children" | "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" | "key" | "pressedOpacity" | "rippleColor" | "rippleEnabled" | "baseOpacity" | "hoverOpacity" | "focusOpacity" | "innerAs"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const Tab: React.ForwardRefExoticComponent<Pick<TabProps, "children" | "form" | "p" | "slot" | "style" | "title" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "value" | "hidden" | "center" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "key" | "innerAs" | "name" | "type" | "disabled" | "rippleColor" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "baseOpacity" | "hoverOpacity" | "focusOpacity" | "pressedOpacity" | "rippleEnabled"> & React.RefAttributes<HTMLButtonElement>>;

package/build/esm/Tab/Tab.js

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import { forwardRef } from 'react';
+import * as React from 'react';
 import { Tab as TabCore } from '@basic-ui/core';
 import { RippleBox } from '../Ripple';
 import { alpha } from '../color';
@@ -10,20 +11,18 @@ import { TabIndicator } from '../TabIndicator';
 import { useTabListContext } from './context';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-const TabInner = /*#__PURE__*/forwardRef(function Tab(props, forwardedRef) {
-  const {
-    innerAs,
-    selected,
-    children,
-    disabled
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["innerAs", "selected", "children", "disabled"]);
+var TabInner = /*#__PURE__*/forwardRef(function Tab(props, forwardedRef) {
+  var innerAs = props.innerAs,
+      selected = props.selected,
+      children = props.children,
+      disabled = props.disabled,
+      otherProps = _objectWithoutProperties(props, ["innerAs", "selected", "children", "disabled"]);
+
+  var _useTabListContext = useTabListContext(),
+      textColor = _useTabListContext.textColor,
+      indicatorColor = _useTabListContext.indicatorColor,
+      selectedTextColor = _useTabListContext.selectedTextColor;
 
-  const {
-    textColor,
-    indicatorColor,
-    selectedTextColor
-  } = useTabListContext();
   return /*#__PURE__*/_jsxs(Box, {
     position: "relative",
     display: "flex",
@@ -62,11 +61,10 @@ const TabInner = /*#__PURE__*/forwardRef(function Tab(props, forwardedRef) {
     })]
   });
 });
-export const Tab = /*#__PURE__*/forwardRef(function Tab(props, forwardedRef) {
-  const {
-    as = 'button'
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["as"]);
+export var Tab = /*#__PURE__*/forwardRef(function Tab(props, forwardedRef) {
+  var _props$as = props.as,
+      as = _props$as === void 0 ? 'button' : _props$as,
+      otherProps = _objectWithoutProperties(props, ["as"]);
 
   return /*#__PURE__*/_jsx(TabCore, _extends({
     as: TabInner,

package/build/esm/Tab/Tab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Tab/Tab.tsx"],"names":["forwardRef","Tab","TabCore","RippleBox","alpha","Text","Box","TabIndicator","useTabListContext","TabInner","props","forwardedRef","innerAs","selected","children","disabled","otherProps","textColor","indicatorColor","selectedTextColor","px","position","color","height","backgroundColor","border","outline","width","alignItems","as"],"mappings":";;AAAA,SAA+BA,UAA/B,QAAiD,OAAjD;AAEA,SAASC,GAAG,IAAIC,OAAhB,QAAyD,gBAAzD;AACA,SAASC,SAAT,QAA0C,WAA1C;AAEA,SAASC,KAAT,QAAsB,UAAtB;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,YAAT,QAA6B,iBAA7B;AACA,SAASC,iBAAT,QAAkC,WAAlC;;;AAQA,MAAMC,QAAQ,gBAAGT,UAAU,CAGzB,SAASC,GAAT,CAAaS,KAAb,EAAoBC,YAApB,EAAkC;AAClC,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,QAAX;AAAqBC,IAAAA,QAArB;AAA+BC,IAAAA;AAA/B,MAA2DL,KAAjE;AAAA,QAAkDM,UAAlD,iCAAiEN,KAAjE;;AACA,QAAM;AAAEO,IAAAA,SAAF;AAAaC,IAAAA,cAAb;AAA6BC,IAAAA;AAA7B,MAAmDX,iBAAiB,EAA1E;AAEA,sBACE,MAAC,GAAD;AAAK,IAAA,QAAQ,EAAC,UAAd;AAAyB,IAAA,OAAO,EAAC,MAAjC;AAAwC,IAAA,QAAQ,EAAE,CAAlD;AAAqD,IAAA,aAAa,EAAC,QAAnE;AAAA,4BACE,KAAC,SAAD;AAME,MAAA,EAAE,EAAEI,OANN;AAOE,MAAA,GAAG,EAAED,YAPP;AAQE,MAAA,WAAW,EAAEO,cARf;AASE,MAAA,QAAQ,EAAEH,QATZ;AAUE,MAAA,KAAK,EAAE;AACLK,QAAAA,EAAE,EAAE,CADC;AAELC,QAAAA,QAAQ,EAAE,UAFL;AAGLC,QAAAA,KAAK,EAAET,QAAQ,GACXM,iBAAiB,IAAID,cADV,GAEXd,KAAK,CAACa,SAAD,EAAYF,QAAQ,GAAG,IAAH,GAAU,GAA9B,CALJ;AAMLQ,QAAAA,MAAM,QAND;AAOLC,QAAAA,eAAe,EAAE,aAPZ;AAQLC,QAAAA,MAAM,EAAE,MARH;AASL,kBAAU;AACRC,UAAAA,OAAO,EAAE;AADD,SATL;AAYLC,QAAAA,KAAK,EAAE,MAZF;AAaLC,QAAAA,UAAU,EAAE;AAbP;AAVT,OAyBMZ,UAzBN;AAAA,6BA2BE,KAAC,IAAD;AACE,QAAA,EAAE,EAAC,MADL;AAEE,QAAA,OAAO,EAAC,QAFV;AAGE,QAAA,KAAK,EAAC,SAHR;AAIE,QAAA,MAAM,EAAC,MAJT;AAKE,QAAA,SAAS,EAAC,QALZ;AAAA,kBAOGF;AAPH;AA3BF,OADF,eAsCE,KAAC,YAAD;AAAc,MAAA,QAAQ,EAAED,QAAxB;AAAkC,MAAA,KAAK,EAAEK;AAAzC,MAtCF;AAAA,IADF;AA0CD,CAjD0B,CAA3B;AAmDA,OAAO,MAAMjB,GAAG,gBAAGD,UAAU,CAA8B,SAASC,GAAT,CACzDS,KADyD,EAEzDC,YAFyD,EAGzD;AACA,QAAM;AAAEkB,IAAAA,EAAE,GAAG;AAAP,MAAmCnB,KAAzC;AAAA,QAA0BM,UAA1B,iCAAyCN,KAAzC;;AAEA,sBACE,KAAC,OAAD;AAAS,IAAA,EAAE,EAAED,QAAb;AAAuB,IAAA,OAAO,EAAEoB,EAAhC;AAAoC,IAAA,GAAG,EAAElB;AAAzC,KAA2DK,UAA3D,EADF;AAGD,CAT4B,CAAtB","sourcesContent":["import { ButtonHTMLAttributes, forwardRef } from 'react';\nimport type * as React from 'react';\nimport { Tab as TabCore, TabProps as TabPropsCore } from '@basic-ui/core';\nimport { RippleBox, RippleBoxProps } from '../Ripple';\nimport { rem } from 'polished';\nimport { alpha } from '../color';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { TabIndicator } from '../TabIndicator';\nimport { useTabListContext } from './context';\n\nexport type TabProps = TabPropsCore &\n  RippleBoxProps<\n    HTMLButtonElement,\n    React.ButtonHTMLAttributes<HTMLButtonElement>\n  >;\n\nconst TabInner = forwardRef<\n  HTMLButtonElement,\n  TabProps & { selected?: boolean }\n>(function Tab(props, forwardedRef) {\n  const { innerAs, selected, children, disabled, ...otherProps } = props;\n  const { textColor, indicatorColor, selectedTextColor } = useTabListContext();\n\n  return (\n    <Box position=\"relative\" display=\"flex\" flexGrow={1} flexDirection=\"column\">\n      <RippleBox<\n        RippleBoxProps<\n          HTMLButtonElement,\n          ButtonHTMLAttributes<HTMLButtonElement>\n        >\n      >\n        as={innerAs}\n        ref={forwardedRef}\n        rippleColor={indicatorColor}\n        disabled={disabled}\n        __css={{\n          px: 3,\n          position: 'relative',\n          color: selected\n            ? selectedTextColor || indicatorColor\n            : alpha(textColor, disabled ? 0.37 : 0.7),\n          height: rem(48),\n          backgroundColor: 'transparent',\n          border: 'none',\n          ':focus': {\n            outline: 'none',\n          },\n          width: '100%',\n          alignItems: 'center',\n        }}\n        {...otherProps}\n      >\n        <Text\n          as=\"span\"\n          variant=\"button\"\n          color=\"inherit\"\n          height=\"100%\"\n          textAlign=\"center\"\n        >\n          {children}\n        </Text>\n      </RippleBox>\n      <TabIndicator selected={selected} color={indicatorColor} />\n    </Box>\n  );\n});\n\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>(function Tab(\n  props,\n  forwardedRef\n) {\n  const { as = 'button', ...otherProps } = props;\n\n  return (\n    <TabCore as={TabInner} innerAs={as} ref={forwardedRef} {...otherProps} />\n  );\n});\n"],"file":"Tab.js"}
+{"version":3,"sources":["../../../src/Tab/Tab.tsx"],"names":["forwardRef","React","Tab","TabCore","RippleBox","alpha","Text","Box","TabIndicator","useTabListContext","TabInner","props","forwardedRef","innerAs","selected","children","disabled","otherProps","textColor","indicatorColor","selectedTextColor","px","position","color","height","backgroundColor","border","outline","width","alignItems","as"],"mappings":";;AACA,SAASA,UAAT,QAA2B,OAA3B;AACA,OAAO,KAAKC,KAAZ,MAAuB,OAAvB;AAEA,SAASC,GAAG,IAAIC,OAAhB,QAA+B,gBAA/B;AAIA,SAASC,SAAT,QAA0B,WAA1B;AACA,SAASC,KAAT,QAAsB,UAAtB;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,YAAT,QAA6B,iBAA7B;AACA,SAASC,iBAAT,QAAkC,WAAlC;;;AAQA,IAAMC,QAAQ,gBAAGV,UAAU,CAGzB,SAASE,GAAT,CAAaS,KAAb,EAAoBC,YAApB,EAAkC;AAAA,MAC1BC,OAD0B,GAC+BF,KAD/B,CAC1BE,OAD0B;AAAA,MACjBC,QADiB,GAC+BH,KAD/B,CACjBG,QADiB;AAAA,MACPC,QADO,GAC+BJ,KAD/B,CACPI,QADO;AAAA,MACGC,QADH,GAC+BL,KAD/B,CACGK,QADH;AAAA,MACgBC,UADhB,4BAC+BN,KAD/B;;AAAA,2BAEuBF,iBAAiB,EAFxC;AAAA,MAE1BS,SAF0B,sBAE1BA,SAF0B;AAAA,MAEfC,cAFe,sBAEfA,cAFe;AAAA,MAECC,iBAFD,sBAECA,iBAFD;;AAIlC,sBACE,MAAC,GAAD;AAAK,IAAA,QAAQ,EAAC,UAAd;AAAyB,IAAA,OAAO,EAAC,MAAjC;AAAwC,IAAA,QAAQ,EAAE,CAAlD;AAAqD,IAAA,aAAa,EAAC,QAAnE;AAAA,4BACE,KAAC,SAAD;AAME,MAAA,EAAE,EAAEP,OANN;AAOE,MAAA,GAAG,EAAED,YAPP;AAQE,MAAA,WAAW,EAAEO,cARf;AASE,MAAA,QAAQ,EAAEH,QATZ;AAUE,MAAA,KAAK,EAAE;AACLK,QAAAA,EAAE,EAAE,CADC;AAELC,QAAAA,QAAQ,EAAE,UAFL;AAGLC,QAAAA,KAAK,EAAET,QAAQ,GACXM,iBAAiB,IAAID,cADV,GAEXd,KAAK,CAACa,SAAD,EAAYF,QAAQ,GAAG,IAAH,GAAU,GAA9B,CALJ;AAMLQ,QAAAA,MAAM,QAND;AAOLC,QAAAA,eAAe,EAAE,aAPZ;AAQLC,QAAAA,MAAM,EAAE,MARH;AASL,kBAAU;AACRC,UAAAA,OAAO,EAAE;AADD,SATL;AAYLC,QAAAA,KAAK,EAAE,MAZF;AAaLC,QAAAA,UAAU,EAAE;AAbP;AAVT,OAyBMZ,UAzBN;AAAA,6BA2BE,KAAC,IAAD;AACE,QAAA,EAAE,EAAC,MADL;AAEE,QAAA,OAAO,EAAC,QAFV;AAGE,QAAA,KAAK,EAAC,SAHR;AAIE,QAAA,MAAM,EAAC,MAJT;AAKE,QAAA,SAAS,EAAC,QALZ;AAAA,kBAOGF;AAPH;AA3BF,OADF,eAsCE,KAAC,YAAD;AAAc,MAAA,QAAQ,EAAED,QAAxB;AAAkC,MAAA,KAAK,EAAEK;AAAzC,MAtCF;AAAA,IADF;AA0CD,CAjD0B,CAA3B;AAmDA,OAAO,IAAMjB,GAAG,gBAAGF,UAAU,CAA8B,SAASE,GAAT,CACzDS,KADyD,EAEzDC,YAFyD,EAGzD;AAAA,kBACyCD,KADzC,CACQmB,EADR;AAAA,MACQA,EADR,0BACa,QADb;AAAA,MAC0Bb,UAD1B,4BACyCN,KADzC;;AAGA,sBACE,KAAC,OAAD;AAAS,IAAA,EAAE,EAAED,QAAb;AAAuB,IAAA,OAAO,EAAEoB,EAAhC;AAAoC,IAAA,GAAG,EAAElB;AAAzC,KAA2DK,UAA3D,EADF;AAGD,CAT4B,CAAtB","sourcesContent":["import type { ButtonHTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport * as React from 'react';\nimport type { TabProps as TabPropsCore } from '@basic-ui/core';\nimport { Tab as TabCore } from '@basic-ui/core';\nimport { rem } from 'polished';\n\nimport type { RippleBoxProps } from '../Ripple';\nimport { RippleBox } from '../Ripple';\nimport { alpha } from '../color';\nimport { Text } from '../Text';\nimport { Box } from '../Box';\nimport { TabIndicator } from '../TabIndicator';\nimport { useTabListContext } from './context';\n\nexport type TabProps = TabPropsCore &\n  RippleBoxProps<\n    HTMLButtonElement,\n    React.ButtonHTMLAttributes<HTMLButtonElement>\n  >;\n\nconst TabInner = forwardRef<\n  HTMLButtonElement,\n  TabProps & { selected?: boolean }\n>(function Tab(props, forwardedRef) {\n  const { innerAs, selected, children, disabled, ...otherProps } = props;\n  const { textColor, indicatorColor, selectedTextColor } = useTabListContext();\n\n  return (\n    <Box position=\"relative\" display=\"flex\" flexGrow={1} flexDirection=\"column\">\n      <RippleBox<\n        RippleBoxProps<\n          HTMLButtonElement,\n          ButtonHTMLAttributes<HTMLButtonElement>\n        >\n      >\n        as={innerAs}\n        ref={forwardedRef}\n        rippleColor={indicatorColor}\n        disabled={disabled}\n        __css={{\n          px: 3,\n          position: 'relative',\n          color: selected\n            ? selectedTextColor || indicatorColor\n            : alpha(textColor, disabled ? 0.37 : 0.7),\n          height: rem(48),\n          backgroundColor: 'transparent',\n          border: 'none',\n          ':focus': {\n            outline: 'none',\n          },\n          width: '100%',\n          alignItems: 'center',\n        }}\n        {...otherProps}\n      >\n        <Text\n          as=\"span\"\n          variant=\"button\"\n          color=\"inherit\"\n          height=\"100%\"\n          textAlign=\"center\"\n        >\n          {children}\n        </Text>\n      </RippleBox>\n      <TabIndicator selected={selected} color={indicatorColor} />\n    </Box>\n  );\n});\n\nexport const Tab = forwardRef<HTMLButtonElement, TabProps>(function Tab(\n  props,\n  forwardedRef\n) {\n  const { as = 'button', ...otherProps } = props;\n\n  return (\n    <TabCore as={TabInner} innerAs={as} ref={forwardedRef} {...otherProps} />\n  );\n});\n"],"file":"Tab.js"}

package/build/esm/Tab/TabList.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { TabListProps as TabListPropsCore } from '@basic-ui/core';
-import { BoxProps } from '../Box';
+import type { TabListProps as TabListPropsCore } from '@basic-ui/core';
+import type { BoxProps } from '../Box';
 export declare type TabListProps = TabListPropsCore & BoxProps & {
     indicatorColor?: string;
     textColor?: string;
     selectedTextColor?: string;
 };
-export declare const TabList: import("react").ForwardRefExoticComponent<Pick<TabListProps, "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "hidden" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "children" | "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" | "key" | "vertical" | "innerAs" | "textColor" | "indicatorColor" | "selectedTextColor" | "manualActivation"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const TabList: import("react").ForwardRefExoticComponent<Pick<TabListProps, "children" | "p" | "slot" | "style" | "title" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "hidden" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "key" | "vertical" | "innerAs" | "textColor" | "indicatorColor" | "selectedTextColor" | "manualActivation"> & import("react").RefAttributes<HTMLDivElement>>;

package/build/esm/Tab/TabList.js

@@ -1,16 +1,14 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import { forwardRef, useRef } from 'react';
 import { TabList as TabListCore } from '@basic-ui/core';
 import { Box } from '../Box';
 import { TabIndicatorProvider } from '../TabIndicator';
 import { TabListProvider } from './context';
 import { jsx as _jsx } from "react/jsx-runtime";
-const TabListInner = /*#__PURE__*/forwardRef(function TabListInner(props, forwardedRef) {
-  const {
-    innerAs
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["innerAs"]);
+var TabListInner = /*#__PURE__*/forwardRef(function TabListInner(props, forwardedRef) {
+  var innerAs = props.innerAs,
+      otherProps = _objectWithoutProperties(props, ["innerAs"]);
 
   return /*#__PURE__*/_jsx(Box, _extends({
     as: innerAs,
@@ -22,25 +20,26 @@ const TabListInner = /*#__PURE__*/forwardRef(function TabListInner(props, forwar
     }
   }, otherProps));
 });
-export const TabList = /*#__PURE__*/forwardRef(function TabList(props, forwardedRef) {
-  const {
-    as = 'div',
-    indicatorColor = 'primary',
-    textColor = 'on.surface',
-    selectedTextColor
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["as", "indicatorColor", "textColor", "selectedTextColor"]);
+export var TabList = /*#__PURE__*/forwardRef(function TabList(props, forwardedRef) {
+  var _props$as = props.as,
+      as = _props$as === void 0 ? 'div' : _props$as,
+      _props$indicatorColor = props.indicatorColor,
+      indicatorColor = _props$indicatorColor === void 0 ? 'primary' : _props$indicatorColor,
+      _props$textColor = props.textColor,
+      textColor = _props$textColor === void 0 ? 'on.surface' : _props$textColor,
+      selectedTextColor = props.selectedTextColor,
+      otherProps = _objectWithoutProperties(props, ["as", "indicatorColor", "textColor", "selectedTextColor"]);
 
-  const currentIndicator = useRef(null);
+  var currentIndicator = useRef(null);
   return /*#__PURE__*/_jsx(TabListProvider, {
     value: {
-      indicatorColor,
-      textColor,
-      selectedTextColor
+      indicatorColor: indicatorColor,
+      textColor: textColor,
+      selectedTextColor: selectedTextColor
     },
     children: /*#__PURE__*/_jsx(TabIndicatorProvider, {
       value: {
-        currentIndicator
+        currentIndicator: currentIndicator
       },
       children: /*#__PURE__*/_jsx(TabListCore, _extends({
         as: TabListInner,

package/build/esm/Tab/TabList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Tab/TabList.tsx"],"names":["forwardRef","useRef","TabList","TabListCore","Box","TabIndicatorProvider","TabListProvider","TabListInner","props","forwardedRef","innerAs","otherProps","minWidth","display","alignItems","as","indicatorColor","textColor","selectedTextColor","currentIndicator"],"mappings":";;AAAA,SAASA,UAAT,EAAqBC,MAArB,QAAmC,OAAnC;AACA,SACEC,OAAO,IAAIC,WADb,QAGO,gBAHP;AAIA,SAASC,GAAT,QAA8B,QAA9B;AAEA,SAASC,oBAAT,QAAqC,iBAArC;AACA,SAASC,eAAT,QAAgC,WAAhC;;AASA,MAAMC,YAAY,gBAAGP,UAAU,CAC7B,SAASO,YAAT,CAAsBC,KAAtB,EAA6BC,YAA7B,EAA2C;AACzC,QAAM;AAAEC,IAAAA;AAAF,MAA6BF,KAAnC;AAAA,QAAoBG,UAApB,iCAAmCH,KAAnC;;AAEA,sBACE,KAAC,GAAD;AACE,IAAA,EAAE,EAAEE,OADN;AAEE,IAAA,GAAG,EAAED,YAFP;AAGE,IAAA,KAAK,EAAE;AAAEG,MAAAA,QAAQ,WAAV;AAAsBC,MAAAA,OAAO,EAAE,MAA/B;AAAuCC,MAAAA,UAAU,EAAE;AAAnD;AAHT,KAIMH,UAJN,EADF;AAQD,CAZ4B,CAA/B;AAeA,OAAO,MAAMT,OAAO,gBAAGF,UAAU,CAC/B,SAASE,OAAT,CAAiBM,KAAjB,EAAwBC,YAAxB,EAAsC;AACpC,QAAM;AACJM,IAAAA,EAAE,GAAG,KADD;AAEJC,IAAAA,cAAc,GAAG,SAFb;AAGJC,IAAAA,SAAS,GAAG,YAHR;AAIJC,IAAAA;AAJI,MAMFV,KANJ;AAAA,QAKKG,UALL,iCAMIH,KANJ;;AAOA,QAAMW,gBAAgB,GAAGlB,MAAM,CAAkB,IAAlB,CAA/B;AAEA,sBACE,KAAC,eAAD;AAAiB,IAAA,KAAK,EAAE;AAAEe,MAAAA,cAAF;AAAkBC,MAAAA,SAAlB;AAA6BC,MAAAA;AAA7B,KAAxB;AAAA,2BACE,KAAC,oBAAD;AAAsB,MAAA,KAAK,EAAE;AAAEC,QAAAA;AAAF,OAA7B;AAAA,6BACE,KAAC,WAAD;AACE,QAAA,EAAE,EAAEZ,YADN;AAEE,QAAA,OAAO,EAAEQ,EAFX;AAGE,QAAA,GAAG,EAAEN;AAHP,SAIME,UAJN;AADF;AADF,IADF;AAYD,CAvB8B,CAA1B","sourcesContent":["import { forwardRef, useRef } from 'react';\nimport {\n  TabList as TabListCore,\n  TabListProps as TabListPropsCore,\n} from '@basic-ui/core';\nimport { Box, BoxProps } from '../Box';\nimport { rem } from 'polished';\nimport { TabIndicatorProvider } from '../TabIndicator';\nimport { TabListProvider } from './context';\n\nexport type TabListProps = TabListPropsCore &\n  BoxProps & {\n    indicatorColor?: string;\n    textColor?: string;\n    selectedTextColor?: string;\n  };\n\nconst TabListInner = forwardRef<HTMLDivElement, TabListProps>(\n  function TabListInner(props, forwardedRef) {\n    const { innerAs, ...otherProps } = props;\n\n    return (\n      <Box\n        as={innerAs}\n        ref={forwardedRef}\n        __css={{ minWidth: rem(360), display: 'flex', alignItems: 'center' }}\n        {...otherProps}\n      />\n    );\n  }\n);\n\nexport const TabList = forwardRef<HTMLDivElement, TabListProps>(\n  function TabList(props, forwardedRef) {\n    const {\n      as = 'div',\n      indicatorColor = 'primary',\n      textColor = 'on.surface',\n      selectedTextColor,\n      ...otherProps\n    } = props;\n    const currentIndicator = useRef<HTMLSpanElement>(null);\n\n    return (\n      <TabListProvider value={{ indicatorColor, textColor, selectedTextColor }}>\n        <TabIndicatorProvider value={{ currentIndicator }}>\n          <TabListCore\n            as={TabListInner}\n            innerAs={as}\n            ref={forwardedRef}\n            {...otherProps}\n          />\n        </TabIndicatorProvider>\n      </TabListProvider>\n    );\n  }\n);\n"],"file":"TabList.js"}
+{"version":3,"sources":["../../../src/Tab/TabList.tsx"],"names":["forwardRef","useRef","TabList","TabListCore","Box","TabIndicatorProvider","TabListProvider","TabListInner","props","forwardedRef","innerAs","otherProps","minWidth","display","alignItems","as","indicatorColor","textColor","selectedTextColor","currentIndicator"],"mappings":";;AAAA,SAASA,UAAT,EAAqBC,MAArB,QAAmC,OAAnC;AAEA,SAASC,OAAO,IAAIC,WAApB,QAAuC,gBAAvC;AAIA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,oBAAT,QAAqC,iBAArC;AACA,SAASC,eAAT,QAAgC,WAAhC;;AASA,IAAMC,YAAY,gBAAGP,UAAU,CAC7B,SAASO,YAAT,CAAsBC,KAAtB,EAA6BC,YAA7B,EAA2C;AAAA,MACjCC,OADiC,GACNF,KADM,CACjCE,OADiC;AAAA,MACrBC,UADqB,4BACNH,KADM;;AAGzC,sBACE,KAAC,GAAD;AACE,IAAA,EAAE,EAAEE,OADN;AAEE,IAAA,GAAG,EAAED,YAFP;AAGE,IAAA,KAAK,EAAE;AAAEG,MAAAA,QAAQ,WAAV;AAAsBC,MAAAA,OAAO,EAAE,MAA/B;AAAuCC,MAAAA,UAAU,EAAE;AAAnD;AAHT,KAIMH,UAJN,EADF;AAQD,CAZ4B,CAA/B;AAeA,OAAO,IAAMT,OAAO,gBAAGF,UAAU,CAC/B,SAASE,OAAT,CAAiBM,KAAjB,EAAwBC,YAAxB,EAAsC;AAAA,kBAOhCD,KAPgC,CAElCO,EAFkC;AAAA,MAElCA,EAFkC,0BAE7B,KAF6B;AAAA,8BAOhCP,KAPgC,CAGlCQ,cAHkC;AAAA,MAGlCA,cAHkC,sCAGjB,SAHiB;AAAA,yBAOhCR,KAPgC,CAIlCS,SAJkC;AAAA,MAIlCA,SAJkC,iCAItB,YAJsB;AAAA,MAKlCC,iBALkC,GAOhCV,KAPgC,CAKlCU,iBALkC;AAAA,MAM/BP,UAN+B,4BAOhCH,KAPgC;;AAQpC,MAAMW,gBAAgB,GAAGlB,MAAM,CAAkB,IAAlB,CAA/B;AAEA,sBACE,KAAC,eAAD;AAAiB,IAAA,KAAK,EAAE;AAAEe,MAAAA,cAAc,EAAdA,cAAF;AAAkBC,MAAAA,SAAS,EAATA,SAAlB;AAA6BC,MAAAA,iBAAiB,EAAjBA;AAA7B,KAAxB;AAAA,2BACE,KAAC,oBAAD;AAAsB,MAAA,KAAK,EAAE;AAAEC,QAAAA,gBAAgB,EAAhBA;AAAF,OAA7B;AAAA,6BACE,KAAC,WAAD;AACE,QAAA,EAAE,EAAEZ,YADN;AAEE,QAAA,OAAO,EAAEQ,EAFX;AAGE,QAAA,GAAG,EAAEN;AAHP,SAIME,UAJN;AADF;AADF,IADF;AAYD,CAvB8B,CAA1B","sourcesContent":["import { forwardRef, useRef } from 'react';\nimport type { TabListProps as TabListPropsCore } from '@basic-ui/core';\nimport { TabList as TabListCore } from '@basic-ui/core';\nimport { rem } from 'polished';\n\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\nimport { TabIndicatorProvider } from '../TabIndicator';\nimport { TabListProvider } from './context';\n\nexport type TabListProps = TabListPropsCore &\n  BoxProps & {\n    indicatorColor?: string;\n    textColor?: string;\n    selectedTextColor?: string;\n  };\n\nconst TabListInner = forwardRef<HTMLDivElement, TabListProps>(\n  function TabListInner(props, forwardedRef) {\n    const { innerAs, ...otherProps } = props;\n\n    return (\n      <Box\n        as={innerAs}\n        ref={forwardedRef}\n        __css={{ minWidth: rem(360), display: 'flex', alignItems: 'center' }}\n        {...otherProps}\n      />\n    );\n  }\n);\n\nexport const TabList = forwardRef<HTMLDivElement, TabListProps>(\n  function TabList(props, forwardedRef) {\n    const {\n      as = 'div',\n      indicatorColor = 'primary',\n      textColor = 'on.surface',\n      selectedTextColor,\n      ...otherProps\n    } = props;\n    const currentIndicator = useRef<HTMLSpanElement>(null);\n\n    return (\n      <TabListProvider value={{ indicatorColor, textColor, selectedTextColor }}>\n        <TabIndicatorProvider value={{ currentIndicator }}>\n          <TabListCore\n            as={TabListInner}\n            innerAs={as}\n            ref={forwardedRef}\n            {...otherProps}\n          />\n        </TabIndicatorProvider>\n      </TabListProvider>\n    );\n  }\n);\n"],"file":"TabList.js"}

package/build/esm/Tab/TabPanel.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { TabPanelProps as TabPanelPropsCore } from '@basic-ui/core';
-import { BoxProps } from '../Box';
+import type { TabPanelProps as TabPanelPropsCore } from '@basic-ui/core';
+import type { BoxProps } from '../Box';
 export declare type TabPanelProps = TabPanelPropsCore & BoxProps;
-export declare const TabPanel: import("react").ForwardRefExoticComponent<Pick<TabPanelProps, "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "hidden" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "children" | "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" | "key" | "innerAs" | "lazy"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const TabPanel: import("react").ForwardRefExoticComponent<Pick<TabPanelProps, "children" | "p" | "slot" | "style" | "title" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "hidden" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "key" | "innerAs" | "lazy"> & import("react").RefAttributes<HTMLDivElement>>;

package/build/esm/Tab/TabPanel.js

@@ -1,25 +1,22 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import { forwardRef } from 'react';
 import { TabPanel as TabPanelCore } from '@basic-ui/core';
 import { Box } from '../Box';
 import { jsx as _jsx } from "react/jsx-runtime";
-const TabPanelInner = /*#__PURE__*/forwardRef(function TabPanelInner(props, forwardedRef) {
-  const {
-    innerAs
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["innerAs"]);
+var TabPanelInner = /*#__PURE__*/forwardRef(function TabPanelInner(props, forwardedRef) {
+  var innerAs = props.innerAs,
+      otherProps = _objectWithoutProperties(props, ["innerAs"]);
 
   return /*#__PURE__*/_jsx(Box, _extends({
     as: innerAs,
     ref: forwardedRef
   }, otherProps));
 });
-export const TabPanel = /*#__PURE__*/forwardRef(function TabPanel(props, forwardedRef) {
-  const {
-    as = 'div'
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["as"]);
+export var TabPanel = /*#__PURE__*/forwardRef(function TabPanel(props, forwardedRef) {
+  var _props$as = props.as,
+      as = _props$as === void 0 ? 'div' : _props$as,
+      otherProps = _objectWithoutProperties(props, ["as"]);
 
   return /*#__PURE__*/_jsx(TabPanelCore, _extends({
     as: TabPanelInner,

package/build/esm/Tab/TabPanel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Tab/TabPanel.tsx"],"names":["forwardRef","TabPanel","TabPanelCore","Box","TabPanelInner","props","forwardedRef","innerAs","otherProps","as"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AACA,SACEC,QAAQ,IAAIC,YADd,QAGO,gBAHP;AAIA,SAASC,GAAT,QAA8B,QAA9B;;AAIA,MAAMC,aAAa,gBAAGJ,UAAU,CAC9B,SAASI,aAAT,CAAuBC,KAAvB,EAA8BC,YAA9B,EAA4C;AAC1C,QAAM;AAAEC,IAAAA;AAAF,MAA6BF,KAAnC;AAAA,QAAoBG,UAApB,iCAAmCH,KAAnC;;AAEA,sBAAO,KAAC,GAAD;AAAK,IAAA,EAAE,EAAEE,OAAT;AAAkB,IAAA,GAAG,EAAED;AAAvB,KAAyCE,UAAzC,EAAP;AACD,CAL6B,CAAhC;AAQA,OAAO,MAAMP,QAAQ,gBAAGD,UAAU,CAChC,SAASC,QAAT,CAAkBI,KAAlB,EAAyBC,YAAzB,EAAuC;AACrC,QAAM;AAAEG,IAAAA,EAAE,GAAG;AAAP,MAAgCJ,KAAtC;AAAA,QAAuBG,UAAvB,iCAAsCH,KAAtC;;AAEA,sBACE,KAAC,YAAD;AACE,IAAA,EAAE,EAAED,aADN;AAEE,IAAA,OAAO,EAAEK,EAFX;AAGE,IAAA,GAAG,EAAEH;AAHP,KAIME,UAJN,EADF;AAQD,CAZ+B,CAA3B","sourcesContent":["import { forwardRef } from 'react';\nimport {\n  TabPanel as TabPanelCore,\n  TabPanelProps as TabPanelPropsCore,\n} from '@basic-ui/core';\nimport { Box, BoxProps } from '../Box';\n\nexport type TabPanelProps = TabPanelPropsCore & BoxProps;\n\nconst TabPanelInner = forwardRef<HTMLDivElement, TabPanelProps>(\n  function TabPanelInner(props, forwardedRef) {\n    const { innerAs, ...otherProps } = props;\n\n    return <Box as={innerAs} ref={forwardedRef} {...otherProps} />;\n  }\n);\n\nexport const TabPanel = forwardRef<HTMLDivElement, TabPanelProps>(\n  function TabPanel(props, forwardedRef) {\n    const { as = 'div', ...otherProps } = props;\n\n    return (\n      <TabPanelCore\n        as={TabPanelInner}\n        innerAs={as}\n        ref={forwardedRef}\n        {...otherProps}\n      />\n    );\n  }\n);\n"],"file":"TabPanel.js"}
+{"version":3,"sources":["../../../src/Tab/TabPanel.tsx"],"names":["forwardRef","TabPanel","TabPanelCore","Box","TabPanelInner","props","forwardedRef","innerAs","otherProps","as"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAASC,QAAQ,IAAIC,YAArB,QAAyC,gBAAzC;AAGA,SAASC,GAAT,QAAoB,QAApB;;AAIA,IAAMC,aAAa,gBAAGJ,UAAU,CAC9B,SAASI,aAAT,CAAuBC,KAAvB,EAA8BC,YAA9B,EAA4C;AAAA,MAClCC,OADkC,GACPF,KADO,CAClCE,OADkC;AAAA,MACtBC,UADsB,4BACPH,KADO;;AAG1C,sBAAO,KAAC,GAAD;AAAK,IAAA,EAAE,EAAEE,OAAT;AAAkB,IAAA,GAAG,EAAED;AAAvB,KAAyCE,UAAzC,EAAP;AACD,CAL6B,CAAhC;AAQA,OAAO,IAAMP,QAAQ,gBAAGD,UAAU,CAChC,SAASC,QAAT,CAAkBI,KAAlB,EAAyBC,YAAzB,EAAuC;AAAA,kBACCD,KADD,CAC7BI,EAD6B;AAAA,MAC7BA,EAD6B,0BACxB,KADwB;AAAA,MACdD,UADc,4BACCH,KADD;;AAGrC,sBACE,KAAC,YAAD;AACE,IAAA,EAAE,EAAED,aADN;AAEE,IAAA,OAAO,EAAEK,EAFX;AAGE,IAAA,GAAG,EAAEH;AAHP,KAIME,UAJN,EADF;AAQD,CAZ+B,CAA3B","sourcesContent":["import { forwardRef } from 'react';\nimport type { TabPanelProps as TabPanelPropsCore } from '@basic-ui/core';\nimport { TabPanel as TabPanelCore } from '@basic-ui/core';\n\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\n\nexport type TabPanelProps = TabPanelPropsCore & BoxProps;\n\nconst TabPanelInner = forwardRef<HTMLDivElement, TabPanelProps>(\n  function TabPanelInner(props, forwardedRef) {\n    const { innerAs, ...otherProps } = props;\n\n    return <Box as={innerAs} ref={forwardedRef} {...otherProps} />;\n  }\n);\n\nexport const TabPanel = forwardRef<HTMLDivElement, TabPanelProps>(\n  function TabPanel(props, forwardedRef) {\n    const { as = 'div', ...otherProps } = props;\n\n    return (\n      <TabPanelCore\n        as={TabPanelInner}\n        innerAs={as}\n        ref={forwardedRef}\n        {...otherProps}\n      />\n    );\n  }\n);\n"],"file":"TabPanel.js"}

package/build/esm/Tab/context.js

@@ -1,11 +1,12 @@
 import { createContext, useContext } from 'react'; // TabList Component
 
-const TabListContext = /*#__PURE__*/createContext({
+var TabListContext = /*#__PURE__*/createContext({
   indicatorColor: 'primary',
   textColor: 'on.surface'
 });
-export const {
-  Provider: TabListProvider
-} = TabListContext;
-export const useTabListContext = () => useContext(TabListContext);
+var TabListProvider = TabListContext.Provider;
+export { TabListProvider };
+export var useTabListContext = function useTabListContext() {
+  return useContext(TabListContext);
+};
 //# sourceMappingURL=context.js.map

package/build/esm/Tab/context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Tab/context.ts"],"names":["createContext","useContext","TabListContext","indicatorColor","textColor","Provider","TabListProvider","useTabListContext"],"mappings":"AAAA,SAASA,aAAT,EAAwBC,UAAxB,QAA0C,OAA1C,C,CAEA;;AAOA,MAAMC,cAAc,gBAAGF,aAAa,CAAsB;AACxDG,EAAAA,cAAc,EAAE,SADwC;AAExDC,EAAAA,SAAS,EAAE;AAF6C,CAAtB,CAApC;AAIA,OAAO,MAAM;AAAEC,EAAAA,QAAQ,EAAEC;AAAZ,IAAgCJ,cAAtC;AACP,OAAO,MAAMK,iBAAiB,GAAG,MAAMN,UAAU,CAACC,cAAD,CAA1C","sourcesContent":["import { createContext, useContext } from 'react';\n\n// TabList Component\nexport interface TabListContextProps {\n  indicatorColor: string;\n  textColor: string;\n  selectedTextColor?: string;\n}\n\nconst TabListContext = createContext<TabListContextProps>({\n  indicatorColor: 'primary',\n  textColor: 'on.surface',\n});\nexport const { Provider: TabListProvider } = TabListContext;\nexport const useTabListContext = () => useContext(TabListContext);\n"],"file":"context.js"}
+{"version":3,"sources":["../../../src/Tab/context.ts"],"names":["createContext","useContext","TabListContext","indicatorColor","textColor","TabListProvider","Provider","useTabListContext"],"mappings":"AAAA,SAASA,aAAT,EAAwBC,UAAxB,QAA0C,OAA1C,C,CAEA;;AAOA,IAAMC,cAAc,gBAAGF,aAAa,CAAsB;AACxDG,EAAAA,cAAc,EAAE,SADwC;AAExDC,EAAAA,SAAS,EAAE;AAF6C,CAAtB,CAApC;IAIyBC,e,GAAoBH,c,CAA9BI,Q;;AACf,OAAO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB;AAAA,SAAMN,UAAU,CAACC,cAAD,CAAhB;AAAA,CAA1B","sourcesContent":["import { createContext, useContext } from 'react';\n\n// TabList Component\nexport interface TabListContextProps {\n  indicatorColor: string;\n  textColor: string;\n  selectedTextColor?: string;\n}\n\nconst TabListContext = createContext<TabListContextProps>({\n  indicatorColor: 'primary',\n  textColor: 'on.surface',\n});\nexport const { Provider: TabListProvider } = TabListContext;\nexport const useTabListContext = () => useContext(TabListContext);\n"],"file":"context.js"}

package/build/esm/TabIndicator/TabIndicator.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { BoxProps } from '../Box';
+import type { BoxProps } from '../Box';
 export interface TabIndicatorProps extends BoxProps {
     selected?: boolean;
     color?: string;
 }
-export declare const TabIndicator: import("react").ForwardRefExoticComponent<Pick<TabIndicatorProps, "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "hidden" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "children" | "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" | "key" | "selected"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const TabIndicator: import("react").ForwardRefExoticComponent<Pick<TabIndicatorProps, "children" | "p" | "slot" | "style" | "title" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "boxShadow" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "hidden" | "as" | "sx" | "__css" | "variant" | "tx" | "theme" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "size" | "bg" | "borderX" | "borderY" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "key" | "selected"> & import("react").RefAttributes<HTMLDivElement>>;

package/build/esm/TabIndicator/TabIndicator.js

@@ -1,33 +1,34 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import { forwardRef, useEffect, useRef, useLayoutEffect } from 'react';
+import { assignMultipleRefs } from '@basic-ui/core';
 import { Box } from '../Box';
 import { useTabIndicatorContext } from './context';
-import { assignMultipleRefs } from '@basic-ui/core';
 import { jsx as _jsx } from "react/jsx-runtime";
-const useEnhancedEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
-export const TabIndicator = /*#__PURE__*/forwardRef(function TabIndicator(props, forwardedRef) {
-  const {
-    as = 'span',
-    selected,
-    color = 'primary'
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["as", "selected", "color"]);
+var useEnhancedEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
+export var TabIndicator = /*#__PURE__*/forwardRef(function TabIndicator(props, forwardedRef) {
+  var _props$as = props.as,
+      as = _props$as === void 0 ? 'span' : _props$as,
+      selected = props.selected,
+      _props$color = props.color,
+      color = _props$color === void 0 ? 'primary' : _props$color,
+      otherProps = _objectWithoutProperties(props, ["as", "selected", "color"]);
+
+  var ref = useRef(null);
+
+  var _useTabIndicatorConte = useTabIndicatorContext(),
+      currentIndicator = _useTabIndicatorConte.currentIndicator;
 
-  const ref = useRef(null);
-  const {
-    currentIndicator
-  } = useTabIndicatorContext();
-  useEnhancedEffect(() => {
+  useEnhancedEffect(function () {
     if (selected && ref.current) {
       if (currentIndicator.current !== null) {
         // We are switching indicator, let's slide!
-        const previousClientRect = currentIndicator.current.getBoundingClientRect();
-        const currentClientRect = ref.current.getBoundingClientRect();
-        const widthDelta = previousClientRect.width / currentClientRect.width;
-        const xPosition = previousClientRect.left - currentClientRect.left;
-        const prevTransition = ref.current.style.transition;
-        const prevTransform = ref.current.style.transform;
+        var previousClientRect = currentIndicator.current.getBoundingClientRect();
+        var currentClientRect = ref.current.getBoundingClientRect();
+        var widthDelta = previousClientRect.width / currentClientRect.width;
+        var xPosition = previousClientRect.left - currentClientRect.left;
+        var prevTransition = ref.current.style.transition;
+        var prevTransform = ref.current.style.transform;
         ref.current.style.transition = 'none';
         ref.current.style.transform = "translateX(".concat(xPosition, "px) scaleX(").concat(widthDelta, ")"); // Force repaint before updating classes and transform to ensure the transform properly takes effect
 

package/build/esm/TabIndicator/TabIndicator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/TabIndicator/TabIndicator.tsx"],"names":["forwardRef","useEffect","useRef","useLayoutEffect","Box","useTabIndicatorContext","assignMultipleRefs","useEnhancedEffect","window","TabIndicator","props","forwardedRef","as","selected","color","otherProps","ref","currentIndicator","current","previousClientRect","getBoundingClientRect","currentClientRect","widthDelta","width","xPosition","left","prevTransition","style","transition","prevTransform","transform","bg","position","bottom","opacity","transformOrigin","zIndex"],"mappings":";;AAAA,SAASA,UAAT,EAAqBC,SAArB,EAAgCC,MAAhC,EAAwCC,eAAxC,QAA+D,OAA/D;AACA,SAASC,GAAT,QAA8B,QAA9B;AAEA,SAASC,sBAAT,QAAuC,WAAvC;AACA,SAASC,kBAAT,QAAmC,gBAAnC;;AAOA,MAAMC,iBAAiB,GACrB,OAAOC,MAAP,KAAkB,WAAlB,GAAgCL,eAAhC,GAAkDF,SADpD;AAGA,OAAO,MAAMQ,YAAY,gBAAGT,UAAU,CACpC,SAASS,YAAT,CAAsBC,KAAtB,EAA6BC,YAA7B,EAA2C;AACzC,QAAM;AAAEC,IAAAA,EAAE,GAAG,MAAP;AAAeC,IAAAA,QAAf;AAAyBC,IAAAA,KAAK,GAAG;AAAjC,MAA8DJ,KAApE;AAAA,QAAqDK,UAArD,iCAAoEL,KAApE;;AACA,QAAMM,GAAG,GAAGd,MAAM,CAAkB,IAAlB,CAAlB;AACA,QAAM;AAAEe,IAAAA;AAAF,MAAuBZ,sBAAsB,EAAnD;AAEAE,EAAAA,iBAAiB,CAAC,MAAM;AACtB,QAAIM,QAAQ,IAAIG,GAAG,CAACE,OAApB,EAA6B;AAC3B,UAAID,gBAAgB,CAACC,OAAjB,KAA6B,IAAjC,EAAuC;AACrC;AACA,cAAMC,kBAAkB,GAAGF,gBAAgB,CAACC,OAAjB,CAAyBE,qBAAzB,EAA3B;AACA,cAAMC,iBAAiB,GAAGL,GAAG,CAACE,OAAJ,CAAYE,qBAAZ,EAA1B;AACA,cAAME,UAAU,GAAGH,kBAAkB,CAACI,KAAnB,GAA2BF,iBAAiB,CAACE,KAAhE;AACA,cAAMC,SAAS,GAAGL,kBAAkB,CAACM,IAAnB,GAA0BJ,iBAAiB,CAACI,IAA9D;AAEA,cAAMC,cAAc,GAAGV,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBC,UAAzC;AACA,cAAMC,aAAa,GAAGb,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBG,SAAxC;AACAd,QAAAA,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBC,UAAlB,GAA+B,MAA/B;AACAZ,QAAAA,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBG,SAAlB,wBAA4CN,SAA5C,wBAAmEF,UAAnE,OAVqC,CAYrC;;AACAN,QAAAA,GAAG,CAACE,OAAJ,CAAYE,qBAAZ,GAbqC,CAerC;;AACAJ,QAAAA,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBC,UAAlB,GAA+BF,cAA/B;AACAV,QAAAA,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBG,SAAlB,GAA8BD,aAA9B;AACD;;AACDZ,MAAAA,gBAAgB,CAACC,OAAjB,GAA2BF,GAAG,CAACE,OAA/B;AACD;AACF,GAvBgB,EAuBd,CAACL,QAAD,CAvBc,CAAjB;AAyBA,sBACE,KAAC,GAAD;AACE,IAAA,EAAE,EAAED,EADN;AAEE,IAAA,GAAG,EAAEN,kBAAkB,CAACU,GAAD,EAAML,YAAN,CAFzB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,YAJR;AAKE,IAAA,KAAK,EAAE;AACLoB,MAAAA,EAAE,EAAEjB,KADC;AAELkB,MAAAA,QAAQ,EAAE,UAFL;AAGLC,MAAAA,MAAM,EAAE,CAHH;AAILH,MAAAA,SAAS,YAJJ;AAKLI,MAAAA,OAAO,EAAErB,QAAQ,GAAG,CAAH,GAAO,CALnB;AAMLsB,MAAAA,eAAe,EAAE,MANZ;AAOLP,MAAAA,UAAU,EAAE,wCAPP;AAQLQ,MAAAA,MAAM,EAAE;AARH;AALT,KAeMrB,UAfN,EADF;AAmBD,CAlDmC,CAA/B","sourcesContent":["import { forwardRef, useEffect, useRef, useLayoutEffect } from 'react';\nimport { Box, BoxProps } from '../Box';\nimport { rem } from 'polished';\nimport { useTabIndicatorContext } from './context';\nimport { assignMultipleRefs } from '@basic-ui/core';\n\nexport interface TabIndicatorProps extends BoxProps {\n  selected?: boolean;\n  color?: string;\n}\n\nconst useEnhancedEffect =\n  typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\nexport const TabIndicator = forwardRef<HTMLDivElement, TabIndicatorProps>(\n  function TabIndicator(props, forwardedRef) {\n    const { as = 'span', selected, color = 'primary', ...otherProps } = props;\n    const ref = useRef<HTMLSpanElement>(null);\n    const { currentIndicator } = useTabIndicatorContext();\n\n    useEnhancedEffect(() => {\n      if (selected && ref.current) {\n        if (currentIndicator.current !== null) {\n          // We are switching indicator, let's slide!\n          const previousClientRect = currentIndicator.current.getBoundingClientRect();\n          const currentClientRect = ref.current.getBoundingClientRect();\n          const widthDelta = previousClientRect.width / currentClientRect.width;\n          const xPosition = previousClientRect.left - currentClientRect.left;\n\n          const prevTransition = ref.current.style.transition;\n          const prevTransform = ref.current.style.transform;\n          ref.current.style.transition = 'none';\n          ref.current.style.transform = `translateX(${xPosition}px) scaleX(${widthDelta})`;\n\n          // Force repaint before updating classes and transform to ensure the transform properly takes effect\n          ref.current.getBoundingClientRect();\n\n          // Restore and let transition do it's magic\n          ref.current.style.transition = prevTransition;\n          ref.current.style.transform = prevTransform;\n        }\n        currentIndicator.current = ref.current;\n      }\n    }, [selected]);\n\n    return (\n      <Box\n        as={as}\n        ref={assignMultipleRefs(ref, forwardedRef)}\n        width=\"100%\"\n        height={rem(2)}\n        __css={{\n          bg: color,\n          position: 'absolute',\n          bottom: 0,\n          transform: `scale(1)`,\n          opacity: selected ? 1 : 0,\n          transformOrigin: 'left',\n          transition: 'transform .25s cubic-bezier(.4,0,.2,1)',\n          zIndex: 1,\n        }}\n        {...otherProps}\n      />\n    );\n  }\n);\n"],"file":"TabIndicator.js"}
+{"version":3,"sources":["../../../src/TabIndicator/TabIndicator.tsx"],"names":["forwardRef","useEffect","useRef","useLayoutEffect","assignMultipleRefs","Box","useTabIndicatorContext","useEnhancedEffect","window","TabIndicator","props","forwardedRef","as","selected","color","otherProps","ref","currentIndicator","current","previousClientRect","getBoundingClientRect","currentClientRect","widthDelta","width","xPosition","left","prevTransition","style","transition","prevTransform","transform","bg","position","bottom","opacity","transformOrigin","zIndex"],"mappings":";;AAAA,SAASA,UAAT,EAAqBC,SAArB,EAAgCC,MAAhC,EAAwCC,eAAxC,QAA+D,OAA/D;AAEA,SAASC,kBAAT,QAAmC,gBAAnC;AAGA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,sBAAT,QAAuC,WAAvC;;AAOA,IAAMC,iBAAiB,GACrB,OAAOC,MAAP,KAAkB,WAAlB,GAAgCL,eAAhC,GAAkDF,SADpD;AAGA,OAAO,IAAMQ,YAAY,gBAAGT,UAAU,CACpC,SAASS,YAAT,CAAsBC,KAAtB,EAA6BC,YAA7B,EAA2C;AAAA,kBAC2BD,KAD3B,CACjCE,EADiC;AAAA,MACjCA,EADiC,0BAC5B,MAD4B;AAAA,MACpBC,QADoB,GAC2BH,KAD3B,CACpBG,QADoB;AAAA,qBAC2BH,KAD3B,CACVI,KADU;AAAA,MACVA,KADU,6BACF,SADE;AAAA,MACYC,UADZ,4BAC2BL,KAD3B;;AAEzC,MAAMM,GAAG,GAAGd,MAAM,CAAkB,IAAlB,CAAlB;;AAFyC,8BAGZI,sBAAsB,EAHV;AAAA,MAGjCW,gBAHiC,yBAGjCA,gBAHiC;;AAKzCV,EAAAA,iBAAiB,CAAC,YAAM;AACtB,QAAIM,QAAQ,IAAIG,GAAG,CAACE,OAApB,EAA6B;AAC3B,UAAID,gBAAgB,CAACC,OAAjB,KAA6B,IAAjC,EAAuC;AACrC;AACA,YAAMC,kBAAkB,GACtBF,gBAAgB,CAACC,OAAjB,CAAyBE,qBAAzB,EADF;AAEA,YAAMC,iBAAiB,GAAGL,GAAG,CAACE,OAAJ,CAAYE,qBAAZ,EAA1B;AACA,YAAME,UAAU,GAAGH,kBAAkB,CAACI,KAAnB,GAA2BF,iBAAiB,CAACE,KAAhE;AACA,YAAMC,SAAS,GAAGL,kBAAkB,CAACM,IAAnB,GAA0BJ,iBAAiB,CAACI,IAA9D;AAEA,YAAMC,cAAc,GAAGV,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBC,UAAzC;AACA,YAAMC,aAAa,GAAGb,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBG,SAAxC;AACAd,QAAAA,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBC,UAAlB,GAA+B,MAA/B;AACAZ,QAAAA,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBG,SAAlB,wBAA4CN,SAA5C,wBAAmEF,UAAnE,OAXqC,CAarC;;AACAN,QAAAA,GAAG,CAACE,OAAJ,CAAYE,qBAAZ,GAdqC,CAgBrC;;AACAJ,QAAAA,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBC,UAAlB,GAA+BF,cAA/B;AACAV,QAAAA,GAAG,CAACE,OAAJ,CAAYS,KAAZ,CAAkBG,SAAlB,GAA8BD,aAA9B;AACD;;AACDZ,MAAAA,gBAAgB,CAACC,OAAjB,GAA2BF,GAAG,CAACE,OAA/B;AACD;AACF,GAxBgB,EAwBd,CAACL,QAAD,CAxBc,CAAjB;AA0BA,sBACE,KAAC,GAAD;AACE,IAAA,EAAE,EAAED,EADN;AAEE,IAAA,GAAG,EAAER,kBAAkB,CAACY,GAAD,EAAML,YAAN,CAFzB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,YAJR;AAKE,IAAA,KAAK,EAAE;AACLoB,MAAAA,EAAE,EAAEjB,KADC;AAELkB,MAAAA,QAAQ,EAAE,UAFL;AAGLC,MAAAA,MAAM,EAAE,CAHH;AAILH,MAAAA,SAAS,YAJJ;AAKLI,MAAAA,OAAO,EAAErB,QAAQ,GAAG,CAAH,GAAO,CALnB;AAMLsB,MAAAA,eAAe,EAAE,MANZ;AAOLP,MAAAA,UAAU,EAAE,wCAPP;AAQLQ,MAAAA,MAAM,EAAE;AARH;AALT,KAeMrB,UAfN,EADF;AAmBD,CAnDmC,CAA/B","sourcesContent":["import { forwardRef, useEffect, useRef, useLayoutEffect } from 'react';\nimport { rem } from 'polished';\nimport { assignMultipleRefs } from '@basic-ui/core';\n\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\nimport { useTabIndicatorContext } from './context';\n\nexport interface TabIndicatorProps extends BoxProps {\n  selected?: boolean;\n  color?: string;\n}\n\nconst useEnhancedEffect =\n  typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\nexport const TabIndicator = forwardRef<HTMLDivElement, TabIndicatorProps>(\n  function TabIndicator(props, forwardedRef) {\n    const { as = 'span', selected, color = 'primary', ...otherProps } = props;\n    const ref = useRef<HTMLSpanElement>(null);\n    const { currentIndicator } = useTabIndicatorContext();\n\n    useEnhancedEffect(() => {\n      if (selected && ref.current) {\n        if (currentIndicator.current !== null) {\n          // We are switching indicator, let's slide!\n          const previousClientRect =\n            currentIndicator.current.getBoundingClientRect();\n          const currentClientRect = ref.current.getBoundingClientRect();\n          const widthDelta = previousClientRect.width / currentClientRect.width;\n          const xPosition = previousClientRect.left - currentClientRect.left;\n\n          const prevTransition = ref.current.style.transition;\n          const prevTransform = ref.current.style.transform;\n          ref.current.style.transition = 'none';\n          ref.current.style.transform = `translateX(${xPosition}px) scaleX(${widthDelta})`;\n\n          // Force repaint before updating classes and transform to ensure the transform properly takes effect\n          ref.current.getBoundingClientRect();\n\n          // Restore and let transition do it's magic\n          ref.current.style.transition = prevTransition;\n          ref.current.style.transform = prevTransform;\n        }\n        currentIndicator.current = ref.current;\n      }\n    }, [selected]);\n\n    return (\n      <Box\n        as={as}\n        ref={assignMultipleRefs(ref, forwardedRef)}\n        width=\"100%\"\n        height={rem(2)}\n        __css={{\n          bg: color,\n          position: 'absolute',\n          bottom: 0,\n          transform: `scale(1)`,\n          opacity: selected ? 1 : 0,\n          transformOrigin: 'left',\n          transition: 'transform .25s cubic-bezier(.4,0,.2,1)',\n          zIndex: 1,\n        }}\n        {...otherProps}\n      />\n    );\n  }\n);\n"],"file":"TabIndicator.js"}