@veeqo/ui 9.2.0 → 9.4.0

package/dist/components/DimensionsInput/DimensionsInput.cjs

@@ -3,27 +3,27 @@
 var React = require('react');
 var index$1 = require('../InputGroup/index.cjs');
 var types = require('../types.cjs');
-var withLabels = require('../../hoc/withLabels/withLabels.cjs');
 var styled = require('./styled.cjs');
 var CrossIcon = require('../../tempIcons/CrossIcon.cjs');
 var index = require('../../theme/index.cjs');
 var blockInvalidCharacters = require('../../utils/blockInvalidCharacters.cjs');
 var invalidCharactersNumeric = require('../../utils/invalidCharactersNumeric.cjs');
+var InputGroupLabel = require('../InputGroup/components/InputGroupLabel/InputGroupLabel.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 const blockInvalidChars = (e) => blockInvalidCharacters.blockInvalidCharacters(e, invalidCharactersNumeric.invalidCharsList);
-const DimensionsInput = withLabels.withLabels(({ size = types.ComponentSize.base, handleChangeHeight, handleChangeWidth, handleChangeLength, className, height, width, length, unit, ...rest }) => (React__default.default.createElement(styled.Container, { className: className },
+const DimensionsInput = ({ size = types.ComponentSize.base, handleChangeHeight, handleChangeWidth, handleChangeLength, className, height, width, length, unit = 'cm', ...rest }) => (React__default.default.createElement(styled.Container, { className: className, role: "group", "aria-label": "Dimensions" },
     React__default.default.createElement(styled.Row, null,
-        React__default.default.createElement(styled.TextField, { onChange: handleChangeLength, size: size, name: "length", type: "number", placeholder: "L", value: length, min: "0", step: "any", onKeyDown: blockInvalidChars, ...rest }),
-        React__default.default.createElement(CrossIcon.CrossIcon, { height: index.theme.sizes.base, width: index.theme.sizes.base }),
-        React__default.default.createElement(styled.TextField, { onChange: handleChangeWidth, size: size, name: "width", type: "number", placeholder: "W", value: width, min: "0", step: "any", onKeyDown: blockInvalidChars, ...rest }),
-        React__default.default.createElement(CrossIcon.CrossIcon, { height: index.theme.sizes.base, width: index.theme.sizes.base }),
+        React__default.default.createElement(styled.TextField, { name: "length", type: "number", value: length, "aria-label": "Length", "aria-describedby": "dimensions-unit", min: "0", step: "any", onChange: handleChangeLength, onKeyDown: blockInvalidChars, size: size, placeholder: "L", ...rest }),
+        React__default.default.createElement(CrossIcon.CrossIcon, { height: index.theme.sizes.base, width: index.theme.sizes.base, role: "presentation" }),
+        React__default.default.createElement(styled.TextField, { name: "width", type: "number", value: width, "aria-label": "Width", "aria-describedby": "dimensions-unit", min: "0", step: "any", onChange: handleChangeWidth, onKeyDown: blockInvalidChars, size: size, placeholder: "W", ...rest }),
+        React__default.default.createElement(CrossIcon.CrossIcon, { height: index.theme.sizes.base, width: index.theme.sizes.base, role: "presentation" }),
         React__default.default.createElement(index$1.InputGroup, null,
-            React__default.default.createElement(styled.TextField, { onChange: handleChangeHeight, size: size, name: "height", type: "number", placeholder: "H", value: height, min: "0", step: "any", onKeyDown: blockInvalidChars, ...rest }),
-            React__default.default.createElement(styled.Button, { size: size }, unit))))));
+            React__default.default.createElement(styled.TextField, { name: "height", type: "number", value: height, "aria-label": "Height", "aria-describedby": "dimensions-unit", min: "0", step: "any", onChange: handleChangeHeight, onKeyDown: blockInvalidChars, size: size, placeholder: "H", ...rest }),
+            React__default.default.createElement(InputGroupLabel.InputGroupLabel, { size: size, unit: unit, id: "dimensions-unit" })))));
 DimensionsInput.displayName = 'DimensionsInput';
 
 exports.DimensionsInput = DimensionsInput;

package/dist/components/DimensionsInput/DimensionsInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DimensionsInput.cjs","sources":["../../../src/components/DimensionsInput/DimensionsInput.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\nimport { InputGroup } from '../InputGroup';\nimport { ComponentSize } from '../types';\nimport { withLabels } from '../../hoc';\n\nimport { Container, Row, TextField, Button } from './styled';\n\nimport { DimensionsProps } from './types';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { theme } from '../../theme';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\nexport const DimensionsInput: FC<DimensionsProps> = withLabels(\n  ({\n    size = ComponentSize.base,\n    handleChangeHeight,\n    handleChangeWidth,\n    handleChangeLength,\n    className,\n    height,\n    width,\n    length,\n    unit,\n    ...rest\n  }: DimensionsProps) => (\n    <Container className={className}>\n      <Row>\n        <TextField\n          onChange={handleChangeLength}\n          size={size}\n          name=\"length\"\n          type=\"number\"\n          placeholder=\"L\"\n          value={length}\n          min=\"0\"\n          step=\"any\"\n          onKeyDown={blockInvalidChars}\n          {...rest}\n        />\n        <CrossIcon height={theme.sizes.base} width={theme.sizes.base} />\n        <TextField\n          onChange={handleChangeWidth}\n          size={size}\n          name=\"width\"\n          type=\"number\"\n          placeholder=\"W\"\n          value={width}\n          min=\"0\"\n          step=\"any\"\n          onKeyDown={blockInvalidChars}\n          {...rest}\n        />\n        <CrossIcon height={theme.sizes.base} width={theme.sizes.base} />\n        <InputGroup>\n          <TextField\n            onChange={handleChangeHeight}\n            size={size}\n            name=\"height\"\n            type=\"number\"\n            placeholder=\"H\"\n            value={height}\n            min=\"0\"\n            step=\"any\"\n            onKeyDown={blockInvalidChars}\n            {...rest}\n          />\n          <Button size={size}>{unit}</Button>\n        </InputGroup>\n      </Row>\n    </Container>\n  ),\n);\n\nDimensionsInput.displayName = 'DimensionsInput';\n"],"names":["blockInvalidCharacters","invalidCharsList","withLabels","ComponentSize","React","Container","Row","TextField","CrossIcon","theme","InputGroup","Button"],"mappings":";;;;;;;;;;;;;;;;AAcA,MAAM,iBAAiB,GAAG,CAAC,CAAsB,KAAKA,6CAAsB,CAAC,CAAC,EAAEC,yCAAgB,CAAC;AACpF,MAAA,eAAe,GAAwBC,qBAAU,CAC5D,CAAC,EACC,IAAI,GAAGC,mBAAa,CAAC,IAAI,EACzB,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,IAAI,EACJ,GAAG,IAAI,EACS,MAChBC,sBAAA,CAAA,aAAA,CAACC,gBAAS,EAAC,EAAA,SAAS,EAAE,SAAS,EAAA;AAC7B,IAAAD,sBAAA,CAAA,aAAA,CAACE,UAAG,EAAA,IAAA;AACF,QAAAF,sBAAA,CAAA,aAAA,CAACG,gBAAS,EACR,EAAA,QAAQ,EAAE,kBAAkB,EAC5B,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,MAAM,EACb,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,iBAAiB,EAAA,GACxB,IAAI,EACR,CAAA;AACF,QAAAH,sBAAA,CAAA,aAAA,CAACI,mBAAS,EAAC,EAAA,MAAM,EAAEC,WAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,EAAI,CAAA;AAChE,QAAAL,sBAAA,CAAA,aAAA,CAACG,gBAAS,EACR,EAAA,QAAQ,EAAE,iBAAiB,EAC3B,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,QAAQ,EACb,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,KAAK,EACZ,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,iBAAiB,EAAA,GACxB,IAAI,EACR,CAAA;AACF,QAAAH,sBAAA,CAAA,aAAA,CAACI,mBAAS,EAAC,EAAA,MAAM,EAAEC,WAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,EAAI,CAAA;AAChE,QAAAL,sBAAA,CAAA,aAAA,CAACM,kBAAU,EAAA,IAAA;AACT,YAAAN,sBAAA,CAAA,aAAA,CAACG,gBAAS,EACR,EAAA,QAAQ,EAAE,kBAAkB,EAC5B,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,MAAM,EACb,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,iBAAiB,EAAA,GACxB,IAAI,EACR,CAAA;AACF,YAAAH,sBAAA,CAAA,aAAA,CAACO,aAAM,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA,EAAG,IAAI,CAAU,CACxB,CACT,CACI,CACb;AAGH,eAAe,CAAC,WAAW,GAAG,iBAAiB;;;;"}
+{"version":3,"file":"DimensionsInput.cjs","sources":["../../../src/components/DimensionsInput/DimensionsInput.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\nimport { InputGroup, InputGroupLabel } from '../InputGroup';\nimport { ComponentSize } from '../types';\n\nimport { Container, Row, TextField } from './styled';\n\nimport { DimensionsProps } from './types';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { theme } from '../../theme';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const DimensionsInput: FC<DimensionsProps> = ({\n  size = ComponentSize.base,\n  handleChangeHeight,\n  handleChangeWidth,\n  handleChangeLength,\n  className,\n  height,\n  width,\n  length,\n  unit = 'cm',\n  ...rest\n}: DimensionsProps) => (\n  <Container className={className} role=\"group\" aria-label=\"Dimensions\">\n    <Row>\n      <TextField\n        name=\"length\"\n        type=\"number\"\n        value={length}\n        aria-label=\"Length\"\n        aria-describedby=\"dimensions-unit\"\n        min=\"0\"\n        step=\"any\"\n        onChange={handleChangeLength}\n        onKeyDown={blockInvalidChars}\n        size={size}\n        placeholder=\"L\"\n        {...rest}\n      />\n      <CrossIcon height={theme.sizes.base} width={theme.sizes.base} role=\"presentation\" />\n      <TextField\n        name=\"width\"\n        type=\"number\"\n        value={width}\n        aria-label=\"Width\"\n        aria-describedby=\"dimensions-unit\"\n        min=\"0\"\n        step=\"any\"\n        onChange={handleChangeWidth}\n        onKeyDown={blockInvalidChars}\n        size={size}\n        placeholder=\"W\"\n        {...rest}\n      />\n      <CrossIcon height={theme.sizes.base} width={theme.sizes.base} role=\"presentation\" />\n      <InputGroup>\n        <TextField\n          name=\"height\"\n          type=\"number\"\n          value={height}\n          aria-label=\"Height\"\n          aria-describedby=\"dimensions-unit\"\n          min=\"0\"\n          step=\"any\"\n          onChange={handleChangeHeight}\n          onKeyDown={blockInvalidChars}\n          size={size}\n          placeholder=\"H\"\n          {...rest}\n        />\n        <InputGroupLabel size={size} unit={unit} id=\"dimensions-unit\" />\n      </InputGroup>\n    </Row>\n  </Container>\n);\n\nDimensionsInput.displayName = 'DimensionsInput';\n"],"names":["blockInvalidCharacters","invalidCharsList","ComponentSize","React","Container","Row","TextField","CrossIcon","theme","InputGroup","InputGroupLabel"],"mappings":";;;;;;;;;;;;;;;;AAaA,MAAM,iBAAiB,GAAG,CAAC,CAAsB,KAAKA,6CAAsB,CAAC,CAAC,EAAEC,yCAAgB,CAAC;MAEpF,eAAe,GAAwB,CAAC,EACnD,IAAI,GAAGC,mBAAa,CAAC,IAAI,EACzB,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,IAAI,GAAG,IAAI,EACX,GAAG,IAAI,EACS,MAChBC,qCAACC,gBAAS,EAAA,EAAC,SAAS,EAAE,SAAS,EAAE,IAAI,EAAC,OAAO,EAAA,YAAA,EAAY,YAAY,EAAA;AACnE,IAAAD,sBAAA,CAAA,aAAA,CAACE,UAAG,EAAA,IAAA;AACF,QAAAF,sBAAA,CAAA,aAAA,CAACG,gBAAS,EACR,EAAA,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,MAAM,EACF,YAAA,EAAA,QAAQ,sBACF,iBAAiB,EAClC,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,QAAQ,EAAE,kBAAkB,EAC5B,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,IAAI,EACV,WAAW,EAAC,GAAG,EAAA,GACX,IAAI,EACR,CAAA;QACFH,sBAAC,CAAA,aAAA,CAAAI,mBAAS,IAAC,MAAM,EAAEC,WAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,cAAc,EAAG,CAAA;AACpF,QAAAL,sBAAA,CAAA,aAAA,CAACG,gBAAS,EACR,EAAA,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,KAAK,EACD,YAAA,EAAA,OAAO,sBACD,iBAAiB,EAClC,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,QAAQ,EAAE,iBAAiB,EAC3B,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,IAAI,EACV,WAAW,EAAC,GAAG,EAAA,GACX,IAAI,EACR,CAAA;QACFH,sBAAC,CAAA,aAAA,CAAAI,mBAAS,IAAC,MAAM,EAAEC,WAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,cAAc,EAAG,CAAA;AACpF,QAAAL,sBAAA,CAAA,aAAA,CAACM,kBAAU,EAAA,IAAA;AACT,YAAAN,sBAAA,CAAA,aAAA,CAACG,gBAAS,EACR,EAAA,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,MAAM,EACF,YAAA,EAAA,QAAQ,sBACF,iBAAiB,EAClC,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,QAAQ,EAAE,kBAAkB,EAC5B,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,IAAI,EACV,WAAW,EAAC,GAAG,EAAA,GACX,IAAI,EACR,CAAA;AACF,YAAAH,sBAAA,CAAA,aAAA,CAACO,+BAAe,EAAC,EAAA,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAC,iBAAiB,EAAA,CAAG,CACrD,CACT,CACI;AAGd,eAAe,CAAC,WAAW,GAAG,iBAAiB;;;;"}

