@basic-ui/material 1.0.0-alpha.51 → 1.0.0-alpha.54

package/build/esm/Tooltip/Tooltip.js

@@ -1,49 +1,45 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["placement", "children", "label", "__css"];
 import { Tooltip as _BaseTooltip, Popper } from '@basic-ui/core';
 import { forwardRef } from 'react';
 import { Box } from '../Box';
 import { alpha } from '../color';
 import { jsx as _jsx } from "react/jsx-runtime";
-var BaseTooltip = _BaseTooltip;
-export var Tooltip = /*#__PURE__*/forwardRef(function Tooltip(props, forwardedRef) {
-  var _props$placement = props.placement,
-      placement = _props$placement === void 0 ? 'bottom' : _props$placement,
-      children = props.children,
-      label = props.label,
-      __css = props.__css,
-      otherProps = _objectWithoutProperties(props, _excluded);
-
-  var cssStyle = _extends({
+const BaseTooltip = _BaseTooltip;
+export const Tooltip = /*#__PURE__*/forwardRef(function Tooltip(props, forwardedRef) {
+  const {
+    placement = 'bottom',
+    children,
+    label,
+    __css,
+    ...otherProps
+  } = props;
+  const cssStyle = {
     variant: ['text.body-medium', 'text.body-small'],
     bg: alpha('#616161', 0.9),
     color: '#fff',
     px: 2,
     py: 1,
     borderRadius: 'extra-small',
-    zIndex: 'tooltip'
-  }, __css);
-
+    zIndex: 'tooltip',
+    ...__css
+  };
   if (!children) {
-    return /*#__PURE__*/_jsx(Box, _extends(_extends({
+    return /*#__PURE__*/_jsx(Box, {
       ref: forwardedRef,
-      __css: cssStyle
-    }, otherProps), {}, {
+      __css: cssStyle,
+      ...otherProps,
       children: label
-    }));
+    });
   }
-
-  return /*#__PURE__*/_jsx(BaseTooltip, _extends(_extends({
+  return /*#__PURE__*/_jsx(BaseTooltip, {
     as: Popper,
     innerAs: Box,
     ref: forwardedRef,
     placement: placement,
     distance: 8,
     label: label,
-    __css: cssStyle
-  }, otherProps), {}, {
+    __css: cssStyle,
+    ...otherProps,
     children: children
-  }));
+  });
 });
 //# sourceMappingURL=Tooltip.js.map

package/build/esm/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","names":["Tooltip","_BaseTooltip","Popper","forwardRef","Box","alpha","BaseTooltip","props","forwardedRef","placement","children","label","__css","otherProps","cssStyle","variant","bg","color","px","py","borderRadius","zIndex"],"sources":["../../../src/Tooltip/Tooltip.tsx"],"sourcesContent":["import type { PopperProps } from '@basic-ui/core';\r\nimport { Tooltip as _BaseTooltip, Popper } from '@basic-ui/core';\r\nimport type { ElementType, FC, ReactNode } from 'react';\r\nimport { forwardRef } from 'react';\r\n\r\nimport type { BoxProps } from '../Box';\r\nimport { Box } from '../Box';\r\nimport { alpha } from '../color';\r\n\r\nexport interface TooltipProps\r\n  extends BoxProps,\r\n    Omit<PopperProps, 'color' | 'anchorEl'> {\r\n  label: ReactNode;\r\n  disabled?: boolean;\r\n}\r\n\r\nconst BaseTooltip: FC<\r\n  BoxProps & {\r\n    innerAs?: ElementType<any>;\r\n    label: ReactNode;\r\n  } & Omit<PopperProps, 'color' | 'anchorEl'>\r\n> = _BaseTooltip as any;\r\n\r\nexport const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(\r\n  function Tooltip(props, forwardedRef) {\r\n    const {\r\n      placement = 'bottom',\r\n      children,\r\n      label,\r\n      __css,\r\n      ...otherProps\r\n    } = props;\r\n    const cssStyle = {\r\n      variant: ['text.body-medium', 'text.body-small'],\r\n      bg: alpha('#616161', 0.9),\r\n      color: '#fff',\r\n      px: 2,\r\n      py: 1,\r\n      borderRadius: 'extra-small',\r\n      zIndex: 'tooltip',\r\n      ...__css,\r\n    };\r\n\r\n    if (!children) {\r\n      return (\r\n        <Box ref={forwardedRef} __css={cssStyle} {...otherProps}>\r\n          {label}\r\n        </Box>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <BaseTooltip\r\n        as={Popper}\r\n        innerAs={Box}\r\n        ref={forwardedRef}\r\n        placement={placement}\r\n        distance={8}\r\n        label={label}\r\n        __css={cssStyle}\r\n        {...otherProps}\r\n      >\r\n        {children}\r\n      </BaseTooltip>\r\n    );\r\n  }\r\n);\r\n"],"mappings":";;;AACA,SAASA,OAAO,IAAIC,YAApB,EAAkCC,MAAlC,QAAgD,gBAAhD;AAEA,SAASC,UAAT,QAA2B,OAA3B;AAGA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,KAAT,QAAsB,UAAtB;;AASA,IAAMC,WAKL,GAAGL,YALJ;AAOA,OAAO,IAAMD,OAAO,gBAAGG,UAAU,CAC/B,SAASH,OAAT,CAAiBO,KAAjB,EAAwBC,YAAxB,EAAsC;EACpC,uBAMID,KANJ,CACEE,SADF;EAAA,IACEA,SADF,iCACc,QADd;EAAA,IAEEC,QAFF,GAMIH,KANJ,CAEEG,QAFF;EAAA,IAGEC,KAHF,GAMIJ,KANJ,CAGEI,KAHF;EAAA,IAIEC,KAJF,GAMIL,KANJ,CAIEK,KAJF;EAAA,IAKKC,UALL,4BAMIN,KANJ;;EAOA,IAAMO,QAAQ;IACZC,OAAO,EAAE,CAAC,kBAAD,EAAqB,iBAArB,CADG;IAEZC,EAAE,EAAEX,KAAK,CAAC,SAAD,EAAY,GAAZ,CAFG;IAGZY,KAAK,EAAE,MAHK;IAIZC,EAAE,EAAE,CAJQ;IAKZC,EAAE,EAAE,CALQ;IAMZC,YAAY,EAAE,aANF;IAOZC,MAAM,EAAE;EAPI,GAQTT,KARS,CAAd;;EAWA,IAAI,CAACF,QAAL,EAAe;IACb,oBACE,KAAC,GAAD;MAAK,GAAG,EAAEF,YAAV;MAAwB,KAAK,EAAEM;IAA/B,GAA6CD,UAA7C;MAAA,UACGF;IADH,GADF;EAKD;;EAED,oBACE,KAAC,WAAD;IACE,EAAE,EAAET,MADN;IAEE,OAAO,EAAEE,GAFX;IAGE,GAAG,EAAEI,YAHP;IAIE,SAAS,EAAEC,SAJb;IAKE,QAAQ,EAAE,CALZ;IAME,KAAK,EAAEE,KANT;IAOE,KAAK,EAAEG;EAPT,GAQMD,UARN;IAAA,UAUGH;EAVH,GADF;AAcD,CA1C8B,CAA1B"}
+{"version":3,"file":"Tooltip.js","names":["Tooltip","_BaseTooltip","Popper","forwardRef","Box","alpha","jsx","_jsx","BaseTooltip","props","forwardedRef","placement","children","label","__css","otherProps","cssStyle","variant","bg","color","px","py","borderRadius","zIndex","ref","as","innerAs","distance"],"sources":["../../../src/Tooltip/Tooltip.tsx"],"sourcesContent":["import type { PopperProps } from '@basic-ui/core';\nimport { Tooltip as _BaseTooltip, Popper } from '@basic-ui/core';\nimport type { ElementType, FC, ReactNode } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\nimport { alpha } from '../color';\n\nexport interface TooltipProps\n  extends BoxProps,\n    Omit<PopperProps, 'color' | 'anchorEl'> {\n  label: ReactNode;\n  disabled?: boolean;\n}\n\nconst BaseTooltip: FC<\n  BoxProps & {\n    innerAs?: ElementType<any>;\n    label: ReactNode;\n  } & Omit<PopperProps, 'color' | 'anchorEl'>\n> = _BaseTooltip as any;\n\nexport const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(\n  function Tooltip(props, forwardedRef) {\n    const {\n      placement = 'bottom',\n      children,\n      label,\n      __css,\n      ...otherProps\n    } = props;\n    const cssStyle = {\n      variant: ['text.body-medium', 'text.body-small'],\n      bg: alpha('#616161', 0.9),\n      color: '#fff',\n      px: 2,\n      py: 1,\n      borderRadius: 'extra-small',\n      zIndex: 'tooltip',\n      ...__css,\n    };\n\n    if (!children) {\n      return (\n        <Box ref={forwardedRef} __css={cssStyle} {...otherProps}>\n          {label}\n        </Box>\n      );\n    }\n\n    return (\n      <BaseTooltip\n        as={Popper}\n        innerAs={Box}\n        ref={forwardedRef}\n        placement={placement}\n        distance={8}\n        label={label}\n        __css={cssStyle}\n        {...otherProps}\n      >\n        {children}\n      </BaseTooltip>\n    );\n  }\n);\n"],"mappings":"AACA,SAASA,OAAO,IAAIC,YAAY,EAAEC,MAAM,QAAQ,gBAAgB;AAEhE,SAASC,UAAU,QAAQ,OAAO;AAGlC,SAASC,GAAG,QAAQ,QAAQ;AAC5B,SAASC,KAAK,QAAQ,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AASjC,MAAMC,WAKL,GAAGP,YAAmB;AAEvB,OAAO,MAAMD,OAAO,gBAAGG,UAAU,CAC/B,SAASH,OAAOA,CAACS,KAAK,EAAEC,YAAY,EAAE;EACpC,MAAM;IACJC,SAAS,GAAG,QAAQ;IACpBC,QAAQ;IACRC,KAAK;IACLC,KAAK;IACL,GAAGC;EACL,CAAC,GAAGN,KAAK;EACT,MAAMO,QAAQ,GAAG;IACfC,OAAO,EAAE,CAAC,kBAAkB,EAAE,iBAAiB,CAAC;IAChDC,EAAE,EAAEb,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC;IACzBc,KAAK,EAAE,MAAM;IACbC,EAAE,EAAE,CAAC;IACLC,EAAE,EAAE,CAAC;IACLC,YAAY,EAAE,aAAa;IAC3BC,MAAM,EAAE,SAAS;IACjB,GAAGT;EACL,CAAC;EAED,IAAI,CAACF,QAAQ,EAAE;IACb,oBACEL,IAAA,CAACH,GAAG;MAACoB,GAAG,EAAEd,YAAa;MAACI,KAAK,EAAEE,QAAS;MAAA,GAAKD,UAAU;MAAAH,QAAA,EACpDC;IAAK,CACH,CAAC;EAEV;EAEA,oBACEN,IAAA,CAACC,WAAW;IACViB,EAAE,EAAEvB,MAAO;IACXwB,OAAO,EAAEtB,GAAI;IACboB,GAAG,EAAEd,YAAa;IAClBC,SAAS,EAAEA,SAAU;IACrBgB,QAAQ,EAAE,CAAE;IACZd,KAAK,EAAEA,KAAM;IACbC,KAAK,EAAEE,QAAS;IAAA,GACZD,UAAU;IAAAH,QAAA,EAEbA;EAAQ,CACE,CAAC;AAElB,CACF,CAAC","ignoreList":[]}

package/build/esm/Tooltip/index.d.ts

@@ -1 +1 @@
-export * from './Tooltip';
+export * from './Tooltip';

package/build/esm/Tooltip/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/Tooltip/index.ts"],"sourcesContent":["export * from './Tooltip';\r\n"],"mappings":"AAAA,cAAc,WAAd"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/Tooltip/index.ts"],"sourcesContent":["export * from './Tooltip';\n"],"mappings":"AAAA,cAAc,WAAW","ignoreList":[]}

package/build/esm/color.d.ts

@@ -1,8 +1,8 @@
-import type { SystemStyleObject } from '@styled-system/css';
-import type { Theme } from './theme';
-export declare const alpha: (colorString: string, alphaValue: number) => (theme: any) => any;
-export declare function mixColor(baseColor: string, overlayColor: string): (theme: any) => string;
-export declare function mixColor(baseColor: string, overlayColor: string, overlayOpacity: number): (theme: any) => string;
-export declare function getColorOverlay(theme: Theme, baseColor: string, overlayColor: string, overlayOpacity: number): SystemStyleObject;
-export declare function getBackgroundOverlay(theme: Theme, backgroundOverlay: number | string, overlayColor?: string): SystemStyleObject;
-export declare function getDarkThemeBackgroundOverlay(theme: Theme, backgroundOverlay: number | string, overlayColor?: string): SystemStyleObject;
+import type { SystemStyleObject } from '@styled-system/css';
+import type { Theme } from './theme';
+export declare const alpha: (colorString: string, alphaValue: number) => (theme: any) => any;
+export declare function mixColor(baseColor: string, overlayColor: string): (theme: any) => string;
+export declare function mixColor(baseColor: string, overlayColor: string, overlayOpacity: number): (theme: any) => string;
+export declare function getColorOverlay(theme: Theme, baseColor: string, overlayColor: string, overlayOpacity: number): SystemStyleObject;
+export declare function getBackgroundOverlay(theme: Theme, backgroundOverlay: number | string, overlayColor?: string): SystemStyleObject;
+export declare function getDarkThemeBackgroundOverlay(theme: Theme, backgroundOverlay: number | string, overlayColor?: string): SystemStyleObject;

package/build/esm/color.js

@@ -1,31 +1,23 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _extends from "@babel/runtime/helpers/extends";
 import { get } from '@styled-system/css';
 import { parseToRgb } from 'polished';
 import { DARK_SCHEME_CLASS } from '@basic-ui/dynamic-theme';
-export var alpha = function alpha(colorString, alphaValue) {
-  return function (theme) {
-    var color = get(theme, 'colors.' + colorString, colorString);
-
-    if (color.startsWith('var')) {
-      var _color = get(theme, 'colors.' + colorString + '_rgb', colorString);
-
-      return "rgba(".concat(_color, ",").concat(alphaValue, ")");
-    }
-
-    if (color.startsWith('rgba(')) {
-      return color;
-    }
-
-    var rgb = parseToRgb(color);
-    return "rgba(".concat(rgb.red, ",").concat(rgb.green, ",").concat(rgb.blue, ",").concat(alphaValue, ")");
-  };
+export const alpha = (colorString, alphaValue) => theme => {
+  const color = get(theme, 'colors.' + colorString, colorString);
+  if (color.startsWith('var')) {
+    const color = get(theme, 'colors.' + colorString + '_rgb', colorString);
+    return `rgba(${color},${alphaValue})`;
+  }
+  if (color.startsWith('rgba(')) {
+    return color;
+  }
+  const rgb = parseToRgb(color);
+  return `rgba(${rgb.red},${rgb.green},${rgb.blue},${alphaValue})`;
 };
 export function mixColor(baseColor, overlayColor, overlayOpacity) {
-  return function (theme) {
-    baseColor = get(theme, "colors.".concat(baseColor), baseColor);
-    overlayColor = overlayOpacity ? alpha(overlayColor, overlayOpacity)(theme) : get(theme, "colors.".concat(overlayColor), overlayColor);
-    return "linear-gradient(".concat(overlayColor, ", ").concat(overlayColor, "), ").concat(baseColor);
+  return theme => {
+    baseColor = get(theme, `colors.${baseColor}`, baseColor);
+    overlayColor = overlayOpacity ? alpha(overlayColor, overlayOpacity)(theme) : get(theme, `colors.${overlayColor}`, overlayColor);
+    return `linear-gradient(${overlayColor}, ${overlayColor}), ${baseColor}`;
   };
 }
 export function getColorOverlay(theme, baseColor, overlayColor, overlayOpacity) {
@@ -34,22 +26,22 @@ export function getColorOverlay(theme, baseColor, overlayColor, overlayOpacity)
   };
 }
 export function getBackgroundOverlay(theme, backgroundOverlay) {
-  var overlayColor = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'on.surface';
-
+  let overlayColor = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'on.surface';
   if (Number(backgroundOverlay) <= 0) {
     return {};
   }
-
-  var overlay = get(theme, "paper.overlays.".concat(backgroundOverlay)) || 0;
+  const overlay = get(theme, `paper.overlays.${backgroundOverlay}`) || 0;
   return getColorOverlay(theme, 'surface', overlayColor, overlay);
 }
 export function getDarkThemeBackgroundOverlay(theme, backgroundOverlay) {
-  var overlayColor = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'on.surface';
-
+  let overlayColor = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'on.surface';
   if (Number(backgroundOverlay) <= 0) {
     return {};
   }
-
-  return _defineProperty({}, ".".concat(DARK_SCHEME_CLASS, " &, &.").concat(DARK_SCHEME_CLASS), _extends({}, getBackgroundOverlay(theme, backgroundOverlay, overlayColor)));
+  return {
+    [`.${DARK_SCHEME_CLASS} &, &.${DARK_SCHEME_CLASS}`]: {
+      ...getBackgroundOverlay(theme, backgroundOverlay, overlayColor)
+    }
+  };
 }
 //# sourceMappingURL=color.js.map

package/build/esm/color.js.map

@@ -1 +1 @@
-{"version":3,"file":"color.js","names":["get","parseToRgb","DARK_SCHEME_CLASS","alpha","colorString","alphaValue","theme","color","startsWith","rgb","red","green","blue","mixColor","baseColor","overlayColor","overlayOpacity","getColorOverlay","background","getBackgroundOverlay","backgroundOverlay","Number","overlay","getDarkThemeBackgroundOverlay"],"sources":["../../src/color.ts"],"sourcesContent":["import type { SystemStyleObject } from '@styled-system/css';\nimport { get } from '@styled-system/css';\nimport { parseToRgb } from 'polished';\nimport { DARK_SCHEME_CLASS } from '@basic-ui/dynamic-theme';\n\nimport type { Theme } from './theme';\n\nexport const alpha =\n  (colorString: string, alphaValue: number) => (theme: any) => {\n    const color = get(theme, 'colors.' + colorString, colorString);\n    if (color.startsWith('var')) {\n      const color = get(theme, 'colors.' + colorString + '_rgb', colorString);\n      return `rgba(${color},${alphaValue})`;\n    }\n    if (color.startsWith('rgba(')) {\n      return color;\n    }\n\n    const rgb = parseToRgb(color);\n    return `rgba(${rgb.red},${rgb.green},${rgb.blue},${alphaValue})`;\n  };\n\nexport function mixColor(\n  baseColor: string,\n  overlayColor: string\n): (theme: any) => string;\nexport function mixColor(\n  baseColor: string,\n  overlayColor: string,\n  overlayOpacity: number\n): (theme: any) => string;\nexport function mixColor(\n  baseColor: string,\n  overlayColor: string,\n  overlayOpacity?: number\n): (theme: any) => string {\n  return (theme) => {\n    baseColor = get(theme, `colors.${baseColor}`, baseColor);\n    overlayColor = overlayOpacity\n      ? alpha(overlayColor, overlayOpacity)(theme)\n      : get(theme, `colors.${overlayColor}`, overlayColor);\n\n    return `linear-gradient(${overlayColor}, ${overlayColor}), ${baseColor}`;\n  };\n}\n\nexport function getColorOverlay(\n  theme: Theme,\n  baseColor: string,\n  overlayColor: string,\n  overlayOpacity: number\n): SystemStyleObject {\n  return {\n    background: mixColor(baseColor, overlayColor, overlayOpacity)(theme),\n  };\n}\n\nexport function getBackgroundOverlay(\n  theme: Theme,\n  backgroundOverlay: number | string,\n  overlayColor = 'on.surface'\n): SystemStyleObject {\n  if (Number(backgroundOverlay) <= 0) {\n    return {};\n  }\n  const overlay = get(theme, `paper.overlays.${backgroundOverlay}`) || 0;\n  return getColorOverlay(theme, 'surface', overlayColor, overlay);\n}\n\nexport function getDarkThemeBackgroundOverlay(\n  theme: Theme,\n  backgroundOverlay: number | string,\n  overlayColor = 'on.surface'\n): SystemStyleObject {\n  if (Number(backgroundOverlay) <= 0) {\n    return {};\n  }\n\n  return {\n    [`.${DARK_SCHEME_CLASS} &, &.${DARK_SCHEME_CLASS}`]: {\n      ...getBackgroundOverlay(theme, backgroundOverlay, overlayColor),\n    },\n  };\n}\n"],"mappings":";;AACA,SAASA,GAAT,QAAoB,oBAApB;AACA,SAASC,UAAT,QAA2B,UAA3B;AACA,SAASC,iBAAT,QAAkC,yBAAlC;AAIA,OAAO,IAAMC,KAAK,GAChB,SADWA,KACX,CAACC,WAAD,EAAsBC,UAAtB;EAAA,OAA6C,UAACC,KAAD,EAAgB;IAC3D,IAAMC,KAAK,GAAGP,GAAG,CAACM,KAAD,EAAQ,YAAYF,WAApB,EAAiCA,WAAjC,CAAjB;;IACA,IAAIG,KAAK,CAACC,UAAN,CAAiB,KAAjB,CAAJ,EAA6B;MAC3B,IAAMD,MAAK,GAAGP,GAAG,CAACM,KAAD,EAAQ,YAAYF,WAAZ,GAA0B,MAAlC,EAA0CA,WAA1C,CAAjB;;MACA,sBAAeG,MAAf,cAAwBF,UAAxB;IACD;;IACD,IAAIE,KAAK,CAACC,UAAN,CAAiB,OAAjB,CAAJ,EAA+B;MAC7B,OAAOD,KAAP;IACD;;IAED,IAAME,GAAG,GAAGR,UAAU,CAACM,KAAD,CAAtB;IACA,sBAAeE,GAAG,CAACC,GAAnB,cAA0BD,GAAG,CAACE,KAA9B,cAAuCF,GAAG,CAACG,IAA3C,cAAmDP,UAAnD;EACD,CAZD;AAAA,CADK;AAwBP,OAAO,SAASQ,QAAT,CACLC,SADK,EAELC,YAFK,EAGLC,cAHK,EAImB;EACxB,OAAO,UAACV,KAAD,EAAW;IAChBQ,SAAS,GAAGd,GAAG,CAACM,KAAD,mBAAkBQ,SAAlB,GAA+BA,SAA/B,CAAf;IACAC,YAAY,GAAGC,cAAc,GACzBb,KAAK,CAACY,YAAD,EAAeC,cAAf,CAAL,CAAoCV,KAApC,CADyB,GAEzBN,GAAG,CAACM,KAAD,mBAAkBS,YAAlB,GAAkCA,YAAlC,CAFP;IAIA,iCAA0BA,YAA1B,eAA2CA,YAA3C,gBAA6DD,SAA7D;EACD,CAPD;AAQD;AAED,OAAO,SAASG,eAAT,CACLX,KADK,EAELQ,SAFK,EAGLC,YAHK,EAILC,cAJK,EAKc;EACnB,OAAO;IACLE,UAAU,EAAEL,QAAQ,CAACC,SAAD,EAAYC,YAAZ,EAA0BC,cAA1B,CAAR,CAAkDV,KAAlD;EADP,CAAP;AAGD;AAED,OAAO,SAASa,oBAAT,CACLb,KADK,EAELc,iBAFK,EAIc;EAAA,IADnBL,YACmB,uEADJ,YACI;;EACnB,IAAIM,MAAM,CAACD,iBAAD,CAAN,IAA6B,CAAjC,EAAoC;IAClC,OAAO,EAAP;EACD;;EACD,IAAME,OAAO,GAAGtB,GAAG,CAACM,KAAD,2BAA0Bc,iBAA1B,EAAH,IAAqD,CAArE;EACA,OAAOH,eAAe,CAACX,KAAD,EAAQ,SAAR,EAAmBS,YAAnB,EAAiCO,OAAjC,CAAtB;AACD;AAED,OAAO,SAASC,6BAAT,CACLjB,KADK,EAELc,iBAFK,EAIc;EAAA,IADnBL,YACmB,uEADJ,YACI;;EACnB,IAAIM,MAAM,CAACD,iBAAD,CAAN,IAA6B,CAAjC,EAAoC;IAClC,OAAO,EAAP;EACD;;EAED,sCACOlB,iBADP,mBACiCA,iBADjC,gBAEOiB,oBAAoB,CAACb,KAAD,EAAQc,iBAAR,EAA2BL,YAA3B,CAF3B;AAKD"}
+{"version":3,"file":"color.js","names":["get","parseToRgb","DARK_SCHEME_CLASS","alpha","colorString","alphaValue","theme","color","startsWith","rgb","red","green","blue","mixColor","baseColor","overlayColor","overlayOpacity","getColorOverlay","background","getBackgroundOverlay","backgroundOverlay","arguments","length","undefined","Number","overlay","getDarkThemeBackgroundOverlay"],"sources":["../../src/color.ts"],"sourcesContent":["import type { SystemStyleObject } from '@styled-system/css';\nimport { get } from '@styled-system/css';\nimport { parseToRgb } from 'polished';\nimport { DARK_SCHEME_CLASS } from '@basic-ui/dynamic-theme';\n\nimport type { Theme } from './theme';\n\nexport const alpha =\n  (colorString: string, alphaValue: number) => (theme: any) => {\n    const color = get(theme, 'colors.' + colorString, colorString);\n    if (color.startsWith('var')) {\n      const color = get(theme, 'colors.' + colorString + '_rgb', colorString);\n      return `rgba(${color},${alphaValue})`;\n    }\n    if (color.startsWith('rgba(')) {\n      return color;\n    }\n\n    const rgb = parseToRgb(color);\n    return `rgba(${rgb.red},${rgb.green},${rgb.blue},${alphaValue})`;\n  };\n\nexport function mixColor(\n  baseColor: string,\n  overlayColor: string\n): (theme: any) => string;\nexport function mixColor(\n  baseColor: string,\n  overlayColor: string,\n  overlayOpacity: number\n): (theme: any) => string;\nexport function mixColor(\n  baseColor: string,\n  overlayColor: string,\n  overlayOpacity?: number\n): (theme: any) => string {\n  return (theme) => {\n    baseColor = get(theme, `colors.${baseColor}`, baseColor);\n    overlayColor = overlayOpacity\n      ? alpha(overlayColor, overlayOpacity)(theme)\n      : get(theme, `colors.${overlayColor}`, overlayColor);\n\n    return `linear-gradient(${overlayColor}, ${overlayColor}), ${baseColor}`;\n  };\n}\n\nexport function getColorOverlay(\n  theme: Theme,\n  baseColor: string,\n  overlayColor: string,\n  overlayOpacity: number\n): SystemStyleObject {\n  return {\n    background: mixColor(baseColor, overlayColor, overlayOpacity)(theme),\n  };\n}\n\nexport function getBackgroundOverlay(\n  theme: Theme,\n  backgroundOverlay: number | string,\n  overlayColor = 'on.surface'\n): SystemStyleObject {\n  if (Number(backgroundOverlay) <= 0) {\n    return {};\n  }\n  const overlay = get(theme, `paper.overlays.${backgroundOverlay}`) || 0;\n  return getColorOverlay(theme, 'surface', overlayColor, overlay);\n}\n\nexport function getDarkThemeBackgroundOverlay(\n  theme: Theme,\n  backgroundOverlay: number | string,\n  overlayColor = 'on.surface'\n): SystemStyleObject {\n  if (Number(backgroundOverlay) <= 0) {\n    return {};\n  }\n\n  return {\n    [`.${DARK_SCHEME_CLASS} &, &.${DARK_SCHEME_CLASS}`]: {\n      ...getBackgroundOverlay(theme, backgroundOverlay, overlayColor),\n    },\n  };\n}\n"],"mappings":"AACA,SAASA,GAAG,QAAQ,oBAAoB;AACxC,SAASC,UAAU,QAAQ,UAAU;AACrC,SAASC,iBAAiB,QAAQ,yBAAyB;AAI3D,OAAO,MAAMC,KAAK,GAChBA,CAACC,WAAmB,EAAEC,UAAkB,KAAMC,KAAU,IAAK;EAC3D,MAAMC,KAAK,GAAGP,GAAG,CAACM,KAAK,EAAE,SAAS,GAAGF,WAAW,EAAEA,WAAW,CAAC;EAC9D,IAAIG,KAAK,CAACC,UAAU,CAAC,KAAK,CAAC,EAAE;IAC3B,MAAMD,KAAK,GAAGP,GAAG,CAACM,KAAK,EAAE,SAAS,GAAGF,WAAW,GAAG,MAAM,EAAEA,WAAW,CAAC;IACvE,OAAO,QAAQG,KAAK,IAAIF,UAAU,GAAG;EACvC;EACA,IAAIE,KAAK,CAACC,UAAU,CAAC,OAAO,CAAC,EAAE;IAC7B,OAAOD,KAAK;EACd;EAEA,MAAME,GAAG,GAAGR,UAAU,CAACM,KAAK,CAAC;EAC7B,OAAO,QAAQE,GAAG,CAACC,GAAG,IAAID,GAAG,CAACE,KAAK,IAAIF,GAAG,CAACG,IAAI,IAAIP,UAAU,GAAG;AAClE,CAAC;AAWH,OAAO,SAASQ,QAAQA,CACtBC,SAAiB,EACjBC,YAAoB,EACpBC,cAAuB,EACC;EACxB,OAAQV,KAAK,IAAK;IAChBQ,SAAS,GAAGd,GAAG,CAACM,KAAK,EAAE,UAAUQ,SAAS,EAAE,EAAEA,SAAS,CAAC;IACxDC,YAAY,GAAGC,cAAc,GACzBb,KAAK,CAACY,YAAY,EAAEC,cAAc,CAAC,CAACV,KAAK,CAAC,GAC1CN,GAAG,CAACM,KAAK,EAAE,UAAUS,YAAY,EAAE,EAAEA,YAAY,CAAC;IAEtD,OAAO,mBAAmBA,YAAY,KAAKA,YAAY,MAAMD,SAAS,EAAE;EAC1E,CAAC;AACH;AAEA,OAAO,SAASG,eAAeA,CAC7BX,KAAY,EACZQ,SAAiB,EACjBC,YAAoB,EACpBC,cAAsB,EACH;EACnB,OAAO;IACLE,UAAU,EAAEL,QAAQ,CAACC,SAAS,EAAEC,YAAY,EAAEC,cAAc,CAAC,CAACV,KAAK;EACrE,CAAC;AACH;AAEA,OAAO,SAASa,oBAAoBA,CAClCb,KAAY,EACZc,iBAAkC,EAEf;EAAA,IADnBL,YAAY,GAAAM,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,YAAY;EAE3B,IAAIG,MAAM,CAACJ,iBAAiB,CAAC,IAAI,CAAC,EAAE;IAClC,OAAO,CAAC,CAAC;EACX;EACA,MAAMK,OAAO,GAAGzB,GAAG,CAACM,KAAK,EAAE,kBAAkBc,iBAAiB,EAAE,CAAC,IAAI,CAAC;EACtE,OAAOH,eAAe,CAACX,KAAK,EAAE,SAAS,EAAES,YAAY,EAAEU,OAAO,CAAC;AACjE;AAEA,OAAO,SAASC,6BAA6BA,CAC3CpB,KAAY,EACZc,iBAAkC,EAEf;EAAA,IADnBL,YAAY,GAAAM,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,YAAY;EAE3B,IAAIG,MAAM,CAACJ,iBAAiB,CAAC,IAAI,CAAC,EAAE;IAClC,OAAO,CAAC,CAAC;EACX;EAEA,OAAO;IACL,CAAC,IAAIlB,iBAAiB,SAASA,iBAAiB,EAAE,GAAG;MACnD,GAAGiB,oBAAoB,CAACb,KAAK,EAAEc,iBAAiB,EAAEL,YAAY;IAChE;EACF,CAAC;AACH","ignoreList":[]}

package/build/esm/css.d.ts

@@ -1 +1 @@
-export * from '@styled-system/css';
+export * from '@styled-system/css';

package/build/esm/css.js.map

@@ -1 +1 @@
-{"version":3,"file":"css.js","names":[],"sources":["../../src/css.ts"],"sourcesContent":["// eslint-disable-next-line prettier/prettier\r\nexport * from '@styled-system/css';\r\n"],"mappings":"AAAA;AACA,cAAc,oBAAd"}
+{"version":3,"file":"css.js","names":[],"sources":["../../src/css.ts"],"sourcesContent":["// eslint-disable-next-line prettier/prettier\nexport * from '@styled-system/css';\n"],"mappings":"AAAA;AACA,cAAc,oBAAoB","ignoreList":[]}

package/build/esm/hooks/useAnimation.d.ts

@@ -1,20 +1,20 @@
-import type { CSSProperties } from 'react';
-export declare type AnimationStateStyles<TStyleProps extends CSSProperties> = {
-    closed: TStyleProps;
-    opening?: TStyleProps;
-    open: TStyleProps;
-    close?: TStyleProps;
-};
-export declare type AnimationStyles<TStyleProps extends CSSProperties> = Record<string, AnimationStateStyles<TStyleProps>>;
-export declare function useAnimation<TStyles extends AnimationStyles<TStyleProps>, TStyleProps extends CSSProperties>(opts: {
-    open: boolean;
-    styles: TStyles;
-    mode: keyof TStyles;
-    openTimeoutInMilliseconds?: number;
-    closeTimeoutInMilliseconds?: number;
-}): {
-    state: keyof AnimationStateStyles<TStyleProps>;
-    style: CSSProperties;
-    timing: number;
-    open: boolean;
-};
+import type { CSSProperties } from 'react';
+export type AnimationStateStyles<TStyleProps extends CSSProperties> = {
+    closed: TStyleProps;
+    opening?: TStyleProps;
+    open: TStyleProps;
+    close?: TStyleProps;
+};
+export type AnimationStyles<TStyleProps extends CSSProperties> = Record<string, AnimationStateStyles<TStyleProps>>;
+export declare function useAnimation<TStyles extends AnimationStyles<TStyleProps>, TStyleProps extends CSSProperties>(opts: {
+    open: boolean;
+    styles: TStyles;
+    mode: keyof TStyles;
+    openTimeoutInMilliseconds?: number;
+    closeTimeoutInMilliseconds?: number;
+}): {
+    state: keyof AnimationStateStyles<TStyleProps>;
+    style: CSSProperties;
+    timing: number;
+    open: boolean;
+};

package/build/esm/hooks/useAnimation.js

@@ -1,62 +1,53 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { useState, useEffect, useCallback } from 'react';
 export function useAnimation(opts) {
-  var styles = opts.styles,
-      mode = opts.mode,
-      openProp = opts.open,
-      _opts$openTimeoutInMi = opts.openTimeoutInMilliseconds,
-      openTimeoutInMilliseconds = _opts$openTimeoutInMi === void 0 ? 225 : _opts$openTimeoutInMi,
-      _opts$closeTimeoutInM = opts.closeTimeoutInMilliseconds,
-      closeTimeoutInMilliseconds = _opts$closeTimeoutInM === void 0 ? 110 : _opts$closeTimeoutInM;
-  var animationStyle = styles[mode];
-
-  var _useState = useState({
+  const {
+    styles,
+    mode,
+    open: openProp,
+    openTimeoutInMilliseconds = 225,
+    closeTimeoutInMilliseconds = 110
+  } = opts;
+  const animationStyle = styles[mode];
+  const [{
+    timing,
+    open,
+    state,
+    style
+  }, setAnimation] = useState({
     state: 'closed',
     style: animationStyle.closed,
     timing: closeTimeoutInMilliseconds,
     open: openProp
-  }),
-      _useState2 = _slicedToArray(_useState, 2),
-      _useState2$ = _useState2[0],
-      timing = _useState2$.timing,
-      open = _useState2$.open,
-      state = _useState2$.state,
-      style = _useState2$.style,
-      setAnimation = _useState2[1];
-
-  var handleClose = useCallback(function () {
-    setAnimation(function (animation) {
-      return animation.state === 'closed' ? animation : _extends(_extends({}, animation), {}, {
-        state: 'close',
-        style: animationStyle.close || animationStyle.closed,
-        timing: closeTimeoutInMilliseconds
-      });
+  });
+  const handleClose = useCallback(() => {
+    setAnimation(animation => animation.state === 'closed' ? animation : {
+      ...animation,
+      state: 'close',
+      style: animationStyle.close || animationStyle.closed,
+      timing: closeTimeoutInMilliseconds
     });
   }, [animationStyle, closeTimeoutInMilliseconds]);
-  var handleOpen = useCallback(function () {
-    setAnimation(function (animation) {
-      return animation.state === 'open' ? animation : _extends(_extends({}, animation), {}, {
-        open: true,
-        state: 'opening',
-        style: animationStyle.opening || animationStyle.closed
-      });
+  const handleOpen = useCallback(() => {
+    setAnimation(animation => animation.state === 'open' ? animation : {
+      ...animation,
+      open: true,
+      state: 'opening',
+      style: animationStyle.opening || animationStyle.closed
     });
   }, [animationStyle]);
-  useEffect(function () {
+  useEffect(() => {
     if (state === 'opening') {
-      setAnimation(function (animation) {
-        return _extends(_extends({}, animation), {}, {
-          state: 'open',
-          style: animationStyle.open,
-          timing: openTimeoutInMilliseconds
-        });
-      });
+      setAnimation(animation => ({
+        ...animation,
+        state: 'open',
+        style: animationStyle.open,
+        timing: openTimeoutInMilliseconds
+      }));
     }
   }, [animationStyle.open, openTimeoutInMilliseconds, state]);
-  useEffect(function () {
+  useEffect(() => {
     if (state === 'close') {
-      var timeout = setTimeout(function () {
+      const timeout = setTimeout(() => {
         setAnimation({
           state: 'closed',
           style: animationStyle.closed,
@@ -64,12 +55,10 @@ export function useAnimation(opts) {
           timing: closeTimeoutInMilliseconds
         });
       }, closeTimeoutInMilliseconds);
-      return function () {
-        return clearTimeout(timeout);
-      };
+      return () => clearTimeout(timeout);
     }
   }, [animationStyle.closed, closeTimeoutInMilliseconds, state]);
-  useEffect(function () {
+  useEffect(() => {
     if (openProp) {
       handleOpen();
     } else {
@@ -77,10 +66,10 @@ export function useAnimation(opts) {
     }
   }, [handleClose, handleOpen, openProp]);
   return {
-    state: state,
-    style: style,
-    timing: timing,
-    open: open
+    state,
+    style,
+    timing,
+    open
   };
 }
 //# sourceMappingURL=useAnimation.js.map

package/build/esm/hooks/useAnimation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAnimation.js","names":["useState","useEffect","useCallback","useAnimation","opts","styles","mode","openProp","open","openTimeoutInMilliseconds","closeTimeoutInMilliseconds","animationStyle","state","style","closed","timing","setAnimation","handleClose","animation","close","handleOpen","opening","timeout","setTimeout","clearTimeout"],"sources":["../../../src/hooks/useAnimation.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\r\nimport { useState, useEffect, useCallback } from 'react';\r\n\r\nexport type AnimationStateStyles<TStyleProps extends CSSProperties> = {\r\n  closed: TStyleProps;\r\n  opening?: TStyleProps;\r\n  open: TStyleProps;\r\n  close?: TStyleProps;\r\n};\r\n\r\nexport type AnimationStyles<TStyleProps extends CSSProperties> = Record<\r\n  string,\r\n  AnimationStateStyles<TStyleProps>\r\n>;\r\n\r\nexport function useAnimation<\r\n  TStyles extends AnimationStyles<TStyleProps>,\r\n  TStyleProps extends CSSProperties\r\n>(opts: {\r\n  open: boolean;\r\n  styles: TStyles;\r\n  mode: keyof TStyles;\r\n  openTimeoutInMilliseconds?: number;\r\n  closeTimeoutInMilliseconds?: number;\r\n}) {\r\n  const {\r\n    styles,\r\n    mode,\r\n    open: openProp,\r\n    openTimeoutInMilliseconds = 225,\r\n    closeTimeoutInMilliseconds = 110,\r\n  } = opts;\r\n  const animationStyle = styles[mode];\r\n  const [{ timing, open, state, style }, setAnimation] = useState<{\r\n    state: keyof AnimationStateStyles<TStyleProps>;\r\n    timing: number;\r\n    open: boolean;\r\n    style: CSSProperties;\r\n  }>({\r\n    state: 'closed',\r\n    style: animationStyle.closed,\r\n    timing: closeTimeoutInMilliseconds,\r\n    open: openProp,\r\n  });\r\n\r\n  const handleClose = useCallback(() => {\r\n    setAnimation((animation) =>\r\n      animation.state === 'closed'\r\n        ? animation\r\n        : {\r\n            ...animation,\r\n            state: 'close',\r\n            style: animationStyle.close || animationStyle.closed,\r\n            timing: closeTimeoutInMilliseconds,\r\n          }\r\n    );\r\n  }, [animationStyle, closeTimeoutInMilliseconds]);\r\n\r\n  const handleOpen = useCallback(() => {\r\n    setAnimation((animation) =>\r\n      animation.state === 'open'\r\n        ? animation\r\n        : {\r\n            ...animation,\r\n            open: true,\r\n            state: 'opening',\r\n            style: animationStyle.opening || animationStyle.closed,\r\n          }\r\n    );\r\n  }, [animationStyle]);\r\n\r\n  useEffect(() => {\r\n    if (state === 'opening') {\r\n      setAnimation((animation) => ({\r\n        ...animation,\r\n        state: 'open',\r\n        style: animationStyle.open,\r\n        timing: openTimeoutInMilliseconds,\r\n      }));\r\n    }\r\n  }, [animationStyle.open, openTimeoutInMilliseconds, state]);\r\n\r\n  useEffect(() => {\r\n    if (state === 'close') {\r\n      const timeout = setTimeout(() => {\r\n        setAnimation({\r\n          state: 'closed',\r\n          style: animationStyle.closed,\r\n          open: false,\r\n          timing: closeTimeoutInMilliseconds,\r\n        });\r\n      }, closeTimeoutInMilliseconds);\r\n      return () => clearTimeout(timeout);\r\n    }\r\n  }, [animationStyle.closed, closeTimeoutInMilliseconds, state]);\r\n\r\n  useEffect(() => {\r\n    if (openProp) {\r\n      handleOpen();\r\n    } else {\r\n      handleClose();\r\n    }\r\n  }, [handleClose, handleOpen, openProp]);\r\n\r\n  return {\r\n    state,\r\n    style,\r\n    timing,\r\n    open,\r\n  };\r\n}\r\n"],"mappings":"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"}
+{"version":3,"file":"useAnimation.js","names":["useState","useEffect","useCallback","useAnimation","opts","styles","mode","open","openProp","openTimeoutInMilliseconds","closeTimeoutInMilliseconds","animationStyle","timing","state","style","setAnimation","closed","handleClose","animation","close","handleOpen","opening","timeout","setTimeout","clearTimeout"],"sources":["../../../src/hooks/useAnimation.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\nimport { useState, useEffect, useCallback } from 'react';\n\nexport type AnimationStateStyles<TStyleProps extends CSSProperties> = {\n  closed: TStyleProps;\n  opening?: TStyleProps;\n  open: TStyleProps;\n  close?: TStyleProps;\n};\n\nexport type AnimationStyles<TStyleProps extends CSSProperties> = Record<\n  string,\n  AnimationStateStyles<TStyleProps>\n>;\n\nexport function useAnimation<\n  TStyles extends AnimationStyles<TStyleProps>,\n  TStyleProps extends CSSProperties\n>(opts: {\n  open: boolean;\n  styles: TStyles;\n  mode: keyof TStyles;\n  openTimeoutInMilliseconds?: number;\n  closeTimeoutInMilliseconds?: number;\n}) {\n  const {\n    styles,\n    mode,\n    open: openProp,\n    openTimeoutInMilliseconds = 225,\n    closeTimeoutInMilliseconds = 110,\n  } = opts;\n  const animationStyle = styles[mode];\n  const [{ timing, open, state, style }, setAnimation] = useState<{\n    state: keyof AnimationStateStyles<TStyleProps>;\n    timing: number;\n    open: boolean;\n    style: CSSProperties;\n  }>({\n    state: 'closed',\n    style: animationStyle.closed,\n    timing: closeTimeoutInMilliseconds,\n    open: openProp,\n  });\n\n  const handleClose = useCallback(() => {\n    setAnimation((animation) =>\n      animation.state === 'closed'\n        ? animation\n        : {\n            ...animation,\n            state: 'close',\n            style: animationStyle.close || animationStyle.closed,\n            timing: closeTimeoutInMilliseconds,\n          }\n    );\n  }, [animationStyle, closeTimeoutInMilliseconds]);\n\n  const handleOpen = useCallback(() => {\n    setAnimation((animation) =>\n      animation.state === 'open'\n        ? animation\n        : {\n            ...animation,\n            open: true,\n            state: 'opening',\n            style: animationStyle.opening || animationStyle.closed,\n          }\n    );\n  }, [animationStyle]);\n\n  useEffect(() => {\n    if (state === 'opening') {\n      setAnimation((animation) => ({\n        ...animation,\n        state: 'open',\n        style: animationStyle.open,\n        timing: openTimeoutInMilliseconds,\n      }));\n    }\n  }, [animationStyle.open, openTimeoutInMilliseconds, state]);\n\n  useEffect(() => {\n    if (state === 'close') {\n      const timeout = setTimeout(() => {\n        setAnimation({\n          state: 'closed',\n          style: animationStyle.closed,\n          open: false,\n          timing: closeTimeoutInMilliseconds,\n        });\n      }, closeTimeoutInMilliseconds);\n      return () => clearTimeout(timeout);\n    }\n  }, [animationStyle.closed, closeTimeoutInMilliseconds, state]);\n\n  useEffect(() => {\n    if (openProp) {\n      handleOpen();\n    } else {\n      handleClose();\n    }\n  }, [handleClose, handleOpen, openProp]);\n\n  return {\n    state,\n    style,\n    timing,\n    open,\n  };\n}\n"],"mappings":"AACA,SAASA,QAAQ,EAAEC,SAAS,EAAEC,WAAW,QAAQ,OAAO;AAcxD,OAAO,SAASC,YAAYA,CAG1BC,IAMD,EAAE;EACD,MAAM;IACJC,MAAM;IACNC,IAAI;IACJC,IAAI,EAAEC,QAAQ;IACdC,yBAAyB,GAAG,GAAG;IAC/BC,0BAA0B,GAAG;EAC/B,CAAC,GAAGN,IAAI;EACR,MAAMO,cAAc,GAAGN,MAAM,CAACC,IAAI,CAAC;EACnC,MAAM,CAAC;IAAEM,MAAM;IAAEL,IAAI;IAAEM,KAAK;IAAEC;EAAM,CAAC,EAAEC,YAAY,CAAC,GAAGf,QAAQ,CAK5D;IACDa,KAAK,EAAE,QAAQ;IACfC,KAAK,EAAEH,cAAc,CAACK,MAAM;IAC5BJ,MAAM,EAAEF,0BAA0B;IAClCH,IAAI,EAAEC;EACR,CAAC,CAAC;EAEF,MAAMS,WAAW,GAAGf,WAAW,CAAC,MAAM;IACpCa,YAAY,CAAEG,SAAS,IACrBA,SAAS,CAACL,KAAK,KAAK,QAAQ,GACxBK,SAAS,GACT;MACE,GAAGA,SAAS;MACZL,KAAK,EAAE,OAAO;MACdC,KAAK,EAAEH,cAAc,CAACQ,KAAK,IAAIR,cAAc,CAACK,MAAM;MACpDJ,MAAM,EAAEF;IACV,CACN,CAAC;EACH,CAAC,EAAE,CAACC,cAAc,EAAED,0BAA0B,CAAC,CAAC;EAEhD,MAAMU,UAAU,GAAGlB,WAAW,CAAC,MAAM;IACnCa,YAAY,CAAEG,SAAS,IACrBA,SAAS,CAACL,KAAK,KAAK,MAAM,GACtBK,SAAS,GACT;MACE,GAAGA,SAAS;MACZX,IAAI,EAAE,IAAI;MACVM,KAAK,EAAE,SAAS;MAChBC,KAAK,EAAEH,cAAc,CAACU,OAAO,IAAIV,cAAc,CAACK;IAClD,CACN,CAAC;EACH,CAAC,EAAE,CAACL,cAAc,CAAC,CAAC;EAEpBV,SAAS,CAAC,MAAM;IACd,IAAIY,KAAK,KAAK,SAAS,EAAE;MACvBE,YAAY,CAAEG,SAAS,KAAM;QAC3B,GAAGA,SAAS;QACZL,KAAK,EAAE,MAAM;QACbC,KAAK,EAAEH,cAAc,CAACJ,IAAI;QAC1BK,MAAM,EAAEH;MACV,CAAC,CAAC,CAAC;IACL;EACF,CAAC,EAAE,CAACE,cAAc,CAACJ,IAAI,EAAEE,yBAAyB,EAAEI,KAAK,CAAC,CAAC;EAE3DZ,SAAS,CAAC,MAAM;IACd,IAAIY,KAAK,KAAK,OAAO,EAAE;MACrB,MAAMS,OAAO,GAAGC,UAAU,CAAC,MAAM;QAC/BR,YAAY,CAAC;UACXF,KAAK,EAAE,QAAQ;UACfC,KAAK,EAAEH,cAAc,CAACK,MAAM;UAC5BT,IAAI,EAAE,KAAK;UACXK,MAAM,EAAEF;QACV,CAAC,CAAC;MACJ,CAAC,EAAEA,0BAA0B,CAAC;MAC9B,OAAO,MAAMc,YAAY,CAACF,OAAO,CAAC;IACpC;EACF,CAAC,EAAE,CAACX,cAAc,CAACK,MAAM,EAAEN,0BAA0B,EAAEG,KAAK,CAAC,CAAC;EAE9DZ,SAAS,CAAC,MAAM;IACd,IAAIO,QAAQ,EAAE;MACZY,UAAU,CAAC,CAAC;IACd,CAAC,MAAM;MACLH,WAAW,CAAC,CAAC;IACf;EACF,CAAC,EAAE,CAACA,WAAW,EAAEG,UAAU,EAAEZ,QAAQ,CAAC,CAAC;EAEvC,OAAO;IACLK,KAAK;IACLC,KAAK;IACLF,MAAM;IACNL;EACF,CAAC;AACH","ignoreList":[]}

package/build/esm/index.d.ts

@@ -1,42 +1,42 @@
-export * from './AppBar';
-export * from './Alert';
-export * from './Badge';
-export * from './BaseLine';
-export * from './BottomSheet';
-export * from './Box';
-export * from './Button';
-export * from './Combobox';
-export * from './CheckBox';
-export * from './Chip';
-export * from './Divider';
-export * from './Dialog';
-export * from './FloatingLabel';
-export * from './LineRipple';
-export * from './Link';
-export * from './List';
-export * from './ListItem';
-export * from './Menu';
-export * from './NavRail';
-export * from './NotchedOutline';
-export * from './Paper';
-export * from './Popover';
-export * from './ProgressSpinner';
-export * from './RadioButton';
-export * from './Ripple';
-export * from './SearchBar';
-export * from './Select';
-export * from './SelectItem';
-export * from './Skeleton';
-export * from './Slider';
-export * from './Snackbar';
-export * from './Switch';
-export * from './Tab';
-export * from './TabIndicator';
-export * from './Table';
-export * from './Text';
-export * from './TextField';
-export * from './Tooltip';
-export * from './motion';
-export * from './theme';
-export * from './color';
-export * from './hooks/useAnimation';
+export * from './AppBar';
+export * from './Alert';
+export * from './Badge';
+export * from './BaseLine';
+export * from './BottomSheet';
+export * from './Box';
+export * from './Button';
+export * from './Combobox';
+export * from './CheckBox';
+export * from './Chip';
+export * from './Divider';
+export * from './Dialog';
+export * from './FloatingLabel';
+export * from './LineRipple';
+export * from './Link';
+export * from './List';
+export * from './ListItem';
+export * from './Menu';
+export * from './NavRail';
+export * from './NotchedOutline';
+export * from './Paper';
+export * from './Popover';
+export * from './ProgressSpinner';
+export * from './RadioButton';
+export * from './Ripple';
+export * from './SearchBar';
+export * from './Select';
+export * from './SelectItem';
+export * from './Skeleton';
+export * from './Slider';
+export * from './Snackbar';
+export * from './Switch';
+export * from './Tab';
+export * from './TabIndicator';
+export * from './Table';
+export * from './Text';
+export * from './TextField';
+export * from './Tooltip';
+export * from './motion';
+export * from './theme';
+export * from './color';
+export * from './hooks/useAnimation';

package/build/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/index.ts"],"sourcesContent":["export * from './AppBar';\nexport * from './Alert';\nexport * from './Badge';\nexport * from './BaseLine';\nexport * from './BottomSheet';\nexport * from './Box';\nexport * from './Button';\nexport * from './Combobox';\nexport * from './CheckBox';\nexport * from './Chip';\nexport * from './Divider';\nexport * from './Dialog';\nexport * from './FloatingLabel';\nexport * from './LineRipple';\nexport * from './Link';\nexport * from './List';\nexport * from './ListItem';\nexport * from './Menu';\nexport * from './NavRail';\nexport * from './NotchedOutline';\nexport * from './Paper';\nexport * from './Popover';\nexport * from './ProgressSpinner';\nexport * from './RadioButton';\nexport * from './Ripple';\nexport * from './SearchBar';\nexport * from './Select';\nexport * from './SelectItem';\nexport * from './Skeleton';\nexport * from './Slider';\nexport * from './Snackbar';\nexport * from './Switch';\nexport * from './Tab';\nexport * from './TabIndicator';\nexport * from './Table';\nexport * from './Text';\nexport * from './TextField';\nexport * from './Tooltip';\nexport * from './motion';\nexport * from './theme';\nexport * from './color';\nexport * from './hooks/useAnimation';\n"],"mappings":"AAAA,cAAc,UAAd;AACA,cAAc,SAAd;AACA,cAAc,SAAd;AACA,cAAc,YAAd;AACA,cAAc,eAAd;AACA,cAAc,OAAd;AACA,cAAc,UAAd;AACA,cAAc,YAAd;AACA,cAAc,YAAd;AACA,cAAc,QAAd;AACA,cAAc,WAAd;AACA,cAAc,UAAd;AACA,cAAc,iBAAd;AACA,cAAc,cAAd;AACA,cAAc,QAAd;AACA,cAAc,QAAd;AACA,cAAc,YAAd;AACA,cAAc,QAAd;AACA,cAAc,WAAd;AACA,cAAc,kBAAd;AACA,cAAc,SAAd;AACA,cAAc,WAAd;AACA,cAAc,mBAAd;AACA,cAAc,eAAd;AACA,cAAc,UAAd;AACA,cAAc,aAAd;AACA,cAAc,UAAd;AACA,cAAc,cAAd;AACA,cAAc,YAAd;AACA,cAAc,UAAd;AACA,cAAc,YAAd;AACA,cAAc,UAAd;AACA,cAAc,OAAd;AACA,cAAc,gBAAd;AACA,cAAc,SAAd;AACA,cAAc,QAAd;AACA,cAAc,aAAd;AACA,cAAc,WAAd;AACA,cAAc,UAAd;AACA,cAAc,SAAd;AACA,cAAc,SAAd;AACA,cAAc,sBAAd"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/index.ts"],"sourcesContent":["export * from './AppBar';\nexport * from './Alert';\nexport * from './Badge';\nexport * from './BaseLine';\nexport * from './BottomSheet';\nexport * from './Box';\nexport * from './Button';\nexport * from './Combobox';\nexport * from './CheckBox';\nexport * from './Chip';\nexport * from './Divider';\nexport * from './Dialog';\nexport * from './FloatingLabel';\nexport * from './LineRipple';\nexport * from './Link';\nexport * from './List';\nexport * from './ListItem';\nexport * from './Menu';\nexport * from './NavRail';\nexport * from './NotchedOutline';\nexport * from './Paper';\nexport * from './Popover';\nexport * from './ProgressSpinner';\nexport * from './RadioButton';\nexport * from './Ripple';\nexport * from './SearchBar';\nexport * from './Select';\nexport * from './SelectItem';\nexport * from './Skeleton';\nexport * from './Slider';\nexport * from './Snackbar';\nexport * from './Switch';\nexport * from './Tab';\nexport * from './TabIndicator';\nexport * from './Table';\nexport * from './Text';\nexport * from './TextField';\nexport * from './Tooltip';\nexport * from './motion';\nexport * from './theme';\nexport * from './color';\nexport * from './hooks/useAnimation';\n"],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,WAAW;AACzB,cAAc,kBAAkB;AAChC,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,mBAAmB;AACjC,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,cAAc;AAC5B,cAAc,YAAY;AAC1B,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,UAAU;AACxB,cAAc,OAAO;AACrB,cAAc,gBAAgB;AAC9B,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,sBAAsB","ignoreList":[]}

package/build/esm/motion.d.ts

@@ -1,7 +1,7 @@
-export declare const EASING_EMPHASIZED = "cubic-bezier(0.2, 0, 0, 1)";
-export declare const EASING_EMPHASIZED_ACCELERATE = "cubic-bezier(0.3, 0, 0.8, 0.15)";
-export declare const EASING_EMPHASIZED_DECELERATE = "cubic-bezier(0.05, 0.7, 0.1, 1)";
-export declare const EASING_LINEAR = "cubic-bezier(0, 0, 1, 1)";
-export declare const EASING_STANDARD = "cubic-bezier(0.2, 0, 0, 1)";
-export declare const EASING_STANDARD_ACCELERATE = "cubic-bezier(0.3, 0, 1, 1)";
-export declare const EASING_STANDARD_DECELERATE = "cubic-bezier(0, 0, 0, 1)";
+export declare const EASING_EMPHASIZED = "cubic-bezier(0.2, 0, 0, 1)";
+export declare const EASING_EMPHASIZED_ACCELERATE = "cubic-bezier(0.3, 0, 0.8, 0.15)";
+export declare const EASING_EMPHASIZED_DECELERATE = "cubic-bezier(0.05, 0.7, 0.1, 1)";
+export declare const EASING_LINEAR = "cubic-bezier(0, 0, 1, 1)";
+export declare const EASING_STANDARD = "cubic-bezier(0.2, 0, 0, 1)";
+export declare const EASING_STANDARD_ACCELERATE = "cubic-bezier(0.3, 0, 1, 1)";
+export declare const EASING_STANDARD_DECELERATE = "cubic-bezier(0, 0, 0, 1)";

package/build/esm/motion.js

@@ -1,8 +1,8 @@
-export var EASING_EMPHASIZED = 'cubic-bezier(0.2, 0, 0, 1)';
-export var EASING_EMPHASIZED_ACCELERATE = 'cubic-bezier(0.3, 0, 0.8, 0.15)';
-export var EASING_EMPHASIZED_DECELERATE = 'cubic-bezier(0.05, 0.7, 0.1, 1)';
-export var EASING_LINEAR = 'cubic-bezier(0, 0, 1, 1)';
-export var EASING_STANDARD = 'cubic-bezier(0.2, 0, 0, 1)';
-export var EASING_STANDARD_ACCELERATE = 'cubic-bezier(0.3, 0, 1, 1)';
-export var EASING_STANDARD_DECELERATE = 'cubic-bezier(0, 0, 0, 1)';
+export const EASING_EMPHASIZED = 'cubic-bezier(0.2, 0, 0, 1)';
+export const EASING_EMPHASIZED_ACCELERATE = 'cubic-bezier(0.3, 0, 0.8, 0.15)';
+export const EASING_EMPHASIZED_DECELERATE = 'cubic-bezier(0.05, 0.7, 0.1, 1)';
+export const EASING_LINEAR = 'cubic-bezier(0, 0, 1, 1)';
+export const EASING_STANDARD = 'cubic-bezier(0.2, 0, 0, 1)';
+export const EASING_STANDARD_ACCELERATE = 'cubic-bezier(0.3, 0, 1, 1)';
+export const EASING_STANDARD_DECELERATE = 'cubic-bezier(0, 0, 0, 1)';
 //# sourceMappingURL=motion.js.map

package/build/esm/motion.js.map

@@ -1 +1 @@
-{"version":3,"file":"motion.js","names":["EASING_EMPHASIZED","EASING_EMPHASIZED_ACCELERATE","EASING_EMPHASIZED_DECELERATE","EASING_LINEAR","EASING_STANDARD","EASING_STANDARD_ACCELERATE","EASING_STANDARD_DECELERATE"],"sources":["../../src/motion.ts"],"sourcesContent":["export const EASING_EMPHASIZED = 'cubic-bezier(0.2, 0, 0, 1)';\r\nexport const EASING_EMPHASIZED_ACCELERATE = 'cubic-bezier(0.3, 0, 0.8, 0.15)';\r\nexport const EASING_EMPHASIZED_DECELERATE = 'cubic-bezier(0.05, 0.7, 0.1, 1)';\r\nexport const EASING_LINEAR = 'cubic-bezier(0, 0, 1, 1)';\r\nexport const EASING_STANDARD = 'cubic-bezier(0.2, 0, 0, 1)';\r\nexport const EASING_STANDARD_ACCELERATE = 'cubic-bezier(0.3, 0, 1, 1)';\r\nexport const EASING_STANDARD_DECELERATE = 'cubic-bezier(0, 0, 0, 1)';\r\n"],"mappings":"AAAA,OAAO,IAAMA,iBAAiB,GAAG,4BAA1B;AACP,OAAO,IAAMC,4BAA4B,GAAG,iCAArC;AACP,OAAO,IAAMC,4BAA4B,GAAG,iCAArC;AACP,OAAO,IAAMC,aAAa,GAAG,0BAAtB;AACP,OAAO,IAAMC,eAAe,GAAG,4BAAxB;AACP,OAAO,IAAMC,0BAA0B,GAAG,4BAAnC;AACP,OAAO,IAAMC,0BAA0B,GAAG,0BAAnC"}
+{"version":3,"file":"motion.js","names":["EASING_EMPHASIZED","EASING_EMPHASIZED_ACCELERATE","EASING_EMPHASIZED_DECELERATE","EASING_LINEAR","EASING_STANDARD","EASING_STANDARD_ACCELERATE","EASING_STANDARD_DECELERATE"],"sources":["../../src/motion.ts"],"sourcesContent":["export const EASING_EMPHASIZED = 'cubic-bezier(0.2, 0, 0, 1)';\nexport const EASING_EMPHASIZED_ACCELERATE = 'cubic-bezier(0.3, 0, 0.8, 0.15)';\nexport const EASING_EMPHASIZED_DECELERATE = 'cubic-bezier(0.05, 0.7, 0.1, 1)';\nexport const EASING_LINEAR = 'cubic-bezier(0, 0, 1, 1)';\nexport const EASING_STANDARD = 'cubic-bezier(0.2, 0, 0, 1)';\nexport const EASING_STANDARD_ACCELERATE = 'cubic-bezier(0.3, 0, 1, 1)';\nexport const EASING_STANDARD_DECELERATE = 'cubic-bezier(0, 0, 0, 1)';\n"],"mappings":"AAAA,OAAO,MAAMA,iBAAiB,GAAG,4BAA4B;AAC7D,OAAO,MAAMC,4BAA4B,GAAG,iCAAiC;AAC7E,OAAO,MAAMC,4BAA4B,GAAG,iCAAiC;AAC7E,OAAO,MAAMC,aAAa,GAAG,0BAA0B;AACvD,OAAO,MAAMC,eAAe,GAAG,4BAA4B;AAC3D,OAAO,MAAMC,0BAA0B,GAAG,4BAA4B;AACtE,OAAO,MAAMC,0BAA0B,GAAG,0BAA0B","ignoreList":[]}