@basic-ui/material 0.1.16 → 1.0.0-alpha.10

package/build/esm/Dialog/Scrim.js

@@ -1,14 +1,12 @@
 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 { Box } from '../Box';
 import { alpha } from '../color';
 import { jsx as _jsx } from "react/jsx-runtime";
-export const Scrim = /*#__PURE__*/forwardRef(function Scrim(props, forwardedRef) {
-  const {
-    __css
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["__css"]);
+export var Scrim = /*#__PURE__*/forwardRef(function Scrim(props, forwardedRef) {
+  var __css = props.__css,
+      otherProps = _objectWithoutProperties(props, ["__css"]);
 
   return /*#__PURE__*/_jsx(Box, _extends({
     ref: forwardedRef,

package/build/esm/Dialog/Scrim.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Dialog/Scrim.tsx"],"names":["forwardRef","Box","alpha","Scrim","props","forwardedRef","__css","otherProps","position","top","left","right","bottom","width","height","backgroundColor","willChange","zIndex","pointerEvents"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AACA,SAASC,GAAT,QAA8B,QAA9B;AACA,SAASC,KAAT,QAAsB,UAAtB;;AAIA,OAAO,MAAMC,KAAK,gBAAGH,UAAU,CAA6B,SAASG,KAAT,CAC1DC,KAD0D,EAE1DC,YAF0D,EAG1D;AACA,QAAM;AAAEC,IAAAA;AAAF,MAA2BF,KAAjC;AAAA,QAAkBG,UAAlB,iCAAiCH,KAAjC;;AAEA,sBACE,KAAC,GAAD;AACE,IAAA,GAAG,EAAEC,YADP;AAEE,IAAA,KAAK;AACHG,MAAAA,QAAQ,EAAE,OADP;AAEHC,MAAAA,GAAG,EAAE,GAFF;AAGHC,MAAAA,IAAI,EAAE,GAHH;AAIHC,MAAAA,KAAK,EAAE,GAJJ;AAKHC,MAAAA,MAAM,EAAE,GALL;AAMHC,MAAAA,KAAK,EAAE,MANJ;AAOHC,MAAAA,MAAM,EAAE,MAPL;AAQHC,MAAAA,eAAe,EAAEb,KAAK,CAAC,MAAD,EAAS,IAAT,CARnB;AASHc,MAAAA,UAAU,EAAE,SATT;AAUHC,MAAAA,MAAM,EAAE,CAAC,CAVN;AAWHC,MAAAA,aAAa,EAAE;AAXZ,OAYAZ,KAZA;AAFP,KAgBMC,UAhBN,EADF;AAoBD,CA1B8B,CAAxB","sourcesContent":["import { forwardRef } from 'react';\nimport { Box, BoxProps } from '../Box';\nimport { alpha } from '../color';\n\nexport type ScrimProps = BoxProps;\n\nexport const Scrim = forwardRef<HTMLDivElement, ScrimProps>(function Scrim(\n  props,\n  forwardedRef\n) {\n  const { __css, ...otherProps } = props;\n\n  return (\n    <Box\n      ref={forwardedRef}\n      __css={{\n        position: 'fixed',\n        top: '0',\n        left: '0',\n        right: '0',\n        bottom: '0',\n        width: '100%',\n        height: '100%',\n        backgroundColor: alpha('#000', 0.32),\n        willChange: 'opacity',\n        zIndex: -1,\n        pointerEvents: 'none',\n        ...__css,\n      }}\n      {...otherProps}\n    />\n  );\n});\n"],"file":"Scrim.js"}
+{"version":3,"sources":["../../../src/Dialog/Scrim.tsx"],"names":["forwardRef","Box","alpha","Scrim","props","forwardedRef","__css","otherProps","position","top","left","right","bottom","width","height","backgroundColor","willChange","zIndex","pointerEvents"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAGA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,KAAT,QAAsB,UAAtB;;AAIA,OAAO,IAAMC,KAAK,gBAAGH,UAAU,CAA6B,SAASG,KAAT,CAC1DC,KAD0D,EAE1DC,YAF0D,EAG1D;AAAA,MACQC,KADR,GACiCF,KADjC,CACQE,KADR;AAAA,MACkBC,UADlB,4BACiCH,KADjC;;AAGA,sBACE,KAAC,GAAD;AACE,IAAA,GAAG,EAAEC,YADP;AAEE,IAAA,KAAK;AACHG,MAAAA,QAAQ,EAAE,OADP;AAEHC,MAAAA,GAAG,EAAE,GAFF;AAGHC,MAAAA,IAAI,EAAE,GAHH;AAIHC,MAAAA,KAAK,EAAE,GAJJ;AAKHC,MAAAA,MAAM,EAAE,GALL;AAMHC,MAAAA,KAAK,EAAE,MANJ;AAOHC,MAAAA,MAAM,EAAE,MAPL;AAQHC,MAAAA,eAAe,EAAEb,KAAK,CAAC,MAAD,EAAS,IAAT,CARnB;AASHc,MAAAA,UAAU,EAAE,SATT;AAUHC,MAAAA,MAAM,EAAE,CAAC,CAVN;AAWHC,MAAAA,aAAa,EAAE;AAXZ,OAYAZ,KAZA;AAFP,KAgBMC,UAhBN,EADF;AAoBD,CA1B8B,CAAxB","sourcesContent":["import { forwardRef } from 'react';\n\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\nimport { alpha } from '../color';\n\nexport type ScrimProps = BoxProps;\n\nexport const Scrim = forwardRef<HTMLDivElement, ScrimProps>(function Scrim(\n  props,\n  forwardedRef\n) {\n  const { __css, ...otherProps } = props;\n\n  return (\n    <Box\n      ref={forwardedRef}\n      __css={{\n        position: 'fixed',\n        top: '0',\n        left: '0',\n        right: '0',\n        bottom: '0',\n        width: '100%',\n        height: '100%',\n        backgroundColor: alpha('#000', 0.32),\n        willChange: 'opacity',\n        zIndex: -1,\n        pointerEvents: 'none',\n        ...__css,\n      }}\n      {...otherProps}\n    />\n  );\n});\n"],"file":"Scrim.js"}

package/build/esm/Dialog/useDialogAnimation.js

@@ -1,7 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import { useAnimation } from '../hooks/useAnimation';
-const styles = {
+import { EASING_STANDARD } from '../motion';
+var styles = {
   slide: {
     closed: {
       opacity: 0.6,
@@ -45,32 +46,31 @@ const styles = {
   }
 };
 export function useDialogAnimation(opts) {
-  const {
-    mode = 'grow'
-  } = opts,
-        otherOpts = _objectWithoutPropertiesLoose(opts, ["mode"]);
+  var _opts$mode = opts.mode,
+      mode = _opts$mode === void 0 ? 'grow' : _opts$mode,
+      otherOpts = _objectWithoutProperties(opts, ["mode"]);
 
-  const {
-    open,
-    state,
-    style,
-    timing
-  } = useAnimation(_extends({
-    styles,
-    mode
-  }, otherOpts));
-  const scrimOpacity = state === 'open' ? 1 : 0;
-  const transition = "opacity ".concat(timing, "ms cubic-bezier(.4,0,.2,1),transform ").concat(timing, "ms cubic-bezier(.4,0,.2,1)");
-  const scrimTransition = "opacity ".concat(timing * 0.4 | 0, "ms cubic-bezier(.4,0,.2,1)");
+  var _useAnimation = useAnimation(_extends({
+    styles: styles,
+    mode: mode
+  }, otherOpts)),
+      open = _useAnimation.open,
+      state = _useAnimation.state,
+      style = _useAnimation.style,
+      timing = _useAnimation.timing;
+
+  var scrimOpacity = state === 'open' ? 1 : 0;
+  var transition = "opacity ".concat(timing, "ms ").concat(EASING_STANDARD, ",transform ").concat(timing, "ms ").concat(EASING_STANDARD);
+  var scrimTransition = "opacity ".concat(timing * 0.4 | 0, "ms ").concat(EASING_STANDARD);
   return {
     containerStyle: _extends({}, style, {
-      transition
+      transition: transition
     }),
     scrimStyle: {
       opacity: scrimOpacity,
       transition: scrimTransition
     },
-    open
+    open: open
   };
 }
 //# sourceMappingURL=useDialogAnimation.js.map

package/build/esm/Dialog/useDialogAnimation.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Dialog/useDialogAnimation.tsx"],"names":["useAnimation","styles","slide","closed","opacity","transform","open","close","grow","useDialogAnimation","opts","mode","otherOpts","state","style","timing","scrimOpacity","transition","scrimTransition","containerStyle","scrimStyle"],"mappings":";;AAAA,SAASA,YAAT,QAA6B,uBAA7B;AAEA,MAAMC,MAAM,GAAG;AACbC,EAAAA,KAAK,EAAE;AACLC,IAAAA,MAAM,EAAE;AAAEC,MAAAA,OAAO,EAAE,GAAX;AAAgBC,MAAAA,SAAS,EAAE;AAA3B,KADH;AAELC,IAAAA,IAAI,EAAE;AAAEF,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB,KAFD;AAGLE,IAAAA,KAAK,EAAE;AAAEH,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB;AAHF,GADM;AAMbG,EAAAA,IAAI,EAAE;AACJL,IAAAA,MAAM,EAAE;AAAEC,MAAAA,OAAO,EAAE,GAAX;AAAgBC,MAAAA,SAAS,EAAE;AAA3B,KADJ;AAEJC,IAAAA,IAAI,EAAE;AAAEF,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB,KAFF;AAGJE,IAAAA,KAAK,EAAE;AAAEH,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB;AAHH,GANO;AAWb,gBAAc;AACZF,IAAAA,MAAM,EAAE;AAAEC,MAAAA,OAAO,EAAE,GAAX;AAAgBC,MAAAA,SAAS,EAAE;AAA3B,KADI;AAEZC,IAAAA,IAAI,EAAE;AAAEF,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB,KAFM;AAGZE,IAAAA,KAAK,EAAE;AAAEH,MAAAA,OAAO,EAAE;AAAX;AAHK;AAXD,CAAf;AAoBA,OAAO,SAASK,kBAAT,CAA4BC,IAA5B,EAKJ;AACD,QAAM;AAAEC,IAAAA,IAAI,GAAG;AAAT,MAAkCD,IAAxC;AAAA,QAA0BE,SAA1B,iCAAwCF,IAAxC;;AACA,QAAM;AAAEJ,IAAAA,IAAF;AAAQO,IAAAA,KAAR;AAAeC,IAAAA,KAAf;AAAsBC,IAAAA;AAAtB,MAAiCf,YAAY;AACjDC,IAAAA,MADiD;AAEjDU,IAAAA;AAFiD,KAG9CC,SAH8C,EAAnD;AAKA,QAAMI,YAAY,GAAGH,KAAK,KAAK,MAAV,GAAmB,CAAnB,GAAuB,CAA5C;AAEA,QAAMI,UAAU,qBAAcF,MAAd,kDAA4DA,MAA5D,+BAAhB;AACA,QAAMG,eAAe,qBAClBH,MAAM,GAAG,GAAV,GAAiB,CADE,+BAArB;AAIA,SAAO;AACLI,IAAAA,cAAc,eAAOL,KAAP;AAAcG,MAAAA;AAAd,MADT;AAELG,IAAAA,UAAU,EAAE;AACVhB,MAAAA,OAAO,EAAEY,YADC;AAEVC,MAAAA,UAAU,EAAEC;AAFF,KAFP;AAMLZ,IAAAA;AANK,GAAP;AAQD","sourcesContent":["import { useAnimation } from '../hooks/useAnimation';\n\nconst styles = {\n  slide: {\n    closed: { opacity: 0.6, transform: 'translateY(100%)' },\n    open: { opacity: 1, transform: 'translateY(0%)' },\n    close: { opacity: 0, transform: 'translateY(10%)' },\n  },\n  grow: {\n    closed: { opacity: 0.8, transform: 'scale(0.8)' },\n    open: { opacity: 1, transform: 'scale(1)' },\n    close: { opacity: 0, transform: 'scale(1)' },\n  },\n  'slide-grow': {\n    closed: { opacity: 0.8, transform: 'translateY(50%) scale(0.8)' },\n    open: { opacity: 1, transform: 'translateY(0%) scale(1)' },\n    close: { opacity: 0 },\n  },\n};\n\nexport type DialogAnimationModes = keyof typeof styles;\n\nexport function useDialogAnimation(opts: {\n  open: boolean;\n  mode?: DialogAnimationModes;\n  openTimeoutInMilliseconds?: number;\n  closeTimeoutInMilliseconds?: number;\n}) {\n  const { mode = 'grow', ...otherOpts } = opts;\n  const { open, state, style, timing } = useAnimation({\n    styles,\n    mode,\n    ...otherOpts,\n  });\n  const scrimOpacity = state === 'open' ? 1 : 0;\n\n  const transition = `opacity ${timing}ms cubic-bezier(.4,0,.2,1),transform ${timing}ms cubic-bezier(.4,0,.2,1)`;\n  const scrimTransition = `opacity ${\n    (timing * 0.4) | 0\n  }ms cubic-bezier(.4,0,.2,1)`;\n\n  return {\n    containerStyle: { ...style, transition },\n    scrimStyle: {\n      opacity: scrimOpacity,\n      transition: scrimTransition,\n    },\n    open,\n  };\n}\n"],"file":"useDialogAnimation.js"}
+{"version":3,"sources":["../../../src/Dialog/useDialogAnimation.tsx"],"names":["useAnimation","EASING_STANDARD","styles","slide","closed","opacity","transform","open","close","grow","useDialogAnimation","opts","mode","otherOpts","state","style","timing","scrimOpacity","transition","scrimTransition","containerStyle","scrimStyle"],"mappings":";;AAAA,SAASA,YAAT,QAA6B,uBAA7B;AACA,SAASC,eAAT,QAAgC,WAAhC;AAEA,IAAMC,MAAM,GAAG;AACbC,EAAAA,KAAK,EAAE;AACLC,IAAAA,MAAM,EAAE;AAAEC,MAAAA,OAAO,EAAE,GAAX;AAAgBC,MAAAA,SAAS,EAAE;AAA3B,KADH;AAELC,IAAAA,IAAI,EAAE;AAAEF,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB,KAFD;AAGLE,IAAAA,KAAK,EAAE;AAAEH,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB;AAHF,GADM;AAMbG,EAAAA,IAAI,EAAE;AACJL,IAAAA,MAAM,EAAE;AAAEC,MAAAA,OAAO,EAAE,GAAX;AAAgBC,MAAAA,SAAS,EAAE;AAA3B,KADJ;AAEJC,IAAAA,IAAI,EAAE;AAAEF,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB,KAFF;AAGJE,IAAAA,KAAK,EAAE;AAAEH,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB;AAHH,GANO;AAWb,gBAAc;AACZF,IAAAA,MAAM,EAAE;AAAEC,MAAAA,OAAO,EAAE,GAAX;AAAgBC,MAAAA,SAAS,EAAE;AAA3B,KADI;AAEZC,IAAAA,IAAI,EAAE;AAAEF,MAAAA,OAAO,EAAE,CAAX;AAAcC,MAAAA,SAAS,EAAE;AAAzB,KAFM;AAGZE,IAAAA,KAAK,EAAE;AAAEH,MAAAA,OAAO,EAAE;AAAX;AAHK;AAXD,CAAf;AAoBA,OAAO,SAASK,kBAAT,CAA4BC,IAA5B,EAKJ;AAAA,mBACuCA,IADvC,CACOC,IADP;AAAA,MACOA,IADP,2BACc,MADd;AAAA,MACyBC,SADzB,4BACuCF,IADvC;;AAAA,sBAEsCX,YAAY;AACjDE,IAAAA,MAAM,EAANA,MADiD;AAEjDU,IAAAA,IAAI,EAAJA;AAFiD,KAG9CC,SAH8C,EAFlD;AAAA,MAEON,IAFP,iBAEOA,IAFP;AAAA,MAEaO,KAFb,iBAEaA,KAFb;AAAA,MAEoBC,KAFpB,iBAEoBA,KAFpB;AAAA,MAE2BC,MAF3B,iBAE2BA,MAF3B;;AAOD,MAAMC,YAAY,GAAGH,KAAK,KAAK,MAAV,GAAmB,CAAnB,GAAuB,CAA5C;AAEA,MAAMI,UAAU,qBAAcF,MAAd,gBAA0Bf,eAA1B,wBAAuDe,MAAvD,gBAAmEf,eAAnE,CAAhB;AACA,MAAMkB,eAAe,qBAAeH,MAAM,GAAG,GAAV,GAAiB,CAA/B,gBAAsCf,eAAtC,CAArB;AAEA,SAAO;AACLmB,IAAAA,cAAc,eAAOL,KAAP;AAAcG,MAAAA,UAAU,EAAVA;AAAd,MADT;AAELG,IAAAA,UAAU,EAAE;AACVhB,MAAAA,OAAO,EAAEY,YADC;AAEVC,MAAAA,UAAU,EAAEC;AAFF,KAFP;AAMLZ,IAAAA,IAAI,EAAJA;AANK,GAAP;AAQD","sourcesContent":["import { useAnimation } from '../hooks/useAnimation';\nimport { EASING_STANDARD } from '../motion';\n\nconst styles = {\n  slide: {\n    closed: { opacity: 0.6, transform: 'translateY(100%)' },\n    open: { opacity: 1, transform: 'translateY(0%)' },\n    close: { opacity: 0, transform: 'translateY(10%)' },\n  },\n  grow: {\n    closed: { opacity: 0.8, transform: 'scale(0.8)' },\n    open: { opacity: 1, transform: 'scale(1)' },\n    close: { opacity: 0, transform: 'scale(1)' },\n  },\n  'slide-grow': {\n    closed: { opacity: 0.8, transform: 'translateY(50%) scale(0.8)' },\n    open: { opacity: 1, transform: 'translateY(0%) scale(1)' },\n    close: { opacity: 0 },\n  },\n};\n\nexport type DialogAnimationModes = keyof typeof styles;\n\nexport function useDialogAnimation(opts: {\n  open: boolean;\n  mode?: DialogAnimationModes;\n  openTimeoutInMilliseconds?: number;\n  closeTimeoutInMilliseconds?: number;\n}) {\n  const { mode = 'grow', ...otherOpts } = opts;\n  const { open, state, style, timing } = useAnimation({\n    styles,\n    mode,\n    ...otherOpts,\n  });\n  const scrimOpacity = state === 'open' ? 1 : 0;\n\n  const transition = `opacity ${timing}ms ${EASING_STANDARD},transform ${timing}ms ${EASING_STANDARD}`;\n  const scrimTransition = `opacity ${(timing * 0.4) | 0}ms ${EASING_STANDARD}`;\n\n  return {\n    containerStyle: { ...style, transition },\n    scrimStyle: {\n      opacity: scrimOpacity,\n      transition: scrimTransition,\n    },\n    open,\n  };\n}\n"],"file":"useDialogAnimation.js"}

package/build/esm/Divider/Divider.d.ts

@@ -1,7 +1,7 @@
-import type * as React from 'react';
-import { BoxProps } from '../Box';
+import type { ElementType } from 'react';
+import type { BoxProps } from '../Box';
 export interface DividerProps extends BoxProps {
-    as?: React.ElementType<any>;
+    as?: ElementType<any>;
     direction?: 'vertical' | 'horizontal';
 }
-export declare const Divider: React.ForwardRefExoticComponent<Pick<DividerProps, "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" | "direction" | "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" | "bg" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "variant" | "size" | "hidden" | "as" | "sx" | "__css" | "tx" | "theme" | "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"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Divider: import("react").ForwardRefExoticComponent<Pick<DividerProps, "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" | "direction" | "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" | "bg" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "hidden" | "theme" | "sx" | "__css" | "variant" | "tx" | "as" | "size" | "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"> & import("react").RefAttributes<HTMLDivElement>>;

package/build/esm/Divider/Divider.js

@@ -1,16 +1,16 @@
 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 { Box } from '../Box';
 import { alpha } from '../color';
 import { jsx as _jsx } from "react/jsx-runtime";
-export const Divider = /*#__PURE__*/forwardRef(function Divider(props, forwardedRef) {
-  const {
-    as = 'div',
-    direction = 'horizontal',
-    __css
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["as", "direction", "__css"]);
+export var Divider = /*#__PURE__*/forwardRef(function Divider(props, forwardedRef) {
+  var _props$as = props.as,
+      as = _props$as === void 0 ? 'div' : _props$as,
+      _props$direction = props.direction,
+      direction = _props$direction === void 0 ? 'horizontal' : _props$direction,
+      __css = props.__css,
+      otherProps = _objectWithoutProperties(props, ["as", "direction", "__css"]);
 
   return /*#__PURE__*/_jsx(Box, _extends({
     ref: forwardedRef,

package/build/esm/Divider/Divider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Divider/Divider.tsx"],"names":["forwardRef","Box","alpha","Divider","props","forwardedRef","as","direction","__css","otherProps","border","listStyleType","height","borderBottomWidth","borderBottomStyle","borderBottomColor","width","borderRightWidth","borderRightStyle","borderRightColor"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAASC,GAAT,QAA8B,QAA9B;AAEA,SAASC,KAAT,QAAsB,UAAtB;;AAOA,OAAO,MAAMC,OAAO,gBAAGH,UAAU,CAC/B,SAASG,OAAT,CAAiBC,KAAjB,EAAwBC,YAAxB,EAAsC;AACpC,QAAM;AACJC,IAAAA,EAAE,GAAG,KADD;AAEJC,IAAAA,SAAS,GAAG,YAFR;AAGJC,IAAAA;AAHI,MAKFJ,KALJ;AAAA,QAIKK,UAJL,iCAKIL,KALJ;;AAOA,sBACE,KAAC,GAAD;AACE,IAAA,GAAG,EAAEC,YADP;AAEE,IAAA,EAAE,EAAEC,EAFN;AAGE,IAAA,IAAI,EAAC;AAHP,KAIMG,UAJN;AAKE,IAAA,KAAK;AACHC,MAAAA,MAAM,EAAE,MADL;AAEHC,MAAAA,aAAa,EAAE;AAFZ,OAGCJ,SAAS,KAAK,YAAd,IAA8B;AAChCK,MAAAA,MAAM,EAAE,CADwB;AAEhCC,MAAAA,iBAAiB,aAFe;AAGhCC,MAAAA,iBAAiB,EAAE,OAHa;AAIhCC,MAAAA,iBAAiB,EAAEb,KAAK,CAAC,YAAD,EAAe,IAAf;AAJQ,KAH/B,EASCK,SAAS,KAAK,UAAd,IAA4B;AAC9BS,MAAAA,KAAK,EAAE,CADuB;AAE9BC,MAAAA,gBAAgB,aAFc;AAG9BC,MAAAA,gBAAgB,EAAE,OAHY;AAI9BC,MAAAA,gBAAgB,EAAEjB,KAAK,CAAC,YAAD,EAAe,IAAf;AAJO,KAT7B,EAeAM,KAfA;AALP,KADF;AAyBD,CAlC8B,CAA1B","sourcesContent":["import { forwardRef } from 'react';\nimport type * as React from 'react';\nimport { Box, BoxProps } from '../Box';\nimport { rem } from 'polished';\nimport { alpha } from '../color';\n\nexport interface DividerProps extends BoxProps {\n  as?: React.ElementType<any>;\n  direction?: 'vertical' | 'horizontal';\n}\n\nexport const Divider = forwardRef<HTMLDivElement, DividerProps>(\n  function Divider(props, forwardedRef) {\n    const {\n      as = 'div',\n      direction = 'horizontal',\n      __css,\n      ...otherProps\n    } = props;\n\n    return (\n      <Box\n        ref={forwardedRef}\n        as={as}\n        role=\"separator\"\n        {...otherProps}\n        __css={{\n          border: 'none',\n          listStyleType: 'none',\n          ...(direction === 'horizontal' && {\n            height: 0,\n            borderBottomWidth: rem(1),\n            borderBottomStyle: 'solid',\n            borderBottomColor: alpha('on.surface', 0.12),\n          }),\n          ...(direction === 'vertical' && {\n            width: 0,\n            borderRightWidth: rem(1),\n            borderRightStyle: 'solid',\n            borderRightColor: alpha('on.surface', 0.12),\n          }),\n          ...__css,\n        }}\n      />\n    );\n  }\n);\n"],"file":"Divider.js"}
+{"version":3,"sources":["../../../src/Divider/Divider.tsx"],"names":["forwardRef","Box","alpha","Divider","props","forwardedRef","as","direction","__css","otherProps","border","listStyleType","height","borderBottomWidth","borderBottomStyle","borderBottomColor","width","borderRightWidth","borderRightStyle","borderRightColor"],"mappings":";;AACA,SAASA,UAAT,QAA2B,OAA3B;AAIA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,KAAT,QAAsB,UAAtB;;AAOA,OAAO,IAAMC,OAAO,gBAAGH,UAAU,CAC/B,SAASG,OAAT,CAAiBC,KAAjB,EAAwBC,YAAxB,EAAsC;AAAA,kBAMhCD,KANgC,CAElCE,EAFkC;AAAA,MAElCA,EAFkC,0BAE7B,KAF6B;AAAA,yBAMhCF,KANgC,CAGlCG,SAHkC;AAAA,MAGlCA,SAHkC,iCAGtB,YAHsB;AAAA,MAIlCC,KAJkC,GAMhCJ,KANgC,CAIlCI,KAJkC;AAAA,MAK/BC,UAL+B,4BAMhCL,KANgC;;AAQpC,sBACE,KAAC,GAAD;AACE,IAAA,GAAG,EAAEC,YADP;AAEE,IAAA,EAAE,EAAEC,EAFN;AAGE,IAAA,IAAI,EAAC;AAHP,KAIMG,UAJN;AAKE,IAAA,KAAK;AACHC,MAAAA,MAAM,EAAE,MADL;AAEHC,MAAAA,aAAa,EAAE;AAFZ,OAGCJ,SAAS,KAAK,YAAd,IAA8B;AAChCK,MAAAA,MAAM,EAAE,CADwB;AAEhCC,MAAAA,iBAAiB,aAFe;AAGhCC,MAAAA,iBAAiB,EAAE,OAHa;AAIhCC,MAAAA,iBAAiB,EAAEb,KAAK,CAAC,YAAD,EAAe,IAAf;AAJQ,KAH/B,EASCK,SAAS,KAAK,UAAd,IAA4B;AAC9BS,MAAAA,KAAK,EAAE,CADuB;AAE9BC,MAAAA,gBAAgB,aAFc;AAG9BC,MAAAA,gBAAgB,EAAE,OAHY;AAI9BC,MAAAA,gBAAgB,EAAEjB,KAAK,CAAC,YAAD,EAAe,IAAf;AAJO,KAT7B,EAeAM,KAfA;AALP,KADF;AAyBD,CAlC8B,CAA1B","sourcesContent":["import type { ElementType } from 'react';\nimport { forwardRef } from 'react';\nimport { rem } from 'polished';\n\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\nimport { alpha } from '../color';\n\nexport interface DividerProps extends BoxProps {\n  as?: ElementType<any>;\n  direction?: 'vertical' | 'horizontal';\n}\n\nexport const Divider = forwardRef<HTMLDivElement, DividerProps>(\n  function Divider(props, forwardedRef) {\n    const {\n      as = 'div',\n      direction = 'horizontal',\n      __css,\n      ...otherProps\n    } = props;\n\n    return (\n      <Box\n        ref={forwardedRef}\n        as={as}\n        role=\"separator\"\n        {...otherProps}\n        __css={{\n          border: 'none',\n          listStyleType: 'none',\n          ...(direction === 'horizontal' && {\n            height: 0,\n            borderBottomWidth: rem(1),\n            borderBottomStyle: 'solid',\n            borderBottomColor: alpha('on.surface', 0.12),\n          }),\n          ...(direction === 'vertical' && {\n            width: 0,\n            borderRightWidth: rem(1),\n            borderRightStyle: 'solid',\n            borderRightColor: alpha('on.surface', 0.12),\n          }),\n          ...__css,\n        }}\n      />\n    );\n  }\n);\n"],"file":"Divider.js"}

package/build/esm/FloatingLabel/FloatingLabel.d.ts

@@ -1,6 +1,6 @@
-import type * as React from 'react';
-export interface FloatingLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
-    children?: React.ReactNode;
+import type { LabelHTMLAttributes, ReactNode } from 'react';
+export interface FloatingLabelProps extends LabelHTMLAttributes<HTMLLabelElement> {
+    children?: ReactNode;
     active?: boolean;
     offsetX?: number;
     height?: number;
@@ -10,4 +10,4 @@ export interface FloatingLabelProps extends React.LabelHTMLAttributes<HTMLLabelE
     translateY?: number;
     transitionTime?: number;
 }
-export declare const FloatingLabel: React.ForwardRefExoticComponent<FloatingLabelProps & React.RefAttributes<HTMLLabelElement>>;
+export declare const FloatingLabel: import("react").ForwardRefExoticComponent<FloatingLabelProps & import("react").RefAttributes<HTMLLabelElement>>;

package/build/esm/FloatingLabel/FloatingLabel.js

@@ -1,33 +1,37 @@
 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 { Text as _Text } from '../Text';
 import { rem } from 'polished';
+import { Text as _Text } from '../Text';
 import { useNotchedOutlineContext } from '../NotchedOutline/context';
+import { EASING_STANDARD } from '../motion';
 import { jsx as _jsx } from "react/jsx-runtime";
-export const FloatingLabel = /*#__PURE__*/forwardRef(function FloatingLabel(props, forwardedRef) {
-  const {
-    offsetX = 0,
-    scale = 0.75,
-    height = 56,
-    active,
-    transitionTime = 150,
-    style = {},
-    translateX: translateXProp,
-    translateY: translateYProp,
-    children
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["offsetX", "scale", "height", "active", "transitionTime", "style", "translateX", "translateY", "children"]);
+export var FloatingLabel = /*#__PURE__*/forwardRef(function FloatingLabel(props, forwardedRef) {
+  var _props$offsetX = props.offsetX,
+      offsetX = _props$offsetX === void 0 ? 0 : _props$offsetX,
+      _props$scale = props.scale,
+      scale = _props$scale === void 0 ? 0.75 : _props$scale,
+      _props$height = props.height,
+      height = _props$height === void 0 ? 56 : _props$height,
+      active = props.active,
+      _props$transitionTime = props.transitionTime,
+      transitionTime = _props$transitionTime === void 0 ? 150 : _props$transitionTime,
+      _props$style = props.style,
+      style = _props$style === void 0 ? {} : _props$style,
+      translateXProp = props.translateX,
+      translateYProp = props.translateY,
+      children = props.children,
+      otherProps = _objectWithoutProperties(props, ["offsetX", "scale", "height", "active", "transitionTime", "style", "translateX", "translateY", "children"]);
 
-  const ctx = useNotchedOutlineContext();
-  const notchStart = ctx ? ctx.notchStart : 0;
-  const Text = _Text;
-  const translateX = translateXProp !== undefined ? translateXProp : notchStart - offsetX;
-  const translateY = translateYProp !== undefined ? translateYProp : -height / 2;
-  const transform = active ? "translate(".concat(rem(translateX), ", ").concat(rem(translateY), ") scale(").concat(scale, ")") : undefined;
+  var ctx = useNotchedOutlineContext();
+  var notchStart = ctx ? ctx.notchStart : 0;
+  var Text = _Text;
+  var translateX = translateXProp !== undefined ? translateXProp : notchStart - offsetX;
+  var translateY = translateYProp !== undefined ? translateYProp : -height / 2;
+  var transform = active ? "translate(".concat(rem(translateX), ", ").concat(rem(translateY), ") scale(").concat(scale, ")") : undefined;
   return /*#__PURE__*/_jsx(Text, _extends({
     as: "label",
-    variant: "subtitle1",
+    variant: "body-large",
     ref: forwardedRef,
     __css: {
       position: 'absolute',
@@ -37,11 +41,11 @@ export const FloatingLabel = /*#__PURE__*/forwardRef(function FloatingLabel(prop
       left: rem(offsetX),
       height: typeof height === 'number' ? rem(height) : height,
       transformOrigin: 'left center',
-      transition: "transform ".concat(transitionTime, "ms cubic-bezier(.4,0,.2,1), color ").concat(transitionTime, "ms cubic-bezier(.4,0,.2,1)"),
+      transition: "transform ".concat(transitionTime, "ms ").concat(EASING_STANDARD, ", color ").concat(transitionTime, "ms ").concat(EASING_STANDARD),
       pointerEvents: 'none'
     },
     style: _extends({
-      transform
+      transform: transform
     }, style)
   }, otherProps, {
     children: children

package/build/esm/FloatingLabel/FloatingLabel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/FloatingLabel/FloatingLabel.tsx"],"names":["forwardRef","Text","_Text","rem","useNotchedOutlineContext","FloatingLabel","props","forwardedRef","offsetX","scale","height","active","transitionTime","style","translateX","translateXProp","translateY","translateYProp","children","otherProps","ctx","notchStart","undefined","transform","position","fontWeight","display","alignItems","left","transformOrigin","transition","pointerEvents"],"mappings":";;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAASC,IAAI,IAAIC,KAAjB,QAA8B,SAA9B;AACA,SAASC,GAAT,QAAoB,UAApB;AACA,SAASC,wBAAT,QAAyC,2BAAzC;;AAeA,OAAO,MAAMC,aAAa,gBAAGL,UAAU,CACrC,SAASK,aAAT,CAAuBC,KAAvB,EAA8BC,YAA9B,EAA4C;AAC1C,QAAM;AACJC,IAAAA,OAAO,GAAG,CADN;AAEJC,IAAAA,KAAK,GAAG,IAFJ;AAGJC,IAAAA,MAAM,GAAG,EAHL;AAIJC,IAAAA,MAJI;AAKJC,IAAAA,cAAc,GAAG,GALb;AAMJC,IAAAA,KAAK,GAAG,EANJ;AAOJC,IAAAA,UAAU,EAAEC,cAPR;AAQJC,IAAAA,UAAU,EAAEC,cARR;AASJC,IAAAA;AATI,MAWFZ,KAXJ;AAAA,QAUKa,UAVL,iCAWIb,KAXJ;;AAaA,QAAMc,GAAG,GAAGhB,wBAAwB,EAApC;AACA,QAAMiB,UAAU,GAAGD,GAAG,GAAGA,GAAG,CAACC,UAAP,GAAoB,CAA1C;AAEA,QAAMpB,IAA8B,GAAGC,KAAvC;AAEA,QAAMY,UAAU,GACdC,cAAc,KAAKO,SAAnB,GAA+BP,cAA/B,GAAgDM,UAAU,GAAGb,OAD/D;AAEA,QAAMQ,UAAU,GACdC,cAAc,KAAKK,SAAnB,GAA+BL,cAA/B,GAAgD,CAACP,MAAD,GAAU,CAD5D;AAGA,QAAMa,SAAS,GAAGZ,MAAM,uBACPR,GAAG,CAACW,UAAD,CADI,eACaX,GAAG,CAACa,UAAD,CADhB,qBACuCP,KADvC,SAEpBa,SAFJ;AAIA,sBACE,KAAC,IAAD;AACE,IAAA,EAAE,EAAC,OADL;AAEE,IAAA,OAAO,EAAC,WAFV;AAGE,IAAA,GAAG,EAAEf,YAHP;AAIE,IAAA,KAAK,EAAE;AACLiB,MAAAA,QAAQ,EAAE,UADL;AAELC,MAAAA,UAAU,EAAE,SAFP;AAGLC,MAAAA,OAAO,EAAE,aAHJ;AAILC,MAAAA,UAAU,EAAE,QAJP;AAKLC,MAAAA,IAAI,EAAEzB,GAAG,CAACK,OAAD,CALJ;AAMLE,MAAAA,MAAM,EAAE,OAAOA,MAAP,KAAkB,QAAlB,GAA6BP,GAAG,CAACO,MAAD,CAAhC,GAA2CA,MAN9C;AAOLmB,MAAAA,eAAe,EAAE,aAPZ;AAQLC,MAAAA,UAAU,sBAAelB,cAAf,+CAAkEA,cAAlE,+BARL;AASLmB,MAAAA,aAAa,EAAE;AATV,KAJT;AAeE,IAAA,KAAK;AACHR,MAAAA;AADG,OAEAV,KAFA;AAfP,KAmBMM,UAnBN;AAAA,cAqBGD;AArBH,KADF;AAyBD,CAtDoC,CAAhC","sourcesContent":["import { forwardRef } from 'react';\nimport type * as React from 'react';\nimport { Text as _Text } from '../Text';\nimport { rem } from 'polished';\nimport { useNotchedOutlineContext } from '../NotchedOutline/context';\n\nexport interface FloatingLabelProps\n  extends React.LabelHTMLAttributes<HTMLLabelElement> {\n  children?: React.ReactNode;\n  active?: boolean;\n  offsetX?: number;\n  height?: number;\n  scale?: number;\n  px?: number;\n  translateX?: number;\n  translateY?: number;\n  transitionTime?: number;\n}\n\nexport const FloatingLabel = forwardRef<HTMLLabelElement, FloatingLabelProps>(\n  function FloatingLabel(props, forwardedRef) {\n    const {\n      offsetX = 0,\n      scale = 0.75,\n      height = 56,\n      active,\n      transitionTime = 150,\n      style = {},\n      translateX: translateXProp,\n      translateY: translateYProp,\n      children,\n      ...otherProps\n    } = props;\n\n    const ctx = useNotchedOutlineContext();\n    const notchStart = ctx ? ctx.notchStart : 0;\n\n    const Text: React.ComponentType<any> = _Text;\n\n    const translateX =\n      translateXProp !== undefined ? translateXProp : notchStart - offsetX;\n    const translateY =\n      translateYProp !== undefined ? translateYProp : -height / 2;\n\n    const transform = active\n      ? `translate(${rem(translateX)}, ${rem(translateY)}) scale(${scale})`\n      : undefined;\n\n    return (\n      <Text\n        as=\"label\"\n        variant=\"subtitle1\"\n        ref={forwardedRef}\n        __css={{\n          position: 'absolute',\n          fontWeight: 'regular',\n          display: 'inline-flex',\n          alignItems: 'center',\n          left: rem(offsetX),\n          height: typeof height === 'number' ? rem(height) : height,\n          transformOrigin: 'left center',\n          transition: `transform ${transitionTime}ms cubic-bezier(.4,0,.2,1), color ${transitionTime}ms cubic-bezier(.4,0,.2,1)`,\n          pointerEvents: 'none',\n        }}\n        style={{\n          transform,\n          ...style,\n        }}\n        {...otherProps}\n      >\n        {children}\n      </Text>\n    );\n  }\n);\n"],"file":"FloatingLabel.js"}
+{"version":3,"sources":["../../../src/FloatingLabel/FloatingLabel.tsx"],"names":["forwardRef","rem","Text","_Text","useNotchedOutlineContext","EASING_STANDARD","FloatingLabel","props","forwardedRef","offsetX","scale","height","active","transitionTime","style","translateXProp","translateX","translateYProp","translateY","children","otherProps","ctx","notchStart","undefined","transform","position","fontWeight","display","alignItems","left","transformOrigin","transition","pointerEvents"],"mappings":";;AACA,SAASA,UAAT,QAA2B,OAA3B;AACA,SAASC,GAAT,QAAoB,UAApB;AAEA,SAASC,IAAI,IAAIC,KAAjB,QAA8B,SAA9B;AACA,SAASC,wBAAT,QAAyC,2BAAzC;AACA,SAASC,eAAT,QAAgC,WAAhC;;AAeA,OAAO,IAAMC,aAAa,gBAAGN,UAAU,CACrC,SAASM,aAAT,CAAuBC,KAAvB,EAA8BC,YAA9B,EAA4C;AAAA,uBAYtCD,KAZsC,CAExCE,OAFwC;AAAA,MAExCA,OAFwC,+BAE9B,CAF8B;AAAA,qBAYtCF,KAZsC,CAGxCG,KAHwC;AAAA,MAGxCA,KAHwC,6BAGhC,IAHgC;AAAA,sBAYtCH,KAZsC,CAIxCI,MAJwC;AAAA,MAIxCA,MAJwC,8BAI/B,EAJ+B;AAAA,MAKxCC,MALwC,GAYtCL,KAZsC,CAKxCK,MALwC;AAAA,8BAYtCL,KAZsC,CAMxCM,cANwC;AAAA,MAMxCA,cANwC,sCAMvB,GANuB;AAAA,qBAYtCN,KAZsC,CAOxCO,KAPwC;AAAA,MAOxCA,KAPwC,6BAOhC,EAPgC;AAAA,MAQ5BC,cAR4B,GAYtCR,KAZsC,CAQxCS,UARwC;AAAA,MAS5BC,cAT4B,GAYtCV,KAZsC,CASxCW,UATwC;AAAA,MAUxCC,QAVwC,GAYtCZ,KAZsC,CAUxCY,QAVwC;AAAA,MAWrCC,UAXqC,4BAYtCb,KAZsC;;AAc1C,MAAMc,GAAG,GAAGjB,wBAAwB,EAApC;AACA,MAAMkB,UAAU,GAAGD,GAAG,GAAGA,GAAG,CAACC,UAAP,GAAoB,CAA1C;AAEA,MAAMpB,IAAwB,GAAGC,KAAjC;AAEA,MAAMa,UAAU,GACdD,cAAc,KAAKQ,SAAnB,GAA+BR,cAA/B,GAAgDO,UAAU,GAAGb,OAD/D;AAEA,MAAMS,UAAU,GACdD,cAAc,KAAKM,SAAnB,GAA+BN,cAA/B,GAAgD,CAACN,MAAD,GAAU,CAD5D;AAGA,MAAMa,SAAS,GAAGZ,MAAM,uBACPX,GAAG,CAACe,UAAD,CADI,eACaf,GAAG,CAACiB,UAAD,CADhB,qBACuCR,KADvC,SAEpBa,SAFJ;AAIA,sBACE,KAAC,IAAD;AACE,IAAA,EAAE,EAAC,OADL;AAEE,IAAA,OAAO,EAAC,YAFV;AAGE,IAAA,GAAG,EAAEf,YAHP;AAIE,IAAA,KAAK,EAAE;AACLiB,MAAAA,QAAQ,EAAE,UADL;AAELC,MAAAA,UAAU,EAAE,SAFP;AAGLC,MAAAA,OAAO,EAAE,aAHJ;AAILC,MAAAA,UAAU,EAAE,QAJP;AAKLC,MAAAA,IAAI,EAAE5B,GAAG,CAACQ,OAAD,CALJ;AAMLE,MAAAA,MAAM,EAAE,OAAOA,MAAP,KAAkB,QAAlB,GAA6BV,GAAG,CAACU,MAAD,CAAhC,GAA2CA,MAN9C;AAOLmB,MAAAA,eAAe,EAAE,aAPZ;AAQLC,MAAAA,UAAU,sBAAelB,cAAf,gBAAmCR,eAAnC,qBAA6DQ,cAA7D,gBAAiFR,eAAjF,CARL;AASL2B,MAAAA,aAAa,EAAE;AATV,KAJT;AAeE,IAAA,KAAK;AACHR,MAAAA,SAAS,EAATA;AADG,OAEAV,KAFA;AAfP,KAmBMM,UAnBN;AAAA,cAqBGD;AArBH,KADF;AAyBD,CAtDoC,CAAhC","sourcesContent":["import type { ComponentType, LabelHTMLAttributes, ReactNode } from 'react';\nimport { forwardRef } from 'react';\nimport { rem } from 'polished';\n\nimport { Text as _Text } from '../Text';\nimport { useNotchedOutlineContext } from '../NotchedOutline/context';\nimport { EASING_STANDARD } from '../motion';\n\nexport interface FloatingLabelProps\n  extends LabelHTMLAttributes<HTMLLabelElement> {\n  children?: ReactNode;\n  active?: boolean;\n  offsetX?: number;\n  height?: number;\n  scale?: number;\n  px?: number;\n  translateX?: number;\n  translateY?: number;\n  transitionTime?: number;\n}\n\nexport const FloatingLabel = forwardRef<HTMLLabelElement, FloatingLabelProps>(\n  function FloatingLabel(props, forwardedRef) {\n    const {\n      offsetX = 0,\n      scale = 0.75,\n      height = 56,\n      active,\n      transitionTime = 150,\n      style = {},\n      translateX: translateXProp,\n      translateY: translateYProp,\n      children,\n      ...otherProps\n    } = props;\n\n    const ctx = useNotchedOutlineContext();\n    const notchStart = ctx ? ctx.notchStart : 0;\n\n    const Text: ComponentType<any> = _Text;\n\n    const translateX =\n      translateXProp !== undefined ? translateXProp : notchStart - offsetX;\n    const translateY =\n      translateYProp !== undefined ? translateYProp : -height / 2;\n\n    const transform = active\n      ? `translate(${rem(translateX)}, ${rem(translateY)}) scale(${scale})`\n      : undefined;\n\n    return (\n      <Text\n        as=\"label\"\n        variant=\"body-large\"\n        ref={forwardedRef}\n        __css={{\n          position: 'absolute',\n          fontWeight: 'regular',\n          display: 'inline-flex',\n          alignItems: 'center',\n          left: rem(offsetX),\n          height: typeof height === 'number' ? rem(height) : height,\n          transformOrigin: 'left center',\n          transition: `transform ${transitionTime}ms ${EASING_STANDARD}, color ${transitionTime}ms ${EASING_STANDARD}`,\n          pointerEvents: 'none',\n        }}\n        style={{\n          transform,\n          ...style,\n        }}\n        {...otherProps}\n      >\n        {children}\n      </Text>\n    );\n  }\n);\n"],"file":"FloatingLabel.js"}

package/build/esm/LineRipple/LineRipple.d.ts

@@ -1,9 +1,9 @@
-import type * as React from 'react';
-import { BoxProps } from '../Box';
+import type { ReactNode } from 'react';
+import type { BoxProps } from '../Box';
 export interface LineRippleProps extends BoxProps {
     active?: boolean;
     transitionDuration?: number;
     posx?: number;
-    children?: React.ReactNode;
+    children?: ReactNode;
 }
-export declare const LineRipple: React.ForwardRefExoticComponent<Pick<LineRippleProps, "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" | "transitionDuration" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "bg" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "variant" | "size" | "hidden" | "as" | "sx" | "__css" | "tx" | "theme" | "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" | "active" | "posx"> & React.RefAttributes<HTMLDivElement>>;
+export declare const LineRipple: import("react").ForwardRefExoticComponent<Pick<LineRippleProps, "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" | "transitionDuration" | "translate" | "verticalAlign" | "width" | "zIndex" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "gridColumnGap" | "gridGap" | "gridRowGap" | "bg" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "hidden" | "theme" | "sx" | "__css" | "variant" | "tx" | "as" | "size" | "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" | "active" | "posx"> & import("react").RefAttributes<HTMLDivElement>>;

package/build/esm/LineRipple/LineRipple.js

@@ -1,25 +1,34 @@
 import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import { forwardRef, useState, useRef, useEffect } from 'react';
 import { useTheme } from '../theme';
 import { Box } from '../Box';
+import { EASING_STANDARD } from '../motion';
 import { jsx as _jsx } from "react/jsx-runtime";
-export const LineRipple = /*#__PURE__*/forwardRef(function LineRipple(props, forwardedRef) {
-  const {
-    as: asProp,
-    transitionDuration = 180,
-    color = 'primary',
-    active = false,
-    posx = -1,
-    style: styleProp = {},
-    __css
-  } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, ["as", "transitionDuration", "color", "active", "posx", "style", "__css"]);
+export var LineRipple = /*#__PURE__*/forwardRef(function LineRipple(props, forwardedRef) {
+  var asProp = props.as,
+      _props$transitionDura = props.transitionDuration,
+      transitionDuration = _props$transitionDura === void 0 ? 180 : _props$transitionDura,
+      _props$color = props.color,
+      color = _props$color === void 0 ? 'primary' : _props$color,
+      _props$active = props.active,
+      active = _props$active === void 0 ? false : _props$active,
+      _props$posx = props.posx,
+      posx = _props$posx === void 0 ? -1 : _props$posx,
+      _props$style = props.style,
+      styleProp = _props$style === void 0 ? {} : _props$style,
+      __css = props.__css,
+      otherProps = _objectWithoutProperties(props, ["as", "transitionDuration", "color", "active", "posx", "style", "__css"]);
+
+  var _useState = useState(),
+      _useState2 = _slicedToArray(_useState, 2),
+      style = _useState2[0],
+      setStyle = _useState2[1];
 
-  const [style, setStyle] = useState();
-  const theme = useTheme();
-  const leaveTimeout = useRef();
-  useEffect(() => {
+  var theme = useTheme();
+  var leaveTimeout = useRef();
+  useEffect(function () {
     if (active) {
       setStyle({
         transform: 'scaleX(1)',
@@ -31,12 +40,12 @@ export const LineRipple = /*#__PURE__*/forwardRef(function LineRipple(props, for
         transform: 'scaleX(1)',
         opacity: 0
       });
-      leaveTimeout.current = window.setTimeout(() => {
+      leaveTimeout.current = window.setTimeout(function () {
         setStyle(undefined);
       }, transitionDuration);
     }
 
-    return () => {
+    return function () {
       clearTimeout(leaveTimeout.current);
     };
   }, [active, posx, transitionDuration]);
@@ -55,7 +64,7 @@ export const LineRipple = /*#__PURE__*/forwardRef(function LineRipple(props, for
       zIndex: 1,
       transform: 'scaleX(0)',
       transformOrigin: 'center center',
-      transition: "transform ".concat(transitionDuration, "ms cubic-bezier(.4,0,.2,1),opacity ").concat(transitionDuration, "ms cubic-bezier(.4,0,.2,1)"),
+      transition: "transform ".concat(transitionDuration, "ms ").concat(EASING_STANDARD, ",opacity ").concat(transitionDuration, "ms ").concat(EASING_STANDARD),
       opacity: 0
     }, __css)
   }, otherProps));

package/build/esm/LineRipple/LineRipple.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/LineRipple/LineRipple.tsx"],"names":["forwardRef","useState","useRef","useEffect","useTheme","Box","LineRipple","props","forwardedRef","as","asProp","transitionDuration","color","active","posx","style","styleProp","__css","otherProps","setStyle","theme","leaveTimeout","transform","transformOrigin","undefined","opacity","current","window","setTimeout","clearTimeout","position","bottom","left","width","height","zIndex","transition"],"mappings":";;AAAA,SAASA,UAAT,EAAqBC,QAArB,EAA+BC,MAA/B,EAAuCC,SAAvC,QAAuE,OAAvE;AAGA,SAASC,QAAT,QAAyB,UAAzB;AACA,SAASC,GAAT,QAA8B,QAA9B;;AASA,OAAO,MAAMC,UAAU,gBAAGN,UAAU,CAClC,SAASM,UAAT,CAAoBC,KAApB,EAA2BC,YAA3B,EAAyC;AACvC,QAAM;AACJC,IAAAA,EAAE,EAAEC,MADA;AAEJC,IAAAA,kBAAkB,GAAG,GAFjB;AAGJC,IAAAA,KAAK,GAAG,SAHJ;AAIJC,IAAAA,MAAM,GAAG,KAJL;AAKJC,IAAAA,IAAI,GAAG,CAAC,CALJ;AAMJC,IAAAA,KAAK,EAAEC,SAAS,GAAG,EANf;AAOJC,IAAAA;AAPI,MASFV,KATJ;AAAA,QAQKW,UARL,iCASIX,KATJ;;AAWA,QAAM,CAACQ,KAAD,EAAQI,QAAR,IAAoBlB,QAAQ,EAAlC;AACA,QAAMmB,KAAK,GAAGhB,QAAQ,EAAtB;AACA,QAAMiB,YAAY,GAAGnB,MAAM,EAA3B;AAEAC,EAAAA,SAAS,CAAC,MAAM;AACd,QAAIU,MAAJ,EAAY;AACVM,MAAAA,QAAQ,CAAC;AACPG,QAAAA,SAAS,EAAE,WADJ;AAEPC,QAAAA,eAAe,EAAET,IAAI,IAAI,CAAR,aAAeA,IAAf,iBAAiCU,SAF3C;AAGPC,QAAAA,OAAO,EAAE;AAHF,OAAD,CAAR;AAKD,KAND,MAMO;AACLN,MAAAA,QAAQ,CAAC;AACPG,QAAAA,SAAS,EAAE,WADJ;AAEPG,QAAAA,OAAO,EAAE;AAFF,OAAD,CAAR;AAKAJ,MAAAA,YAAY,CAACK,OAAb,GAAuBC,MAAM,CAACC,UAAP,CAAkB,MAAM;AAC7CT,QAAAA,QAAQ,CAACK,SAAD,CAAR;AACD,OAFsB,EAEpBb,kBAFoB,CAAvB;AAGD;;AAED,WAAO,MAAM;AACXkB,MAAAA,YAAY,CAACR,YAAY,CAACK,OAAd,CAAZ;AACD,KAFD;AAGD,GArBQ,EAqBN,CAACb,MAAD,EAASC,IAAT,EAAeH,kBAAf,CArBM,CAAT;AAuBA,sBACE,KAAC,GAAD;AACE,IAAA,EAAE,EAAED,MADN;AAEE,IAAA,GAAG,EAAEF,YAFP;AAGE,IAAA,EAAE,EAAEI,KAHN;AAIE,IAAA,KAAK,EAAEQ,KAJT;AAKE,IAAA,KAAK,eAAOL,KAAP,EAAiBC,SAAjB,CALP;AAME,IAAA,KAAK;AACHc,MAAAA,QAAQ,EAAE,UADP;AAEHC,MAAAA,MAAM,EAAE,GAFL;AAGHC,MAAAA,IAAI,EAAE,GAHH;AAIHC,MAAAA,KAAK,EAAE,MAJJ;AAKHC,MAAAA,MAAM,YALH;AAMHC,MAAAA,MAAM,EAAE,CANL;AAOHb,MAAAA,SAAS,EAAE,WAPR;AAQHC,MAAAA,eAAe,EAAE,eARd;AASHa,MAAAA,UAAU,sBAAezB,kBAAf,gDAAuEA,kBAAvE,+BATP;AAUHc,MAAAA,OAAO,EAAE;AAVN,OAWAR,KAXA;AANP,KAmBMC,UAnBN,EADF;AAuBD,CA/DiC,CAA7B","sourcesContent":["import { forwardRef, useState, useRef, useEffect, CSSProperties } from 'react';\nimport type * as React from 'react';\nimport { rem } from 'polished';\nimport { useTheme } from '../theme';\nimport { Box, BoxProps } from '../Box';\n\nexport interface LineRippleProps extends BoxProps {\n  active?: boolean;\n  transitionDuration?: number;\n  posx?: number;\n  children?: React.ReactNode;\n}\n\nexport const LineRipple = forwardRef<HTMLDivElement, LineRippleProps>(\n  function LineRipple(props, forwardedRef) {\n    const {\n      as: asProp,\n      transitionDuration = 180,\n      color = 'primary',\n      active = false,\n      posx = -1,\n      style: styleProp = {},\n      __css,\n      ...otherProps\n    } = props;\n\n    const [style, setStyle] = useState<CSSProperties>();\n    const theme = useTheme();\n    const leaveTimeout = useRef<number>();\n\n    useEffect(() => {\n      if (active) {\n        setStyle({\n          transform: 'scaleX(1)',\n          transformOrigin: posx >= 0 ? `${posx}px center` : undefined,\n          opacity: 1,\n        });\n      } else {\n        setStyle({\n          transform: 'scaleX(1)',\n          opacity: 0,\n        });\n\n        leaveTimeout.current = window.setTimeout(() => {\n          setStyle(undefined);\n        }, transitionDuration);\n      }\n\n      return () => {\n        clearTimeout(leaveTimeout.current);\n      };\n    }, [active, posx, transitionDuration]);\n\n    return (\n      <Box\n        as={asProp}\n        ref={forwardedRef}\n        bg={color}\n        theme={theme}\n        style={{ ...style, ...styleProp }}\n        __css={{\n          position: 'absolute',\n          bottom: '0',\n          left: '0',\n          width: '100%',\n          height: rem(2),\n          zIndex: 1,\n          transform: 'scaleX(0)',\n          transformOrigin: 'center center',\n          transition: `transform ${transitionDuration}ms cubic-bezier(.4,0,.2,1),opacity ${transitionDuration}ms cubic-bezier(.4,0,.2,1)`,\n          opacity: 0,\n          ...__css,\n        }}\n        {...otherProps}\n      />\n    );\n  }\n);\n"],"file":"LineRipple.js"}
+{"version":3,"sources":["../../../src/LineRipple/LineRipple.tsx"],"names":["forwardRef","useState","useRef","useEffect","useTheme","Box","EASING_STANDARD","LineRipple","props","forwardedRef","asProp","as","transitionDuration","color","active","posx","style","styleProp","__css","otherProps","setStyle","theme","leaveTimeout","transform","transformOrigin","undefined","opacity","current","window","setTimeout","clearTimeout","position","bottom","left","width","height","zIndex","transition"],"mappings":";;;AACA,SAASA,UAAT,EAAqBC,QAArB,EAA+BC,MAA/B,EAAuCC,SAAvC,QAAwD,OAAxD;AAGA,SAASC,QAAT,QAAyB,UAAzB;AAEA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,eAAT,QAAgC,WAAhC;;AASA,OAAO,IAAMC,UAAU,gBAAGP,UAAU,CAClC,SAASO,UAAT,CAAoBC,KAApB,EAA2BC,YAA3B,EAAyC;AAAA,MAEjCC,MAFiC,GAUnCF,KAVmC,CAErCG,EAFqC;AAAA,8BAUnCH,KAVmC,CAGrCI,kBAHqC;AAAA,MAGrCA,kBAHqC,sCAGhB,GAHgB;AAAA,qBAUnCJ,KAVmC,CAIrCK,KAJqC;AAAA,MAIrCA,KAJqC,6BAI7B,SAJ6B;AAAA,sBAUnCL,KAVmC,CAKrCM,MALqC;AAAA,MAKrCA,MALqC,8BAK5B,KAL4B;AAAA,oBAUnCN,KAVmC,CAMrCO,IANqC;AAAA,MAMrCA,IANqC,4BAM9B,CAAC,CAN6B;AAAA,qBAUnCP,KAVmC,CAOrCQ,KAPqC;AAAA,MAO9BC,SAP8B,6BAOlB,EAPkB;AAAA,MAQrCC,KARqC,GAUnCV,KAVmC,CAQrCU,KARqC;AAAA,MASlCC,UATkC,4BAUnCX,KAVmC;;AAAA,kBAYbP,QAAQ,EAZK;AAAA;AAAA,MAYhCe,KAZgC;AAAA,MAYzBI,QAZyB;;AAavC,MAAMC,KAAK,GAAGjB,QAAQ,EAAtB;AACA,MAAMkB,YAAY,GAAGpB,MAAM,EAA3B;AAEAC,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIW,MAAJ,EAAY;AACVM,MAAAA,QAAQ,CAAC;AACPG,QAAAA,SAAS,EAAE,WADJ;AAEPC,QAAAA,eAAe,EAAET,IAAI,IAAI,CAAR,aAAeA,IAAf,iBAAiCU,SAF3C;AAGPC,QAAAA,OAAO,EAAE;AAHF,OAAD,CAAR;AAKD,KAND,MAMO;AACLN,MAAAA,QAAQ,CAAC;AACPG,QAAAA,SAAS,EAAE,WADJ;AAEPG,QAAAA,OAAO,EAAE;AAFF,OAAD,CAAR;AAKAJ,MAAAA,YAAY,CAACK,OAAb,GAAuBC,MAAM,CAACC,UAAP,CAAkB,YAAM;AAC7CT,QAAAA,QAAQ,CAACK,SAAD,CAAR;AACD,OAFsB,EAEpBb,kBAFoB,CAAvB;AAGD;;AAED,WAAO,YAAM;AACXkB,MAAAA,YAAY,CAACR,YAAY,CAACK,OAAd,CAAZ;AACD,KAFD;AAGD,GArBQ,EAqBN,CAACb,MAAD,EAASC,IAAT,EAAeH,kBAAf,CArBM,CAAT;AAuBA,sBACE,KAAC,GAAD;AACE,IAAA,EAAE,EAAEF,MADN;AAEE,IAAA,GAAG,EAAED,YAFP;AAGE,IAAA,EAAE,EAAEI,KAHN;AAIE,IAAA,KAAK,EAAEQ,KAJT;AAKE,IAAA,KAAK,eAAOL,KAAP,EAAiBC,SAAjB,CALP;AAME,IAAA,KAAK;AACHc,MAAAA,QAAQ,EAAE,UADP;AAEHC,MAAAA,MAAM,EAAE,GAFL;AAGHC,MAAAA,IAAI,EAAE,GAHH;AAIHC,MAAAA,KAAK,EAAE,MAJJ;AAKHC,MAAAA,MAAM,YALH;AAMHC,MAAAA,MAAM,EAAE,CANL;AAOHb,MAAAA,SAAS,EAAE,WAPR;AAQHC,MAAAA,eAAe,EAAE,eARd;AASHa,MAAAA,UAAU,sBAAezB,kBAAf,gBAAuCN,eAAvC,sBAAkEM,kBAAlE,gBAA0FN,eAA1F,CATP;AAUHoB,MAAAA,OAAO,EAAE;AAVN,OAWAR,KAXA;AANP,KAmBMC,UAnBN,EADF;AAuBD,CA/DiC,CAA7B","sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { forwardRef, useState, useRef, useEffect } from 'react';\nimport { rem } from 'polished';\n\nimport { useTheme } from '../theme';\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\nimport { EASING_STANDARD } from '../motion';\n\nexport interface LineRippleProps extends BoxProps {\n  active?: boolean;\n  transitionDuration?: number;\n  posx?: number;\n  children?: ReactNode;\n}\n\nexport const LineRipple = forwardRef<HTMLDivElement, LineRippleProps>(\n  function LineRipple(props, forwardedRef) {\n    const {\n      as: asProp,\n      transitionDuration = 180,\n      color = 'primary',\n      active = false,\n      posx = -1,\n      style: styleProp = {},\n      __css,\n      ...otherProps\n    } = props;\n\n    const [style, setStyle] = useState<CSSProperties>();\n    const theme = useTheme();\n    const leaveTimeout = useRef<number>();\n\n    useEffect(() => {\n      if (active) {\n        setStyle({\n          transform: 'scaleX(1)',\n          transformOrigin: posx >= 0 ? `${posx}px center` : undefined,\n          opacity: 1,\n        });\n      } else {\n        setStyle({\n          transform: 'scaleX(1)',\n          opacity: 0,\n        });\n\n        leaveTimeout.current = window.setTimeout(() => {\n          setStyle(undefined);\n        }, transitionDuration);\n      }\n\n      return () => {\n        clearTimeout(leaveTimeout.current);\n      };\n    }, [active, posx, transitionDuration]);\n\n    return (\n      <Box\n        as={asProp}\n        ref={forwardedRef}\n        bg={color}\n        theme={theme}\n        style={{ ...style, ...styleProp }}\n        __css={{\n          position: 'absolute',\n          bottom: '0',\n          left: '0',\n          width: '100%',\n          height: rem(2),\n          zIndex: 1,\n          transform: 'scaleX(0)',\n          transformOrigin: 'center center',\n          transition: `transform ${transitionDuration}ms ${EASING_STANDARD},opacity ${transitionDuration}ms ${EASING_STANDARD}`,\n          opacity: 0,\n          ...__css,\n        }}\n        {...otherProps}\n      />\n    );\n  }\n);\n"],"file":"LineRipple.js"}