package/dist/components/DimensionsInput/DimensionsInput.js

@@ -1,23 +1,23 @@
 import React from 'react';
 import { InputGroup } from '../InputGroup/index.js';
 import { ComponentSize } from '../types.js';
-import { withLabels } from '../../hoc/withLabels/withLabels.js';
-import { Container, Row, TextField as StyledTextField, Button as StyledButton } from './styled.js';
+import { Container, Row, TextField as StyledTextField } from './styled.js';
 import { CrossIcon } from '../../tempIcons/CrossIcon.js';
 import { theme } from '../../theme/index.js';
 import { blockInvalidCharacters } from '../../utils/blockInvalidCharacters.js';
 import { invalidCharsList } from '../../utils/invalidCharactersNumeric.js';
+import { InputGroupLabel } from '../InputGroup/components/InputGroupLabel/InputGroupLabel.js';
 
 const blockInvalidChars = (e) => blockInvalidCharacters(e, invalidCharsList);
-const DimensionsInput = withLabels(({ size = ComponentSize.base, handleChangeHeight, handleChangeWidth, handleChangeLength, className, height, width, length, unit, ...rest }) => (React.createElement(Container, { className: className },
+const DimensionsInput = ({ size = ComponentSize.base, handleChangeHeight, handleChangeWidth, handleChangeLength, className, height, width, length, unit = 'cm', ...rest }) => (React.createElement(Container, { className: className, role: "group", "aria-label": "Dimensions" },
     React.createElement(Row, null,
-        React.createElement(StyledTextField, { onChange: handleChangeLength, size: size, name: "length", type: "number", placeholder: "L", value: length, min: "0", step: "any", onKeyDown: blockInvalidChars, ...rest }),
-        React.createElement(CrossIcon, { height: theme.sizes.base, width: theme.sizes.base }),
-        React.createElement(StyledTextField, { onChange: handleChangeWidth, size: size, name: "width", type: "number", placeholder: "W", value: width, min: "0", step: "any", onKeyDown: blockInvalidChars, ...rest }),
-        React.createElement(CrossIcon, { height: theme.sizes.base, width: theme.sizes.base }),
+        React.createElement(StyledTextField, { name: "length", type: "number", value: length, "aria-label": "Length", "aria-describedby": "dimensions-unit", min: "0", step: "any", onChange: handleChangeLength, onKeyDown: blockInvalidChars, size: size, placeholder: "L", ...rest }),
+        React.createElement(CrossIcon, { height: theme.sizes.base, width: theme.sizes.base, role: "presentation" }),
+        React.createElement(StyledTextField, { name: "width", type: "number", value: width, "aria-label": "Width", "aria-describedby": "dimensions-unit", min: "0", step: "any", onChange: handleChangeWidth, onKeyDown: blockInvalidChars, size: size, placeholder: "W", ...rest }),
+        React.createElement(CrossIcon, { height: theme.sizes.base, width: theme.sizes.base, role: "presentation" }),
         React.createElement(InputGroup, null,
-            React.createElement(StyledTextField, { onChange: handleChangeHeight, size: size, name: "height", type: "number", placeholder: "H", value: height, min: "0", step: "any", onKeyDown: blockInvalidChars, ...rest }),
-            React.createElement(StyledButton, { size: size }, unit))))));
+            React.createElement(StyledTextField, { name: "height", type: "number", value: height, "aria-label": "Height", "aria-describedby": "dimensions-unit", min: "0", step: "any", onChange: handleChangeHeight, onKeyDown: blockInvalidChars, size: size, placeholder: "H", ...rest }),
+            React.createElement(InputGroupLabel, { size: size, unit: unit, id: "dimensions-unit" })))));
 DimensionsInput.displayName = 'DimensionsInput';
 
 export { DimensionsInput };

