@razorpay/blade 12.31.4 → 12.32.0

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

@@ -0,0 +1,139 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import React__default, { useMemo } from 'react';
+import { StyledInputGroup } from './StyledInputGroup.js';
+import { InputGroupProvider } from './InputGroupContext.js';
+import { formHintLeftLabelMarginLeft } from '../Input/BaseInput/baseInputTokens.js';
+import '../Box/BaseBox/index.js';
+import '../BladeProvider/index.js';
+import '../../utils/index.js';
+import { useFormId } from '../Form/useFormId.js';
+import '../../utils/metaAttribute/index.js';
+import '../Box/styledProps/index.js';
+import '../../utils/makeAnalyticsAttribute/index.js';
+import { FormLabel } from '../Form/FormLabel.js';
+import { FormHint } from '../Form/FormHint.js';
+import '../../utils/makeSize/index.js';
+import { useId } from '../../utils/useId.js';
+import { getHintType } from '../Input/BaseInput/BaseInput.js';
+import { getOuterMotionRef } from '../../utils/getMotionRefs.js';
+import '../../utils/assignWithoutSideEffects/index.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import useTheme from '../BladeProvider/useTheme.js';
+import { useBreakpoint } from '../../utils/useBreakpoint/useBreakpoint.js';
+import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.web.js';
+import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
+import { getStyledProps } from '../Box/styledProps/getStyledProps.js';
+import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
+import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
+import { makeSize } from '../../utils/makeSize/makeSize.js';
+import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
+
+var _excluded = ["label", "labelPosition", "size", "helpText", "errorText", "successText", "validationState", "isDisabled", "children", "testID", "_motionMeta"];
+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 _InputGroup = function _InputGroup(_ref, ref) {
+  var label = _ref.label,
+    _ref$labelPosition = _ref.labelPosition,
+    labelPosition = _ref$labelPosition === void 0 ? 'top' : _ref$labelPosition,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'medium' : _ref$size,
+    helpText = _ref.helpText,
+    errorText = _ref.errorText,
+    successText = _ref.successText,
+    _ref$validationState = _ref.validationState,
+    validationState = _ref$validationState === void 0 ? 'none' : _ref$validationState,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    children = _ref.children,
+    testID = _ref.testID,
+    _motionMeta = _ref._motionMeta,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var contextValue = useMemo(function () {
+    return {
+      isInsideInputGroup: true,
+      size: size,
+      isDisabled: isDisabled
+    };
+  }, [size, isDisabled]);
+  var _useFormId = useFormId('input-group'),
+    inputId = _useFormId.inputId,
+    helpTextId = _useFormId.helpTextId,
+    errorTextId = _useFormId.errorTextId,
+    successTextId = _useFormId.successTextId;
+  var idBase = useId('input-group');
+  var labelId = "".concat(idBase, "-label");
+  var _useTheme = useTheme(),
+    theme = _useTheme.theme;
+  var _useBreakpoint = useBreakpoint({
+      breakpoints: theme.breakpoints
+    }),
+    matchedDeviceType = _useBreakpoint.matchedDeviceType;
+  var isLabelLeftPositioned = labelPosition === 'left' && matchedDeviceType === 'desktop';
+  var willRenderHintText = Boolean(helpText) || validationState === 'success' && Boolean(successText) || validationState === 'error' && Boolean(errorText);
+  var totalInputRows = React__default.Children.count(children);
+  return /*#__PURE__*/jsx(InputGroupProvider, {
+    value: contextValue,
+    children: /*#__PURE__*/jsx(StyledInputGroup, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
+      ref: getOuterMotionRef({
+        _motionMeta: _motionMeta,
+        ref: ref
+      })
+    }, metaAttribute({
+      name: MetaConstants.InputGroup,
+      testID: testID
+    })), getStyledProps(rest)), makeAnalyticsAttribute(rest)), {}, {
+      children: /*#__PURE__*/jsxs(BaseBox, {
+        display: "flex",
+        flexDirection: "column",
+        width: "100%",
+        "data-testid": testID,
+        role: "group",
+        children: [/*#__PURE__*/jsxs(BaseBox, {
+          display: "flex",
+          flexDirection: isLabelLeftPositioned ? 'row' : 'column',
+          alignItems: isLabelLeftPositioned && totalInputRows < 2 ? 'center' : undefined,
+          children: [label && /*#__PURE__*/jsx(FormLabel, {
+            as: "label",
+            position: labelPosition,
+            id: labelId,
+            htmlFor: inputId,
+            size: size,
+            children: label
+          }), /*#__PURE__*/jsx(BaseBox, {
+            display: "flex",
+            flexDirection: "column",
+            children: children
+          })]
+        }), willRenderHintText && /*#__PURE__*/jsx(BaseBox, {
+          marginLeft: makeSize(label && isLabelLeftPositioned ? formHintLeftLabelMarginLeft[size] : 0),
+          children: /*#__PURE__*/jsx(BaseBox, {
+            display: "flex",
+            flexDirection: "row",
+            justifyContent: "space-between",
+            children: /*#__PURE__*/jsx(FormHint, {
+              type: getHintType({
+                validationState: validationState,
+                hasHelpText: Boolean(helpText)
+              }),
+              helpText: helpText,
+              errorText: errorText,
+              successText: successText,
+              helpTextId: helpTextId,
+              errorTextId: errorTextId,
+              successTextId: successTextId,
+              size: size
+            })
+          })
+        })]
+      })
+    }))
+  });
+};
+var InputGroup = /*#__PURE__*/assignWithoutSideEffects( /*#__PURE__*/React__default.forwardRef(_InputGroup), {
+  displayName: 'InputGroup',
+  componentId: 'InputGroup'
+});
+
+export { InputGroup };
+//# sourceMappingURL=InputGroup.web.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InputGroup.web.js","sources":["../../../../../../src/components/InputGroup/InputGroup.web.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport type { InputGroupProps } from './types';\nimport { StyledInputGroup } from './StyledInputGroup';\nimport { InputGroupProvider } from './InputGroupContext';\nimport { formHintLeftLabelMarginLeft } from '~components/Input/BaseInput/baseInputTokens';\nimport type { BladeElementRef } from '~utils/types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { useTheme } from '~components/BladeProvider';\nimport { useBreakpoint } from '~utils';\nimport { useFormId } from '~components/Form/useFormId';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\nimport { FormLabel } from '~components/Form/FormLabel';\nimport { FormHint } from '~components/Form/FormHint';\nimport { makeSize } from '~utils/makeSize';\nimport { useId } from '~utils/useId';\nimport { getHintType } from '~components/Input/BaseInput/BaseInput';\nimport { getOuterMotionRef } from '~utils/getMotionRefs';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\n\nconst _InputGroup: React.ForwardRefRenderFunction<BladeElementRef, InputGroupProps> = (\n  {\n    label,\n    labelPosition = 'top',\n    size = 'medium',\n    helpText,\n    errorText,\n    successText,\n    validationState = 'none',\n    isDisabled = false,\n    children,\n    testID,\n    _motionMeta,\n    ...rest\n  },\n  ref,\n) => {\n  const contextValue = useMemo(\n    () => ({\n      isInsideInputGroup: true,\n      size,\n      isDisabled,\n    }),\n    [size, isDisabled],\n  );\n\n  const { inputId, helpTextId, errorTextId, successTextId } = useFormId('input-group');\n  const idBase = useId('input-group');\n  const labelId = `${idBase}-label`;\n  const { theme } = useTheme();\n  const { matchedDeviceType } = useBreakpoint({ breakpoints: theme.breakpoints });\n  const isLabelLeftPositioned = labelPosition === 'left' && matchedDeviceType === 'desktop';\n\n  const willRenderHintText =\n    Boolean(helpText) ||\n    (validationState === 'success' && Boolean(successText)) ||\n    (validationState === 'error' && Boolean(errorText));\n\n  const totalInputRows = React.Children.count(children);\n\n  return (\n    <InputGroupProvider value={contextValue}>\n      <StyledInputGroup\n        ref={getOuterMotionRef({ _motionMeta, ref })}\n        {...metaAttribute({ name: MetaConstants.InputGroup, testID })}\n        {...getStyledProps(rest)}\n        {...makeAnalyticsAttribute(rest)}\n      >\n        <BaseBox\n          display=\"flex\"\n          flexDirection=\"column\"\n          width=\"100%\"\n          data-testid={testID}\n          role=\"group\"\n        >\n          <BaseBox\n            display=\"flex\"\n            flexDirection={isLabelLeftPositioned ? 'row' : 'column'}\n            alignItems={isLabelLeftPositioned && totalInputRows < 2 ? 'center' : undefined}\n          >\n            {label && (\n              <FormLabel\n                as=\"label\"\n                position={labelPosition}\n                id={labelId}\n                htmlFor={inputId}\n                size={size}\n              >\n                {label}\n              </FormLabel>\n            )}\n\n            <BaseBox display=\"flex\" flexDirection=\"column\">\n              {children}\n            </BaseBox>\n          </BaseBox>\n\n          {willRenderHintText && (\n            <BaseBox\n              marginLeft={makeSize(\n                label && isLabelLeftPositioned ? formHintLeftLabelMarginLeft[size] : 0,\n              )}\n            >\n              <BaseBox display=\"flex\" flexDirection=\"row\" justifyContent=\"space-between\">\n                <FormHint\n                  type={getHintType({ validationState, hasHelpText: Boolean(helpText) })}\n                  helpText={helpText}\n                  errorText={errorText}\n                  successText={successText}\n                  helpTextId={helpTextId}\n                  errorTextId={errorTextId}\n                  successTextId={successTextId}\n                  size={size}\n                />\n              </BaseBox>\n            </BaseBox>\n          )}\n        </BaseBox>\n      </StyledInputGroup>\n    </InputGroupProvider>\n  );\n};\n\nconst InputGroup = assignWithoutSideEffects(React.forwardRef(_InputGroup), {\n  displayName: 'InputGroup',\n  componentId: 'InputGroup',\n});\nexport { InputGroup };\n"],"names":["_InputGroup","_ref","ref","label","_ref$labelPosition","labelPosition","_ref$size","size","helpText","errorText","successText","_ref$validationState","validationState","_ref$isDisabled","isDisabled","children","testID","_motionMeta","rest","_objectWithoutProperties","_excluded","contextValue","useMemo","isInsideInputGroup","_useFormId","useFormId","inputId","helpTextId","errorTextId","successTextId","idBase","useId","labelId","concat","_useTheme","useTheme","theme","_useBreakpoint","useBreakpoint","breakpoints","matchedDeviceType","isLabelLeftPositioned","willRenderHintText","Boolean","totalInputRows","React","Children","count","_jsx","InputGroupProvider","value","StyledInputGroup","_objectSpread","getOuterMotionRef","metaAttribute","name","MetaConstants","InputGroup","getStyledProps","makeAnalyticsAttribute","_jsxs","BaseBox","display","flexDirection","width","role","alignItems","undefined","FormLabel","as","position","id","htmlFor","marginLeft","makeSize","formHintLeftLabelMarginLeft","justifyContent","FormHint","type","getHintType","hasHelpText","assignWithoutSideEffects","forwardRef","displayName","componentId"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,IAAMA,WAA6E,GAAG,SAAhFA,WAA6EA,CAAAC,IAAA,EAejFC,GAAG,EACA;AAAA,EAAA,IAdDC,KAAK,GAAAF,IAAA,CAALE,KAAK;IAAAC,kBAAA,GAAAH,IAAA,CACLI,aAAa;AAAbA,IAAAA,aAAa,GAAAD,kBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,kBAAA;IAAAE,SAAA,GAAAL,IAAA,CACrBM,IAAI;AAAJA,IAAAA,IAAI,GAAAD,SAAA,KAAG,KAAA,CAAA,GAAA,QAAQ,GAAAA,SAAA;IACfE,QAAQ,GAAAP,IAAA,CAARO,QAAQ;IACRC,SAAS,GAAAR,IAAA,CAATQ,SAAS;IACTC,WAAW,GAAAT,IAAA,CAAXS,WAAW;IAAAC,oBAAA,GAAAV,IAAA,CACXW,eAAe;AAAfA,IAAAA,eAAe,GAAAD,oBAAA,KAAG,KAAA,CAAA,GAAA,MAAM,GAAAA,oBAAA;IAAAE,eAAA,GAAAZ,IAAA,CACxBa,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,eAAA;IAClBE,QAAQ,GAAAd,IAAA,CAARc,QAAQ;IACRC,MAAM,GAAAf,IAAA,CAANe,MAAM;IACNC,WAAW,GAAAhB,IAAA,CAAXgB,WAAW;AACRC,IAAAA,IAAI,GAAAC,wBAAA,CAAAlB,IAAA,EAAAmB,SAAA,CAAA,CAAA;EAIT,IAAMC,YAAY,GAAGC,OAAO,CAC1B,YAAA;IAAA,OAAO;AACLC,MAAAA,kBAAkB,EAAE,IAAI;AACxBhB,MAAAA,IAAI,EAAJA,IAAI;AACJO,MAAAA,UAAU,EAAVA,UAAAA;KACD,CAAA;AAAA,GAAC,EACF,CAACP,IAAI,EAAEO,UAAU,CACnB,CAAC,CAAA;AAED,EAAA,IAAAU,UAAA,GAA4DC,SAAS,CAAC,aAAa,CAAC;IAA5EC,OAAO,GAAAF,UAAA,CAAPE,OAAO;IAAEC,UAAU,GAAAH,UAAA,CAAVG,UAAU;IAAEC,WAAW,GAAAJ,UAAA,CAAXI,WAAW;IAAEC,aAAa,GAAAL,UAAA,CAAbK,aAAa,CAAA;AACvD,EAAA,IAAMC,MAAM,GAAGC,KAAK,CAAC,aAAa,CAAC,CAAA;AACnC,EAAA,IAAMC,OAAO,GAAA,EAAA,CAAAC,MAAA,CAAMH,MAAM,EAAQ,QAAA,CAAA,CAAA;AACjC,EAAA,IAAAI,SAAA,GAAkBC,QAAQ,EAAE;IAApBC,KAAK,GAAAF,SAAA,CAALE,KAAK,CAAA;EACb,IAAAC,cAAA,GAA8BC,aAAa,CAAC;MAAEC,WAAW,EAAEH,KAAK,CAACG,WAAAA;AAAY,KAAC,CAAC;IAAvEC,iBAAiB,GAAAH,cAAA,CAAjBG,iBAAiB,CAAA;EACzB,IAAMC,qBAAqB,GAAGpC,aAAa,KAAK,MAAM,IAAImC,iBAAiB,KAAK,SAAS,CAAA;EAEzF,IAAME,kBAAkB,GACtBC,OAAO,CAACnC,QAAQ,CAAC,IAChBI,eAAe,KAAK,SAAS,IAAI+B,OAAO,CAACjC,WAAW,CAAE,IACtDE,eAAe,KAAK,OAAO,IAAI+B,OAAO,CAAClC,SAAS,CAAE,CAAA;EAErD,IAAMmC,cAAc,GAAGC,cAAK,CAACC,QAAQ,CAACC,KAAK,CAAChC,QAAQ,CAAC,CAAA;EAErD,oBACEiC,GAAA,CAACC,kBAAkB,EAAA;AAACC,IAAAA,KAAK,EAAE7B,YAAa;IAAAN,QAAA,eACtCiC,GAAA,CAACG,gBAAgB,EAAAC,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAA;MACflD,GAAG,EAAEmD,iBAAiB,CAAC;AAAEpC,QAAAA,WAAW,EAAXA,WAAW;AAAEf,QAAAA,GAAG,EAAHA,GAAAA;OAAK,CAAA;AAAE,KAAA,EACzCoD,aAAa,CAAC;MAAEC,IAAI,EAAEC,aAAa,CAACC,UAAU;AAAEzC,MAAAA,MAAM,EAANA,MAAAA;KAAQ,CAAC,CACzD0C,EAAAA,cAAc,CAACxC,IAAI,CAAC,CACpByC,EAAAA,sBAAsB,CAACzC,IAAI,CAAC,CAAA,EAAA,EAAA,EAAA;MAAAH,QAAA,eAEhC6C,IAAA,CAACC,OAAO,EAAA;AACNC,QAAAA,OAAO,EAAC,MAAM;AACdC,QAAAA,aAAa,EAAC,QAAQ;AACtBC,QAAAA,KAAK,EAAC,MAAM;AACZ,QAAA,aAAA,EAAahD,MAAO;AACpBiD,QAAAA,IAAI,EAAC,OAAO;QAAAlD,QAAA,EAAA,cAEZ6C,IAAA,CAACC,OAAO,EAAA;AACNC,UAAAA,OAAO,EAAC,MAAM;AACdC,UAAAA,aAAa,EAAEtB,qBAAqB,GAAG,KAAK,GAAG,QAAS;UACxDyB,UAAU,EAAEzB,qBAAqB,IAAIG,cAAc,GAAG,CAAC,GAAG,QAAQ,GAAGuB,SAAU;AAAApD,UAAAA,QAAA,EAE9EZ,CAAAA,KAAK,iBACJ6C,GAAA,CAACoB,SAAS,EAAA;AACRC,YAAAA,EAAE,EAAC,OAAO;AACVC,YAAAA,QAAQ,EAAEjE,aAAc;AACxBkE,YAAAA,EAAE,EAAEvC,OAAQ;AACZwC,YAAAA,OAAO,EAAE9C,OAAQ;AACjBnB,YAAAA,IAAI,EAAEA,IAAK;AAAAQ,YAAAA,QAAA,EAEVZ,KAAAA;AAAK,WACG,CACZ,eAED6C,GAAA,CAACa,OAAO,EAAA;AAACC,YAAAA,OAAO,EAAC,MAAM;AAACC,YAAAA,aAAa,EAAC,QAAQ;AAAAhD,YAAAA,QAAA,EAC3CA,QAAAA;AAAQ,WACF,CAAC,CAAA;AAAA,SACH,CAAC,EAET2B,kBAAkB,iBACjBM,GAAA,CAACa,OAAO,EAAA;AACNY,UAAAA,UAAU,EAAEC,QAAQ,CAClBvE,KAAK,IAAIsC,qBAAqB,GAAGkC,2BAA2B,CAACpE,IAAI,CAAC,GAAG,CACvE,CAAE;UAAAQ,QAAA,eAEFiC,GAAA,CAACa,OAAO,EAAA;AAACC,YAAAA,OAAO,EAAC,MAAM;AAACC,YAAAA,aAAa,EAAC,KAAK;AAACa,YAAAA,cAAc,EAAC,eAAe;YAAA7D,QAAA,eACxEiC,GAAA,CAAC6B,QAAQ,EAAA;cACPC,IAAI,EAAEC,WAAW,CAAC;AAAEnE,gBAAAA,eAAe,EAAfA,eAAe;gBAAEoE,WAAW,EAAErC,OAAO,CAACnC,QAAQ,CAAA;AAAE,eAAC,CAAE;AACvEA,cAAAA,QAAQ,EAAEA,QAAS;AACnBC,cAAAA,SAAS,EAAEA,SAAU;AACrBC,cAAAA,WAAW,EAAEA,WAAY;AACzBiB,cAAAA,UAAU,EAAEA,UAAW;AACvBC,cAAAA,WAAW,EAAEA,WAAY;AACzBC,cAAAA,aAAa,EAAEA,aAAc;AAC7BtB,cAAAA,IAAI,EAAEA,IAAAA;aACP,CAAA;WACM,CAAA;AAAC,SACH,CACV,CAAA;OACM,CAAA;KACO,CAAA,CAAA;AAAC,GACD,CAAC,CAAA;AAEzB,CAAC,CAAA;AAEKkD,IAAAA,UAAU,gBAAGwB,wBAAwB,eAACpC,cAAK,CAACqC,UAAU,CAAClF,WAAW,CAAC,EAAE;AACzEmF,EAAAA,WAAW,EAAE,YAAY;AACzBC,EAAAA,WAAW,EAAE,YAAA;AACf,CAAC;;;;"}

