@razorpay/blade 11.38.1 → 12.0.0

package/build/lib/web/production/components/Typography/Text/Text.js

@@ -1,6 +1,6 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import 'react';
+import React__default from 'react';
 import '../BaseText/index.js';
 import { useValidateAsProp } from '../utils.js';
 import '../../Box/styledProps/index.js';
@@ -16,12 +16,6 @@ var _excluded = ["as", "variant", "weight", "size", "truncateAfterLines", "child
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var validAsValues = ['p', 'span', 'div', 'abbr', 'figcaption', 'cite', 'q', 'label'];
-
-/**
- * Conditionally changing props based on variant.
- * Overloads or union gives wrong intellisense.
- */
-
 var getTextProps = function getTextProps(_ref) {
   var variant = _ref.variant,
     weight = _ref.weight,
@@ -91,7 +85,7 @@ var getTextProps = function getTextProps(_ref) {
   }
   return props;
 };
-var _Text = function _Text(_ref2) {
+var _Text = function _Text(_ref2, ref) {
   var _ref2$as = _ref2.as,
     as = _ref2$as === void 0 ? 'p' : _ref2$as,
     _ref2$variant = _ref2.variant,
@@ -125,11 +119,13 @@ var _Text = function _Text(_ref2) {
     as: as,
     validAsValues: validAsValues
   });
-  return /*#__PURE__*/jsx(BaseText, _objectSpread(_objectSpread(_objectSpread({}, props), getStyledProps(styledProps)), {}, {
+  return /*#__PURE__*/jsx(BaseText, _objectSpread(_objectSpread(_objectSpread({
+    ref: ref
+  }, props), getStyledProps(styledProps)), {}, {
     children: children
   }));
 };
-var Text = /*#__PURE__*/assignWithoutSideEffects(_Text, {
+var Text = /*#__PURE__*/assignWithoutSideEffects( /*#__PURE__*/React__default.forwardRef(_Text), {
   displayName: 'Text',
   componentId: 'Text'
 });

package/build/lib/web/production/components/Typography/Text/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sources":["../../../../../../../src/components/Typography/Text/Text.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport type { ReactElement } from 'react';\nimport React from 'react';\nimport { BaseText } from '../BaseText';\nimport type { BaseTextProps, BaseTextSizes } from '../BaseText/types';\nimport { useValidateAsProp } from '../utils';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\n\nconst validAsValues = ['p', 'span', 'div', 'abbr', 'figcaption', 'cite', 'q', 'label'] as const;\ntype TextCommonProps = {\n  as?: typeof validAsValues[number];\n  truncateAfterLines?: number;\n  children: React.ReactNode;\n  weight?: Extract<BaseTextProps['fontWeight'], 'regular' | 'medium' | 'semibold'>;\n  /**\n   * Overrides the color of the Text component.\n   *\n   * **Note** This takes priority over `type` and `contrast` prop to decide color of text\n   */\n  color?: BaseTextProps['color'];\n  textAlign?: BaseTextProps['textAlign'];\n  textDecorationLine?: BaseTextProps['textDecorationLine'];\n  wordBreak?: BaseTextProps['wordBreak'];\n} & TestID &\n  StyledPropsBlade;\n\nexport type TextVariant = 'body' | 'caption';\n\ntype TextBodyVariant = TextCommonProps & {\n  variant?: Extract<TextVariant, 'body'>;\n  size?: Extract<BaseTextSizes, 'xsmall' | 'small' | 'medium' | 'large'>;\n};\n\ntype TextCaptionVariant = TextCommonProps & {\n  variant?: Extract<TextVariant, 'caption'>;\n  size?: Extract<BaseTextSizes, 'small' | 'medium'>;\n};\n\n/**\n * Conditionally changing props based on variant.\n * Overloads or union gives wrong intellisense.\n */\nexport type TextProps<T> = T extends {\n  variant: infer Variant;\n}\n  ? Variant extends 'caption'\n    ? TextCaptionVariant\n    : Variant extends 'body'\n    ? TextBodyVariant\n    : T\n  : T;\n\ntype GetTextPropsReturn = Omit<BaseTextProps, 'children'>;\ntype GetTextProps<T extends { variant: TextVariant }> = Pick<\n  TextProps<T>,\n  'variant' | 'weight' | 'size' | 'color' | 'testID' | 'textAlign' | 'textDecorationLine'\n>;\n\nconst getTextProps = <T extends { variant: TextVariant }>({\n  variant,\n  weight,\n  size,\n  color = 'surface.text.gray.normal',\n  testID,\n  textAlign,\n  textDecorationLine,\n}: GetTextProps<T>): GetTextPropsReturn => {\n  const props: GetTextPropsReturn = {\n    color,\n    fontSize: 100,\n    fontWeight: weight ?? 'regular',\n    fontStyle: 'normal',\n    lineHeight: 100,\n    fontFamily: 'text',\n    componentName: 'text',\n    testID,\n    textAlign,\n    textDecorationLine,\n  };\n\n  if (variant === 'caption') {\n    // variant of caption can only have size of small\n    if (size && size !== 'small' && size !== 'medium') {\n      if (__DEV__) {\n        throwBladeError({\n          moduleName: 'Text',\n          message: `size cannot be '${size}' when variant is 'caption'`,\n        });\n      }\n      // Set size as small in case of invalid size\n      size = 'small';\n    }\n  } else if (variant !== 'caption' && !size) {\n    size = 'medium';\n  }\n\n  if (variant === 'body') {\n    if (size === 'xsmall') {\n      props.fontSize = 25;\n      props.lineHeight = 25;\n    }\n    if (size === 'small') {\n      props.fontSize = 75;\n      props.lineHeight = 75;\n    }\n    if (size === 'medium') {\n      props.fontSize = 100;\n      props.lineHeight = 100;\n    }\n    if (size === 'large') {\n      props.fontSize = 200;\n      props.lineHeight = 200;\n    }\n  }\n  if (variant === 'caption') {\n    if (size === 'small') {\n      props.fontSize = 50;\n      props.lineHeight = 50;\n      props.fontWeight = 'regular';\n    }\n    if (size === 'medium') {\n      props.fontSize = 100;\n      props.lineHeight = 50;\n      props.fontWeight = 'regular';\n    }\n    props.fontStyle = 'italic';\n  }\n\n  return props;\n};\n\nconst _Text = <T extends { variant: TextVariant }>({\n  as = 'p',\n  variant = 'body',\n  weight = 'regular',\n  size,\n  truncateAfterLines,\n  children,\n  color,\n  testID,\n  textAlign,\n  textDecorationLine,\n  wordBreak,\n  ...styledProps\n}: TextProps<T>): ReactElement => {\n  const props: Omit<BaseTextProps, 'children'> = {\n    as,\n    truncateAfterLines,\n    wordBreak,\n    ...getTextProps({\n      variant,\n      weight,\n      color,\n      size,\n      testID,\n      textAlign,\n      textDecorationLine,\n    }),\n  };\n\n  useValidateAsProp({ componentName: 'Text', as, validAsValues });\n\n  return (\n    <BaseText {...props} {...getStyledProps(styledProps)}>\n      {children}\n    </BaseText>\n  );\n};\n\nconst Text = assignWithoutSideEffects(_Text, {\n  displayName: 'Text',\n  componentId: 'Text',\n});\n\nexport { Text, getTextProps };\n"],"names":["validAsValues","getTextProps","_ref","variant","weight","size","_ref$color","color","testID","textAlign","textDecorationLine","props","fontSize","fontWeight","fontStyle","lineHeight","fontFamily","componentName","throwBladeError","moduleName","message","concat","_Text","_ref2","_ref2$as","as","_ref2$variant","_ref2$weight","truncateAfterLines","children","wordBreak","styledProps","_objectWithoutProperties","_excluded","_objectSpread","useValidateAsProp","_jsx","BaseText","getStyledProps","Text","assignWithoutSideEffects","displayName","componentId"],"mappings":"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"}
+{"version":3,"file":"Text.js","sources":["../../../../../../../src/components/Typography/Text/Text.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport type { ReactElement } from 'react';\nimport React from 'react';\nimport { BaseText } from '../BaseText';\nimport type { BaseTextProps, BaseTextSizes } from '../BaseText/types';\nimport { useValidateAsProp } from '../utils';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { BladeElementRef, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\n\nconst validAsValues = ['p', 'span', 'div', 'abbr', 'figcaption', 'cite', 'q', 'label'] as const;\ntype TextCommonProps = {\n  as?: typeof validAsValues[number];\n  truncateAfterLines?: number;\n  children: React.ReactNode;\n  weight?: Extract<BaseTextProps['fontWeight'], 'regular' | 'medium' | 'semibold'>;\n  /**\n   * Overrides the color of the Text component.\n   *\n   * **Note** This takes priority over `type` and `contrast` prop to decide color of text\n   */\n  color?: BaseTextProps['color'];\n  textAlign?: BaseTextProps['textAlign'];\n  textDecorationLine?: BaseTextProps['textDecorationLine'];\n  wordBreak?: BaseTextProps['wordBreak'];\n} & TestID &\n  StyledPropsBlade;\n\nexport type TextVariant = 'body' | 'caption';\n\ntype TextBodyVariant = TextCommonProps & {\n  variant?: Extract<TextVariant, 'body'>;\n  size?: Extract<BaseTextSizes, 'xsmall' | 'small' | 'medium' | 'large'>;\n};\n\ntype TextCaptionVariant = TextCommonProps & {\n  variant?: Extract<TextVariant, 'caption'>;\n  size?: Extract<BaseTextSizes, 'small' | 'medium'>;\n};\n\nexport type TextProps<T> = T extends { variant: infer Variant }\n  ? Variant extends 'caption'\n    ? TextCaptionVariant\n    : Variant extends 'body'\n    ? TextBodyVariant\n    : T\n  : T;\n\ntype GetTextPropsReturn = Omit<BaseTextProps, 'children'>;\ntype GetTextProps<T extends { variant: TextVariant }> = Pick<\n  TextProps<T>,\n  'variant' | 'weight' | 'size' | 'color' | 'testID' | 'textAlign' | 'textDecorationLine'\n>;\n\nconst getTextProps = <T extends { variant: TextVariant }>({\n  variant,\n  weight,\n  size,\n  color = 'surface.text.gray.normal',\n  testID,\n  textAlign,\n  textDecorationLine,\n}: GetTextProps<T>): GetTextPropsReturn => {\n  const props: GetTextPropsReturn = {\n    color,\n    fontSize: 100,\n    fontWeight: weight ?? 'regular',\n    fontStyle: 'normal',\n    lineHeight: 100,\n    fontFamily: 'text',\n    componentName: 'text',\n    testID,\n    textAlign,\n    textDecorationLine,\n  };\n\n  if (variant === 'caption') {\n    // variant of caption can only have size of small\n    if (size && size !== 'small' && size !== 'medium') {\n      if (__DEV__) {\n        throwBladeError({\n          moduleName: 'Text',\n          message: `size cannot be '${size}' when variant is 'caption'`,\n        });\n      }\n      // Set size as small in case of invalid size\n      size = 'small';\n    }\n  } else if (variant !== 'caption' && !size) {\n    size = 'medium';\n  }\n\n  if (variant === 'body') {\n    if (size === 'xsmall') {\n      props.fontSize = 25;\n      props.lineHeight = 25;\n    }\n    if (size === 'small') {\n      props.fontSize = 75;\n      props.lineHeight = 75;\n    }\n    if (size === 'medium') {\n      props.fontSize = 100;\n      props.lineHeight = 100;\n    }\n    if (size === 'large') {\n      props.fontSize = 200;\n      props.lineHeight = 200;\n    }\n  }\n  if (variant === 'caption') {\n    if (size === 'small') {\n      props.fontSize = 50;\n      props.lineHeight = 50;\n      props.fontWeight = 'regular';\n    }\n    if (size === 'medium') {\n      props.fontSize = 100;\n      props.lineHeight = 50;\n      props.fontWeight = 'regular';\n    }\n    props.fontStyle = 'italic';\n  }\n\n  return props;\n};\n\nconst _Text = <T extends { variant: TextVariant }>(\n  {\n    as = 'p',\n    variant = 'body',\n    weight = 'regular',\n    size,\n    truncateAfterLines,\n    children,\n    color,\n    testID,\n    textAlign,\n    textDecorationLine,\n    wordBreak,\n    ...styledProps\n  }: TextProps<T>,\n  ref: React.Ref<BladeElementRef>,\n): ReactElement => {\n  const props: Omit<BaseTextProps, 'children'> = {\n    as,\n    truncateAfterLines,\n    wordBreak,\n    ...getTextProps({\n      variant,\n      weight,\n      color,\n      size,\n      testID,\n      textAlign,\n      textDecorationLine,\n    }),\n  };\n\n  useValidateAsProp({ componentName: 'Text', as, validAsValues });\n\n  return (\n    <BaseText ref={ref} {...props} {...getStyledProps(styledProps)}>\n      {children}\n    </BaseText>\n  );\n};\n\nconst Text = assignWithoutSideEffects(React.forwardRef(_Text), {\n  displayName: 'Text',\n  componentId: 'Text',\n});\n\nexport { Text, getTextProps };\n"],"names":["validAsValues","getTextProps","_ref","variant","weight","size","_ref$color","color","testID","textAlign","textDecorationLine","props","fontSize","fontWeight","fontStyle","lineHeight","fontFamily","componentName","throwBladeError","moduleName","message","concat","_Text","_ref2","ref","_ref2$as","as","_ref2$variant","_ref2$weight","truncateAfterLines","children","wordBreak","styledProps","_objectWithoutProperties","_excluded","_objectSpread","useValidateAsProp","_jsx","BaseText","getStyledProps","Text","assignWithoutSideEffects","React","forwardRef","displayName","componentId"],"mappings":"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"}

package/build/lib/web/production/components/index.js

@@ -22,6 +22,7 @@ import './Divider/index.js';
 import './Drawer/index.js';
 import './DatePicker/index.js';
 import './Dropdown/index.js';
+import './Fade/index.js';
 import './FileUpload/index.js';
 import './Icons/index.js';
 import './Indicator/index.js';
@@ -36,16 +37,20 @@ import './Link/index.js';
 import './List/index.js';
 import './LiveAnnouncer/index.web.js';
 import './Modal/index.js';
+import './Move/index.js';
+import './Morph/index.js';
 import './Menu/index.js';
 import './Popover/index.js';
 import './ProgressBar/index.js';
 import './Radio/index.js';
+import './Scale/index.js';
 import './SideNav/index.js';
 import './Skeleton/index.js';
 import './SkipNav/index.web.js';
 import './Spinner/index.js';
 import './SpotlightPopoverTour/index.js';
 import './StepGroup/index.js';
+import './Slide/index.js';
 import './Switch/index.js';
 import './Table/index.js';
 import './Tabs/index.js';
@@ -105,6 +110,7 @@ export { DropdownOverlay } from './Dropdown/DropdownOverlay.web.js';
 export { DropdownButton } from './Dropdown/DropdownButton.js';
 export { DropdownLink } from './Dropdown/DropdownLink.js';
 export { DropdownFooter, DropdownHeader } from './Dropdown/DropdownHeaderFooter.js';
+export { Fade } from './Fade/Fade.web.js';
 export { FileUpload } from './FileUpload/FileUpload.web.js';
 export { default as AcceptPaymentsIcon } from './Icons/AcceptPaymentsIcon/AcceptPaymentsIcon.js';
 export { default as ActivityIcon } from './Icons/ActivityIcon/ActivityIcon.js';
@@ -359,6 +365,7 @@ export { default as PowerIcon } from './Icons/PowerIcon/PowerIcon.js';
 export { default as PrinterIcon } from './Icons/PrinterIcon/PrinterIcon.js';
 export { default as QRCodeIcon } from './Icons/QRCodeIcon/QRCodeIcon.js';
 export { default as RadioIcon } from './Icons/RadioIcon/RadioIcon.js';
+export { default as RayIcon } from './Icons/RayIcon/RayIcon.js';
 export { default as RazorpayIcon } from './Icons/RazorpayIcon/RazorpayIcon.js';
 export { default as RazorpayXIcon } from './Icons/RazorpayXIcon/RazorpayXIcon.js';
 export { default as RazorpayxPayrollIcon } from './Icons/RazorpayxPayrollIcon/RazorpayxPayrollIcon.js';
@@ -489,6 +496,8 @@ export { Modal } from './Modal/Modal.web.js';
 export { ModalBody } from './Modal/ModalBody.web.js';
 export { ModalHeader } from './Modal/ModalHeader.web.js';
 export { ModalFooter } from './Modal/ModalFooter.web.js';
+export { Move } from './Move/Move.web.js';
+export { Morph } from './Morph/Morph.web.js';
 export { Menu } from './Menu/Menu.web.js';
 export { MenuItem } from './Menu/MenuItem.web.js';
 export { MenuOverlay } from './Menu/MenuOverlay.web.js';
@@ -499,6 +508,7 @@ export { PopoverInteractiveWrapper } from './Popover/PopoverInteractiveWrapper.w
 export { ProgressBar } from './ProgressBar/ProgressBar.js';
 export { Radio } from './Radio/Radio.js';
 export { RadioGroup } from './Radio/RadioGroup/RadioGroup.js';
+export { Scale } from './Scale/Scale.web.js';
 export { SideNav } from './SideNav/SideNav.web.js';
 export { SideNavLink } from './SideNav/SideNavItems/SideNavLink.web.js';
 export { SideNavLevel } from './SideNav/SideNavLevel.web.js';
@@ -516,6 +526,7 @@ export { SpotlightPopoverTourStep } from './SpotlightPopoverTour/TourStep.web.js
 export { StepGroup } from './StepGroup/StepGroup.web.js';
 export { StepItem } from './StepGroup/StepItem.web.js';
 export { StepItemIcon, StepItemIndicator } from './StepGroup/StepItemMarker.js';
+export { Slide } from './Slide/Slide.web.js';
 export { Switch } from './Switch/Switch.js';
 export { Table } from './Table/Table.web.js';
 export { TableHeader, TableHeaderCell, TableHeaderRow } from './Table/TableHeader.web.js';

package/build/lib/web/production/components/index.js.map

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

package/build/lib/web/production/tokens/global/motion.js

@@ -4,41 +4,35 @@ import { makeBezier } from '../../utils/makeBezier/makeBezier.web.js';
 // similar to EasingFactoryFn of `react-native-reanimated`
 
 var delay = {
-  '2xshort': 70,
-  xshort: 120,
-  "short": 180,
-  "long": 3000,
-  xlong: 5000
+  '2xquick': 80,
+  xquick: 160,
+  moderate: 280,
+  gentle: 480,
+  xgentle: 960,
+  "long": 2000,
+  xlong: 3000,
+  '2xlong': 5000
 };
 var duration = {
-  '2xquick': 70,
-  xquick: 150,
+  '2xquick': 80,
+  xquick: 160,
   quick: 200,
-  moderate: 250,
-  xmoderate: 300,
-  gentle: 400,
-  xgentle: 600,
-  '2xgentle': 900
+  moderate: 280,
+  xmoderate: 360,
+  gentle: 480,
+  xgentle: 640,
+  '2xgentle': 960
 };
 
 /* makeBezier returns a string of `cubic-bezier()` for web & a react-native-reanimated Easing Function of type `EasingFactoryFn` for native */
 var easing = {
-  standard: {
-    attentive: makeBezier(0.5, 0, 0.3, 1.5),
-    effective: makeBezier(0.3, 0, 0.2, 1),
-    revealing: makeBezier(0.5, 0, 0, 1),
-    wary: makeBezier(1, 0.5, 0, 0.5)
-  },
-  entrance: {
-    attentive: makeBezier(0.5, 0, 0.3, 1.5),
-    effective: makeBezier(0, 0, 0.2, 1),
-    revealing: makeBezier(0, 0, 0, 1)
-  },
-  exit: {
-    attentive: makeBezier(0.7, 0, 0.5, 1),
-    effective: makeBezier(0.17, 0, 1, 1),
-    revealing: makeBezier(0.5, 0, 1, 1)
-  }
+  linear: makeBezier(0, 0, 0, 0),
+  entrance: makeBezier(0, 0, 0.2, 1),
+  exit: makeBezier(0.17, 0, 1, 1),
+  standard: makeBezier(0.3, 0, 0.2, 1),
+  emphasized: makeBezier(0.5, 0, 0, 1),
+  overshoot: makeBezier(0.5, 0, 0.3, 1.5),
+  shake: makeBezier(1, 0.5, 0, 0.5)
 };
 var motion = {
   delay: delay,

package/build/lib/web/production/tokens/global/motion.js.map

@@ -1 +1 @@
-{"version":3,"file":"motion.js","sources":["../../../../../../src/tokens/global/motion.ts"],"sourcesContent":["import type { DotNotationMotionStringToken } from '~utils/types';\nimport type { Platform } from '~utils';\nimport { makeBezier } from '~utils/makeBezier';\n\ntype Duration = {\n  /** `70` milliseconds */\n  '2xquick': 70;\n  /** `150` milliseconds */\n  xquick: 150;\n  /** `200` milliseconds */\n  quick: 200;\n  /** `250` milliseconds */\n  moderate: 250;\n  /** `300` milliseconds */\n  xmoderate: 300;\n  /** `400` milliseconds */\n  gentle: 400;\n  /** `600` milliseconds */\n  xgentle: 600;\n  /** `900` milliseconds */\n  '2xgentle': 900;\n};\n\ntype Delay = {\n  /** `70` milliseconds */\n  '2xshort': 70;\n  /** `120` milliseconds */\n  xshort: 120;\n  /** `180` milliseconds */\n  short: 180;\n  /** `3000` milliseconds */\n  long: 3000;\n  /** `5000` milliseconds */\n  xlong: 5000;\n};\n\nexport type EasingFactoryFn = { factory: () => (value: number) => number }; // similar to EasingFactoryFn of `react-native-reanimated`\nexport type EasingType<Value extends string> = Platform.Select<{\n  web: Value;\n  native: EasingFactoryFn;\n}>;\n\ntype Easing = {\n  /** Easings for all standard animations*/\n  standard: {\n    /** `cubic-bezier(0.5, 0, 0.3, 1.5)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    attentive: EasingType<'cubic-bezier(0.5, 0, 0.3, 1.5)'>;\n    /** `cubic-bezier(0.3, 0, 0.2, 1)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    effective: EasingType<'cubic-bezier(0.3, 0, 0.2, 1)'>;\n    /** `cubic-bezier(0.5, 0, 0, 1)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    revealing: EasingType<'cubic-bezier(0.5, 0, 0, 1)'>;\n    /** `cubic-bezier(1, 0.5, 0, 0.5)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    wary: EasingType<'cubic-bezier(1, 0.5, 0, 0.5)'>;\n  };\n  /** Easings for all entrance animations*/\n  entrance: {\n    /** `cubic-bezier(0.5, 0, 0.3, 1.5)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    attentive: EasingType<'cubic-bezier(0.5, 0, 0.3, 1.5)'>;\n    /** `cubic-bezier(0, 0, 0.2, 1)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    effective: EasingType<'cubic-bezier(0, 0, 0.2, 1)'>;\n    /** `cubic-bezier(0, 0, 0, 1)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    revealing: EasingType<'cubic-bezier(0, 0, 0, 1)'>;\n  };\n  /** Easings for all exit animations*/\n  exit: {\n    /** `cubic-bezier(0.7, 0, 0.5, 1)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    attentive: EasingType<'cubic-bezier(0.7, 0, 0.5, 1)'>;\n    /** `cubic-bezier(0.17, 0, 1, 1)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    effective: EasingType<'cubic-bezier(0.17, 0, 1, 1)'>;\n    /** `cubic-bezier(0.5, 0, 1, 1)`\n     *\n     *  Returns a `string` of `\"cubic-bezier(...)\"` for web & react-native-reanimated's Easing Function of type `EasingFactoryFn` for native */\n    revealing: EasingType<'cubic-bezier(0.5, 0, 1, 1)'>;\n  };\n};\n\nexport type Motion = Readonly<{\n  delay: Delay;\n  duration: Duration;\n  easing: Easing;\n}>;\n\nexport type EasingString = `easing.${DotNotationMotionStringToken<Easing>}`;\nexport type DurationString = `duration.${keyof Duration}`;\nexport type DelayString = `delay.${keyof Delay}`;\n\nconst delay: Delay = {\n  '2xshort': 70,\n  xshort: 120,\n  short: 180,\n  long: 3000,\n  xlong: 5000,\n};\n\nconst duration: Duration = {\n  '2xquick': 70,\n  xquick: 150,\n  quick: 200,\n  moderate: 250,\n  xmoderate: 300,\n  gentle: 400,\n  xgentle: 600,\n  '2xgentle': 900,\n};\n\n/* makeBezier returns a string of `cubic-bezier()` for web & a react-native-reanimated Easing Function of type `EasingFactoryFn` for native */\nconst easing: Easing = {\n  standard: {\n    attentive: makeBezier(0.5, 0, 0.3, 1.5),\n    effective: makeBezier(0.3, 0, 0.2, 1),\n    revealing: makeBezier(0.5, 0, 0, 1),\n    wary: makeBezier(1, 0.5, 0, 0.5),\n  },\n  entrance: {\n    attentive: makeBezier(0.5, 0, 0.3, 1.5),\n    effective: makeBezier(0, 0, 0.2, 1),\n    revealing: makeBezier(0, 0, 0, 1),\n  },\n  exit: {\n    attentive: makeBezier(0.7, 0, 0.5, 1),\n    effective: makeBezier(0.17, 0, 1, 1),\n    revealing: makeBezier(0.5, 0, 1, 1),\n  },\n};\n\nexport const motion: Motion = {\n  delay,\n  duration,\n  easing,\n};\n"],"names":["delay","xshort","xlong","duration","xquick","quick","moderate","xmoderate","gentle","xgentle","easing","standard","attentive","makeBezier","effective","revealing","wary","entrance","exit","motion"],"mappings":";;;AAoC4E;;AAoE5E,IAAMA,KAAY,GAAG;AACnB,EAAA,SAAS,EAAE,EAAE;AACbC,EAAAA,MAAM,EAAE,GAAG;AACX,EAAA,OAAA,EAAO,GAAG;AACV,EAAA,MAAA,EAAM,IAAI;AACVC,EAAAA,KAAK,EAAE,IAAA;AACT,CAAC,CAAA;AAED,IAAMC,QAAkB,GAAG;AACzB,EAAA,SAAS,EAAE,EAAE;AACbC,EAAAA,MAAM,EAAE,GAAG;AACXC,EAAAA,KAAK,EAAE,GAAG;AACVC,EAAAA,QAAQ,EAAE,GAAG;AACbC,EAAAA,SAAS,EAAE,GAAG;AACdC,EAAAA,MAAM,EAAE,GAAG;AACXC,EAAAA,OAAO,EAAE,GAAG;AACZ,EAAA,UAAU,EAAE,GAAA;AACd,CAAC,CAAA;;AAED;AACA,IAAMC,MAAc,GAAG;AACrBC,EAAAA,QAAQ,EAAE;IACRC,SAAS,EAAEC,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IACvCC,SAAS,EAAED,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IACrCE,SAAS,EAAEF,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;IACnCG,IAAI,EAAEH,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,CAAA;GAChC;AACDI,EAAAA,QAAQ,EAAE;IACRL,SAAS,EAAEC,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IACvCC,SAAS,EAAED,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IACnCE,SAAS,EAAEF,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAA;GACjC;AACDK,EAAAA,IAAI,EAAE;IACJN,SAAS,EAAEC,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IACrCC,SAAS,EAAED,UAAU,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;IACpCE,SAAS,EAAEF,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAA;AACpC,GAAA;AACF,CAAC,CAAA;AAEM,IAAMM,MAAc,GAAG;AAC5BnB,EAAAA,KAAK,EAALA,KAAK;AACLG,EAAAA,QAAQ,EAARA,QAAQ;AACRO,EAAAA,MAAM,EAANA,MAAAA;AACF;;;;"}
+{"version":3,"file":"motion.js","sources":["../../../../../../src/tokens/global/motion.ts"],"sourcesContent":["import type { Platform } from '~utils';\nimport { makeBezier } from '~utils/makeBezier';\n\ntype Duration = {\n  /** `80` milliseconds */\n  '2xquick': 80;\n  /** `160` milliseconds */\n  xquick: 160;\n  /** `200` milliseconds */\n  quick: 200;\n  /** `280` milliseconds */\n  moderate: 280;\n  /** `360` milliseconds */\n  xmoderate: 360;\n  /** `480` milliseconds */\n  gentle: 480;\n  /** `640` milliseconds */\n  xgentle: 640;\n  /** `960` milliseconds */\n  '2xgentle': 960;\n};\n\nexport type Delay = {\n  /** `80` milliseconds */\n  '2xquick': 80;\n  /** `160` milliseconds */\n  xquick: 160;\n  /** `280` milliseconds */\n  moderate: 280;\n  /** `480` milliseconds */\n  gentle: 480;\n  /** `960` milliseconds */\n  xgentle: 960;\n  /** `2000` milliseconds */\n  long: 2000;\n  /** `3000` milliseconds */\n  xlong: 3000;\n  /** `5000` milliseconds */\n  '2xlong': 5000;\n};\n\nexport type EasingFactoryFn = { factory: () => (value: number) => number }; // similar to EasingFactoryFn of `react-native-reanimated`\nexport type EasingType<Value extends string> = Platform.Select<{\n  web: Value;\n  native: EasingFactoryFn;\n}>;\n\ntype Easing = {\n  /**\n   * Linear Easing\n   *\n   * Use Case: Marquee, Progress Bar, etc\n   *\n   * Returns cubic-bezier string in web and EasingFactoryFn of react-native-reanimated in native\n   */\n  linear: EasingType<'cubic-bezier(0, 0, 0, 0)'>;\n\n  /**\n   * Entrance Animation Easing\n   *\n   * Use Case: Entry of modals, drawer, dropdown, etc\n   *\n   * Returns cubic-bezier string in web and EasingFactoryFn of react-native-reanimated in native\n   */\n  entrance: EasingType<'cubic-bezier(0, 0, 0.2, 1)'>;\n\n  /**\n   * Exit Animation Easing\n   *\n   * Use Case: Exit of modals, drawer, dropdown, etc\n   *\n   * Returns cubic-bezier string in web and EasingFactoryFn of react-native-reanimated in native\n   */\n  exit: EasingType<'cubic-bezier(0.17, 0, 1, 1)'>;\n\n  /**\n   * Standard Easing\n   *\n   * Use Case: Morph\n   *\n   * Returns cubic-bezier string in web and EasingFactoryFn of react-native-reanimated in native\n   */\n  standard: EasingType<'cubic-bezier(0.3, 0, 0.2, 1)'>;\n\n  /**\n   * Emphasized Easing\n   *\n   * Use Case: Hover states of interactive items\n   *\n   * Returns cubic-bezier string in web and EasingFactoryFn of react-native-reanimated in native\n   */\n  emphasized: EasingType<'cubic-bezier(0.5, 0, 0, 1)'>;\n\n  /**\n   * Overshoot Easing\n   *\n   * Use Case: Toast notifications\n   *\n   * Returns cubic-bezier string in web and EasingFactoryFn of react-native-reanimated in native\n   */\n  overshoot: EasingType<'cubic-bezier(0.5, 0, 0.3, 1.5)'>;\n\n  /**\n   * Error Easing\n   *\n   * Use Case: Error States\n   *\n   * Returns cubic-bezier string in web and EasingFactoryFn of react-native-reanimated in native\n   */\n  shake: EasingType<'cubic-bezier(1, 0.5, 0, 0.5)'>;\n};\n\nexport type Motion = Readonly<{\n  delay: Delay;\n  duration: Duration;\n  easing: Easing;\n}>;\n\nexport type EasingString = `easing.${keyof Easing}`;\nexport type DurationString = `duration.${keyof Duration}`;\nexport type DelayString = `delay.${keyof Delay}`;\n\nconst delay: Delay = {\n  '2xquick': 80,\n  xquick: 160,\n  moderate: 280,\n  gentle: 480,\n  xgentle: 960,\n  long: 2000,\n  xlong: 3000,\n  '2xlong': 5000,\n};\n\nconst duration: Duration = {\n  '2xquick': 80,\n  xquick: 160,\n  quick: 200,\n  moderate: 280,\n  xmoderate: 360,\n  gentle: 480,\n  xgentle: 640,\n  '2xgentle': 960,\n};\n\n/* makeBezier returns a string of `cubic-bezier()` for web & a react-native-reanimated Easing Function of type `EasingFactoryFn` for native */\nconst easing: Easing = {\n  linear: makeBezier(0, 0, 0, 0),\n  entrance: makeBezier(0, 0, 0.2, 1),\n  exit: makeBezier(0.17, 0, 1, 1),\n  standard: makeBezier(0.3, 0, 0.2, 1),\n  emphasized: makeBezier(0.5, 0, 0, 1),\n  overshoot: makeBezier(0.5, 0, 0.3, 1.5),\n  shake: makeBezier(1, 0.5, 0, 0.5),\n};\n\nexport const motion: Motion = {\n  delay,\n  duration,\n  easing,\n};\n"],"names":["delay","xquick","moderate","gentle","xgentle","xlong","duration","quick","xmoderate","easing","linear","makeBezier","entrance","exit","standard","emphasized","overshoot","shake","motion"],"mappings":";;;AAyC4E;;AAiF5E,IAAMA,KAAY,GAAG;AACnB,EAAA,SAAS,EAAE,EAAE;AACbC,EAAAA,MAAM,EAAE,GAAG;AACXC,EAAAA,QAAQ,EAAE,GAAG;AACbC,EAAAA,MAAM,EAAE,GAAG;AACXC,EAAAA,OAAO,EAAE,GAAG;AACZ,EAAA,MAAA,EAAM,IAAI;AACVC,EAAAA,KAAK,EAAE,IAAI;AACX,EAAA,QAAQ,EAAE,IAAA;AACZ,CAAC,CAAA;AAED,IAAMC,QAAkB,GAAG;AACzB,EAAA,SAAS,EAAE,EAAE;AACbL,EAAAA,MAAM,EAAE,GAAG;AACXM,EAAAA,KAAK,EAAE,GAAG;AACVL,EAAAA,QAAQ,EAAE,GAAG;AACbM,EAAAA,SAAS,EAAE,GAAG;AACdL,EAAAA,MAAM,EAAE,GAAG;AACXC,EAAAA,OAAO,EAAE,GAAG;AACZ,EAAA,UAAU,EAAE,GAAA;AACd,CAAC,CAAA;;AAED;AACA,IAAMK,MAAc,GAAG;EACrBC,MAAM,EAAEC,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;EAC9BC,QAAQ,EAAED,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;EAClCE,IAAI,EAAEF,UAAU,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;EAC/BG,QAAQ,EAAEH,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;EACpCI,UAAU,EAAEJ,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;EACpCK,SAAS,EAAEL,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;EACvCM,KAAK,EAAEN,UAAU,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,CAAA;AAClC,CAAC,CAAA;AAEM,IAAMO,MAAc,GAAG;AAC5BlB,EAAAA,KAAK,EAALA,KAAK;AACLM,EAAAA,QAAQ,EAARA,QAAQ;AACRG,EAAAA,MAAM,EAANA,MAAAA;AACF;;;;"}

package/build/lib/web/production/utils/cssBezierToArray.js

@@ -0,0 +1,12 @@
+var cssBezierToArray = function cssBezierToArray(cssCubicBezierString) {
+  var indexOfFirstBracket = cssCubicBezierString.indexOf('(');
+  var indexOfLastBracket = cssCubicBezierString.lastIndexOf(')');
+  var bezierValuesString = cssCubicBezierString.slice(indexOfFirstBracket + 1, indexOfLastBracket);
+  var bezierValuesArray = bezierValuesString.split(',').map(function (val) {
+    return Number(val);
+  });
+  return bezierValuesArray;
+};
+
+export { cssBezierToArray };
+//# sourceMappingURL=cssBezierToArray.js.map

package/build/lib/web/production/utils/cssBezierToArray.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cssBezierToArray.js","sources":["../../../../../src/utils/cssBezierToArray.ts"],"sourcesContent":["const cssBezierToArray = <\n  X1 extends number,\n  Y1 extends number,\n  X2 extends number,\n  Y2 extends number\n>(\n  cssCubicBezierString: `cubic-bezier(${X1}, ${Y1}, ${X2}, ${Y2})`,\n): [X1, Y1, X2, Y2] => {\n  const indexOfFirstBracket = cssCubicBezierString.indexOf('(');\n  const indexOfLastBracket = cssCubicBezierString.lastIndexOf(')');\n  const bezierValuesString = cssCubicBezierString.slice(\n    indexOfFirstBracket + 1,\n    indexOfLastBracket,\n  );\n  const bezierValuesArray = bezierValuesString.split(',').map((val) => Number(val)) as [\n    X1,\n    Y1,\n    X2,\n    Y2,\n  ];\n  return bezierValuesArray;\n};\n\nexport { cssBezierToArray };\n"],"names":["cssBezierToArray","cssCubicBezierString","indexOfFirstBracket","indexOf","indexOfLastBracket","lastIndexOf","bezierValuesString","slice","bezierValuesArray","split","map","val","Number"],"mappings":"AAAA,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAMpBC,oBAAgE,EAC3C;AACrB,EAAA,IAAMC,mBAAmB,GAAGD,oBAAoB,CAACE,OAAO,CAAC,GAAG,CAAC,CAAA;AAC7D,EAAA,IAAMC,kBAAkB,GAAGH,oBAAoB,CAACI,WAAW,CAAC,GAAG,CAAC,CAAA;EAChE,IAAMC,kBAAkB,GAAGL,oBAAoB,CAACM,KAAK,CACnDL,mBAAmB,GAAG,CAAC,EACvBE,kBACF,CAAC,CAAA;AACD,EAAA,IAAMI,iBAAiB,GAAGF,kBAAkB,CAACG,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,UAACC,GAAG,EAAA;IAAA,OAAKC,MAAM,CAACD,GAAG,CAAC,CAAA;GAK/E,CAAA,CAAA;AACD,EAAA,OAAOH,iBAAiB,CAAA;AAC1B;;;;"}

package/build/lib/web/production/utils/getFocusRingStyles/getFocusRingStyles.web.js

@@ -22,7 +22,7 @@ function getFocusRingStyles(_ref) {
     outlineOffset: "".concat(negativeOffset ? '-4px' : '1px').concat(important),
     transitionProperty: 'outline-width',
     transitionDuration: castWebType(makeMotionTime(theme.motion.duration['2xquick'])),
-    transitionTimingFunction: castWebType(theme.motion.easing.standard.effective)
+    transitionTimingFunction: castWebType(theme.motion.easing.standard)
   };
 }
 

package/build/lib/web/production/utils/getFocusRingStyles/getFocusRingStyles.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"getFocusRingStyles.web.js","sources":["../../../../../../src/utils/getFocusRingStyles/getFocusRingStyles.web.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport type { GetFocusRingArgs } from './types';\nimport { castWebType, makeMotionTime } from '~utils';\n\n/**\n * @param props.theme Blade Theme Object\n * @param props.negativeOffset if set the outline offset will be set to -4px, this is useful\n * in table component where the outline will get cutoff by the table border\n */\nfunction getFocusRingStyles({\n  theme,\n  negativeOffset = false,\n  isImportant = false,\n}: GetFocusRingArgs) {\n  const important = `${isImportant ? ' !important' : ''}`;\n  return {\n    outline: `4px solid ${theme.colors.surface.border.primary.muted}${important}`,\n    outlineOffset: `${negativeOffset ? '-4px' : '1px'}${important}`,\n    transitionProperty: 'outline-width',\n    transitionDuration: castWebType(makeMotionTime(theme.motion.duration['2xquick'])),\n    transitionTimingFunction: castWebType(theme.motion.easing.standard.effective),\n  } as const;\n}\n\nexport { getFocusRingStyles };\n"],"names":["getFocusRingStyles","_ref","theme","_ref$negativeOffset","negativeOffset","_ref$isImportant","isImportant","important","concat","outline","colors","surface","border","primary","muted","outlineOffset","transitionProperty","transitionDuration","castWebType","makeMotionTime","motion","duration","transitionTimingFunction","easing","standard","effective"],"mappings":";;;;AAAA;;;AAIA;AACA;AACA;AACA;AACA;AACA,SAASA,kBAAkBA,CAAAC,IAAA,EAIN;AAAA,EAAA,IAHnBC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAAC,mBAAA,GAAAF,IAAA,CACLG,cAAc;AAAdA,IAAAA,cAAc,GAAAD,mBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,mBAAA;IAAAE,gBAAA,GAAAJ,IAAA,CACtBK,WAAW;AAAXA,IAAAA,WAAW,GAAAD,gBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,gBAAA,CAAA;EAEnB,IAAME,SAAS,MAAAC,MAAA,CAAMF,WAAW,GAAG,aAAa,GAAG,EAAE,CAAE,CAAA;EACvD,OAAO;AACLG,IAAAA,OAAO,eAAAD,MAAA,CAAeN,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,MAAM,CAACC,OAAO,CAACC,KAAK,EAAAN,MAAA,CAAGD,SAAS,CAAE;AAC7EQ,IAAAA,aAAa,EAAAP,EAAAA,CAAAA,MAAA,CAAKJ,cAAc,GAAG,MAAM,GAAG,KAAK,CAAAI,CAAAA,MAAA,CAAGD,SAAS,CAAE;AAC/DS,IAAAA,kBAAkB,EAAE,eAAe;AACnCC,IAAAA,kBAAkB,EAAEC,WAAW,CAACC,cAAc,CAACjB,KAAK,CAACkB,MAAM,CAACC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC;IACjFC,wBAAwB,EAAEJ,WAAW,CAAChB,KAAK,CAACkB,MAAM,CAACG,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAA;GAC7E,CAAA;AACH;;;;"}
+{"version":3,"file":"getFocusRingStyles.web.js","sources":["../../../../../../src/utils/getFocusRingStyles/getFocusRingStyles.web.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport type { GetFocusRingArgs } from './types';\nimport { castWebType, makeMotionTime } from '~utils';\n\n/**\n * @param props.theme Blade Theme Object\n * @param props.negativeOffset if set the outline offset will be set to -4px, this is useful\n * in table component where the outline will get cutoff by the table border\n */\nfunction getFocusRingStyles({\n  theme,\n  negativeOffset = false,\n  isImportant = false,\n}: GetFocusRingArgs) {\n  const important = `${isImportant ? ' !important' : ''}`;\n  return {\n    outline: `4px solid ${theme.colors.surface.border.primary.muted}${important}`,\n    outlineOffset: `${negativeOffset ? '-4px' : '1px'}${important}`,\n    transitionProperty: 'outline-width',\n    transitionDuration: castWebType(makeMotionTime(theme.motion.duration['2xquick'])),\n    transitionTimingFunction: castWebType(theme.motion.easing.standard),\n  } as const;\n}\n\nexport { getFocusRingStyles };\n"],"names":["getFocusRingStyles","_ref","theme","_ref$negativeOffset","negativeOffset","_ref$isImportant","isImportant","important","concat","outline","colors","surface","border","primary","muted","outlineOffset","transitionProperty","transitionDuration","castWebType","makeMotionTime","motion","duration","transitionTimingFunction","easing","standard"],"mappings":";;;;AAAA;;;AAIA;AACA;AACA;AACA;AACA;AACA,SAASA,kBAAkBA,CAAAC,IAAA,EAIN;AAAA,EAAA,IAHnBC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAAC,mBAAA,GAAAF,IAAA,CACLG,cAAc;AAAdA,IAAAA,cAAc,GAAAD,mBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,mBAAA;IAAAE,gBAAA,GAAAJ,IAAA,CACtBK,WAAW;AAAXA,IAAAA,WAAW,GAAAD,gBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,gBAAA,CAAA;EAEnB,IAAME,SAAS,MAAAC,MAAA,CAAMF,WAAW,GAAG,aAAa,GAAG,EAAE,CAAE,CAAA;EACvD,OAAO;AACLG,IAAAA,OAAO,eAAAD,MAAA,CAAeN,KAAK,CAACQ,MAAM,CAACC,OAAO,CAACC,MAAM,CAACC,OAAO,CAACC,KAAK,EAAAN,MAAA,CAAGD,SAAS,CAAE;AAC7EQ,IAAAA,aAAa,EAAAP,EAAAA,CAAAA,MAAA,CAAKJ,cAAc,GAAG,MAAM,GAAG,KAAK,CAAAI,CAAAA,MAAA,CAAGD,SAAS,CAAE;AAC/DS,IAAAA,kBAAkB,EAAE,eAAe;AACnCC,IAAAA,kBAAkB,EAAEC,WAAW,CAACC,cAAc,CAACjB,KAAK,CAACkB,MAAM,CAACC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC;IACjFC,wBAAwB,EAAEJ,WAAW,CAAChB,KAAK,CAACkB,MAAM,CAACG,MAAM,CAACC,QAAQ,CAAA;GACnE,CAAA;AACH;;;;"}

package/build/lib/web/production/utils/getMotionRefs.js

@@ -0,0 +1,86 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+/**
+ * ## What are `getOuterMotionRef` and `getInnerMotionRef` functions?
+ *
+ * - Motion react requires refs on outermost element to animate components
+ * - But we have certain components like input where we already pass refs on inner elements with certain expectation (e.g. in input to focus on the input)
+ *
+ * Using these 2 utility functions, we can use 2 refs from same forwardRef. One on outer element and one on inner element
+ *
+ * ---
+ *
+ * ### Examples
+ *
+ * ```jsx
+ *
+ * const MyComponent = ({ _motionMeta }: MotionMetaProp, ref: React.Ref<BladeElementRef>) => {
+ *
+ *  return (
+ *   <BaseBox ref={getOuterMotionRef({ _motionMeta, ref })}>
+ *    <Text>Something something</Text>
+ *    <BaseInput ref={getInnerMotionRef({ _motionMeta, ref })} />
+ *  </BaseBox>
+ *  )
+ * }
+ * ```
+ *
+ * ### What does it internally do?
+ *
+ * - On BaseMotion.tsx, we inject _motionMeta prop with ref that is passed to child.
+ * - i.e. we pick the `ref` prop of child, and pass it as `_motionMeta.innerRef`. This way in our components, we have access to both the refs. The motion/react ref that we get from forwardRef, and `_motionMeta.innerRef` (ref that you pass on child component of motion)
+ * - Both `getOuterMotionRef` and `getInnerMotionRef` are simple one line utility functions to use the correct ref on correct element.
+ *
+ * ### When to use this?
+ *
+ * - When you want to forward ref to component on inner element instead of outer element (e.g. passing down the ref to input in checkbox)
+ */
+var getOuterMotionRef = function getOuterMotionRef(_ref) {
+  var _motionMeta = _ref._motionMeta,
+    ref = _ref.ref;
+  return _motionMeta !== null && _motionMeta !== void 0 && _motionMeta.isEnhanced ? ref : null;
+};
+
+/**
+ * ## What are `getOuterMotionRef` and `getInnerMotionRef` functions?
+ *
+ * - Motion react requires refs on outermost element to animate components
+ * - But we have certain components like input where we already pass refs on inner elements with certain expectation (e.g. in input to focus on the input)
+ *
+ * Using these 2 utility functions, we can use 2 refs from same forwardRef. One on outer element and one on inner element
+ *
+ * ---
+ *
+ * ### Examples
+ *
+ * ```jsx
+ *
+ * const MyComponent = ({ _motionMeta }: MotionMetaProp, ref: React.Ref<BladeElementRef>) => {
+ *
+ *  return (
+ *   <BaseBox ref={getOuterMotionRef({ _motionMeta, ref })}>
+ *    <Text>Something something</Text>
+ *    <BaseInput ref={getInnerMotionRef({ _motionMeta, ref })} />
+ *  </BaseBox>
+ *  )
+ * }
+ * ```
+ *
+ * ### What does it internally do?
+ *
+ * - On BaseMotion.tsx, we inject _motionMeta prop with ref that is passed to child.
+ * - i.e. we pick the `ref` prop of child, and pass it as `_motionMeta.innerRef`. This way in our components, we have access to both the refs. The motion/react ref that we get from forwardRef, and `_motionMeta.innerRef` (ref that you pass on child component of motion)
+ * - Both `getOuterMotionRef` and `getInnerMotionRef` are simple one line utility functions to use the correct ref on correct element.
+ *
+ * ### When to use this?
+ *
+ * - When you want to forward ref to component on inner element instead of outer element (e.g. passing down the ref to input in checkbox)
+ */
+var getInnerMotionRef = function getInnerMotionRef(_ref2) {
+  var _motionMeta = _ref2._motionMeta,
+    ref = _ref2.ref;
+  return _motionMeta !== null && _motionMeta !== void 0 && _motionMeta.isEnhanced ? _motionMeta.innerRef : ref;
+};
+
+export { getInnerMotionRef, getOuterMotionRef };
+//# sourceMappingURL=getMotionRefs.js.map

package/build/lib/web/production/utils/getMotionRefs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getMotionRefs.js","sources":["../../../../../src/utils/getMotionRefs.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type React from 'react';\nimport type { BladeElementRef } from './types';\nimport type { MotionMetaProp } from '~components/BaseMotion';\n\ntype MotionRefsType = {\n  ref: React.Ref<BladeElementRef>;\n} & MotionMetaProp;\n\n/**\n * ## What are `getOuterMotionRef` and `getInnerMotionRef` functions?\n *\n * - Motion react requires refs on outermost element to animate components\n * - But we have certain components like input where we already pass refs on inner elements with certain expectation (e.g. in input to focus on the input)\n *\n * Using these 2 utility functions, we can use 2 refs from same forwardRef. One on outer element and one on inner element\n *\n * ---\n *\n * ### Examples\n *\n * ```jsx\n *\n * const MyComponent = ({ _motionMeta }: MotionMetaProp, ref: React.Ref<BladeElementRef>) => {\n *\n *  return (\n *   <BaseBox ref={getOuterMotionRef({ _motionMeta, ref })}>\n *    <Text>Something something</Text>\n *    <BaseInput ref={getInnerMotionRef({ _motionMeta, ref })} />\n *  </BaseBox>\n *  )\n * }\n * ```\n *\n * ### What does it internally do?\n *\n * - On BaseMotion.tsx, we inject _motionMeta prop with ref that is passed to child.\n * - i.e. we pick the `ref` prop of child, and pass it as `_motionMeta.innerRef`. This way in our components, we have access to both the refs. The motion/react ref that we get from forwardRef, and `_motionMeta.innerRef` (ref that you pass on child component of motion)\n * - Both `getOuterMotionRef` and `getInnerMotionRef` are simple one line utility functions to use the correct ref on correct element.\n *\n * ### When to use this?\n *\n * - When you want to forward ref to component on inner element instead of outer element (e.g. passing down the ref to input in checkbox)\n */\nconst getOuterMotionRef = ({ _motionMeta, ref }: MotionRefsType): any => {\n  return _motionMeta?.isEnhanced ? ref : null;\n};\n\n/**\n * ## What are `getOuterMotionRef` and `getInnerMotionRef` functions?\n *\n * - Motion react requires refs on outermost element to animate components\n * - But we have certain components like input where we already pass refs on inner elements with certain expectation (e.g. in input to focus on the input)\n *\n * Using these 2 utility functions, we can use 2 refs from same forwardRef. One on outer element and one on inner element\n *\n * ---\n *\n * ### Examples\n *\n * ```jsx\n *\n * const MyComponent = ({ _motionMeta }: MotionMetaProp, ref: React.Ref<BladeElementRef>) => {\n *\n *  return (\n *   <BaseBox ref={getOuterMotionRef({ _motionMeta, ref })}>\n *    <Text>Something something</Text>\n *    <BaseInput ref={getInnerMotionRef({ _motionMeta, ref })} />\n *  </BaseBox>\n *  )\n * }\n * ```\n *\n * ### What does it internally do?\n *\n * - On BaseMotion.tsx, we inject _motionMeta prop with ref that is passed to child.\n * - i.e. we pick the `ref` prop of child, and pass it as `_motionMeta.innerRef`. This way in our components, we have access to both the refs. The motion/react ref that we get from forwardRef, and `_motionMeta.innerRef` (ref that you pass on child component of motion)\n * - Both `getOuterMotionRef` and `getInnerMotionRef` are simple one line utility functions to use the correct ref on correct element.\n *\n * ### When to use this?\n *\n * - When you want to forward ref to component on inner element instead of outer element (e.g. passing down the ref to input in checkbox)\n */\nconst getInnerMotionRef = ({ _motionMeta, ref }: MotionRefsType): any => {\n  return _motionMeta?.isEnhanced ? _motionMeta.innerRef : ref;\n};\n\nexport { getOuterMotionRef, getInnerMotionRef };\n"],"names":["getOuterMotionRef","_ref","_motionMeta","ref","isEnhanced","getInnerMotionRef","_ref2","innerRef"],"mappings":"AAAA;;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMA,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAAC,IAAA,EAAkD;AAAA,EAAA,IAA5CC,WAAW,GAAAD,IAAA,CAAXC,WAAW;IAAEC,GAAG,GAAAF,IAAA,CAAHE,GAAG,CAAA;EAC3C,OAAOD,WAAW,KAAXA,IAAAA,IAAAA,WAAW,KAAXA,KAAAA,CAAAA,IAAAA,WAAW,CAAEE,UAAU,GAAGD,GAAG,GAAG,IAAI,CAAA;AAC7C,EAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAME,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAAC,KAAA,EAAkD;AAAA,EAAA,IAA5CJ,WAAW,GAAAI,KAAA,CAAXJ,WAAW;IAAEC,GAAG,GAAAG,KAAA,CAAHH,GAAG,CAAA;AAC3C,EAAA,OAAOD,WAAW,KAAA,IAAA,IAAXA,WAAW,KAAA,KAAA,CAAA,IAAXA,WAAW,CAAEE,UAAU,GAAGF,WAAW,CAACK,QAAQ,GAAGJ,GAAG,CAAA;AAC7D;;;;"}

package/build/lib/web/production/utils/msToSeconds.js

@@ -0,0 +1,6 @@
+var msToSeconds = function msToSeconds(durationInMS) {
+  return durationInMS / 1000;
+};
+
+export { msToSeconds };
+//# sourceMappingURL=msToSeconds.js.map

package/build/lib/web/production/utils/msToSeconds.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"msToSeconds.js","sources":["../../../../../src/utils/msToSeconds.ts"],"sourcesContent":["const msToSeconds = (durationInMS: number): number => {\n  return durationInMS / 1000;\n};\n\nexport { msToSeconds };\n"],"names":["msToSeconds","durationInMS"],"mappings":"AAAA,IAAMA,WAAW,GAAG,SAAdA,WAAWA,CAAIC,YAAoB,EAAa;EACpD,OAAOA,YAAY,GAAG,IAAI,CAAA;AAC5B;;;;"}