package/dist/components/DimensionsInput/DimensionsInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DimensionsInput.js","sources":["../../../src/components/DimensionsInput/DimensionsInput.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\nimport { InputGroup } from '../InputGroup';\nimport { ComponentSize } from '../types';\nimport { withLabels } from '../../hoc';\n\nimport { Container, Row, TextField, Button } from './styled';\n\nimport { DimensionsProps } from './types';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { theme } from '../../theme';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\nexport const DimensionsInput: FC<DimensionsProps> = withLabels(\n  ({\n    size = ComponentSize.base,\n    handleChangeHeight,\n    handleChangeWidth,\n    handleChangeLength,\n    className,\n    height,\n    width,\n    length,\n    unit,\n    ...rest\n  }: DimensionsProps) => (\n    <Container className={className}>\n      <Row>\n        <TextField\n          onChange={handleChangeLength}\n          size={size}\n          name=\"length\"\n          type=\"number\"\n          placeholder=\"L\"\n          value={length}\n          min=\"0\"\n          step=\"any\"\n          onKeyDown={blockInvalidChars}\n          {...rest}\n        />\n        <CrossIcon height={theme.sizes.base} width={theme.sizes.base} />\n        <TextField\n          onChange={handleChangeWidth}\n          size={size}\n          name=\"width\"\n          type=\"number\"\n          placeholder=\"W\"\n          value={width}\n          min=\"0\"\n          step=\"any\"\n          onKeyDown={blockInvalidChars}\n          {...rest}\n        />\n        <CrossIcon height={theme.sizes.base} width={theme.sizes.base} />\n        <InputGroup>\n          <TextField\n            onChange={handleChangeHeight}\n            size={size}\n            name=\"height\"\n            type=\"number\"\n            placeholder=\"H\"\n            value={height}\n            min=\"0\"\n            step=\"any\"\n            onKeyDown={blockInvalidChars}\n            {...rest}\n          />\n          <Button size={size}>{unit}</Button>\n        </InputGroup>\n      </Row>\n    </Container>\n  ),\n);\n\nDimensionsInput.displayName = 'DimensionsInput';\n"],"names":["TextField","Button"],"mappings":";;;;;;;;;;AAcA,MAAM,iBAAiB,GAAG,CAAC,CAAsB,KAAK,sBAAsB,CAAC,CAAC,EAAE,gBAAgB,CAAC;AACpF,MAAA,eAAe,GAAwB,UAAU,CAC5D,CAAC,EACC,IAAI,GAAG,aAAa,CAAC,IAAI,EACzB,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,IAAI,EACJ,GAAG,IAAI,EACS,MAChB,KAAA,CAAA,aAAA,CAAC,SAAS,EAAC,EAAA,SAAS,EAAE,SAAS,EAAA;AAC7B,IAAA,KAAA,CAAA,aAAA,CAAC,GAAG,EAAA,IAAA;AACF,QAAA,KAAA,CAAA,aAAA,CAACA,eAAS,EACR,EAAA,QAAQ,EAAE,kBAAkB,EAC5B,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,MAAM,EACb,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,iBAAiB,EAAA,GACxB,IAAI,EACR,CAAA;AACF,QAAA,KAAA,CAAA,aAAA,CAAC,SAAS,EAAC,EAAA,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAI,CAAA;AAChE,QAAA,KAAA,CAAA,aAAA,CAACA,eAAS,EACR,EAAA,QAAQ,EAAE,iBAAiB,EAC3B,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,QAAQ,EACb,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,KAAK,EACZ,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,iBAAiB,EAAA,GACxB,IAAI,EACR,CAAA;AACF,QAAA,KAAA,CAAA,aAAA,CAAC,SAAS,EAAC,EAAA,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAI,CAAA;AAChE,QAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,IAAA;AACT,YAAA,KAAA,CAAA,aAAA,CAACA,eAAS,EACR,EAAA,QAAQ,EAAE,kBAAkB,EAC5B,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,MAAM,EACb,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,iBAAiB,EAAA,GACxB,IAAI,EACR,CAAA;AACF,YAAA,KAAA,CAAA,aAAA,CAACC,YAAM,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA,EAAG,IAAI,CAAU,CACxB,CACT,CACI,CACb;AAGH,eAAe,CAAC,WAAW,GAAG,iBAAiB;;;;"}
+{"version":3,"file":"DimensionsInput.js","sources":["../../../src/components/DimensionsInput/DimensionsInput.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\nimport { InputGroup, InputGroupLabel } from '../InputGroup';\nimport { ComponentSize } from '../types';\n\nimport { Container, Row, TextField } from './styled';\n\nimport { DimensionsProps } from './types';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { theme } from '../../theme';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const DimensionsInput: FC<DimensionsProps> = ({\n  size = ComponentSize.base,\n  handleChangeHeight,\n  handleChangeWidth,\n  handleChangeLength,\n  className,\n  height,\n  width,\n  length,\n  unit = 'cm',\n  ...rest\n}: DimensionsProps) => (\n  <Container className={className} role=\"group\" aria-label=\"Dimensions\">\n    <Row>\n      <TextField\n        name=\"length\"\n        type=\"number\"\n        value={length}\n        aria-label=\"Length\"\n        aria-describedby=\"dimensions-unit\"\n        min=\"0\"\n        step=\"any\"\n        onChange={handleChangeLength}\n        onKeyDown={blockInvalidChars}\n        size={size}\n        placeholder=\"L\"\n        {...rest}\n      />\n      <CrossIcon height={theme.sizes.base} width={theme.sizes.base} role=\"presentation\" />\n      <TextField\n        name=\"width\"\n        type=\"number\"\n        value={width}\n        aria-label=\"Width\"\n        aria-describedby=\"dimensions-unit\"\n        min=\"0\"\n        step=\"any\"\n        onChange={handleChangeWidth}\n        onKeyDown={blockInvalidChars}\n        size={size}\n        placeholder=\"W\"\n        {...rest}\n      />\n      <CrossIcon height={theme.sizes.base} width={theme.sizes.base} role=\"presentation\" />\n      <InputGroup>\n        <TextField\n          name=\"height\"\n          type=\"number\"\n          value={height}\n          aria-label=\"Height\"\n          aria-describedby=\"dimensions-unit\"\n          min=\"0\"\n          step=\"any\"\n          onChange={handleChangeHeight}\n          onKeyDown={blockInvalidChars}\n          size={size}\n          placeholder=\"H\"\n          {...rest}\n        />\n        <InputGroupLabel size={size} unit={unit} id=\"dimensions-unit\" />\n      </InputGroup>\n    </Row>\n  </Container>\n);\n\nDimensionsInput.displayName = 'DimensionsInput';\n"],"names":["TextField"],"mappings":";;;;;;;;;;AAaA,MAAM,iBAAiB,GAAG,CAAC,CAAsB,KAAK,sBAAsB,CAAC,CAAC,EAAE,gBAAgB,CAAC;MAEpF,eAAe,GAAwB,CAAC,EACnD,IAAI,GAAG,aAAa,CAAC,IAAI,EACzB,kBAAkB,EAClB,iBAAiB,EACjB,kBAAkB,EAClB,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,IAAI,GAAG,IAAI,EACX,GAAG,IAAI,EACS,MAChB,oBAAC,SAAS,EAAA,EAAC,SAAS,EAAE,SAAS,EAAE,IAAI,EAAC,OAAO,EAAA,YAAA,EAAY,YAAY,EAAA;AACnE,IAAA,KAAA,CAAA,aAAA,CAAC,GAAG,EAAA,IAAA;AACF,QAAA,KAAA,CAAA,aAAA,CAACA,eAAS,EACR,EAAA,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,MAAM,EACF,YAAA,EAAA,QAAQ,sBACF,iBAAiB,EAClC,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,QAAQ,EAAE,kBAAkB,EAC5B,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,IAAI,EACV,WAAW,EAAC,GAAG,EAAA,GACX,IAAI,EACR,CAAA;QACF,KAAC,CAAA,aAAA,CAAA,SAAS,IAAC,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,cAAc,EAAG,CAAA;AACpF,QAAA,KAAA,CAAA,aAAA,CAACA,eAAS,EACR,EAAA,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,KAAK,EACD,YAAA,EAAA,OAAO,sBACD,iBAAiB,EAClC,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,QAAQ,EAAE,iBAAiB,EAC3B,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,IAAI,EACV,WAAW,EAAC,GAAG,EAAA,GACX,IAAI,EACR,CAAA;QACF,KAAC,CAAA,aAAA,CAAA,SAAS,IAAC,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,cAAc,EAAG,CAAA;AACpF,QAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,IAAA;AACT,YAAA,KAAA,CAAA,aAAA,CAACA,eAAS,EACR,EAAA,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,MAAM,EACF,YAAA,EAAA,QAAQ,sBACF,iBAAiB,EAClC,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,KAAK,EACV,QAAQ,EAAE,kBAAkB,EAC5B,SAAS,EAAE,iBAAiB,EAC5B,IAAI,EAAE,IAAI,EACV,WAAW,EAAC,GAAG,EAAA,GACX,IAAI,EACR,CAAA;AACF,YAAA,KAAA,CAAA,aAAA,CAAC,eAAe,EAAC,EAAA,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAC,iBAAiB,EAAA,CAAG,CACrD,CACT,CACI;AAGd,eAAe,CAAC,WAAW,GAAG,iBAAiB;;;;"}

package/dist/components/DimensionsInput/index.cjs

@@ -0,0 +1,10 @@
+'use strict';
+
+var withLabels = require('../../hoc/withLabels/withLabels.cjs');
+require('react');
+var DimensionsInput$1 = require('./DimensionsInput.cjs');
+
+const DimensionsInput = withLabels.withLabels(DimensionsInput$1.DimensionsInput);
+
+exports.DimensionsInput = DimensionsInput;
+//# sourceMappingURL=index.cjs.map

package/dist/components/DimensionsInput/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/components/DimensionsInput/index.ts"],"sourcesContent":["import { withLabels } from '../../hoc';\nimport { DimensionsInput as BaseDimensionsInput } from './DimensionsInput';\n\nexport const DimensionsInput = withLabels(BaseDimensionsInput);\n"],"names":["withLabels","BaseDimensionsInput"],"mappings":";;;;;;MAGa,eAAe,GAAGA,qBAAU,CAACC,iCAAmB;;;;"}

package/dist/components/DimensionsInput/index.d.ts

@@ -1 +1,2 @@
-export { DimensionsInput } from './DimensionsInput';
+/// <reference types="react" />
+export declare const DimensionsInput: import("react").FC<import("./types").DimensionsProps & import("../../hoc/withLabels/withLabels").WithLabelsProps>;

package/dist/components/DimensionsInput/index.js

@@ -0,0 +1,8 @@
+import { withLabels } from '../../hoc/withLabels/withLabels.js';
+import 'react';
+import { DimensionsInput as DimensionsInput$1 } from './DimensionsInput.js';
+
+const DimensionsInput = withLabels(DimensionsInput$1);
+
+export { DimensionsInput };
+//# sourceMappingURL=index.js.map