package/build/lib/web/production/components/InputGroup/InputGroupContext.js

@@ -0,0 +1,12 @@
+import React__default from 'react';
+
+var InputGroupContext = /*#__PURE__*/React__default.createContext({
+  isInsideInputGroup: false
+});
+var InputGroupProvider = InputGroupContext.Provider;
+var useInputGroupContext = function useInputGroupContext() {
+  return React__default.useContext(InputGroupContext);
+};
+
+export { InputGroupProvider, useInputGroupContext };
+//# sourceMappingURL=InputGroupContext.js.map

package/build/lib/web/production/components/InputGroup/InputGroupContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputGroupContext.js","sources":["../../../../../../src/components/InputGroup/InputGroupContext.tsx"],"sourcesContent":["import React from 'react';\nimport type { InputGroupContextType } from './types';\n\nconst InputGroupContext = React.createContext<InputGroupContextType>({\n  isInsideInputGroup: false,\n});\nconst InputGroupProvider = InputGroupContext.Provider;\n\nconst useInputGroupContext = (): InputGroupContextType => {\n  return React.useContext(InputGroupContext);\n};\n\nexport { useInputGroupContext, InputGroupProvider };\n"],"names":["InputGroupContext","React","createContext","isInsideInputGroup","InputGroupProvider","Provider","useInputGroupContext","useContext"],"mappings":";;AAGA,IAAMA,iBAAiB,gBAAGC,cAAK,CAACC,aAAa,CAAwB;AACnEC,EAAAA,kBAAkB,EAAE,KAAA;AACtB,CAAC,CAAC,CAAA;AACF,IAAMC,kBAAkB,GAAGJ,iBAAiB,CAACK,SAAQ;AAErD,IAAMC,oBAAoB,GAAG,SAAvBA,oBAAoBA,GAAgC;AACxD,EAAA,OAAOL,cAAK,CAACM,UAAU,CAACP,iBAAiB,CAAC,CAAA;AAC5C;;;;"}