package/dist/components/DimensionsInput/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/DimensionsInput/index.ts"],"sourcesContent":["import { withLabels } from '../../hoc';\nimport { DimensionsInput as BaseDimensionsInput } from './DimensionsInput';\n\nexport const DimensionsInput = withLabels(BaseDimensionsInput);\n"],"names":["BaseDimensionsInput"],"mappings":";;;;MAGa,eAAe,GAAG,UAAU,CAACA,iBAAmB;;;;"}

package/dist/components/DimensionsInput/styled.cjs

@@ -1,9 +1,7 @@
 'use strict';
 
 var styled = require('styled-components');
-var Text = require('../Text/Text.cjs');
 var index = require('../TextField/index.cjs');
-var Button = require('../Button/Button.cjs');
 var BaseContainer = require('../BaseContainer/BaseContainer.cjs');
 var index$1 = require('../../theme/index.cjs');
 
@@ -14,12 +12,9 @@ var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 const Container = styled__default.default(BaseContainer.BaseContainer).withConfig({ displayName: "vui--Container", componentId: "vui--oxhxoy" }) `display:flex;flex-direction:column;position:relative;`;
 const Row = styled__default.default(BaseContainer.BaseContainer).withConfig({ displayName: "vui--Row", componentId: "vui--w9sg63" }) `display:flex;align-items:center;margin-top:4px;gap:8px;`;
 const StyledTextField = styled__default.default(index.TextField).withConfig({ displayName: "vui--StyledTextField", componentId: "vui--1dp86fg" }) `width:52px;margin:0;padding:0 6px;&&&{text-align:left;border-color:${index$1.theme.colors.neutral.ink.lightest};}`;
-const StyledButton = styled__default.default(Button.Button).withConfig({ displayName: "vui--StyledButton", componentId: "vui--1h9einl" }) `padding:0 6px;border-color:${index$1.theme.colors.neutral.ink.lightest};`;
-styled__default.default(Text.Text).withConfig({ displayName: "vui--Label", componentId: "vui--2iwwsg" }) ``;
-styled__default.default.span.withConfig({ displayName: "vui--Error", componentId: "vui--1ln478r" }) `display:block;font-family:${index$1.theme.text.error.fontFamily};font-size:${index$1.theme.text.error.fontSize};font-weight:${index$1.theme.text.error.fontWeight};line-height:${index$1.theme.text.error.lineHeight};color:${index$1.theme.text.error.color};&::before{content:'';position:absolute;top:0;bottom:0;left:calc(${index$1.theme.sizes[2]} * -1);width:2px;background-color:${index$1.theme.colors.secondary.red.base};}`;
-styled__default.default.span.withConfig({ displayName: "vui--Hint", componentId: "vui--5lfadq" }) `display:block;font-family:${index$1.theme.fontFamily};font-size:${index$1.theme.sizes[3]};line-height:${index$1.theme.sizes[4]};color:${index$1.theme.colors.neutral.ink.light};`;
+styled__default.default.span.withConfig({ displayName: "vui--Error", componentId: "vui--1isax7l" }) `display:block;font-family:${index$1.theme.text.error.fontFamily};font-size:${index$1.theme.text.error.fontSize};font-weight:${index$1.theme.text.error.fontWeight};line-height:${index$1.theme.text.error.lineHeight};color:${index$1.theme.text.error.color};&::before{content:'';position:absolute;top:0;bottom:0;left:calc(${index$1.theme.sizes[2]} * -1);width:2px;background-color:${index$1.theme.colors.secondary.red.base};}`;
+styled__default.default.span.withConfig({ displayName: "vui--Hint", componentId: "vui--gorpke" }) `display:block;font-family:${index$1.theme.fontFamily};font-size:${index$1.theme.sizes[3]};line-height:${index$1.theme.sizes[4]};color:${index$1.theme.colors.neutral.ink.light};`;
 
-exports.Button = StyledButton;
 exports.Container = Container;
 exports.Row = Row;
 exports.TextField = StyledTextField;

package/dist/components/DimensionsInput/styled.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"styled.cjs","sources":["../../../src/components/DimensionsInput/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { Text } from '../Text';\nimport { TextField } from '../TextField';\nimport { Button } from '../Button';\nimport { BaseContainer } from '../BaseContainer';\nimport { theme } from '../../theme';\n\nconst Container = styled(BaseContainer)`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n`;\n\nconst Row = styled(BaseContainer)`\n  display: flex;\n  align-items: center;\n  margin-top: 4px;\n\n  gap: 8px;\n`;\n\nconst StyledTextField = styled(TextField)`\n  width: 52px;\n  margin: 0;\n  padding: 0 6px;\n\n  &&& {\n    text-align: left;\n    border-color: ${theme.colors.neutral.ink.lightest};\n  }\n`;\n\nconst StyledButton = styled(Button)`\n  padding: 0 6px;\n  border-color: ${theme.colors.neutral.ink.lightest};\n`;\n\nconst Label = styled(Text)``;\n\nconst Error = styled.span`\n  display: block;\n  font-family: ${theme.text.error.fontFamily};\n  font-size: ${theme.text.error.fontSize};\n  font-weight: ${theme.text.error.fontWeight};\n  line-height: ${theme.text.error.lineHeight};\n  color: ${theme.text.error.color};\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: calc(${theme.sizes[2]} * -1);\n    width: 2px;\n    background-color: ${theme.colors.secondary.red.base};\n  }\n`;\n\nconst Hint = styled.span`\n  display: block;\n  font-family: ${theme.fontFamily};\n  font-size: ${theme.sizes[3]};\n  line-height: ${theme.sizes[4]};\n  color: ${theme.colors.neutral.ink.light};\n`;\n\nexport { Container, Row, Error, Hint, StyledTextField as TextField, StyledButton as Button, Label };\n"],"names":["styled","BaseContainer","TextField","theme","Button","Text"],"mappings":";;;;;;;;;;;;;AAQA,MAAM,SAAS,GAAGA,uBAAM,CAACC,2BAAa,CAAC;AAMvC,MAAM,GAAG,GAAGD,uBAAM,CAACC,2BAAa,CAAC;AAQjC,MAAM,eAAe,GAAGD,uBAAM,CAACE,eAAS,CAAC,CAOrB,UAAA,CAAA,EAAA,WAAA,EAAA,sBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,mEAAA,EAAAC,aAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAIrD,MAAM,YAAY,GAAGH,uBAAM,CAACI,aAAM,CAAC,CAEjB,UAAA,CAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,2BAAA,EAAAD,aAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAGrCH,uBAAM,CAACK,SAAI,CAAC;AAEZL,uBAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,0BAAA,EAERG,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAA,WAAA,EAC7BA,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAA,aAAA,EACvBA,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAC3B,aAAA,EAAAA,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CACjC,OAAA,EAAAA,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,oEAOhBA,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAEP,kCAAA,EAAAA,aAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI;AAI1CH,uBAAM,CAAC,IAAI,CAEP,UAAA,CAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,0BAAA,EAAAG,aAAK,CAAC,UAAU,cAClBA,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA,aAAA,EACZA,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,UACpBA,aAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK;;;;;;;"}
+{"version":3,"file":"styled.cjs","sources":["../../../src/components/DimensionsInput/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { TextField } from '../TextField';\nimport { BaseContainer } from '../BaseContainer';\nimport { theme } from '../../theme';\n\nconst Container = styled(BaseContainer)`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n`;\n\nconst Row = styled(BaseContainer)`\n  display: flex;\n  align-items: center;\n  margin-top: 4px;\n\n  gap: 8px;\n`;\n\nconst StyledTextField = styled(TextField)`\n  width: 52px;\n  margin: 0;\n  padding: 0 6px;\n\n  &&& {\n    text-align: left;\n    border-color: ${theme.colors.neutral.ink.lightest};\n  }\n`;\n\nconst Error = styled.span`\n  display: block;\n  font-family: ${theme.text.error.fontFamily};\n  font-size: ${theme.text.error.fontSize};\n  font-weight: ${theme.text.error.fontWeight};\n  line-height: ${theme.text.error.lineHeight};\n  color: ${theme.text.error.color};\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: calc(${theme.sizes[2]} * -1);\n    width: 2px;\n    background-color: ${theme.colors.secondary.red.base};\n  }\n`;\n\nconst Hint = styled.span`\n  display: block;\n  font-family: ${theme.fontFamily};\n  font-size: ${theme.sizes[3]};\n  line-height: ${theme.sizes[4]};\n  color: ${theme.colors.neutral.ink.light};\n`;\n\nexport { Container, Row, Error, Hint, StyledTextField as TextField };\n"],"names":["styled","BaseContainer","TextField","theme"],"mappings":";;;;;;;;;;;AAMA,MAAM,SAAS,GAAGA,uBAAM,CAACC,2BAAa,CAAC;AAMvC,MAAM,GAAG,GAAGD,uBAAM,CAACC,2BAAa,CAAC;AAQjC,MAAM,eAAe,GAAGD,uBAAM,CAACE,eAAS,CAAC,CAOrB,UAAA,CAAA,EAAA,WAAA,EAAA,sBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,mEAAA,EAAAC,aAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAIvCH,uBAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,0BAAA,EAERG,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAA,WAAA,EAC7BA,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAA,aAAA,EACvBA,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAC3B,aAAA,EAAAA,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CACjC,OAAA,EAAAA,aAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,oEAOhBA,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAEP,kCAAA,EAAAA,aAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI;AAI1CH,uBAAM,CAAC,IAAI,CAEP,UAAA,CAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,0BAAA,EAAAG,aAAK,CAAC,UAAU,cAClBA,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA,aAAA,EACZA,aAAK,CAAC,KAAK,CAAC,CAAC,CAAC,UACpBA,aAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK;;;;;;"}