package/build/lib/web/production/components/InputGroup/InputRow.web.js

@@ -0,0 +1,27 @@
+import React__default from 'react';
+import '../../utils/assignWithoutSideEffects/index.js';
+import '../Box/BaseBox/index.js';
+import { jsx } from 'react/jsx-runtime';
+import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
+import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
+
+var _InputRow = function _InputRow(_ref) {
+  var _ref$gridTemplateColu = _ref.gridTemplateColumns,
+    gridTemplateColumns = _ref$gridTemplateColu === void 0 ? '1fr' : _ref$gridTemplateColu,
+    children = _ref.children,
+    testID = _ref.testID;
+  return /*#__PURE__*/jsx(BaseBox, {
+    display: "grid",
+    gridTemplateColumns: gridTemplateColumns,
+    "data-testid": testID,
+    className: "__blade-input-row",
+    children: children
+  });
+};
+var InputRow = /*#__PURE__*/assignWithoutSideEffects( /*#__PURE__*/React__default.forwardRef(_InputRow), {
+  displayName: 'InputRow',
+  componentId: 'InputRow'
+});
+
+export { InputRow, _InputRow };
+//# sourceMappingURL=InputRow.web.js.map

package/build/lib/web/production/components/InputGroup/InputRow.web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputRow.web.js","sources":["../../../../../../src/components/InputGroup/InputRow.web.tsx"],"sourcesContent":["import React from 'react';\nimport type { InputRowProps } from './types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport BaseBox from '~components/Box/BaseBox';\n\nexport const _InputRow = ({\n  gridTemplateColumns = '1fr',\n  children,\n  testID,\n}: InputRowProps): JSX.Element => {\n  return (\n    <BaseBox\n      display=\"grid\"\n      gridTemplateColumns={gridTemplateColumns}\n      data-testid={testID}\n      className=\"__blade-input-row\"\n    >\n      {children}\n    </BaseBox>\n  );\n};\n\nconst InputRow = assignWithoutSideEffects(React.forwardRef(_InputRow), {\n  displayName: 'InputRow',\n  componentId: 'InputRow',\n});\nexport { InputRow };\n"],"names":["_InputRow","_ref","_ref$gridTemplateColu","gridTemplateColumns","children","testID","_jsx","BaseBox","display","className","InputRow","assignWithoutSideEffects","React","forwardRef","displayName","componentId"],"mappings":";;;;;;;IAKaA,SAAS,GAAG,SAAZA,SAASA,CAAAC,IAAA,EAIY;AAAA,EAAA,IAAAC,qBAAA,GAAAD,IAAA,CAHhCE,mBAAmB;AAAnBA,IAAAA,mBAAmB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,qBAAA;IAC3BE,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,MAAM,GAAAJ,IAAA,CAANI,MAAM,CAAA;EAEN,oBACEC,GAAA,CAACC,OAAO,EAAA;AACNC,IAAAA,OAAO,EAAC,MAAM;AACdL,IAAAA,mBAAmB,EAAEA,mBAAoB;AACzC,IAAA,aAAA,EAAaE,MAAO;AACpBI,IAAAA,SAAS,EAAC,mBAAmB;AAAAL,IAAAA,QAAA,EAE5BA,QAAAA;AAAQ,GACF,CAAC,CAAA;AAEd,EAAC;AAEKM,IAAAA,QAAQ,gBAAGC,wBAAwB,eAACC,cAAK,CAACC,UAAU,CAACb,SAAS,CAAC,EAAE;AACrEc,EAAAA,WAAW,EAAE,UAAU;AACvBC,EAAAA,WAAW,EAAE,UAAA;AACf,CAAC;;;;"}

package/build/lib/web/production/components/InputGroup/StyledInputGroup.js

@@ -0,0 +1,17 @@
+import styled from 'styled-components';
+import '../Box/BaseBox/index.js';
+import '../../utils/index.js';
+import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
+import { makeBorderSize } from '../../utils/makeBorderSize/makeBorderSize.js';
+
+var StyledInputGroup = /*#__PURE__*/styled(BaseBox).withConfig({
+  displayName: "StyledInputGroup",
+  componentId: "sc-11o2n6c-0"
+})(["", ""], function (_ref) {
+  var theme = _ref.theme;
+  var radius = makeBorderSize(theme.border.radius.medium);
+  return "\n      /* Reset all inputs and their focus ring wrappers */\n      & .__blade-input-row .__blade-base-input-wrapper,\n      & .__blade-input-row .focus-ring-wrapper {\n        border-radius: 0;\n      }\n\n      /* Multi-row: First row, first column */\n      & .__blade-input-row:first-child > div:first-child .__blade-base-input-wrapper,\n      & .__blade-input-row:first-child > div:first-child .focus-ring-wrapper {\n        border-top-left-radius: ".concat(radius, ";\n      }\n\n      /* Multi-row: First row, last column */\n      & .__blade-input-row:first-child > div:last-child .__blade-base-input-wrapper,\n      & .__blade-input-row:first-child > div:last-child .focus-ring-wrapper {\n        border-top-right-radius: ").concat(radius, ";\n      }\n\n      /* Multi-row: Last row, first column */\n      & .__blade-input-row:last-child > div:first-child .__blade-base-input-wrapper,\n      & .__blade-input-row:last-child > div:first-child .focus-ring-wrapper {\n        border-bottom-left-radius: ").concat(radius, ";\n      }\n\n      /* Multi-row: Last row, last column */\n      & .__blade-input-row:last-child > div:last-child .__blade-base-input-wrapper,\n      & .__blade-input-row:last-child > div:last-child .focus-ring-wrapper {\n        border-bottom-right-radius: ").concat(radius, ";\n      }\n\n      /* Multi-row: First row with only one column */\n      & .__blade-input-row:first-child > div:only-child .__blade-base-input-wrapper,\n      & .__blade-input-row:first-child > div:only-child .focus-ring-wrapper {\n        border-top-left-radius: ").concat(radius, ";\n        border-top-right-radius: ").concat(radius, ";\n      }\n\n      /* Multi-row: Last row with only one column */\n      & .__blade-input-row:last-child > div:only-child .__blade-base-input-wrapper,\n      & .__blade-input-row:last-child > div:only-child .focus-ring-wrapper {\n        border-bottom-left-radius: ").concat(radius, ";\n        border-bottom-right-radius: ").concat(radius, ";\n      }\n\n      /* Single row: Single column */\n      & .__blade-input-row:only-child > div:only-child .__blade-base-input-wrapper,\n      & .__blade-input-row:only-child > div:only-child .focus-ring-wrapper {\n        border-radius: ").concat(radius, ";\n      }\n\n      /* Single row: First column */\n      & .__blade-input-row:only-child > div:first-child:not(:only-child) .__blade-base-input-wrapper,\n      & .__blade-input-row:only-child > div:first-child:not(:only-child) .focus-ring-wrapper {\n        border-top-left-radius: ").concat(radius, ";\n        border-bottom-left-radius: ").concat(radius, ";\n      }\n\n      /* Single row: Last column */\n      & .__blade-input-row:only-child > div:last-child:not(:only-child) .__blade-base-input-wrapper,\n      & .__blade-input-row:only-child > div:last-child:not(:only-child) .focus-ring-wrapper {\n        border-top-right-radius: ").concat(radius, ";\n        border-bottom-right-radius: ").concat(radius, ";\n      }\n\n      /* Single row: Middle columns */\n      & .__blade-input-row:only-child > div:not(:first-child):not(:last-child) .__blade-base-input-wrapper,\n      & .__blade-input-row:only-child > div:not(:first-child):not(:last-child) .focus-ring-wrapper {\n        border-radius: 0;\n      }\n    ");
+});
+
+export { StyledInputGroup };
+//# sourceMappingURL=StyledInputGroup.js.map

package/build/lib/web/production/components/InputGroup/StyledInputGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StyledInputGroup.js","sources":["../../../../../../src/components/InputGroup/StyledInputGroup.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport BaseBox from '~components/Box/BaseBox';\nimport { makeBorderSize } from '~utils';\n\nconst StyledInputGroup = styled(BaseBox)`\n  ${({ theme }) => {\n    const radius = makeBorderSize(theme.border.radius.medium);\n    return `\n      /* Reset all inputs and their focus ring wrappers */\n      & .__blade-input-row .__blade-base-input-wrapper,\n      & .__blade-input-row .focus-ring-wrapper {\n        border-radius: 0;\n      }\n\n      /* Multi-row: First row, first column */\n      & .__blade-input-row:first-child > div:first-child .__blade-base-input-wrapper,\n      & .__blade-input-row:first-child > div:first-child .focus-ring-wrapper {\n        border-top-left-radius: ${radius};\n      }\n\n      /* Multi-row: First row, last column */\n      & .__blade-input-row:first-child > div:last-child .__blade-base-input-wrapper,\n      & .__blade-input-row:first-child > div:last-child .focus-ring-wrapper {\n        border-top-right-radius: ${radius};\n      }\n\n      /* Multi-row: Last row, first column */\n      & .__blade-input-row:last-child > div:first-child .__blade-base-input-wrapper,\n      & .__blade-input-row:last-child > div:first-child .focus-ring-wrapper {\n        border-bottom-left-radius: ${radius};\n      }\n\n      /* Multi-row: Last row, last column */\n      & .__blade-input-row:last-child > div:last-child .__blade-base-input-wrapper,\n      & .__blade-input-row:last-child > div:last-child .focus-ring-wrapper {\n        border-bottom-right-radius: ${radius};\n      }\n\n      /* Multi-row: First row with only one column */\n      & .__blade-input-row:first-child > div:only-child .__blade-base-input-wrapper,\n      & .__blade-input-row:first-child > div:only-child .focus-ring-wrapper {\n        border-top-left-radius: ${radius};\n        border-top-right-radius: ${radius};\n      }\n\n      /* Multi-row: Last row with only one column */\n      & .__blade-input-row:last-child > div:only-child .__blade-base-input-wrapper,\n      & .__blade-input-row:last-child > div:only-child .focus-ring-wrapper {\n        border-bottom-left-radius: ${radius};\n        border-bottom-right-radius: ${radius};\n      }\n\n      /* Single row: Single column */\n      & .__blade-input-row:only-child > div:only-child .__blade-base-input-wrapper,\n      & .__blade-input-row:only-child > div:only-child .focus-ring-wrapper {\n        border-radius: ${radius};\n      }\n\n      /* Single row: First column */\n      & .__blade-input-row:only-child > div:first-child:not(:only-child) .__blade-base-input-wrapper,\n      & .__blade-input-row:only-child > div:first-child:not(:only-child) .focus-ring-wrapper {\n        border-top-left-radius: ${radius};\n        border-bottom-left-radius: ${radius};\n      }\n\n      /* Single row: Last column */\n      & .__blade-input-row:only-child > div:last-child:not(:only-child) .__blade-base-input-wrapper,\n      & .__blade-input-row:only-child > div:last-child:not(:only-child) .focus-ring-wrapper {\n        border-top-right-radius: ${radius};\n        border-bottom-right-radius: ${radius};\n      }\n\n      /* Single row: Middle columns */\n      & .__blade-input-row:only-child > div:not(:first-child):not(:last-child) .__blade-base-input-wrapper,\n      & .__blade-input-row:only-child > div:not(:first-child):not(:last-child) .focus-ring-wrapper {\n        border-radius: 0;\n      }\n    `;\n  }}\n`;\n\nexport { StyledInputGroup };\n"],"names":["StyledInputGroup","styled","BaseBox","withConfig","displayName","componentId","_ref","theme","radius","makeBorderSize","border","medium","concat"],"mappings":";;;;;;AAIA,IAAMA,gBAAgB,gBAAGC,MAAM,CAACC,OAAO,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,kBAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CACpC,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA,EAAA,UAAAC,IAAA,EAAe;AAAA,EAAA,IAAZC,KAAK,GAAAD,IAAA,CAALC,KAAK,CAAA;EACR,IAAMC,MAAM,GAAGC,cAAc,CAACF,KAAK,CAACG,MAAM,CAACF,MAAM,CAACG,MAAM,CAAC,CAAA;EACzD,OAAAC,wcAAAA,CAAAA,MAAA,CAU8BJ,MAAM,EAAA,qQAAA,CAAA,CAAAI,MAAA,CAMLJ,MAAM,EAAAI,uQAAAA,CAAAA,CAAAA,MAAA,CAMJJ,MAAM,yQAAAI,MAAA,CAMLJ,MAAM,EAAA,4QAAA,CAAA,CAAAI,MAAA,CAMVJ,MAAM,EAAAI,sCAAAA,CAAAA,CAAAA,MAAA,CACLJ,MAAM,EAAAI,4QAAAA,CAAAA,CAAAA,MAAA,CAMJJ,MAAM,EAAA,yCAAA,CAAA,CAAAI,MAAA,CACLJ,MAAM,qPAAAI,MAAA,CAMnBJ,MAAM,EAAA,6RAAA,CAAA,CAAAI,MAAA,CAMGJ,MAAM,EAAAI,wCAAAA,CAAAA,CAAAA,MAAA,CACHJ,MAAM,EAAAI,2RAAAA,CAAAA,CAAAA,MAAA,CAMRJ,MAAM,EAAA,yCAAA,CAAA,CAAAI,MAAA,CACHJ,MAAM,EAAA,mTAAA,CAAA,CAAA;AAS1C,CAAC;;;;"}

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