package/dist/components/DimensionsInput/styled.d.ts

@@ -303,16 +303,6 @@ declare const StyledTextField: import("styled-components").StyledComponent<impor
     size?: "base" | "sm" | undefined;
     multiline?: boolean | undefined;
 } & import("react").RefAttributes<HTMLInputElement> & import("../../hoc/withLabels/withLabels").WithLabelsProps>, any, {}, never>;
-declare const StyledButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
-    children?: import("react").ReactNode;
-    variant?: import("../Button/types").ButtonVariant | undefined;
-    size?: "base" | "sm" | undefined;
-    iconSlot?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
-    dropdown?: boolean | undefined;
-    loading?: boolean | undefined;
-    contentStyles?: import("react").CSSProperties | undefined;
-} & import("react").RefAttributes<HTMLButtonElement>>, any, {}, never>;
-declare const Label: import("styled-components").StyledComponent<"span", any, {} & import("../Text/types").TextProps, never>;
 declare const Error: import("styled-components").StyledComponent<"span", any, {}, never>;
 declare const Hint: import("styled-components").StyledComponent<"span", any, {}, never>;
-export { Container, Row, Error, Hint, StyledTextField as TextField, StyledButton as Button, Label };
+export { Container, Row, Error, Hint, StyledTextField as TextField };

package/dist/components/DimensionsInput/styled.js

@@ -1,17 +1,13 @@
 import styled from 'styled-components';
-import { Text } from '../Text/Text.js';
 import { TextField } from '../TextField/index.js';
-import { Button } from '../Button/Button.js';
 import { BaseContainer } from '../BaseContainer/BaseContainer.js';
 import { theme } from '../../theme/index.js';
 
 const Container = styled(BaseContainer).withConfig({ displayName: "vui--Container", componentId: "vui--oxhxoy" }) `display:flex;flex-direction:column;position:relative;`;
 const Row = styled(BaseContainer).withConfig({ displayName: "vui--Row", componentId: "vui--w9sg63" }) `display:flex;align-items:center;margin-top:4px;gap:8px;`;
 const StyledTextField = styled(TextField).withConfig({ displayName: "vui--StyledTextField", componentId: "vui--1dp86fg" }) `width:52px;margin:0;padding:0 6px;&&&{text-align:left;border-color:${theme.colors.neutral.ink.lightest};}`;
-const StyledButton = styled(Button).withConfig({ displayName: "vui--StyledButton", componentId: "vui--1h9einl" }) `padding:0 6px;border-color:${theme.colors.neutral.ink.lightest};`;
-styled(Text).withConfig({ displayName: "vui--Label", componentId: "vui--2iwwsg" }) ``;
-styled.span.withConfig({ displayName: "vui--Error", componentId: "vui--1ln478r" }) `display:block;font-family:${theme.text.error.fontFamily};font-size:${theme.text.error.fontSize};font-weight:${theme.text.error.fontWeight};line-height:${theme.text.error.lineHeight};color:${theme.text.error.color};&::before{content:'';position:absolute;top:0;bottom:0;left:calc(${theme.sizes[2]} * -1);width:2px;background-color:${theme.colors.secondary.red.base};}`;
-styled.span.withConfig({ displayName: "vui--Hint", componentId: "vui--5lfadq" }) `display:block;font-family:${theme.fontFamily};font-size:${theme.sizes[3]};line-height:${theme.sizes[4]};color:${theme.colors.neutral.ink.light};`;
+styled.span.withConfig({ displayName: "vui--Error", componentId: "vui--1isax7l" }) `display:block;font-family:${theme.text.error.fontFamily};font-size:${theme.text.error.fontSize};font-weight:${theme.text.error.fontWeight};line-height:${theme.text.error.lineHeight};color:${theme.text.error.color};&::before{content:'';position:absolute;top:0;bottom:0;left:calc(${theme.sizes[2]} * -1);width:2px;background-color:${theme.colors.secondary.red.base};}`;
+styled.span.withConfig({ displayName: "vui--Hint", componentId: "vui--gorpke" }) `display:block;font-family:${theme.fontFamily};font-size:${theme.sizes[3]};line-height:${theme.sizes[4]};color:${theme.colors.neutral.ink.light};`;
 
-export { StyledButton as Button, Container, Row, StyledTextField as TextField };
+export { Container, Row, StyledTextField as TextField };
 //# sourceMappingURL=styled.js.map

package/dist/components/DimensionsInput/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../src/components/DimensionsInput/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { Text } from '../Text';\nimport { TextField } from '../TextField';\nimport { Button } from '../Button';\nimport { BaseContainer } from '../BaseContainer';\nimport { theme } from '../../theme';\n\nconst Container = styled(BaseContainer)`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n`;\n\nconst Row = styled(BaseContainer)`\n  display: flex;\n  align-items: center;\n  margin-top: 4px;\n\n  gap: 8px;\n`;\n\nconst StyledTextField = styled(TextField)`\n  width: 52px;\n  margin: 0;\n  padding: 0 6px;\n\n  &&& {\n    text-align: left;\n    border-color: ${theme.colors.neutral.ink.lightest};\n  }\n`;\n\nconst StyledButton = styled(Button)`\n  padding: 0 6px;\n  border-color: ${theme.colors.neutral.ink.lightest};\n`;\n\nconst Label = styled(Text)``;\n\nconst Error = styled.span`\n  display: block;\n  font-family: ${theme.text.error.fontFamily};\n  font-size: ${theme.text.error.fontSize};\n  font-weight: ${theme.text.error.fontWeight};\n  line-height: ${theme.text.error.lineHeight};\n  color: ${theme.text.error.color};\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: calc(${theme.sizes[2]} * -1);\n    width: 2px;\n    background-color: ${theme.colors.secondary.red.base};\n  }\n`;\n\nconst Hint = styled.span`\n  display: block;\n  font-family: ${theme.fontFamily};\n  font-size: ${theme.sizes[3]};\n  line-height: ${theme.sizes[4]};\n  color: ${theme.colors.neutral.ink.light};\n`;\n\nexport { Container, Row, Error, Hint, StyledTextField as TextField, StyledButton as Button, Label };\n"],"names":[],"mappings":";;;;;;;AAQA,MAAM,SAAS,GAAG,MAAM,CAAC,aAAa,CAAC;AAMvC,MAAM,GAAG,GAAG,MAAM,CAAC,aAAa,CAAC;AAQjC,MAAM,eAAe,GAAG,MAAM,CAAC,SAAS,CAAC,CAOrB,UAAA,CAAA,EAAA,WAAA,EAAA,sBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,mEAAA,EAAA,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAIrD,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,CAEjB,UAAA,CAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,2BAAA,EAAA,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAGrC,MAAM,CAAC,IAAI,CAAC;AAEZ,MAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,0BAAA,EAER,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAA,WAAA,EAC7B,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAA,aAAA,EACvB,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAC3B,aAAA,EAAA,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CACjC,OAAA,EAAA,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,oEAOhB,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAEP,kCAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI;AAI1C,MAAM,CAAC,IAAI,CAEP,UAAA,CAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,0BAAA,EAAA,KAAK,CAAC,UAAU,cAClB,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA,aAAA,EACZ,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,UACpB,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../src/components/DimensionsInput/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { TextField } from '../TextField';\nimport { BaseContainer } from '../BaseContainer';\nimport { theme } from '../../theme';\n\nconst Container = styled(BaseContainer)`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n`;\n\nconst Row = styled(BaseContainer)`\n  display: flex;\n  align-items: center;\n  margin-top: 4px;\n\n  gap: 8px;\n`;\n\nconst StyledTextField = styled(TextField)`\n  width: 52px;\n  margin: 0;\n  padding: 0 6px;\n\n  &&& {\n    text-align: left;\n    border-color: ${theme.colors.neutral.ink.lightest};\n  }\n`;\n\nconst Error = styled.span`\n  display: block;\n  font-family: ${theme.text.error.fontFamily};\n  font-size: ${theme.text.error.fontSize};\n  font-weight: ${theme.text.error.fontWeight};\n  line-height: ${theme.text.error.lineHeight};\n  color: ${theme.text.error.color};\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: calc(${theme.sizes[2]} * -1);\n    width: 2px;\n    background-color: ${theme.colors.secondary.red.base};\n  }\n`;\n\nconst Hint = styled.span`\n  display: block;\n  font-family: ${theme.fontFamily};\n  font-size: ${theme.sizes[3]};\n  line-height: ${theme.sizes[4]};\n  color: ${theme.colors.neutral.ink.light};\n`;\n\nexport { Container, Row, Error, Hint, StyledTextField as TextField };\n"],"names":[],"mappings":";;;;;AAMA,MAAM,SAAS,GAAG,MAAM,CAAC,aAAa,CAAC;AAMvC,MAAM,GAAG,GAAG,MAAM,CAAC,aAAa,CAAC;AAQjC,MAAM,eAAe,GAAG,MAAM,CAAC,SAAS,CAAC,CAOrB,UAAA,CAAA,EAAA,WAAA,EAAA,sBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,mEAAA,EAAA,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAIvC,MAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,0BAAA,EAER,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAA,WAAA,EAC7B,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAA,aAAA,EACvB,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAC3B,aAAA,EAAA,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CACjC,OAAA,EAAA,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,oEAOhB,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAEP,kCAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI;AAI1C,MAAM,CAAC,IAAI,CAEP,UAAA,CAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,0BAAA,EAAA,KAAK,CAAC,UAAU,cAClB,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA,aAAA,EACZ,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,UACpB,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK;;;;"}

package/dist/components/DimensionsInput/types.d.ts

@@ -1,15 +1,12 @@
 import { ComponentSize } from '../types';
-export interface DimensionsProps {
+export type DimensionsProps = {
     size?: ComponentSize;
     handleChangeHeight: (value: string) => void;
     handleChangeWidth: (value: string) => void;
     handleChangeLength: (value: string) => void;
-    label?: string;
-    hint?: string;
-    error?: string;
     height: string;
     width: string;
     length: string;
     unit?: string;
     className?: string;
-}
+};

package/dist/components/Image/Image.cjs

@@ -2,7 +2,7 @@
 
 var React = require('react');
 var reactPopper = require('react-popper');
-var ReactDOM = require('react-dom');
+var reactDom = require('react-dom');
 var PlaceholderImage = require('./components/PlaceholderImage.cjs');
 var styled = require('./components/styled.cjs');
 var utils = require('./utils.cjs');
@@ -41,7 +41,7 @@ const Image = ({ src, alt = '', className, e2eClassName, width, height, previewW
             isImageHidden &&
             (placeholder || (React__default.default.createElement(PlaceholderImage.PlaceholderImage, { className: buildClassnames.buildClassnames([classNames === null || classNames === undefined ? undefined : classNames.placeholder, e2eClassNames === null || e2eClassNames === undefined ? undefined : e2eClassNames.placeholder]), width: placeholderWidth || width, height: placeholderHeight || height }))),
         isPreviewOpen &&
-            ReactDOM.createPortal(React__default.default.createElement(styled.PreviewImageContainer, { ref: setPopperElement, style: styles.popper, ...attributes.popper, className: buildClassnames.buildClassnames([
+            reactDom.createPortal(React__default.default.createElement(styled.PreviewImageContainer, { ref: setPopperElement, style: styles.popper, ...attributes.popper, className: buildClassnames.buildClassnames([
                     classNames === null || classNames === undefined ? undefined : classNames.previewImageContainer,
                     e2eClassNames === null || e2eClassNames === undefined ? undefined : e2eClassNames.previewImageContainer,
                 ]) },

package/dist/components/InputGroup/components/InputGroupLabel/InputGroupLabel.cjs

@@ -0,0 +1,15 @@
+'use strict';
+
+var React = require('react');
+var Text = require('../../../Text/Text.cjs');
+var styled = require('./styled.cjs');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+const InputGroupLabel = ({ id, unit, size }) => (React__default.default.createElement(styled.GroupLabelWrapper, { size: size },
+    React__default.default.createElement(Text.Text, { variant: "body", id: id }, unit)));
+
+exports.InputGroupLabel = InputGroupLabel;
+//# sourceMappingURL=InputGroupLabel.cjs.map

package/dist/components/InputGroup/components/InputGroupLabel/InputGroupLabel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputGroupLabel.cjs","sources":["../../../../../src/components/InputGroup/components/InputGroupLabel/InputGroupLabel.tsx"],"sourcesContent":["import React from 'react';\nimport { ComponentSize } from 'src/components/types';\nimport { Text } from '../../../Text';\nimport { GroupLabelWrapper } from './styled';\n\ntype InputGroupLabelProps = {\n  id?: string;\n  unit: string;\n  size: ComponentSize;\n};\n\nexport const InputGroupLabel = ({ id, unit, size }: InputGroupLabelProps) => (\n  <GroupLabelWrapper size={size}>\n    <Text variant=\"body\" id={id}>\n      {unit}\n    </Text>\n  </GroupLabelWrapper>\n);\n"],"names":["React","GroupLabelWrapper","Text"],"mappings":";;;;;;;;;;MAWa,eAAe,GAAG,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAwB,MACtEA,qCAACC,wBAAiB,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA;AAC3B,IAAAD,sBAAA,CAAA,aAAA,CAACE,SAAI,EAAA,EAAC,OAAO,EAAC,MAAM,EAAC,EAAE,EAAE,EAAE,EACxB,EAAA,IAAI,CACA,CACW;;;;"}

package/dist/components/InputGroup/components/InputGroupLabel/InputGroupLabel.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { ComponentSize } from 'src/components/types';
+type InputGroupLabelProps = {
+    id?: string;
+    unit: string;
+    size: ComponentSize;
+};
+export declare const InputGroupLabel: ({ id, unit, size }: InputGroupLabelProps) => React.JSX.Element;
+export {};

package/dist/components/InputGroup/components/InputGroupLabel/InputGroupLabel.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { Text } from '../../../Text/Text.js';
+import { GroupLabelWrapper } from './styled.js';
+
+const InputGroupLabel = ({ id, unit, size }) => (React.createElement(GroupLabelWrapper, { size: size },
+    React.createElement(Text, { variant: "body", id: id }, unit)));
+
+export { InputGroupLabel };
+//# sourceMappingURL=InputGroupLabel.js.map

package/dist/components/InputGroup/components/InputGroupLabel/InputGroupLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputGroupLabel.js","sources":["../../../../../src/components/InputGroup/components/InputGroupLabel/InputGroupLabel.tsx"],"sourcesContent":["import React from 'react';\nimport { ComponentSize } from 'src/components/types';\nimport { Text } from '../../../Text';\nimport { GroupLabelWrapper } from './styled';\n\ntype InputGroupLabelProps = {\n  id?: string;\n  unit: string;\n  size: ComponentSize;\n};\n\nexport const InputGroupLabel = ({ id, unit, size }: InputGroupLabelProps) => (\n  <GroupLabelWrapper size={size}>\n    <Text variant=\"body\" id={id}>\n      {unit}\n    </Text>\n  </GroupLabelWrapper>\n);\n"],"names":[],"mappings":";;;;MAWa,eAAe,GAAG,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAwB,MACtE,oBAAC,iBAAiB,EAAA,EAAC,IAAI,EAAE,IAAI,EAAA;AAC3B,IAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,MAAM,EAAC,EAAE,EAAE,EAAE,EACxB,EAAA,IAAI,CACA,CACW;;;;"}

package/dist/components/InputGroup/components/InputGroupLabel/index.d.ts

@@ -0,0 +1 @@
+export { InputGroupLabel } from './InputGroupLabel';

package/dist/components/InputGroup/components/InputGroupLabel/styled.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+var styled = require('styled-components');
+var index = require('../../../../theme/index.cjs');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
+const GroupLabelWrapper = styled__default.default.div.withConfig({ displayName: "vui--GroupLabelWrapper", componentId: "vui--1nbjbcg" }) `display:flex;align-items:center;padding:0 6px;border:1px solid;border-color:${index.theme.colors.neutral.ink.lightest};border-radius:${index.theme.radius.base};`;
+
+exports.GroupLabelWrapper = GroupLabelWrapper;
+//# sourceMappingURL=styled.cjs.map

package/dist/components/InputGroup/components/InputGroupLabel/styled.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.cjs","sources":["../../../../../src/components/InputGroup/components/InputGroupLabel/styled.ts"],"sourcesContent":["import { ComponentSize } from 'src/components/types';\nimport styled from 'styled-components';\nimport { theme } from 'Theme';\n\nexport const GroupLabelWrapper = styled.div<{ size: ComponentSize }>`\n  display: flex;\n  align-items: center;\n\n  padding: 0 6px;\n\n  border: 1px solid;\n  border-color: ${theme.colors.neutral.ink.lightest};\n  border-radius: ${theme.radius.base};\n`;\n"],"names":["styled","theme"],"mappings":";;;;;;;;;AAIa,MAAA,iBAAiB,GAAGA,uBAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,wBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,4EAAA,EAOzBC,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAChC,eAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,IAAI,CAAA,CAAA;;;;"}

package/dist/components/InputGroup/components/InputGroupLabel/styled.d.ts

@@ -0,0 +1,4 @@
+import { ComponentSize } from 'src/components/types';
+export declare const GroupLabelWrapper: import("styled-components").StyledComponent<"div", any, {
+    size: ComponentSize;
+}, never>;

package/dist/components/InputGroup/components/InputGroupLabel/styled.js

@@ -0,0 +1,7 @@
+import styled from 'styled-components';
+import { theme } from '../../../../theme/index.js';
+
+const GroupLabelWrapper = styled.div.withConfig({ displayName: "vui--GroupLabelWrapper", componentId: "vui--1nbjbcg" }) `display:flex;align-items:center;padding:0 6px;border:1px solid;border-color:${theme.colors.neutral.ink.lightest};border-radius:${theme.radius.base};`;
+
+export { GroupLabelWrapper };
+//# sourceMappingURL=styled.js.map

package/dist/components/InputGroup/components/InputGroupLabel/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","sources":["../../../../../src/components/InputGroup/components/InputGroupLabel/styled.ts"],"sourcesContent":["import { ComponentSize } from 'src/components/types';\nimport styled from 'styled-components';\nimport { theme } from 'Theme';\n\nexport const GroupLabelWrapper = styled.div<{ size: ComponentSize }>`\n  display: flex;\n  align-items: center;\n\n  padding: 0 6px;\n\n  border: 1px solid;\n  border-color: ${theme.colors.neutral.ink.lightest};\n  border-radius: ${theme.radius.base};\n`;\n"],"names":[],"mappings":";;;AAIa,MAAA,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,wBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,4EAAA,EAOzB,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAChC,eAAA,EAAA,KAAK,CAAC,MAAM,CAAC,IAAI,CAAA,CAAA;;;;"}

package/dist/components/InputGroup/index.cjs

@@ -1,12 +1,15 @@
 'use strict';
 
 var styled = require('styled-components');
+require('react');
+require('../Text/Text.cjs');
+require('./components/InputGroupLabel/styled.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const InputGroup = styled__default.default.div.withConfig({ displayName: "vui--InputGroup", componentId: "vui--1w0e9jz" }) `display:flex;& > *{margin-left:0;margin-right:0;box-shadow:none;}& > *:not(:last-child){border-right-width:0 !important;}& > *:hover{}& > *:focus,& > *:active{z-index:5;border-right-width:1px !important;}& > *:focus + *,& > *:active + *{border-left-width:0 !important;}& > *:not(:first-child):not(:last-child){border-top-left-radius:0 !important;border-top-right-radius:0 !important;border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important;}& > *:first-child{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;}& > *:last-child{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important;}`;
+const InputGroup = styled__default.default.div.withConfig({ displayName: "vui--InputGroup", componentId: "vui--1w0e9jz" }) `display:flex;& > *{margin-left:0;margin-right:0;box-shadow:none;}& > *:not(:last-child){border-right-width:0 !important;}& > *:focus,& > *:active{z-index:5;}& > *:not(:first-child):not(:last-child){border-top-left-radius:0 !important;border-top-right-radius:0 !important;border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important;}& > *:first-child{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;}& > *:last-child{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important;}`;
 
 exports.InputGroup = InputGroup;
 //# sourceMappingURL=index.cjs.map

package/dist/components/InputGroup/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/InputGroup/index.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const InputGroup = styled.div`\n  display: flex;\n\n  & > * {\n    margin-left: 0;\n    margin-right: 0;\n    box-shadow: none;\n  }\n\n  & > *:not(:last-child) {\n    border-right-width: 0 !important;\n  }\n\n  & > *:hover {\n  }\n\n  & > *:focus,\n  & > *:active {\n    z-index: 5;\n    border-right-width: 1px !important;\n  }\n\n  & > *:focus + *,\n  & > *:active + * {\n    border-left-width: 0 !important;\n  }\n\n  & > *:not(:first-child):not(:last-child) {\n    border-top-left-radius: 0 !important;\n    border-top-right-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n  }\n\n  & > *:first-child {\n    border-top-right-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n  }\n\n  & > *:last-child {\n    border-top-left-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n  }\n`;\n"],"names":["styled"],"mappings":";;;;;;;;MAEa,UAAU,GAAGA,uBAAM,CAAC,GAAG;;;;"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/InputGroup/index.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport { InputGroupLabel } from './components/InputGroupLabel';\n\nexport const InputGroup = styled.div`\n  display: flex;\n\n  & > * {\n    margin-left: 0;\n    margin-right: 0;\n    box-shadow: none;\n  }\n\n  & > *:not(:last-child) {\n    border-right-width: 0 !important;\n  }\n\n  & > *:focus,\n  & > *:active {\n    z-index: 5;\n  }\n\n  & > *:not(:first-child):not(:last-child) {\n    border-top-left-radius: 0 !important;\n    border-top-right-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n  }\n\n  & > *:first-child {\n    border-top-right-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n  }\n\n  & > *:last-child {\n    border-top-left-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n  }\n`;\n"],"names":["styled"],"mappings":";;;;;;;;;;;MAIa,UAAU,GAAGA,uBAAM,CAAC,GAAG;;;;"}

package/dist/components/InputGroup/index.d.ts

@@ -1 +1,2 @@
+export { InputGroupLabel } from './components/InputGroupLabel';
 export declare const InputGroup: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/InputGroup/index.js

@@ -1,6 +1,9 @@
 import styled from 'styled-components';
+import 'react';
+import '../Text/Text.js';
+import './components/InputGroupLabel/styled.js';
 
-const InputGroup = styled.div.withConfig({ displayName: "vui--InputGroup", componentId: "vui--1w0e9jz" }) `display:flex;& > *{margin-left:0;margin-right:0;box-shadow:none;}& > *:not(:last-child){border-right-width:0 !important;}& > *:hover{}& > *:focus,& > *:active{z-index:5;border-right-width:1px !important;}& > *:focus + *,& > *:active + *{border-left-width:0 !important;}& > *:not(:first-child):not(:last-child){border-top-left-radius:0 !important;border-top-right-radius:0 !important;border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important;}& > *:first-child{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;}& > *:last-child{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important;}`;
+const InputGroup = styled.div.withConfig({ displayName: "vui--InputGroup", componentId: "vui--1w0e9jz" }) `display:flex;& > *{margin-left:0;margin-right:0;box-shadow:none;}& > *:not(:last-child){border-right-width:0 !important;}& > *:focus,& > *:active{z-index:5;}& > *:not(:first-child):not(:last-child){border-top-left-radius:0 !important;border-top-right-radius:0 !important;border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important;}& > *:first-child{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important;}& > *:last-child{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important;}`;
 
 export { InputGroup };
 //# sourceMappingURL=index.js.map

package/dist/components/InputGroup/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/InputGroup/index.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const InputGroup = styled.div`\n  display: flex;\n\n  & > * {\n    margin-left: 0;\n    margin-right: 0;\n    box-shadow: none;\n  }\n\n  & > *:not(:last-child) {\n    border-right-width: 0 !important;\n  }\n\n  & > *:hover {\n  }\n\n  & > *:focus,\n  & > *:active {\n    z-index: 5;\n    border-right-width: 1px !important;\n  }\n\n  & > *:focus + *,\n  & > *:active + * {\n    border-left-width: 0 !important;\n  }\n\n  & > *:not(:first-child):not(:last-child) {\n    border-top-left-radius: 0 !important;\n    border-top-right-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n  }\n\n  & > *:first-child {\n    border-top-right-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n  }\n\n  & > *:last-child {\n    border-top-left-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n  }\n`;\n"],"names":[],"mappings":";;MAEa,UAAU,GAAG,MAAM,CAAC,GAAG;;;;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/InputGroup/index.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport { InputGroupLabel } from './components/InputGroupLabel';\n\nexport const InputGroup = styled.div`\n  display: flex;\n\n  & > * {\n    margin-left: 0;\n    margin-right: 0;\n    box-shadow: none;\n  }\n\n  & > *:not(:last-child) {\n    border-right-width: 0 !important;\n  }\n\n  & > *:focus,\n  & > *:active {\n    z-index: 5;\n  }\n\n  & > *:not(:first-child):not(:last-child) {\n    border-top-left-radius: 0 !important;\n    border-top-right-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n  }\n\n  & > *:first-child {\n    border-top-right-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n  }\n\n  & > *:last-child {\n    border-top-left-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n  }\n`;\n"],"names":[],"mappings":";;;;;MAIa,UAAU,GAAG,MAAM,CAAC,GAAG;;;;"}

package/dist/components/Modal/Modal.cjs

@@ -10,6 +10,7 @@ var Button = require('../Button/Button.cjs');
 var Card = require('../Card/Card.cjs');
 var CardHeader = require('../CardHeader/CardHeader.cjs');
 var Stack = require('../Stack/Stack.cjs');
+var utils = require('./utils.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -17,7 +18,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 /* eslint-disable react/destructuring-assignment */
 const Modal = (props) => {
-    const { shouldShow, showHeaderCloseButton = true, fullBleed = false, variant = 'base', onClose: parentOnClose, children, className, } = props;
+    const { shouldShow, showHeaderCloseButton = true, preventClose = false, fullBleed = false, variant = 'base', onClose: parentOnClose, children, className, } = props;
     const modalRef = React.useRef(null);
     const [mainSectionRef, setMainSectionRef] = React.useState(null);
     React.useEffect(() => {
@@ -35,7 +36,7 @@ const Modal = (props) => {
     };
     return (React__default.default.createElement(framerMotion.AnimatePresence, null, shouldShow && (React__default.default.createElement("div", { "data-testid": "dialog-wrapper" },
         React__default.default.createElement(styled.NonScrollableBody, null),
-        React__default.default.createElement(Dialog.Dialog, { ref: modalRef, onClose: onClose, variant: variant, "aria-describedby": "modal_title", className: className },
+        React__default.default.createElement(Dialog.Dialog, { ref: modalRef, onClose: onClose, onKeyDown: preventClose ? utils.preventDefaultEventOnESC : undefined, variant: variant, "aria-describedby": "modal_title", className: className },
             React__default.default.createElement(Card.Card.Surface, null,
                 types.hasHeaderSlot(props) ? (props.headerSlot) : (React__default.default.createElement(CardHeader.CardHeader, { id: "modal_title", headerVariant: "headingLarge", title: props.headerTitle, subtitle: props.headerSubtitle, ...(showHeaderCloseButton && { onClickClose: onClose }) })),
                 React__default.default.createElement(styled.MainSection, { onScroll: onScroll, ref: setMainSectionRef, isScrollable: isContentOverflowing, fullBleed: fullBleed }, children),

package/dist/components/Modal/Modal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.cjs","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["/* eslint-disable react/destructuring-assignment */\nimport React, { useEffect, useRef, useState } from 'react';\nimport { AnimatePresence } from 'framer-motion';\n\nimport { MainSection, NonScrollableBody } from './components/styled';\nimport { ModalProps, hasFooterSlot, hasHeaderSlot } from './types';\nimport { Dialog } from './components/Dialog/Dialog';\n\nimport { useIsOverflowing } from '../../hooks/useIsOverflowing';\nimport { Button } from '../Button';\nimport { Card } from '../Card';\nimport { CardHeader } from '../CardHeader';\nimport { Stack } from '../Stack';\n\nexport const Modal = (props: ModalProps) => {\n  const {\n    shouldShow,\n    showHeaderCloseButton = true,\n    fullBleed = false,\n    variant = 'base',\n    onClose: parentOnClose,\n    children,\n    className,\n  } = props;\n\n  const modalRef = useRef<HTMLDialogElement | null>(null);\n  const [mainSectionRef, setMainSectionRef] = useState<HTMLElement | null>(null);\n\n  useEffect(() => {\n    if (shouldShow) {\n      modalRef.current?.removeAttribute('open'); // Allows for conditional rendering.\n      modalRef.current?.showModal();\n    }\n  }, [shouldShow]);\n\n  const { isOverflowing: isContentOverflowing, onScroll } = useIsOverflowing(mainSectionRef);\n\n  const onClose = () => {\n    modalRef.current?.close();\n    parentOnClose();\n  };\n\n  return (\n    <AnimatePresence>\n      {shouldShow && (\n        <div data-testid=\"dialog-wrapper\">\n          <NonScrollableBody />\n          <Dialog\n            ref={modalRef}\n            onClose={onClose}\n            variant={variant}\n            aria-describedby=\"modal_title\"\n            className={className}\n          >\n            <Card.Surface>\n              {hasHeaderSlot(props) ? (\n                props.headerSlot\n              ) : (\n                <CardHeader\n                  id=\"modal_title\"\n                  headerVariant=\"headingLarge\"\n                  title={props.headerTitle}\n                  subtitle={props.headerSubtitle}\n                  {...(showHeaderCloseButton && { onClickClose: onClose })}\n                />\n              )}\n\n              <MainSection\n                onScroll={onScroll}\n                ref={setMainSectionRef}\n                isScrollable={isContentOverflowing}\n                fullBleed={fullBleed}\n              >\n                {children}\n              </MainSection>\n\n              {hasFooterSlot(props) && props.footerSlot}\n\n              {!hasFooterSlot(props) && (props.leftActions || props.rightActions) && (\n                <Card.Footer>\n                  <Stack direction=\"horizontal\" alignX={props.leftActions ? 'between' : 'end'}>\n                    {props.leftActions && (\n                      <Stack\n                        direction=\"horizontal\"\n                        alignX=\"start\"\n                        data-testid=\"left-actions-container\"\n                      >\n                        {props.leftActions.map(({ label, ...actionProps }) => (\n                          <Button key={label} type=\"button\" {...actionProps}>\n                            {label}\n                          </Button>\n                        ))}\n                      </Stack>\n                    )}\n                    {props.rightActions && (\n                      <Stack\n                        direction=\"horizontal\"\n                        alignX=\"end\"\n                        data-testid=\"right-actions-container\"\n                      >\n                        {props.rightActions.map(({ label, ...actionProps }) => (\n                          <Button key={label} type=\"button\" {...actionProps}>\n                            {label}\n                          </Button>\n                        ))}\n                      </Stack>\n                    )}\n                  </Stack>\n                </Card.Footer>\n              )}\n            </Card.Surface>\n          </Dialog>\n        </div>\n      )}\n    </AnimatePresence>\n  );\n};\n"],"names":["useRef","useState","useEffect","useIsOverflowing","React","AnimatePresence","NonScrollableBody","Dialog","Card","hasHeaderSlot","CardHeader","MainSection","hasFooterSlot","Stack","Button"],"mappings":"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"}
+{"version":3,"file":"Modal.cjs","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["/* eslint-disable react/destructuring-assignment */\nimport React, { useEffect, useRef, useState } from 'react';\nimport { AnimatePresence } from 'framer-motion';\n\nimport { MainSection, NonScrollableBody } from './components/styled';\nimport { ModalProps, hasFooterSlot, hasHeaderSlot } from './types';\nimport { Dialog } from './components/Dialog/Dialog';\n\nimport { useIsOverflowing } from '../../hooks/useIsOverflowing';\nimport { Button } from '../Button';\nimport { Card } from '../Card';\nimport { CardHeader } from '../CardHeader';\nimport { Stack } from '../Stack';\nimport { preventDefaultEventOnESC } from './utils';\n\nexport const Modal = (props: ModalProps) => {\n  const {\n    shouldShow,\n    showHeaderCloseButton = true,\n    preventClose = false,\n    fullBleed = false,\n    variant = 'base',\n    onClose: parentOnClose,\n    children,\n    className,\n  } = props;\n\n  const modalRef = useRef<HTMLDialogElement | null>(null);\n  const [mainSectionRef, setMainSectionRef] = useState<HTMLElement | null>(null);\n\n  useEffect(() => {\n    if (shouldShow) {\n      modalRef.current?.removeAttribute('open'); // Allows for conditional rendering.\n      modalRef.current?.showModal();\n    }\n  }, [shouldShow]);\n\n  const { isOverflowing: isContentOverflowing, onScroll } = useIsOverflowing(mainSectionRef);\n\n  const onClose = () => {\n    modalRef.current?.close();\n    parentOnClose();\n  };\n\n  return (\n    <AnimatePresence>\n      {shouldShow && (\n        <div data-testid=\"dialog-wrapper\">\n          <NonScrollableBody />\n          <Dialog\n            ref={modalRef}\n            onClose={onClose}\n            onKeyDown={preventClose ? preventDefaultEventOnESC : undefined}\n            variant={variant}\n            aria-describedby=\"modal_title\"\n            className={className}\n          >\n            <Card.Surface>\n              {hasHeaderSlot(props) ? (\n                props.headerSlot\n              ) : (\n                <CardHeader\n                  id=\"modal_title\"\n                  headerVariant=\"headingLarge\"\n                  title={props.headerTitle}\n                  subtitle={props.headerSubtitle}\n                  {...(showHeaderCloseButton && { onClickClose: onClose })}\n                />\n              )}\n\n              <MainSection\n                onScroll={onScroll}\n                ref={setMainSectionRef}\n                isScrollable={isContentOverflowing}\n                fullBleed={fullBleed}\n              >\n                {children}\n              </MainSection>\n\n              {hasFooterSlot(props) && props.footerSlot}\n\n              {!hasFooterSlot(props) && (props.leftActions || props.rightActions) && (\n                <Card.Footer>\n                  <Stack direction=\"horizontal\" alignX={props.leftActions ? 'between' : 'end'}>\n                    {props.leftActions && (\n                      <Stack\n                        direction=\"horizontal\"\n                        alignX=\"start\"\n                        data-testid=\"left-actions-container\"\n                      >\n                        {props.leftActions.map(({ label, ...actionProps }) => (\n                          <Button key={label} type=\"button\" {...actionProps}>\n                            {label}\n                          </Button>\n                        ))}\n                      </Stack>\n                    )}\n                    {props.rightActions && (\n                      <Stack\n                        direction=\"horizontal\"\n                        alignX=\"end\"\n                        data-testid=\"right-actions-container\"\n                      >\n                        {props.rightActions.map(({ label, ...actionProps }) => (\n                          <Button key={label} type=\"button\" {...actionProps}>\n                            {label}\n                          </Button>\n                        ))}\n                      </Stack>\n                    )}\n                  </Stack>\n                </Card.Footer>\n              )}\n            </Card.Surface>\n          </Dialog>\n        </div>\n      )}\n    </AnimatePresence>\n  );\n};\n"],"names":["useRef","useState","useEffect","useIsOverflowing","React","AnimatePresence","NonScrollableBody","Dialog","preventDefaultEventOnESC","Card","hasHeaderSlot","CardHeader","MainSection","hasFooterSlot","Stack","Button"],"mappings":"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"}

package/dist/components/Modal/Modal.js

@@ -8,10 +8,11 @@ import { Button } from '../Button/Button.js';
 import { Card } from '../Card/Card.js';
 import { CardHeader } from '../CardHeader/CardHeader.js';
 import { Stack } from '../Stack/Stack.js';
+import { preventDefaultEventOnESC } from './utils.js';
 
 /* eslint-disable react/destructuring-assignment */
 const Modal = (props) => {
-    const { shouldShow, showHeaderCloseButton = true, fullBleed = false, variant = 'base', onClose: parentOnClose, children, className, } = props;
+    const { shouldShow, showHeaderCloseButton = true, preventClose = false, fullBleed = false, variant = 'base', onClose: parentOnClose, children, className, } = props;
     const modalRef = useRef(null);
     const [mainSectionRef, setMainSectionRef] = useState(null);
     useEffect(() => {
@@ -29,7 +30,7 @@ const Modal = (props) => {
     };
     return (React.createElement(AnimatePresence, null, shouldShow && (React.createElement("div", { "data-testid": "dialog-wrapper" },
         React.createElement(NonScrollableBody, null),
-        React.createElement(Dialog, { ref: modalRef, onClose: onClose, variant: variant, "aria-describedby": "modal_title", className: className },
+        React.createElement(Dialog, { ref: modalRef, onClose: onClose, onKeyDown: preventClose ? preventDefaultEventOnESC : undefined, variant: variant, "aria-describedby": "modal_title", className: className },
             React.createElement(Card.Surface, null,
                 hasHeaderSlot(props) ? (props.headerSlot) : (React.createElement(CardHeader, { id: "modal_title", headerVariant: "headingLarge", title: props.headerTitle, subtitle: props.headerSubtitle, ...(showHeaderCloseButton && { onClickClose: onClose }) })),
                 React.createElement(MainSection, { onScroll: onScroll, ref: setMainSectionRef, isScrollable: isContentOverflowing, fullBleed: fullBleed }, children),