@@ -0,0 +1,3 @@
+export { InputGroup } from './InputGroup.web.js';
+export { InputRow } from './InputRow.web.js';
+//# sourceMappingURL=index.js.map

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

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

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

@@ -10,7 +10,6 @@ export { ModalBody } from './ModalBody.web.js';
 import { ModalContext } from './ModalContext.js';
 import { ModalBackdrop } from './ModalBackdrop.js';
 import { modalMargin, modalMaxWidth, modalMinWidth, modalMaxHeight, modalResponsiveScreenGap, modalBorderRadius } from './modalTokens.js';
-import { componentIds } from './constants.js';
 import '../../utils/index.js';
 import '../Box/BaseBox/index.js';
 import '../BladeProvider/index.js';
@@ -19,7 +18,6 @@ import '../../utils/metaAttribute/index.js';
 import '../../utils/makeAccessible/index.js';
 import '../../utils/logger/index.js';
 import { componentZIndices } from '../../utils/componentZIndices.js';
-import '../../utils/useVerifyAllowedChildren/index.js';
 import '../../utils/makeAnalyticsAttribute/index.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
@@ -28,7 +26,6 @@ import { makeMotionTime } from '../../utils/makeMotionTime/makeMotionTime.web.js
 import { makeSize } from '../../utils/makeSize/makeSize.js';
 import useTheme from '../BladeProvider/useTheme.js';
 import { logger } from '../../utils/logger/logger.js';
-import { useVerifyAllowedChildren } from '../../utils/useVerifyAllowedChildren/useVerifyAllowedChildren.js';
 import { Box } from '../Box/Box.js';
 import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.web.js';
@@ -105,13 +102,6 @@ var Modal = function Modal(_ref2) {
       onDismiss();
     }
   };
-
-  // Only allow ModalHeader, ModalBody and ModalFooter as children
-  useVerifyAllowedChildren({
-    allowedComponents: [componentIds.ModalHeader, componentIds.ModalBody, componentIds.ModalFooter],
-    children: children,
-    componentName: 'Modal'
-  });
   return /*#__PURE__*/jsx(FloatingPortal, {
     children: /*#__PURE__*/jsx(ModalContext.Provider, {
       value: modalContext,

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.web.js","sources":["../../../../../../src/components/Modal/Modal.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useEffect } from 'react';\nimport styled, { css } from 'styled-components';\nimport { FloatingFocusManager, FloatingPortal, useFloating } from '@floating-ui/react';\nimport usePresence from 'use-presence';\nimport { ModalHeader } from './ModalHeader';\nimport type { ModalHeaderProps } from './ModalHeader';\nimport { ModalFooter } from './ModalFooter';\nimport type { ModalFooterProps } from './ModalFooter';\nimport { ModalBody } from './ModalBody';\nimport type { ModalBodyProps } from './ModalBody';\nimport { ModalContext } from './ModalContext';\nimport { ModalBackdrop } from './ModalBackdrop';\nimport {\n  modalBorderRadius,\n  modalMaxHeight,\n  modalMaxWidth,\n  modalMinWidth,\n  modalResponsiveScreenGap,\n  modalMargin,\n} from './modalTokens';\nimport type { ModalProps } from './types';\nimport { componentIds } from './constants';\nimport { castWebType, makeMotionTime, makeSize } from '~utils';\nimport { BaseBox } from '~components/Box/BaseBox';\nimport { useTheme } from '~components/BladeProvider';\nimport { Box } from '~components/Box';\nimport { MetaConstants, metaAttribute } from '~utils/metaAttribute';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { logger } from '~utils/logger';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst ModalContent = styled(BaseBox)<{ isVisible: boolean; size: NonNullable<ModalProps['size']> }>(\n  ({ isVisible, theme, size }) => {\n    const scale = isVisible ? 1 : 0.9;\n    const transform = size !== 'full' ? `translate(-50%, -50%) scale(${scale})` : ``;\n\n    return css`\n      box-shadow: ${theme.elevation.highRaised};\n      opacity: ${isVisible ? 1 : 0};\n      position: fixed;\n      transform: ${transform};\n      transition-property: opacity, transform;\n      transition-duration: ${castWebType(makeMotionTime(theme.motion.duration.moderate))};\n      transition-timing-function: ${isVisible\n        ? castWebType(theme.motion.easing.entrance)\n        : castWebType(theme.motion.easing.exit)};\n\n      ${size === 'full' &&\n      css`\n        top: ${makeSize(modalMargin[size])};\n        left: ${makeSize(modalMargin[size])};\n        right: ${makeSize(modalMargin[size])};\n        bottom: ${makeSize(modalMargin[size])};\n      `}\n    `;\n  },\n);\n\nconst Modal = ({\n  isOpen = false,\n  children,\n  onDismiss,\n  initialFocusRef,\n  size = 'small',\n  accessibilityLabel,\n  zIndex = componentZIndices.modal,\n  ...rest\n}: ModalProps): React.ReactElement => {\n  const { theme, platform } = useTheme();\n  const { isMounted, isVisible } = usePresence(isOpen, {\n    transitionDuration: theme.motion.duration.moderate,\n    initialEnter: true,\n  });\n\n  // Warn consumer if modal is opened on mobile\n  useEffect(() => {\n    if (__DEV__) {\n      if (platform === 'onMobile') {\n        logger({\n          message: 'Modal is not supported on mobile devices. Please use BottomSheet instead.',\n          moduleName: 'Modal',\n          type: 'warn',\n        });\n      }\n    }\n  }, [platform]);\n\n  // required by floating ui to handle focus\n  const { refs, context } = useFloating({\n    open: isMounted,\n  });\n\n  const defaultInitialFocusRef = React.useRef<any>(null);\n\n  const modalContext = React.useMemo(\n    () => ({\n      isOpen,\n      close: onDismiss,\n      defaultInitialFocusRef,\n      isVisible,\n    }),\n    [isOpen, onDismiss, defaultInitialFocusRef, isVisible],\n  );\n  const handleKeyDown = (event: React.KeyboardEvent): void => {\n    // close modal on escape key press\n    if (event?.key === 'Escape' || event?.code === 'Escape') {\n      onDismiss();\n    }\n  };\n\n  // Only allow ModalHeader, ModalBody and ModalFooter as children\n  useVerifyAllowedChildren({\n    allowedComponents: [componentIds.ModalHeader, componentIds.ModalBody, componentIds.ModalFooter],\n    children,\n    componentName: 'Modal',\n  });\n\n  return (\n    <FloatingPortal>\n      <ModalContext.Provider value={modalContext}>\n        {isMounted ? (\n          <FloatingFocusManager\n            returnFocus\n            initialFocus={initialFocusRef ?? defaultInitialFocusRef}\n            context={context}\n            modal={true}\n          >\n            <Box\n              zIndex={zIndex}\n              position=\"fixed\"\n              testID=\"modal-wrapper\"\n              {...makeAnalyticsAttribute(rest)}\n            >\n              <ModalBackdrop />\n              <ModalContent\n                {...metaAttribute({\n                  name: MetaConstants.Modal,\n                })}\n                {...makeAccessible({\n                  role: 'dialog',\n                  modal: true,\n                  label: accessibilityLabel,\n                })}\n                maxWidth={size === 'full' ? '100%' : makeSize(modalMaxWidth[size])}\n                minWidth={makeSize(modalMinWidth)}\n                maxHeight={modalMaxHeight[size]}\n                width={\n                  size === 'full'\n                    ? `calc(100vw - ${makeSize(modalMargin[size] * 2)})`\n                    : `calc(100vw - ${makeSize(modalResponsiveScreenGap)})`\n                }\n                borderRadius={modalBorderRadius}\n                backgroundColor=\"popup.background.subtle\"\n                display=\"flex\"\n                flexDirection=\"column\"\n                top=\"50%\"\n                left=\"50%\"\n                onKeyDown={handleKeyDown}\n                isVisible={isVisible}\n                size={size}\n                ref={refs.setFloating}\n                overflow=\"hidden\"\n              >\n                {children}\n              </ModalContent>\n            </Box>\n          </FloatingFocusManager>\n        ) : null}\n      </ModalContext.Provider>\n    </FloatingPortal>\n  );\n};\n\nexport { Modal, ModalHeader, ModalFooter, ModalBody };\nexport type { ModalProps, ModalHeaderProps, ModalFooterProps, ModalBodyProps };\n"],"names":["ModalContent","styled","BaseBox","withConfig","displayName","componentId","_ref","isVisible","theme","size","scale","transform","concat","css","elevation","highRaised","castWebType","makeMotionTime","motion","duration","moderate","easing","entrance","exit","makeSize","modalMargin","Modal","_ref2","_ref2$isOpen","isOpen","children","onDismiss","initialFocusRef","_ref2$size","accessibilityLabel","_ref2$zIndex","zIndex","componentZIndices","modal","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","platform","_usePresence","usePresence","transitionDuration","initialEnter","isMounted","useEffect","logger","message","moduleName","type","_useFloating","useFloating","open","refs","context","defaultInitialFocusRef","React","useRef","modalContext","useMemo","close","handleKeyDown","event","key","code","useVerifyAllowedChildren","allowedComponents","componentIds","ModalHeader","ModalBody","ModalFooter","componentName","_jsx","FloatingPortal","ModalContext","Provider","value","FloatingFocusManager","returnFocus","initialFocus","_jsxs","Box","_objectSpread","position","testID","makeAnalyticsAttribute","ModalBackdrop","metaAttribute","name","MetaConstants","makeAccessible","role","label","maxWidth","modalMaxWidth","minWidth","modalMinWidth","maxHeight","modalMaxHeight","width","modalResponsiveScreenGap","borderRadius","modalBorderRadius","backgroundColor","display","flexDirection","top","left","onKeyDown","ref","setFloating","overflow"],"mappings":"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"}
+{"version":3,"file":"Modal.web.js","sources":["../../../../../../src/components/Modal/Modal.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useEffect } from 'react';\nimport styled, { css } from 'styled-components';\nimport { FloatingFocusManager, FloatingPortal, useFloating } from '@floating-ui/react';\nimport usePresence from 'use-presence';\nimport { ModalHeader } from './ModalHeader';\nimport type { ModalHeaderProps } from './ModalHeader';\nimport { ModalFooter } from './ModalFooter';\nimport type { ModalFooterProps } from './ModalFooter';\nimport { ModalBody } from './ModalBody';\nimport type { ModalBodyProps } from './ModalBody';\nimport { ModalContext } from './ModalContext';\nimport { ModalBackdrop } from './ModalBackdrop';\nimport {\n  modalBorderRadius,\n  modalMaxHeight,\n  modalMaxWidth,\n  modalMinWidth,\n  modalResponsiveScreenGap,\n  modalMargin,\n} from './modalTokens';\nimport type { ModalProps } from './types';\nimport { castWebType, makeMotionTime, makeSize } from '~utils';\nimport { BaseBox } from '~components/Box/BaseBox';\nimport { useTheme } from '~components/BladeProvider';\nimport { Box } from '~components/Box';\nimport { MetaConstants, metaAttribute } from '~utils/metaAttribute';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { logger } from '~utils/logger';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst ModalContent = styled(BaseBox)<{ isVisible: boolean; size: NonNullable<ModalProps['size']> }>(\n  ({ isVisible, theme, size }) => {\n    const scale = isVisible ? 1 : 0.9;\n    const transform = size !== 'full' ? `translate(-50%, -50%) scale(${scale})` : ``;\n\n    return css`\n      box-shadow: ${theme.elevation.highRaised};\n      opacity: ${isVisible ? 1 : 0};\n      position: fixed;\n      transform: ${transform};\n      transition-property: opacity, transform;\n      transition-duration: ${castWebType(makeMotionTime(theme.motion.duration.moderate))};\n      transition-timing-function: ${isVisible\n        ? castWebType(theme.motion.easing.entrance)\n        : castWebType(theme.motion.easing.exit)};\n\n      ${size === 'full' &&\n      css`\n        top: ${makeSize(modalMargin[size])};\n        left: ${makeSize(modalMargin[size])};\n        right: ${makeSize(modalMargin[size])};\n        bottom: ${makeSize(modalMargin[size])};\n      `}\n    `;\n  },\n);\n\nconst Modal = ({\n  isOpen = false,\n  children,\n  onDismiss,\n  initialFocusRef,\n  size = 'small',\n  accessibilityLabel,\n  zIndex = componentZIndices.modal,\n  ...rest\n}: ModalProps): React.ReactElement => {\n  const { theme, platform } = useTheme();\n  const { isMounted, isVisible } = usePresence(isOpen, {\n    transitionDuration: theme.motion.duration.moderate,\n    initialEnter: true,\n  });\n\n  // Warn consumer if modal is opened on mobile\n  useEffect(() => {\n    if (__DEV__) {\n      if (platform === 'onMobile') {\n        logger({\n          message: 'Modal is not supported on mobile devices. Please use BottomSheet instead.',\n          moduleName: 'Modal',\n          type: 'warn',\n        });\n      }\n    }\n  }, [platform]);\n\n  // required by floating ui to handle focus\n  const { refs, context } = useFloating({\n    open: isMounted,\n  });\n\n  const defaultInitialFocusRef = React.useRef<any>(null);\n\n  const modalContext = React.useMemo(\n    () => ({\n      isOpen,\n      close: onDismiss,\n      defaultInitialFocusRef,\n      isVisible,\n    }),\n    [isOpen, onDismiss, defaultInitialFocusRef, isVisible],\n  );\n  const handleKeyDown = (event: React.KeyboardEvent): void => {\n    // close modal on escape key press\n    if (event?.key === 'Escape' || event?.code === 'Escape') {\n      onDismiss();\n    }\n  };\n\n  return (\n    <FloatingPortal>\n      <ModalContext.Provider value={modalContext}>\n        {isMounted ? (\n          <FloatingFocusManager\n            returnFocus\n            initialFocus={initialFocusRef ?? defaultInitialFocusRef}\n            context={context}\n            modal={true}\n          >\n            <Box\n              zIndex={zIndex}\n              position=\"fixed\"\n              testID=\"modal-wrapper\"\n              {...makeAnalyticsAttribute(rest)}\n            >\n              <ModalBackdrop />\n              <ModalContent\n                {...metaAttribute({\n                  name: MetaConstants.Modal,\n                })}\n                {...makeAccessible({\n                  role: 'dialog',\n                  modal: true,\n                  label: accessibilityLabel,\n                })}\n                maxWidth={size === 'full' ? '100%' : makeSize(modalMaxWidth[size])}\n                minWidth={makeSize(modalMinWidth)}\n                maxHeight={modalMaxHeight[size]}\n                width={\n                  size === 'full'\n                    ? `calc(100vw - ${makeSize(modalMargin[size] * 2)})`\n                    : `calc(100vw - ${makeSize(modalResponsiveScreenGap)})`\n                }\n                borderRadius={modalBorderRadius}\n                backgroundColor=\"popup.background.subtle\"\n                display=\"flex\"\n                flexDirection=\"column\"\n                top=\"50%\"\n                left=\"50%\"\n                onKeyDown={handleKeyDown}\n                isVisible={isVisible}\n                size={size}\n                ref={refs.setFloating}\n                overflow=\"hidden\"\n              >\n                {children}\n              </ModalContent>\n            </Box>\n          </FloatingFocusManager>\n        ) : null}\n      </ModalContext.Provider>\n    </FloatingPortal>\n  );\n};\n\nexport { Modal, ModalHeader, ModalFooter, ModalBody };\nexport type { ModalProps, ModalHeaderProps, ModalFooterProps, ModalBodyProps };\n"],"names":["ModalContent","styled","BaseBox","withConfig","displayName","componentId","_ref","isVisible","theme","size","scale","transform","concat","css","elevation","highRaised","castWebType","makeMotionTime","motion","duration","moderate","easing","entrance","exit","makeSize","modalMargin","Modal","_ref2","_ref2$isOpen","isOpen","children","onDismiss","initialFocusRef","_ref2$size","accessibilityLabel","_ref2$zIndex","zIndex","componentZIndices","modal","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","platform","_usePresence","usePresence","transitionDuration","initialEnter","isMounted","useEffect","logger","message","moduleName","type","_useFloating","useFloating","open","refs","context","defaultInitialFocusRef","React","useRef","modalContext","useMemo","close","handleKeyDown","event","key","code","_jsx","FloatingPortal","ModalContext","Provider","value","FloatingFocusManager","returnFocus","initialFocus","_jsxs","Box","_objectSpread","position","testID","makeAnalyticsAttribute","ModalBackdrop","metaAttribute","name","MetaConstants","makeAccessible","role","label","maxWidth","modalMaxWidth","minWidth","modalMinWidth","maxHeight","modalMaxHeight","width","modalResponsiveScreenGap","borderRadius","modalBorderRadius","backgroundColor","display","flexDirection","top","left","onKeyDown","ref","setFloating","overflow"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCA,IAAMA,YAAY,gBAAGC,MAAM,CAACC,OAAO,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,wBAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAClC,CAAA,CAAA,UAAAC,IAAA,EAAgC;AAAA,EAAA,IAA7BC,SAAS,GAAAD,IAAA,CAATC,SAAS;IAAEC,KAAK,GAAAF,IAAA,CAALE,KAAK;IAAEC,IAAI,GAAAH,IAAA,CAAJG,IAAI,CAAA;AACvB,EAAA,IAAMC,KAAK,GAAGH,SAAS,GAAG,CAAC,GAAG,GAAG,CAAA;EACjC,IAAMI,SAAS,GAAGF,IAAI,KAAK,MAAM,GAAAG,8BAAAA,CAAAA,MAAA,CAAkCF,KAAK,EAAQ,GAAA,CAAA,GAAA,EAAA,CAAA;AAEhF,EAAA,OAAOG,GAAG,CACML,CAAAA,aAAAA,EAAAA,WAAAA,EAAAA,4BAAAA,EAAAA,6DAAAA,EAAAA,8BAAAA,EAAAA,GAAAA,EAAAA,EAAAA,CAAAA,EAAAA,KAAK,CAACM,SAAS,CAACC,UAAU,EAC7BR,SAAS,GAAG,CAAC,GAAG,CAAC,EAEfI,SAAS,EAECK,WAAW,CAACC,cAAc,CAACT,KAAK,CAACU,MAAM,CAACC,QAAQ,CAACC,QAAQ,CAAC,CAAC,EACpDb,SAAS,GACnCS,WAAW,CAACR,KAAK,CAACU,MAAM,CAACG,MAAM,CAACC,QAAQ,CAAC,GACzCN,WAAW,CAACR,KAAK,CAACU,MAAM,CAACG,MAAM,CAACE,IAAI,CAAC,EAEvCd,IAAI,KAAK,MAAM,IACjBI,GAAG,CAAA,CAAA,MAAA,EAAA,QAAA,EAAA,SAAA,EAAA,UAAA,EAAA,GAAA,CAAA,EACMW,QAAQ,CAACC,WAAW,CAAChB,IAAI,CAAC,CAAC,EAC1Be,QAAQ,CAACC,WAAW,CAAChB,IAAI,CAAC,CAAC,EAC1Be,QAAQ,CAACC,WAAW,CAAChB,IAAI,CAAC,CAAC,EAC1Be,QAAQ,CAACC,WAAW,CAAChB,IAAI,CAAC,CAAC,CACtC,CAAA,CAAA;AAEL,CAAC,CACF,CAAA;AAED,IAAMiB,KAAK,GAAG,SAARA,KAAKA,CAAAC,KAAA,EAS2B;AAAA,EAAA,IAAAC,YAAA,GAAAD,KAAA,CARpCE,MAAM;AAANA,IAAAA,MAAM,GAAAD,YAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,YAAA;IACdE,QAAQ,GAAAH,KAAA,CAARG,QAAQ;IACRC,SAAS,GAAAJ,KAAA,CAATI,SAAS;IACTC,eAAe,GAAAL,KAAA,CAAfK,eAAe;IAAAC,UAAA,GAAAN,KAAA,CACflB,IAAI;AAAJA,IAAAA,IAAI,GAAAwB,UAAA,KAAG,KAAA,CAAA,GAAA,OAAO,GAAAA,UAAA;IACdC,kBAAkB,GAAAP,KAAA,CAAlBO,kBAAkB;IAAAC,YAAA,GAAAR,KAAA,CAClBS,MAAM;AAANA,IAAAA,MAAM,GAAAD,YAAA,KAAA,KAAA,CAAA,GAAGE,iBAAiB,CAACC,KAAK,GAAAH,YAAA;AAC7BI,IAAAA,IAAI,GAAAC,wBAAA,CAAAb,KAAA,EAAAc,SAAA,CAAA,CAAA;AAEP,EAAA,IAAAC,SAAA,GAA4BC,QAAQ,EAAE;IAA9BnC,KAAK,GAAAkC,SAAA,CAALlC,KAAK;IAAEoC,QAAQ,GAAAF,SAAA,CAARE,QAAQ,CAAA;AACvB,EAAA,IAAAC,YAAA,GAAiCC,WAAW,CAACjB,MAAM,EAAE;AACnDkB,MAAAA,kBAAkB,EAAEvC,KAAK,CAACU,MAAM,CAACC,QAAQ,CAACC,QAAQ;AAClD4B,MAAAA,YAAY,EAAE,IAAA;AAChB,KAAC,CAAC;IAHMC,SAAS,GAAAJ,YAAA,CAATI,SAAS;IAAE1C,SAAS,GAAAsC,YAAA,CAATtC,SAAS,CAAA;;AAK5B;AACA2C,EAAAA,SAAS,CAAC,YAAM;AACd,IAAA,IAAI,KAAO,EAAE;MACX,IAAIN,QAAQ,KAAK,UAAU,EAAE;AAC3BO,QAAAA,MAAM,CAAC;AACLC,UAAAA,OAAO,EAAE,2EAA2E;AACpFC,UAAAA,UAAU,EAAE,OAAO;AACnBC,UAAAA,IAAI,EAAE,MAAA;AACR,SAAC,CAAC,CAAA;AACJ,OAAA;AACF,KAAA;AACF,GAAC,EAAE,CAACV,QAAQ,CAAC,CAAC,CAAA;;AAEd;EACA,IAAAW,YAAA,GAA0BC,WAAW,CAAC;AACpCC,MAAAA,IAAI,EAAER,SAAAA;AACR,KAAC,CAAC;IAFMS,IAAI,GAAAH,YAAA,CAAJG,IAAI;IAAEC,OAAO,GAAAJ,YAAA,CAAPI,OAAO,CAAA;AAIrB,EAAA,IAAMC,sBAAsB,GAAGC,cAAK,CAACC,MAAM,CAAM,IAAI,CAAC,CAAA;AAEtD,EAAA,IAAMC,YAAY,GAAGF,cAAK,CAACG,OAAO,CAChC,YAAA;IAAA,OAAO;AACLnC,MAAAA,MAAM,EAANA,MAAM;AACNoC,MAAAA,KAAK,EAAElC,SAAS;AAChB6B,MAAAA,sBAAsB,EAAtBA,sBAAsB;AACtBrD,MAAAA,SAAS,EAATA,SAAAA;KACD,CAAA;GAAC,EACF,CAACsB,MAAM,EAAEE,SAAS,EAAE6B,sBAAsB,EAAErD,SAAS,CACvD,CAAC,CAAA;AACD,EAAA,IAAM2D,aAAa,GAAG,SAAhBA,aAAaA,CAAIC,KAA0B,EAAW;AAC1D;IACA,IAAI,CAAAA,KAAK,KAALA,IAAAA,IAAAA,KAAK,uBAALA,KAAK,CAAEC,GAAG,MAAK,QAAQ,IAAI,CAAAD,KAAK,aAALA,KAAK,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAALA,KAAK,CAAEE,IAAI,MAAK,QAAQ,EAAE;AACvDtC,MAAAA,SAAS,EAAE,CAAA;AACb,KAAA;GACD,CAAA;EAED,oBACEuC,GAAA,CAACC,cAAc,EAAA;AAAAzC,IAAAA,QAAA,eACbwC,GAAA,CAACE,YAAY,CAACC,QAAQ,EAAA;AAACC,MAAAA,KAAK,EAAEX,YAAa;AAAAjC,MAAAA,QAAA,EACxCmB,SAAS,gBACRqB,GAAA,CAACK,oBAAoB,EAAA;QACnBC,WAAW,EAAA,IAAA;AACXC,QAAAA,YAAY,EAAE7C,eAAe,KAAA,IAAA,IAAfA,eAAe,KAAfA,KAAAA,CAAAA,GAAAA,eAAe,GAAI4B,sBAAuB;AACxDD,QAAAA,OAAO,EAAEA,OAAQ;AACjBrB,QAAAA,KAAK,EAAE,IAAK;AAAAR,QAAAA,QAAA,eAEZgD,IAAA,CAACC,GAAG,EAAAC,aAAA,CAAAA,aAAA,CAAA;AACF5C,UAAAA,MAAM,EAAEA,MAAO;AACf6C,UAAAA,QAAQ,EAAC,OAAO;AAChBC,UAAAA,MAAM,EAAC,eAAA;SACHC,EAAAA,sBAAsB,CAAC5C,IAAI,CAAC,CAAA,EAAA,EAAA,EAAA;AAAAT,UAAAA,QAAA,gBAEhCwC,GAAA,CAACc,aAAa,EAAE,EAAA,CAAC,eACjBd,GAAA,CAACtE,YAAY,EAAAgF,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAA,EAAA,EACPK,aAAa,CAAC;YAChBC,IAAI,EAAEC,aAAa,CAAC7D,KAAAA;WACrB,CAAC,CACE8D,EAAAA,cAAc,CAAC;AACjBC,YAAAA,IAAI,EAAE,QAAQ;AACdnD,YAAAA,KAAK,EAAE,IAAI;AACXoD,YAAAA,KAAK,EAAExD,kBAAAA;AACT,WAAC,CAAC,CAAA,EAAA,EAAA,EAAA;AACFyD,YAAAA,QAAQ,EAAElF,IAAI,KAAK,MAAM,GAAG,MAAM,GAAGe,QAAQ,CAACoE,aAAa,CAACnF,IAAI,CAAC,CAAE;AACnEoF,YAAAA,QAAQ,EAAErE,QAAQ,CAACsE,aAAa,CAAE;AAClCC,YAAAA,SAAS,EAAEC,cAAc,CAACvF,IAAI,CAAE;YAChCwF,KAAK,EACHxF,IAAI,KAAK,MAAM,mBAAAG,MAAA,CACKY,QAAQ,CAACC,WAAW,CAAChB,IAAI,CAAC,GAAG,CAAC,CAAC,EAAAG,GAAAA,CAAAA,GAAAA,eAAAA,CAAAA,MAAA,CAC/BY,QAAQ,CAAC0E,wBAAwB,CAAC,EACvD,GAAA,CAAA;AACDC,YAAAA,YAAY,EAAEC,iBAAkB;AAChCC,YAAAA,eAAe,EAAC,yBAAyB;AACzCC,YAAAA,OAAO,EAAC,MAAM;AACdC,YAAAA,aAAa,EAAC,QAAQ;AACtBC,YAAAA,GAAG,EAAC,KAAK;AACTC,YAAAA,IAAI,EAAC,KAAK;AACVC,YAAAA,SAAS,EAAExC,aAAc;AACzB3D,YAAAA,SAAS,EAAEA,SAAU;AACrBE,YAAAA,IAAI,EAAEA,IAAK;YACXkG,GAAG,EAAEjD,IAAI,CAACkD,WAAY;AACtBC,YAAAA,QAAQ,EAAC,QAAQ;AAAA/E,YAAAA,QAAA,EAEhBA,QAAAA;AAAQ,WAAA,CACG,CAAC,CAAA;SACZ,CAAA,CAAA;AAAC,OACc,CAAC,GACrB,IAAA;KACiB,CAAA;AAAC,GACV,CAAC,CAAA;AAErB;;;;"}

package/build/lib/web/production/components/StepGroup/StepItem.web.js

@@ -31,7 +31,7 @@ import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
 import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
 
-var _excluded = ["title", "titleColor", "timestamp", "description", "stepProgress", "marker", "trailing", "isSelected", "isDisabled", "href", "target", "onClick", "children", "_index", "_totalIndex", "_nestingLevel"];
+var _excluded = ["title", "titleColor", "timestamp", "description", "stepProgress", "marker", "trailing", "isSelected", "isDisabled", "href", "target", "onClick", "children", "_index", "_totalIndex", "_nestingLevel", "minWidth"];
 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 InteractiveItemHeaderBox = /*#__PURE__*/styled.button.withConfig({
@@ -100,6 +100,7 @@ var _StepItem = function _StepItem(_ref2) {
     _totalIndex = _ref2$_totalIndex === void 0 ? 0 : _ref2$_totalIndex,
     _ref2$_nestingLevel = _ref2._nestingLevel,
     _nestingLevel = _ref2$_nestingLevel === void 0 ? 0 : _ref2$_nestingLevel,
+    minWidth = _ref2.minWidth,
     rest = _objectWithoutProperties(_ref2, _excluded);
   var _useStepGroup = useStepGroup(),
     itemsCount = _useStepGroup.itemsInGroupCount,
@@ -173,7 +174,7 @@ var _StepItem = function _StepItem(_ref2) {
     className: "step-item step-index-".concat(_index, " step-nesting-level-").concat(_nestingLevel),
     textAlign: isVertical ? 'left' : 'center',
     alignItems: isVertical ? undefined : 'center',
-    minWidth: isVertical ? undefined : "min(".concat(makeSize(size['120']), ", 100%)"),
+    minWidth: isVertical ? undefined : minWidth !== null && minWidth !== void 0 ? minWidth : "min(".concat(makeSize(size['120']), ", 100%)"),
     width: isVertical ? '100%' : undefined,
     flex: isVertical ? undefined : '1',
     marginX: isVertical ? 'spacing.4' : 'spacing.0'

package/build/lib/web/production/components/StepGroup/StepItem.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepItem.web.js","sources":["../../../../../../src/components/StepGroup/StepItem.web.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { StepLine } from './StepLine';\nimport type { StepLineProps } from './StepLine';\nimport { useStepGroup } from './StepGroupContext';\nimport type {\n  InteractiveItemHeaderProps,\n  StepGroupContextType,\n  StepGroupProps,\n  StepItemProps,\n} from './types';\nimport { componentIds } from './componentIds';\nimport { itemLineGap, stepItemHeaderTokens } from './tokens';\nimport { Box } from '~components/Box';\nimport { Text } from '~components/Typography';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport BaseBox from '~components/Box/BaseBox';\nimport { makeSize, makeSpace } from '~utils';\nimport { size as sizeTokens } from '~tokens/global';\nimport { getFocusRingStyles } from '~utils/getFocusRingStyles';\nimport getIn from '~utils/lodashButBetter/get';\nimport { throwBladeError } from '~utils/logger';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype GetStepTypeFromIndexProps = {\n  _index: StepItemProps['_index'];\n  _nestingLevel: StepGroupProps['_nestingLevel'];\n  itemsCount: StepGroupContextType['itemsInGroupCount'];\n};\n\nconst InteractiveItemHeaderBox = styled.button<InteractiveItemHeaderProps>((props) => {\n  return {\n    padding: `${makeSpace(getIn(props.theme, props.paddingY))} ${makeSpace(\n      getIn(props.theme, props.paddingX),\n    )}`,\n    cursor: 'pointer',\n    display: 'inline-block',\n    textDecoration: 'none',\n    border: 'none',\n    textAlign: 'inherit',\n    backgroundColor: props.theme.colors.transparent,\n    borderRadius: props.theme.border.radius.medium,\n    width: '100%',\n    transition: `background-color ${props.theme.motion.duration.xquick} ${props.theme.motion.easing.standard}`,\n    ':not([disabled]):hover': {\n      backgroundColor: props.isSelected\n        ? props.theme.colors.interactive.background.primary.faded\n        : props.theme.colors.interactive.background.gray.default,\n    },\n    ':not([disabled]):focus-visible': {\n      ...getFocusRingStyles({ theme: props.theme }),\n    },\n    '&[disabled]': {\n      cursor: 'not-allowed',\n    },\n  };\n});\n\nconst getStepTypeFromIndex = ({\n  _index,\n  _nestingLevel,\n  itemsCount,\n}: GetStepTypeFromIndexProps): StepLineProps['stepType'] => {\n  if (_nestingLevel === 0) {\n    return 'default';\n  }\n\n  if (itemsCount === 1) {\n    return 'single-item';\n  }\n\n  if (_index === 0) {\n    return 'start';\n  }\n\n  if (_index === itemsCount - 1) {\n    return 'end';\n  }\n\n  return 'middle';\n};\n\nconst _StepItem = ({\n  title,\n  titleColor,\n  timestamp,\n  description,\n  stepProgress = 'none',\n  marker,\n  trailing,\n  isSelected,\n  isDisabled,\n  href,\n  target,\n  onClick,\n  children,\n  _index = 0,\n  _totalIndex = 0,\n  _nestingLevel = 0,\n  ...rest\n}: StepItemProps): React.ReactElement => {\n  const {\n    itemsInGroupCount: itemsCount,\n    totalItemsInParentGroupCount,\n    orientation,\n    size,\n  } = useStepGroup();\n  const stepType = React.useMemo(\n    () => getStepTypeFromIndex({ _index, _nestingLevel, itemsCount }),\n    [_index, _nestingLevel, itemsCount],\n  );\n\n  const itemRef = React.useRef<HTMLDivElement>(null);\n\n  const isFirstItem = _totalIndex === 0;\n  const isLastItem = _totalIndex === totalItemsInParentGroupCount - 1;\n  const isInteractive = Boolean(href) || Boolean(onClick);\n  const isVertical = orientation === 'vertical';\n  const isNested = _nestingLevel > 0;\n\n  if (__DEV__) {\n    if (trailing && orientation === 'horizontal') {\n      throwBladeError({\n        message: 'trailing is not allowed in horizontal StepGroup',\n        moduleName: 'StepItem',\n      });\n    }\n\n    if (_nestingLevel >= 1 && orientation === 'horizontal') {\n      throwBladeError({\n        message: 'Nested StepGroup components are not allowed in horizontal orientation',\n        moduleName: 'StepItem',\n      });\n    }\n  }\n\n  const stepItemHeaderJSX = (\n    <Box display=\"flex\" flexDirection=\"row\" justifyContent=\"space-between\" gap=\"spacing.4\">\n      <Box>\n        <Text\n          size={stepItemHeaderTokens[size].title}\n          color={\n            isDisabled\n              ? 'surface.text.gray.disabled'\n              : isSelected\n              ? 'surface.text.primary.normal'\n              : titleColor ?? 'surface.text.gray.subtle'\n          }\n          weight={isNested ? 'regular' : 'medium'}\n        >\n          {title}\n        </Text>\n        <Text\n          size={stepItemHeaderTokens[size].timestamp}\n          marginY=\"spacing.2\"\n          color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n          variant=\"caption\"\n        >\n          {timestamp}\n        </Text>\n        <Text\n          size={stepItemHeaderTokens[size].description}\n          color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n        >\n          {description}\n        </Text>\n      </Box>\n      {trailing ? <Box>{trailing}</Box> : null}\n    </Box>\n  );\n\n  const stepItemHeaderPaddings: Omit<InteractiveItemHeaderProps, 'isSelected'> = {\n    paddingY: 'spacing.3',\n    paddingX: 'spacing.4',\n  } as const;\n\n  const enhancedMarker = marker\n    ? React.cloneElement(marker, {\n        isDisabled: isDisabled ?? marker?.props?.isDisabled,\n      })\n    : undefined;\n\n  return (\n    <BaseBox\n      display=\"flex\"\n      flexDirection={isVertical ? 'row' : 'column'}\n      gap={itemLineGap[size]}\n      className={`step-item step-index-${_index} step-nesting-level-${_nestingLevel}`}\n      textAlign={isVertical ? 'left' : 'center'}\n      alignItems={isVertical ? undefined : 'center'}\n      minWidth={isVertical ? undefined : `min(${makeSize(sizeTokens['120'])}, 100%)`}\n      width={isVertical ? '100%' : undefined}\n      flex={isVertical ? undefined : '1'}\n      marginX={isVertical ? 'spacing.4' : 'spacing.0'}\n      {...metaAttribute({ name: MetaConstants.StepItem })}\n      {...makeAnalyticsAttribute(rest)}\n      ref={itemRef}\n    >\n      <StepLine\n        shouldShowStartBranch={!isFirstItem}\n        shouldShowEndBranch={!isLastItem}\n        stepType={stepType}\n        marker={enhancedMarker}\n        stepProgress={stepProgress}\n      />\n      <Box flex=\"1\" marginRight={isVertical ? undefined : undefined}>\n        {isInteractive ? (\n          <InteractiveItemHeaderBox\n            {...stepItemHeaderPaddings}\n            as={href ? 'a' : 'button'}\n            href={href}\n            target={target}\n            isSelected={isSelected}\n            onClick={onClick}\n            disabled={isDisabled}\n          >\n            {stepItemHeaderJSX}\n          </InteractiveItemHeaderBox>\n        ) : (\n          <Box {...stepItemHeaderPaddings}>{stepItemHeaderJSX}</Box>\n        )}\n        {children ? (\n          <Box paddingX=\"spacing.4\" paddingBottom=\"spacing.3\">\n            {children}\n          </Box>\n        ) : null}\n      </Box>\n    </BaseBox>\n  );\n};\n\n/**\n * ## StepItem\n *\n * Component meant to be used inside the StepGroup parent component\n *\n * ### Usage\n *\n * ```jsx\n * <StepGroup orientation=\"vertical\" size=\"medium\">\n *   <StepItem\n *      title=\"Personal Details\"\n *      timestamp=\"Thu 15th Oct'23 | 12:00pm\"\n *      description=\"Fill your personal details here\"\n *      marker={<StepItemIndicator color=\"negative\" />}\n *    />\n * </StepGroup>\n * ```\n *\n * ---\n *\n * Checkout {@link https://blade.razorpay.com/?path=/docs/components-stepgroup--docs StepGroup Documentation}\n */\nconst StepItem = assignWithoutSideEffects(_StepItem, {\n  componentId: componentIds.StepItem,\n  displayName: componentIds.StepItem,\n});\n\nexport { StepLine, StepItem };\n"],"names":["InteractiveItemHeaderBox","styled","button","withConfig","displayName","componentId","props","padding","concat","makeSpace","getIn","theme","paddingY","paddingX","cursor","display","textDecoration","border","textAlign","backgroundColor","colors","transparent","borderRadius","radius","medium","width","transition","motion","duration","xquick","easing","standard","isSelected","interactive","background","primary","faded","gray","_objectSpread","getFocusRingStyles","getStepTypeFromIndex","_ref","_index","_nestingLevel","itemsCount","_StepItem","_ref2","_marker$props","title","titleColor","timestamp","description","_ref2$stepProgress","stepProgress","marker","trailing","isDisabled","href","target","onClick","children","_ref2$_index","_ref2$_totalIndex","_totalIndex","_ref2$_nestingLevel","rest","_objectWithoutProperties","_excluded","_useStepGroup","useStepGroup","itemsInGroupCount","totalItemsInParentGroupCount","orientation","size","stepType","React","useMemo","itemRef","useRef","isFirstItem","isLastItem","isInteractive","Boolean","isVertical","isNested","throwBladeError","message","moduleName","stepItemHeaderJSX","_jsxs","Box","flexDirection","justifyContent","gap","_jsx","Text","stepItemHeaderTokens","color","weight","marginY","variant","stepItemHeaderPaddings","enhancedMarker","cloneElement","undefined","BaseBox","itemLineGap","className","alignItems","minWidth","makeSize","sizeTokens","flex","marginX","metaAttribute","name","MetaConstants","StepItem","makeAnalyticsAttribute","ref","StepLine","shouldShowStartBranch","shouldShowEndBranch","marginRight","as","disabled","paddingBottom","assignWithoutSideEffects","componentIds"],"mappings":"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"}
+{"version":3,"file":"StepItem.web.js","sources":["../../../../../../src/components/StepGroup/StepItem.web.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { StepLine } from './StepLine';\nimport type { StepLineProps } from './StepLine';\nimport { useStepGroup } from './StepGroupContext';\nimport type {\n  InteractiveItemHeaderProps,\n  StepGroupContextType,\n  StepGroupProps,\n  StepItemProps,\n} from './types';\nimport { componentIds } from './componentIds';\nimport { itemLineGap, stepItemHeaderTokens } from './tokens';\nimport { Box } from '~components/Box';\nimport { Text } from '~components/Typography';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport BaseBox from '~components/Box/BaseBox';\nimport { makeSize, makeSpace } from '~utils';\nimport { size as sizeTokens } from '~tokens/global';\nimport { getFocusRingStyles } from '~utils/getFocusRingStyles';\nimport getIn from '~utils/lodashButBetter/get';\nimport { throwBladeError } from '~utils/logger';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype GetStepTypeFromIndexProps = {\n  _index: StepItemProps['_index'];\n  _nestingLevel: StepGroupProps['_nestingLevel'];\n  itemsCount: StepGroupContextType['itemsInGroupCount'];\n};\n\nconst InteractiveItemHeaderBox = styled.button<InteractiveItemHeaderProps>((props) => {\n  return {\n    padding: `${makeSpace(getIn(props.theme, props.paddingY))} ${makeSpace(\n      getIn(props.theme, props.paddingX),\n    )}`,\n    cursor: 'pointer',\n    display: 'inline-block',\n    textDecoration: 'none',\n    border: 'none',\n    textAlign: 'inherit',\n    backgroundColor: props.theme.colors.transparent,\n    borderRadius: props.theme.border.radius.medium,\n    width: '100%',\n    transition: `background-color ${props.theme.motion.duration.xquick} ${props.theme.motion.easing.standard}`,\n    ':not([disabled]):hover': {\n      backgroundColor: props.isSelected\n        ? props.theme.colors.interactive.background.primary.faded\n        : props.theme.colors.interactive.background.gray.default,\n    },\n    ':not([disabled]):focus-visible': {\n      ...getFocusRingStyles({ theme: props.theme }),\n    },\n    '&[disabled]': {\n      cursor: 'not-allowed',\n    },\n  };\n});\n\nconst getStepTypeFromIndex = ({\n  _index,\n  _nestingLevel,\n  itemsCount,\n}: GetStepTypeFromIndexProps): StepLineProps['stepType'] => {\n  if (_nestingLevel === 0) {\n    return 'default';\n  }\n\n  if (itemsCount === 1) {\n    return 'single-item';\n  }\n\n  if (_index === 0) {\n    return 'start';\n  }\n\n  if (_index === itemsCount - 1) {\n    return 'end';\n  }\n\n  return 'middle';\n};\n\nconst _StepItem = ({\n  title,\n  titleColor,\n  timestamp,\n  description,\n  stepProgress = 'none',\n  marker,\n  trailing,\n  isSelected,\n  isDisabled,\n  href,\n  target,\n  onClick,\n  children,\n  _index = 0,\n  _totalIndex = 0,\n  _nestingLevel = 0,\n  minWidth,\n  ...rest\n}: StepItemProps): React.ReactElement => {\n  const {\n    itemsInGroupCount: itemsCount,\n    totalItemsInParentGroupCount,\n    orientation,\n    size,\n  } = useStepGroup();\n  const stepType = React.useMemo(\n    () => getStepTypeFromIndex({ _index, _nestingLevel, itemsCount }),\n    [_index, _nestingLevel, itemsCount],\n  );\n\n  const itemRef = React.useRef<HTMLDivElement>(null);\n\n  const isFirstItem = _totalIndex === 0;\n  const isLastItem = _totalIndex === totalItemsInParentGroupCount - 1;\n  const isInteractive = Boolean(href) || Boolean(onClick);\n  const isVertical = orientation === 'vertical';\n  const isNested = _nestingLevel > 0;\n\n  if (__DEV__) {\n    if (trailing && orientation === 'horizontal') {\n      throwBladeError({\n        message: 'trailing is not allowed in horizontal StepGroup',\n        moduleName: 'StepItem',\n      });\n    }\n\n    if (_nestingLevel >= 1 && orientation === 'horizontal') {\n      throwBladeError({\n        message: 'Nested StepGroup components are not allowed in horizontal orientation',\n        moduleName: 'StepItem',\n      });\n    }\n  }\n\n  const stepItemHeaderJSX = (\n    <Box display=\"flex\" flexDirection=\"row\" justifyContent=\"space-between\" gap=\"spacing.4\">\n      <Box>\n        <Text\n          size={stepItemHeaderTokens[size].title}\n          color={\n            isDisabled\n              ? 'surface.text.gray.disabled'\n              : isSelected\n              ? 'surface.text.primary.normal'\n              : titleColor ?? 'surface.text.gray.subtle'\n          }\n          weight={isNested ? 'regular' : 'medium'}\n        >\n          {title}\n        </Text>\n        <Text\n          size={stepItemHeaderTokens[size].timestamp}\n          marginY=\"spacing.2\"\n          color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n          variant=\"caption\"\n        >\n          {timestamp}\n        </Text>\n        <Text\n          size={stepItemHeaderTokens[size].description}\n          color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.muted'}\n        >\n          {description}\n        </Text>\n      </Box>\n      {trailing ? <Box>{trailing}</Box> : null}\n    </Box>\n  );\n\n  const stepItemHeaderPaddings: Omit<InteractiveItemHeaderProps, 'isSelected'> = {\n    paddingY: 'spacing.3',\n    paddingX: 'spacing.4',\n  } as const;\n\n  const enhancedMarker = marker\n    ? React.cloneElement(marker, {\n        isDisabled: isDisabled ?? marker?.props?.isDisabled,\n      })\n    : undefined;\n\n  return (\n    <BaseBox\n      display=\"flex\"\n      flexDirection={isVertical ? 'row' : 'column'}\n      gap={itemLineGap[size]}\n      className={`step-item step-index-${_index} step-nesting-level-${_nestingLevel}`}\n      textAlign={isVertical ? 'left' : 'center'}\n      alignItems={isVertical ? undefined : 'center'}\n      minWidth={isVertical ? undefined : minWidth ?? `min(${makeSize(sizeTokens['120'])}, 100%)`}\n      width={isVertical ? '100%' : undefined}\n      flex={isVertical ? undefined : '1'}\n      marginX={isVertical ? 'spacing.4' : 'spacing.0'}\n      {...metaAttribute({ name: MetaConstants.StepItem })}\n      {...makeAnalyticsAttribute(rest)}\n      ref={itemRef}\n    >\n      <StepLine\n        shouldShowStartBranch={!isFirstItem}\n        shouldShowEndBranch={!isLastItem}\n        stepType={stepType}\n        marker={enhancedMarker}\n        stepProgress={stepProgress}\n      />\n      <Box flex=\"1\" marginRight={isVertical ? undefined : undefined}>\n        {isInteractive ? (\n          <InteractiveItemHeaderBox\n            {...stepItemHeaderPaddings}\n            as={href ? 'a' : 'button'}\n            href={href}\n            target={target}\n            isSelected={isSelected}\n            onClick={onClick}\n            disabled={isDisabled}\n          >\n            {stepItemHeaderJSX}\n          </InteractiveItemHeaderBox>\n        ) : (\n          <Box {...stepItemHeaderPaddings}>{stepItemHeaderJSX}</Box>\n        )}\n        {children ? (\n          <Box paddingX=\"spacing.4\" paddingBottom=\"spacing.3\">\n            {children}\n          </Box>\n        ) : null}\n      </Box>\n    </BaseBox>\n  );\n};\n\n/**\n * ## StepItem\n *\n * Component meant to be used inside the StepGroup parent component\n *\n * ### Usage\n *\n * ```jsx\n * <StepGroup orientation=\"vertical\" size=\"medium\">\n *   <StepItem\n *      title=\"Personal Details\"\n *      timestamp=\"Thu 15th Oct'23 | 12:00pm\"\n *      description=\"Fill your personal details here\"\n *      marker={<StepItemIndicator color=\"negative\" />}\n *    />\n * </StepGroup>\n * ```\n *\n * ---\n *\n * Checkout {@link https://blade.razorpay.com/?path=/docs/components-stepgroup--docs StepGroup Documentation}\n */\nconst StepItem = assignWithoutSideEffects(_StepItem, {\n  componentId: componentIds.StepItem,\n  displayName: componentIds.StepItem,\n});\n\nexport { StepLine, StepItem };\n"],"names":["InteractiveItemHeaderBox","styled","button","withConfig","displayName","componentId","props","padding","concat","makeSpace","getIn","theme","paddingY","paddingX","cursor","display","textDecoration","border","textAlign","backgroundColor","colors","transparent","borderRadius","radius","medium","width","transition","motion","duration","xquick","easing","standard","isSelected","interactive","background","primary","faded","gray","_objectSpread","getFocusRingStyles","getStepTypeFromIndex","_ref","_index","_nestingLevel","itemsCount","_StepItem","_ref2","_marker$props","title","titleColor","timestamp","description","_ref2$stepProgress","stepProgress","marker","trailing","isDisabled","href","target","onClick","children","_ref2$_index","_ref2$_totalIndex","_totalIndex","_ref2$_nestingLevel","minWidth","rest","_objectWithoutProperties","_excluded","_useStepGroup","useStepGroup","itemsInGroupCount","totalItemsInParentGroupCount","orientation","size","stepType","React","useMemo","itemRef","useRef","isFirstItem","isLastItem","isInteractive","Boolean","isVertical","isNested","throwBladeError","message","moduleName","stepItemHeaderJSX","_jsxs","Box","flexDirection","justifyContent","gap","_jsx","Text","stepItemHeaderTokens","color","weight","marginY","variant","stepItemHeaderPaddings","enhancedMarker","cloneElement","undefined","BaseBox","itemLineGap","className","alignItems","makeSize","sizeTokens","flex","marginX","metaAttribute","name","MetaConstants","StepItem","makeAnalyticsAttribute","ref","StepLine","shouldShowStartBranch","shouldShowEndBranch","marginRight","as","disabled","paddingBottom","assignWithoutSideEffects","componentIds"],"mappings":"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"}

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

@@ -36,6 +36,7 @@ import './Input/TextArea/index.js';
 import './Input/TextInput/index.js';
 import './Input/SearchInput/index.js';
 import './Input/PhoneNumberInput/index.js';
+import './InputGroup/index.js';
 import './Link/index.js';
 import './List/index.js';
 import './LiveAnnouncer/index.web.js';
@@ -521,6 +522,8 @@ export { TextArea } from './Input/TextArea/TextArea.js';
 export { TextInput } from './Input/TextInput/TextInput.js';
 export { SearchInput } from './Input/SearchInput/SearchInput.js';
 export { PhoneNumberInput } from './Input/PhoneNumberInput/PhoneNumberInput.web.js';
+export { InputGroup } from './InputGroup/InputGroup.web.js';
+export { InputRow } from './InputGroup/InputRow.web.js';
 export { default as Link } from './Link/Link/Link.js';
 export { List } from './List/List.js';
 export { ListItem } from './List/ListItem.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/utils/getFocusRingStyles/getFocusRingStyles.web.js

@@ -22,7 +22,8 @@ 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)
+    transitionTimingFunction: castWebType(theme.motion.easing.standard),
+    zIndex: 2 // Prevent focus ring clipping by adjacent inputs in InputGroup
   };
 }
 

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),\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;;;;"}
+{"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    zIndex: 2, // Prevent focus ring clipping by adjacent inputs in InputGroup\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","zIndex"],"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,CAAC;IACnEC,MAAM,EAAE,CAAC;GACV,CAAA;AACH;;;;"}

package/build/lib/web/production/utils/metaAttribute/metaConstants.js

@@ -50,6 +50,7 @@ var MetaConstants = {
   Icon: 'icon',
   IconButton: 'icon-button',
   Indicator: 'indicator',
+  InputGroup: 'input-group',
   Link: 'link',
   List: 'list',
   ListItem: 'list-item',