@veeqo/ui 10.0.0-beta.2 → 10.0.0-beta.4

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

@@ -1,2 +1,4 @@
+/// <reference types="react" />
 import { InputProps } from '../types';
-export declare const InputGroup: import("styled-components").StyledComponent<"div", any, InputProps, never>;
+export type InputGroupProps = React.HTMLAttributes<HTMLDivElement> & InputProps;
+export declare const InputGroup: import("styled-components").StyledComponent<"div", any, import("react").HTMLAttributes<HTMLDivElement> & InputProps, never>;

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';\nimport { inputVariableStyles } from '../../utils/forms/variables';\nimport { InputProps } from '../types';\n\nexport const InputGroup = styled.div<InputProps>`\n  ${inputVariableStyles}\n\n  display: flex;\n\n  /* Remove inline margins from all children */\n  & > * {\n    margin-left: 0;\n    margin-right: 0;\n    box-shadow: none;\n  }\n\n  /* Bring in-focus and active children to the front to maintain outlines */\n  & > *:focus,\n  & > *:active {\n    z-index: 5;\n  }\n\n  /* Remove inline borders for children in the middle */\n  & > *:not(:first-child):not(:last-child) {\n    border-radius: 0 !important;\n    border-inline: 0 !important;\n  }\n\n  /* Remove right border radius from first child */\n  & > *:first-child {\n    border-top-right-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n    border-right: 0 !important;\n  }\n\n  /* Remove left border radius from last child */\n  & > *:last-child {\n    border-top-left-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n    border-left: 0 !important;\n  }\n`;\n"],"names":[],"mappings":";;;AAIa,MAAA,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,EAChC,mBAAmB,CAAA,sbAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/InputGroup/index.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { inputVariableStyles } from '../../utils/forms/variables';\nimport { InputProps } from '../types';\n\nexport type InputGroupProps = React.HTMLAttributes<HTMLDivElement> & InputProps;\n\nexport const InputGroup = styled.div<InputGroupProps>`\n  ${inputVariableStyles}\n\n  display: flex;\n\n  /* Remove inline margins from all children */\n  & > * {\n    margin-left: 0;\n    margin-right: 0;\n    box-shadow: none;\n  }\n\n  /* Bring in-focus and active children to the front to maintain outlines */\n  & > *:focus,\n  & > *:active {\n    z-index: 5;\n  }\n\n  /* Remove inline borders for children in the middle */\n  & > *:not(:first-child):not(:last-child) {\n    border-radius: 0 !important;\n    border-inline: 0 !important;\n  }\n\n  /* Remove right border radius from first child */\n  & > *:first-child {\n    border-top-right-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n    border-right: 0 !important;\n  }\n\n  /* Remove left border radius from last child */\n  & > *:last-child {\n    border-top-left-radius: 0 !important;\n    border-bottom-left-radius: 0 !important;\n    border-left: 0 !important;\n  }\n`;\n"],"names":[],"mappings":";;;AAMa,MAAA,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,EAChC,mBAAmB,CAAA,sbAAA;;;;"}

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');
+require('../Stack/types.cjs');
 var utils = require('./utils.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }

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, isSideDraw } 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    displayMode = 'modal',\n    fullBleed = false,\n    variant = 'base',\n    onClose: parentOnClose,\n    children,\n    ...rest\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 handleClose = () => {\n    if (preventClose) return;\n\n    const result = parentOnClose();\n    if (result === false) return; // Otherwise close on void, or true.\n\n    modalRef.current?.close();\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDialogElement>) => {\n    if (e.key === 'Escape') {\n      e.preventDefault(); // Prevent default ESC behavior\n\n      // Don't close if this is the top level and there are other dialogs open\n      const openDialogs = document.querySelectorAll('dialog[open]');\n      if (openDialogs.length > 1 && modalRef.current === openDialogs[0]) return;\n\n      handleClose();\n    }\n  };\n\n  const handleBackdropClick = async (e: React.MouseEvent<HTMLDialogElement>) => {\n    if (displayMode === 'modal') return;\n    if (e.target === modalRef.current) handleClose();\n  };\n\n  return (\n    <AnimatePresence>\n      {shouldShow && (\n        <div data-testid=\"dialog-wrapper\" style={{ position: 'absolute' }}>\n          <NonScrollableBody />\n          <Dialog\n            displayMode={displayMode}\n            variant={variant}\n            ref={modalRef}\n            onClose={handleClose}\n            onKeyDown={preventClose ? preventDefaultEventOnESC : handleKeyDown}\n            onClick={handleBackdropClick}\n            {...rest}\n            aria-describedby=\"modal_title\"\n            appearance={(isSideDraw(props) && props.appearance) || 'primary'}\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: handleClose })}\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","isSideDraw","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, isSideDraw } 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    displayMode = 'modal',\n    fullBleed = false,\n    variant = 'base',\n    onClose: parentOnClose,\n    children,\n    ...rest\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 handleClose = () => {\n    if (preventClose) return;\n\n    const result = parentOnClose();\n    if (result === false) return; // Otherwise close on void, or true.\n\n    modalRef.current?.close();\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDialogElement>) => {\n    if (e.key === 'Escape') {\n      e.preventDefault(); // Prevent default ESC behavior\n\n      // Don't close if this is the top level and there are other dialogs open\n      const openDialogs = document.querySelectorAll('dialog[open]');\n      if (openDialogs.length > 1 && modalRef.current === openDialogs[0]) return;\n\n      handleClose();\n    }\n  };\n\n  const handleBackdropClick = async (e: React.MouseEvent<HTMLDialogElement>) => {\n    if (displayMode === 'modal') return;\n    if (e.target === modalRef.current) handleClose();\n  };\n\n  return (\n    <AnimatePresence>\n      {shouldShow && (\n        <div data-testid=\"dialog-wrapper\" style={{ position: 'absolute' }}>\n          <NonScrollableBody />\n          <Dialog\n            displayMode={displayMode}\n            variant={variant}\n            ref={modalRef}\n            onClose={handleClose}\n            onKeyDown={preventClose ? preventDefaultEventOnESC : handleKeyDown}\n            onClick={handleBackdropClick}\n            {...rest}\n            aria-describedby=\"modal_title\"\n            appearance={(isSideDraw(props) && props.appearance) || 'primary'}\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: handleClose })}\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","isSideDraw","Card","hasHeaderSlot","CardHeader","MainSection","hasFooterSlot","Stack","Button"],"mappings":"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"}

package/dist/components/Modal/Modal.js

@@ -8,6 +8,7 @@ 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 '../Stack/types.js';
 import { preventDefaultEventOnESC } from './utils.js';
 
 /* eslint-disable react/destructuring-assignment */

package/dist/components/Modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","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, isSideDraw } 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    displayMode = 'modal',\n    fullBleed = false,\n    variant = 'base',\n    onClose: parentOnClose,\n    children,\n    ...rest\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 handleClose = () => {\n    if (preventClose) return;\n\n    const result = parentOnClose();\n    if (result === false) return; // Otherwise close on void, or true.\n\n    modalRef.current?.close();\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDialogElement>) => {\n    if (e.key === 'Escape') {\n      e.preventDefault(); // Prevent default ESC behavior\n\n      // Don't close if this is the top level and there are other dialogs open\n      const openDialogs = document.querySelectorAll('dialog[open]');\n      if (openDialogs.length > 1 && modalRef.current === openDialogs[0]) return;\n\n      handleClose();\n    }\n  };\n\n  const handleBackdropClick = async (e: React.MouseEvent<HTMLDialogElement>) => {\n    if (displayMode === 'modal') return;\n    if (e.target === modalRef.current) handleClose();\n  };\n\n  return (\n    <AnimatePresence>\n      {shouldShow && (\n        <div data-testid=\"dialog-wrapper\" style={{ position: 'absolute' }}>\n          <NonScrollableBody />\n          <Dialog\n            displayMode={displayMode}\n            variant={variant}\n            ref={modalRef}\n            onClose={handleClose}\n            onKeyDown={preventClose ? preventDefaultEventOnESC : handleKeyDown}\n            onClick={handleBackdropClick}\n            {...rest}\n            aria-describedby=\"modal_title\"\n            appearance={(isSideDraw(props) && props.appearance) || 'primary'}\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: handleClose })}\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":["React"],"mappings":"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"}
+{"version":3,"file":"Modal.js","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, isSideDraw } 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    displayMode = 'modal',\n    fullBleed = false,\n    variant = 'base',\n    onClose: parentOnClose,\n    children,\n    ...rest\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 handleClose = () => {\n    if (preventClose) return;\n\n    const result = parentOnClose();\n    if (result === false) return; // Otherwise close on void, or true.\n\n    modalRef.current?.close();\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDialogElement>) => {\n    if (e.key === 'Escape') {\n      e.preventDefault(); // Prevent default ESC behavior\n\n      // Don't close if this is the top level and there are other dialogs open\n      const openDialogs = document.querySelectorAll('dialog[open]');\n      if (openDialogs.length > 1 && modalRef.current === openDialogs[0]) return;\n\n      handleClose();\n    }\n  };\n\n  const handleBackdropClick = async (e: React.MouseEvent<HTMLDialogElement>) => {\n    if (displayMode === 'modal') return;\n    if (e.target === modalRef.current) handleClose();\n  };\n\n  return (\n    <AnimatePresence>\n      {shouldShow && (\n        <div data-testid=\"dialog-wrapper\" style={{ position: 'absolute' }}>\n          <NonScrollableBody />\n          <Dialog\n            displayMode={displayMode}\n            variant={variant}\n            ref={modalRef}\n            onClose={handleClose}\n            onKeyDown={preventClose ? preventDefaultEventOnESC : handleKeyDown}\n            onClick={handleBackdropClick}\n            {...rest}\n            aria-describedby=\"modal_title\"\n            appearance={(isSideDraw(props) && props.appearance) || 'primary'}\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: handleClose })}\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":["React"],"mappings":"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"}

package/dist/components/Pagination/Pagination.cjs

@@ -2,6 +2,7 @@
 
 var React = require('react');
 var Stack = require('../Stack/Stack.cjs');
+require('../Stack/types.cjs');
 var styled = require('./styled.cjs');
 var components = require('./components.cjs');
 var usePagination = require('./hooks/usePagination.cjs');
@@ -9,7 +10,6 @@ var RightArrowIcon = require('../../tempIcons/RightArrowIcon.cjs');
 var StartArrowIcon = require('../../tempIcons/StartArrowIcon.cjs');
 var LeftArrowIcon = require('../../tempIcons/LeftArrowIcon.cjs');
 var EndArrowIcon = require('../../tempIcons/EndArrowIcon.cjs');
-var types = require('../types.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -39,7 +39,7 @@ const Pagination = ({ testId, e2eClassName, currentPage, totalPagesCount, handle
         React__default.default.createElement(styled.PaginationButton, { onClick: handleSkipBack, iconSlot: React__default.default.createElement(StartArrowIcon.StartArrowIcon, null), size: "sm", "aria-label": "go to first page" }),
         React__default.default.createElement(styled.PaginationButton, { onClick: handleDecrement, iconSlot: React__default.default.createElement(LeftArrowIcon.LeftArrowIcon, null), size: "sm", "aria-label": "go to previous page", "aria-disabled": currentPage <= 1 }),
         React__default.default.createElement("form", { onSubmit: handleFormSubmit },
-            React__default.default.createElement(styled.PageInput, { "aria-live": "polite", "aria-label": `page ${currentPage} of ${totalPagesCount}`, size: types.ComponentSize.sm, type: "number", value: pageInputValue, min: "1", max: `${totalPagesCount}`, onChange: handleInputChange, onBlur: handleSubmit })),
+            React__default.default.createElement(styled.PageInput, { "aria-live": "polite", "aria-label": `page ${currentPage} of ${totalPagesCount}`, size: "sm", type: "number", value: pageInputValue, min: "1", max: `${totalPagesCount}`, onChange: handleInputChange, onBlur: handleSubmit })),
         React__default.default.createElement(components.PageCount, { count: totalPagesCount }),
         React__default.default.createElement(styled.PaginationButton, { onClick: handleIncrement, iconSlot: React__default.default.createElement(RightArrowIcon.RightArrowIcon, null), size: "sm", "aria-label": "go to next page", "aria-disabled": currentPage >= totalPagesCount }),
         React__default.default.createElement(styled.PaginationButton, { onClick: handleSkipToEnd, iconSlot: React__default.default.createElement(EndArrowIcon.EndArrowIcon, null), size: "sm", "aria-label": "go to last page", "aria-disabled": currentPage >= totalPagesCount })));

package/dist/components/Pagination/Pagination.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.cjs","sources":["../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import React from 'react';\nimport { PaginationProps } from './types';\n\nimport { Stack } from '../Stack';\nimport { PageInput, PaginationButton } from './styled';\nimport { PageCount } from './components';\nimport { usePagination } from './hooks/usePagination';\n\nimport { RightArrowIcon } from '../../tempIcons/RightArrowIcon';\nimport { StartArrowIcon } from '../../tempIcons/StartArrowIcon';\nimport { LeftArrowIcon } from '../../tempIcons/LeftArrowIcon';\nimport { EndArrowIcon } from '../../tempIcons/EndArrowIcon';\n\nimport { ComponentSize } from '../types';\n\nexport const Pagination = ({\n  testId,\n  e2eClassName,\n  currentPage,\n  totalPagesCount,\n  handleChangePage,\n}: PaginationProps) => {\n  const {\n    pageInputValue,\n    handleIncrement,\n    handleDecrement,\n    handleFormSubmit,\n    handleInputChange,\n    handleSubmit,\n  } = usePagination({\n    currentPage,\n    totalPagesCount,\n    handleChangePage,\n  });\n\n  /**\n   * A function to go back to the first page, provided we aren't already there.\n   */\n  const handleSkipBack = () => {\n    if (currentPage !== 1) handleChangePage(1);\n  };\n\n  /**\n   * A function to go to the last page, provided we aren't already there.\n   */\n  const handleSkipToEnd = () => {\n    if (currentPage !== totalPagesCount) handleChangePage(totalPagesCount);\n  };\n\n  return (\n    <Stack\n      direction=\"horizontal\"\n      alignY=\"center\"\n      spacing=\"xs\"\n      data-testid={testId}\n      className={e2eClassName}\n    >\n      <PaginationButton\n        onClick={handleSkipBack}\n        iconSlot={<StartArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to first page\"\n      />\n      <PaginationButton\n        onClick={handleDecrement}\n        iconSlot={<LeftArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to previous page\"\n        aria-disabled={currentPage <= 1}\n      />\n\n      <form onSubmit={handleFormSubmit}>\n        <PageInput\n          aria-live=\"polite\"\n          aria-label={`page ${currentPage} of ${totalPagesCount}`}\n          size={ComponentSize.sm}\n          type=\"number\"\n          value={pageInputValue}\n          min=\"1\"\n          max={`${totalPagesCount}`}\n          onChange={handleInputChange}\n          onBlur={handleSubmit}\n        />\n      </form>\n\n      <PageCount count={totalPagesCount} />\n\n      <PaginationButton\n        onClick={handleIncrement}\n        iconSlot={<RightArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to next page\"\n        aria-disabled={currentPage >= totalPagesCount}\n      />\n\n      <PaginationButton\n        onClick={handleSkipToEnd}\n        iconSlot={<EndArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to last page\"\n        aria-disabled={currentPage >= totalPagesCount}\n      />\n    </Stack>\n  );\n};\n"],"names":["usePagination","React","Stack","PaginationButton","StartArrowIcon","LeftArrowIcon","PageInput","ComponentSize","PageCount","RightArrowIcon","EndArrowIcon"],"mappings":";;;;;;;;;;;;;;;;;AAea,MAAA,UAAU,GAAG,CAAC,EACzB,MAAM,EACN,YAAY,EACZ,WAAW,EACX,eAAe,EACf,gBAAgB,GACA,KAAI;AACpB,IAAA,MAAM,EACJ,cAAc,EACd,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,iBAAiB,EACjB,YAAY,GACb,GAAGA,2BAAa,CAAC;QAChB,WAAW;QACX,eAAe;QACf,gBAAgB;AACjB,KAAA,CAAC;AAEF;;AAEG;IACH,MAAM,cAAc,GAAG,MAAK;QAC1B,IAAI,WAAW,KAAK,CAAC;YAAE,gBAAgB,CAAC,CAAC,CAAC;AAC5C,KAAC;AAED;;AAEG;IACH,MAAM,eAAe,GAAG,MAAK;QAC3B,IAAI,WAAW,KAAK,eAAe;YAAE,gBAAgB,CAAC,eAAe,CAAC;AACxE,KAAC;IAED,QACEC,qCAACC,WAAK,EAAA,EACJ,SAAS,EAAC,YAAY,EACtB,MAAM,EAAC,QAAQ,EACf,OAAO,EAAC,IAAI,EAAA,aAAA,EACC,MAAM,EACnB,SAAS,EAAE,YAAY,EAAA;AAEvB,QAAAD,sBAAA,CAAA,aAAA,CAACE,uBAAgB,EACf,EAAA,OAAO,EAAE,cAAc,EACvB,QAAQ,EAAEF,sBAAC,CAAA,aAAA,CAAAG,6BAAc,OAAG,EAC5B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,kBAAkB,EAC7B,CAAA;QACFH,sBAAC,CAAA,aAAA,CAAAE,uBAAgB,IACf,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEF,sBAAC,CAAA,aAAA,CAAAI,2BAAa,OAAG,EAC3B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,qBAAqB,EACjB,eAAA,EAAA,WAAW,IAAI,CAAC,EAC/B,CAAA;QAEFJ,sBAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,QAAQ,EAAE,gBAAgB,EAAA;AAC9B,YAAAA,sBAAA,CAAA,aAAA,CAACK,gBAAS,EACE,EAAA,WAAA,EAAA,QAAQ,gBACN,CAAQ,KAAA,EAAA,WAAW,OAAO,eAAe,CAAA,CAAE,EACvD,IAAI,EAAEC,mBAAa,CAAC,EAAE,EACtB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,cAAc,EACrB,GAAG,EAAC,GAAG,EACP,GAAG,EAAE,CAAG,EAAA,eAAe,EAAE,EACzB,QAAQ,EAAE,iBAAiB,EAC3B,MAAM,EAAE,YAAY,GACpB,CACG;AAEP,QAAAN,sBAAA,CAAA,aAAA,CAACO,oBAAS,EAAA,EAAC,KAAK,EAAE,eAAe,EAAI,CAAA;QAErCP,sBAAC,CAAA,aAAA,CAAAE,uBAAgB,IACf,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEF,sBAAC,CAAA,aAAA,CAAAQ,6BAAc,OAAG,EAC5B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,iBAAiB,EACb,eAAA,EAAA,WAAW,IAAI,eAAe,EAC7C,CAAA;QAEFR,sBAAC,CAAA,aAAA,CAAAE,uBAAgB,EACf,EAAA,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEF,sBAAC,CAAA,aAAA,CAAAS,yBAAY,EAAG,IAAA,CAAA,EAC1B,IAAI,EAAC,IAAI,EACE,YAAA,EAAA,iBAAiB,EACb,eAAA,EAAA,WAAW,IAAI,eAAe,EAAA,CAC7C,CACI;AAEZ;;;;"}
+{"version":3,"file":"Pagination.cjs","sources":["../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import React from 'react';\nimport { PaginationProps } from './types';\n\nimport { Stack } from '../Stack';\nimport { PageInput, PaginationButton } from './styled';\nimport { PageCount } from './components';\nimport { usePagination } from './hooks/usePagination';\n\nimport { RightArrowIcon } from '../../tempIcons/RightArrowIcon';\nimport { StartArrowIcon } from '../../tempIcons/StartArrowIcon';\nimport { LeftArrowIcon } from '../../tempIcons/LeftArrowIcon';\nimport { EndArrowIcon } from '../../tempIcons/EndArrowIcon';\n\nexport const Pagination = ({\n  testId,\n  e2eClassName,\n  currentPage,\n  totalPagesCount,\n  handleChangePage,\n}: PaginationProps) => {\n  const {\n    pageInputValue,\n    handleIncrement,\n    handleDecrement,\n    handleFormSubmit,\n    handleInputChange,\n    handleSubmit,\n  } = usePagination({\n    currentPage,\n    totalPagesCount,\n    handleChangePage,\n  });\n\n  /**\n   * A function to go back to the first page, provided we aren't already there.\n   */\n  const handleSkipBack = () => {\n    if (currentPage !== 1) handleChangePage(1);\n  };\n\n  /**\n   * A function to go to the last page, provided we aren't already there.\n   */\n  const handleSkipToEnd = () => {\n    if (currentPage !== totalPagesCount) handleChangePage(totalPagesCount);\n  };\n\n  return (\n    <Stack\n      direction=\"horizontal\"\n      alignY=\"center\"\n      spacing=\"xs\"\n      data-testid={testId}\n      className={e2eClassName}\n    >\n      <PaginationButton\n        onClick={handleSkipBack}\n        iconSlot={<StartArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to first page\"\n      />\n      <PaginationButton\n        onClick={handleDecrement}\n        iconSlot={<LeftArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to previous page\"\n        aria-disabled={currentPage <= 1}\n      />\n\n      <form onSubmit={handleFormSubmit}>\n        <PageInput\n          aria-live=\"polite\"\n          aria-label={`page ${currentPage} of ${totalPagesCount}`}\n          size=\"sm\"\n          type=\"number\"\n          value={pageInputValue}\n          min=\"1\"\n          max={`${totalPagesCount}`}\n          onChange={handleInputChange}\n          onBlur={handleSubmit}\n        />\n      </form>\n\n      <PageCount count={totalPagesCount} />\n\n      <PaginationButton\n        onClick={handleIncrement}\n        iconSlot={<RightArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to next page\"\n        aria-disabled={currentPage >= totalPagesCount}\n      />\n\n      <PaginationButton\n        onClick={handleSkipToEnd}\n        iconSlot={<EndArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to last page\"\n        aria-disabled={currentPage >= totalPagesCount}\n      />\n    </Stack>\n  );\n};\n"],"names":["usePagination","React","Stack","PaginationButton","StartArrowIcon","LeftArrowIcon","PageInput","PageCount","RightArrowIcon","EndArrowIcon"],"mappings":";;;;;;;;;;;;;;;;;AAaa,MAAA,UAAU,GAAG,CAAC,EACzB,MAAM,EACN,YAAY,EACZ,WAAW,EACX,eAAe,EACf,gBAAgB,GACA,KAAI;AACpB,IAAA,MAAM,EACJ,cAAc,EACd,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,iBAAiB,EACjB,YAAY,GACb,GAAGA,2BAAa,CAAC;QAChB,WAAW;QACX,eAAe;QACf,gBAAgB;AACjB,KAAA,CAAC;AAEF;;AAEG;IACH,MAAM,cAAc,GAAG,MAAK;QAC1B,IAAI,WAAW,KAAK,CAAC;YAAE,gBAAgB,CAAC,CAAC,CAAC;AAC5C,KAAC;AAED;;AAEG;IACH,MAAM,eAAe,GAAG,MAAK;QAC3B,IAAI,WAAW,KAAK,eAAe;YAAE,gBAAgB,CAAC,eAAe,CAAC;AACxE,KAAC;IAED,QACEC,qCAACC,WAAK,EAAA,EACJ,SAAS,EAAC,YAAY,EACtB,MAAM,EAAC,QAAQ,EACf,OAAO,EAAC,IAAI,EAAA,aAAA,EACC,MAAM,EACnB,SAAS,EAAE,YAAY,EAAA;AAEvB,QAAAD,sBAAA,CAAA,aAAA,CAACE,uBAAgB,EACf,EAAA,OAAO,EAAE,cAAc,EACvB,QAAQ,EAAEF,sBAAC,CAAA,aAAA,CAAAG,6BAAc,OAAG,EAC5B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,kBAAkB,EAC7B,CAAA;QACFH,sBAAC,CAAA,aAAA,CAAAE,uBAAgB,IACf,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEF,sBAAC,CAAA,aAAA,CAAAI,2BAAa,OAAG,EAC3B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,qBAAqB,EACjB,eAAA,EAAA,WAAW,IAAI,CAAC,EAC/B,CAAA;QAEFJ,sBAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,QAAQ,EAAE,gBAAgB,EAAA;AAC9B,YAAAA,sBAAA,CAAA,aAAA,CAACK,gBAAS,EACE,EAAA,WAAA,EAAA,QAAQ,gBACN,CAAQ,KAAA,EAAA,WAAW,OAAO,eAAe,CAAA,CAAE,EACvD,IAAI,EAAC,IAAI,EACT,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,cAAc,EACrB,GAAG,EAAC,GAAG,EACP,GAAG,EAAE,GAAG,eAAe,CAAA,CAAE,EACzB,QAAQ,EAAE,iBAAiB,EAC3B,MAAM,EAAE,YAAY,GACpB,CACG;AAEP,QAAAL,sBAAA,CAAA,aAAA,CAACM,oBAAS,EAAA,EAAC,KAAK,EAAE,eAAe,EAAI,CAAA;QAErCN,sBAAC,CAAA,aAAA,CAAAE,uBAAgB,IACf,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEF,sBAAC,CAAA,aAAA,CAAAO,6BAAc,OAAG,EAC5B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,iBAAiB,EACb,eAAA,EAAA,WAAW,IAAI,eAAe,EAC7C,CAAA;QAEFP,sBAAC,CAAA,aAAA,CAAAE,uBAAgB,EACf,EAAA,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEF,sBAAC,CAAA,aAAA,CAAAQ,yBAAY,EAAG,IAAA,CAAA,EAC1B,IAAI,EAAC,IAAI,EACE,YAAA,EAAA,iBAAiB,EACb,eAAA,EAAA,WAAW,IAAI,eAAe,EAAA,CAC7C,CACI;AAEZ;;;;"}

package/dist/components/Pagination/Pagination.js

@@ -1,5 +1,6 @@
 import React__default from 'react';
 import { Stack } from '../Stack/Stack.js';
+import '../Stack/types.js';
 import { PaginationButton, PageInput } from './styled.js';
 import { PageCount } from './components.js';
 import { usePagination } from './hooks/usePagination.js';
@@ -7,7 +8,6 @@ import { RightArrowIcon } from '../../tempIcons/RightArrowIcon.js';
 import { StartArrowIcon } from '../../tempIcons/StartArrowIcon.js';
 import { LeftArrowIcon } from '../../tempIcons/LeftArrowIcon.js';
 import { EndArrowIcon } from '../../tempIcons/EndArrowIcon.js';
-import { ComponentSize } from '../types.js';
 
 const Pagination = ({ testId, e2eClassName, currentPage, totalPagesCount, handleChangePage, }) => {
     const { pageInputValue, handleIncrement, handleDecrement, handleFormSubmit, handleInputChange, handleSubmit, } = usePagination({
@@ -33,7 +33,7 @@ const Pagination = ({ testId, e2eClassName, currentPage, totalPagesCount, handle
         React__default.createElement(PaginationButton, { onClick: handleSkipBack, iconSlot: React__default.createElement(StartArrowIcon, null), size: "sm", "aria-label": "go to first page" }),
         React__default.createElement(PaginationButton, { onClick: handleDecrement, iconSlot: React__default.createElement(LeftArrowIcon, null), size: "sm", "aria-label": "go to previous page", "aria-disabled": currentPage <= 1 }),
         React__default.createElement("form", { onSubmit: handleFormSubmit },
-            React__default.createElement(PageInput, { "aria-live": "polite", "aria-label": `page ${currentPage} of ${totalPagesCount}`, size: ComponentSize.sm, type: "number", value: pageInputValue, min: "1", max: `${totalPagesCount}`, onChange: handleInputChange, onBlur: handleSubmit })),
+            React__default.createElement(PageInput, { "aria-live": "polite", "aria-label": `page ${currentPage} of ${totalPagesCount}`, size: "sm", type: "number", value: pageInputValue, min: "1", max: `${totalPagesCount}`, onChange: handleInputChange, onBlur: handleSubmit })),
         React__default.createElement(PageCount, { count: totalPagesCount }),
         React__default.createElement(PaginationButton, { onClick: handleIncrement, iconSlot: React__default.createElement(RightArrowIcon, null), size: "sm", "aria-label": "go to next page", "aria-disabled": currentPage >= totalPagesCount }),
         React__default.createElement(PaginationButton, { onClick: handleSkipToEnd, iconSlot: React__default.createElement(EndArrowIcon, null), size: "sm", "aria-label": "go to last page", "aria-disabled": currentPage >= totalPagesCount })));

package/dist/components/Pagination/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sources":["../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import React from 'react';\nimport { PaginationProps } from './types';\n\nimport { Stack } from '../Stack';\nimport { PageInput, PaginationButton } from './styled';\nimport { PageCount } from './components';\nimport { usePagination } from './hooks/usePagination';\n\nimport { RightArrowIcon } from '../../tempIcons/RightArrowIcon';\nimport { StartArrowIcon } from '../../tempIcons/StartArrowIcon';\nimport { LeftArrowIcon } from '../../tempIcons/LeftArrowIcon';\nimport { EndArrowIcon } from '../../tempIcons/EndArrowIcon';\n\nimport { ComponentSize } from '../types';\n\nexport const Pagination = ({\n  testId,\n  e2eClassName,\n  currentPage,\n  totalPagesCount,\n  handleChangePage,\n}: PaginationProps) => {\n  const {\n    pageInputValue,\n    handleIncrement,\n    handleDecrement,\n    handleFormSubmit,\n    handleInputChange,\n    handleSubmit,\n  } = usePagination({\n    currentPage,\n    totalPagesCount,\n    handleChangePage,\n  });\n\n  /**\n   * A function to go back to the first page, provided we aren't already there.\n   */\n  const handleSkipBack = () => {\n    if (currentPage !== 1) handleChangePage(1);\n  };\n\n  /**\n   * A function to go to the last page, provided we aren't already there.\n   */\n  const handleSkipToEnd = () => {\n    if (currentPage !== totalPagesCount) handleChangePage(totalPagesCount);\n  };\n\n  return (\n    <Stack\n      direction=\"horizontal\"\n      alignY=\"center\"\n      spacing=\"xs\"\n      data-testid={testId}\n      className={e2eClassName}\n    >\n      <PaginationButton\n        onClick={handleSkipBack}\n        iconSlot={<StartArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to first page\"\n      />\n      <PaginationButton\n        onClick={handleDecrement}\n        iconSlot={<LeftArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to previous page\"\n        aria-disabled={currentPage <= 1}\n      />\n\n      <form onSubmit={handleFormSubmit}>\n        <PageInput\n          aria-live=\"polite\"\n          aria-label={`page ${currentPage} of ${totalPagesCount}`}\n          size={ComponentSize.sm}\n          type=\"number\"\n          value={pageInputValue}\n          min=\"1\"\n          max={`${totalPagesCount}`}\n          onChange={handleInputChange}\n          onBlur={handleSubmit}\n        />\n      </form>\n\n      <PageCount count={totalPagesCount} />\n\n      <PaginationButton\n        onClick={handleIncrement}\n        iconSlot={<RightArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to next page\"\n        aria-disabled={currentPage >= totalPagesCount}\n      />\n\n      <PaginationButton\n        onClick={handleSkipToEnd}\n        iconSlot={<EndArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to last page\"\n        aria-disabled={currentPage >= totalPagesCount}\n      />\n    </Stack>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;AAea,MAAA,UAAU,GAAG,CAAC,EACzB,MAAM,EACN,YAAY,EACZ,WAAW,EACX,eAAe,EACf,gBAAgB,GACA,KAAI;AACpB,IAAA,MAAM,EACJ,cAAc,EACd,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,iBAAiB,EACjB,YAAY,GACb,GAAG,aAAa,CAAC;QAChB,WAAW;QACX,eAAe;QACf,gBAAgB;AACjB,KAAA,CAAC;AAEF;;AAEG;IACH,MAAM,cAAc,GAAG,MAAK;QAC1B,IAAI,WAAW,KAAK,CAAC;YAAE,gBAAgB,CAAC,CAAC,CAAC;AAC5C,KAAC;AAED;;AAEG;IACH,MAAM,eAAe,GAAG,MAAK;QAC3B,IAAI,WAAW,KAAK,eAAe;YAAE,gBAAgB,CAAC,eAAe,CAAC;AACxE,KAAC;IAED,QACEA,6BAAC,KAAK,EAAA,EACJ,SAAS,EAAC,YAAY,EACtB,MAAM,EAAC,QAAQ,EACf,OAAO,EAAC,IAAI,EAAA,aAAA,EACC,MAAM,EACnB,SAAS,EAAE,YAAY,EAAA;AAEvB,QAAAA,cAAA,CAAA,aAAA,CAAC,gBAAgB,EACf,EAAA,OAAO,EAAE,cAAc,EACvB,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,cAAc,OAAG,EAC5B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,kBAAkB,EAC7B,CAAA;QACFA,cAAC,CAAA,aAAA,CAAA,gBAAgB,IACf,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,aAAa,OAAG,EAC3B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,qBAAqB,EACjB,eAAA,EAAA,WAAW,IAAI,CAAC,EAC/B,CAAA;QAEFA,cAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,QAAQ,EAAE,gBAAgB,EAAA;AAC9B,YAAAA,cAAA,CAAA,aAAA,CAAC,SAAS,EACE,EAAA,WAAA,EAAA,QAAQ,gBACN,CAAQ,KAAA,EAAA,WAAW,OAAO,eAAe,CAAA,CAAE,EACvD,IAAI,EAAE,aAAa,CAAC,EAAE,EACtB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,cAAc,EACrB,GAAG,EAAC,GAAG,EACP,GAAG,EAAE,CAAG,EAAA,eAAe,EAAE,EACzB,QAAQ,EAAE,iBAAiB,EAC3B,MAAM,EAAE,YAAY,GACpB,CACG;AAEP,QAAAA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAC,KAAK,EAAE,eAAe,EAAI,CAAA;QAErCA,cAAC,CAAA,aAAA,CAAA,gBAAgB,IACf,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,cAAc,OAAG,EAC5B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,iBAAiB,EACb,eAAA,EAAA,WAAW,IAAI,eAAe,EAC7C,CAAA;QAEFA,cAAC,CAAA,aAAA,CAAA,gBAAgB,EACf,EAAA,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,YAAY,EAAG,IAAA,CAAA,EAC1B,IAAI,EAAC,IAAI,EACE,YAAA,EAAA,iBAAiB,EACb,eAAA,EAAA,WAAW,IAAI,eAAe,EAAA,CAC7C,CACI;AAEZ;;;;"}
+{"version":3,"file":"Pagination.js","sources":["../../../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import React from 'react';\nimport { PaginationProps } from './types';\n\nimport { Stack } from '../Stack';\nimport { PageInput, PaginationButton } from './styled';\nimport { PageCount } from './components';\nimport { usePagination } from './hooks/usePagination';\n\nimport { RightArrowIcon } from '../../tempIcons/RightArrowIcon';\nimport { StartArrowIcon } from '../../tempIcons/StartArrowIcon';\nimport { LeftArrowIcon } from '../../tempIcons/LeftArrowIcon';\nimport { EndArrowIcon } from '../../tempIcons/EndArrowIcon';\n\nexport const Pagination = ({\n  testId,\n  e2eClassName,\n  currentPage,\n  totalPagesCount,\n  handleChangePage,\n}: PaginationProps) => {\n  const {\n    pageInputValue,\n    handleIncrement,\n    handleDecrement,\n    handleFormSubmit,\n    handleInputChange,\n    handleSubmit,\n  } = usePagination({\n    currentPage,\n    totalPagesCount,\n    handleChangePage,\n  });\n\n  /**\n   * A function to go back to the first page, provided we aren't already there.\n   */\n  const handleSkipBack = () => {\n    if (currentPage !== 1) handleChangePage(1);\n  };\n\n  /**\n   * A function to go to the last page, provided we aren't already there.\n   */\n  const handleSkipToEnd = () => {\n    if (currentPage !== totalPagesCount) handleChangePage(totalPagesCount);\n  };\n\n  return (\n    <Stack\n      direction=\"horizontal\"\n      alignY=\"center\"\n      spacing=\"xs\"\n      data-testid={testId}\n      className={e2eClassName}\n    >\n      <PaginationButton\n        onClick={handleSkipBack}\n        iconSlot={<StartArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to first page\"\n      />\n      <PaginationButton\n        onClick={handleDecrement}\n        iconSlot={<LeftArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to previous page\"\n        aria-disabled={currentPage <= 1}\n      />\n\n      <form onSubmit={handleFormSubmit}>\n        <PageInput\n          aria-live=\"polite\"\n          aria-label={`page ${currentPage} of ${totalPagesCount}`}\n          size=\"sm\"\n          type=\"number\"\n          value={pageInputValue}\n          min=\"1\"\n          max={`${totalPagesCount}`}\n          onChange={handleInputChange}\n          onBlur={handleSubmit}\n        />\n      </form>\n\n      <PageCount count={totalPagesCount} />\n\n      <PaginationButton\n        onClick={handleIncrement}\n        iconSlot={<RightArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to next page\"\n        aria-disabled={currentPage >= totalPagesCount}\n      />\n\n      <PaginationButton\n        onClick={handleSkipToEnd}\n        iconSlot={<EndArrowIcon />}\n        size=\"sm\"\n        aria-label=\"go to last page\"\n        aria-disabled={currentPage >= totalPagesCount}\n      />\n    </Stack>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;AAaa,MAAA,UAAU,GAAG,CAAC,EACzB,MAAM,EACN,YAAY,EACZ,WAAW,EACX,eAAe,EACf,gBAAgB,GACA,KAAI;AACpB,IAAA,MAAM,EACJ,cAAc,EACd,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,iBAAiB,EACjB,YAAY,GACb,GAAG,aAAa,CAAC;QAChB,WAAW;QACX,eAAe;QACf,gBAAgB;AACjB,KAAA,CAAC;AAEF;;AAEG;IACH,MAAM,cAAc,GAAG,MAAK;QAC1B,IAAI,WAAW,KAAK,CAAC;YAAE,gBAAgB,CAAC,CAAC,CAAC;AAC5C,KAAC;AAED;;AAEG;IACH,MAAM,eAAe,GAAG,MAAK;QAC3B,IAAI,WAAW,KAAK,eAAe;YAAE,gBAAgB,CAAC,eAAe,CAAC;AACxE,KAAC;IAED,QACEA,6BAAC,KAAK,EAAA,EACJ,SAAS,EAAC,YAAY,EACtB,MAAM,EAAC,QAAQ,EACf,OAAO,EAAC,IAAI,EAAA,aAAA,EACC,MAAM,EACnB,SAAS,EAAE,YAAY,EAAA;AAEvB,QAAAA,cAAA,CAAA,aAAA,CAAC,gBAAgB,EACf,EAAA,OAAO,EAAE,cAAc,EACvB,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,cAAc,OAAG,EAC5B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,kBAAkB,EAC7B,CAAA;QACFA,cAAC,CAAA,aAAA,CAAA,gBAAgB,IACf,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,aAAa,OAAG,EAC3B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,qBAAqB,EACjB,eAAA,EAAA,WAAW,IAAI,CAAC,EAC/B,CAAA;QAEFA,cAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,QAAQ,EAAE,gBAAgB,EAAA;AAC9B,YAAAA,cAAA,CAAA,aAAA,CAAC,SAAS,EACE,EAAA,WAAA,EAAA,QAAQ,gBACN,CAAQ,KAAA,EAAA,WAAW,OAAO,eAAe,CAAA,CAAE,EACvD,IAAI,EAAC,IAAI,EACT,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,cAAc,EACrB,GAAG,EAAC,GAAG,EACP,GAAG,EAAE,GAAG,eAAe,CAAA,CAAE,EACzB,QAAQ,EAAE,iBAAiB,EAC3B,MAAM,EAAE,YAAY,GACpB,CACG;AAEP,QAAAA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAC,KAAK,EAAE,eAAe,EAAI,CAAA;QAErCA,cAAC,CAAA,aAAA,CAAA,gBAAgB,IACf,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,cAAc,OAAG,EAC5B,IAAI,EAAC,IAAI,EAAA,YAAA,EACE,iBAAiB,EACb,eAAA,EAAA,WAAW,IAAI,eAAe,EAC7C,CAAA;QAEFA,cAAC,CAAA,aAAA,CAAA,gBAAgB,EACf,EAAA,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,YAAY,EAAG,IAAA,CAAA,EAC1B,IAAI,EAAC,IAAI,EACE,YAAA,EAAA,iBAAiB,EACb,eAAA,EAAA,WAAW,IAAI,eAAe,EAAA,CAC7C,CACI;AAEZ;;;;"}

package/dist/components/Pagination/styled.cjs

@@ -3,6 +3,7 @@
 var styled = require('styled-components');
 var index = require('../../theme/index.cjs');
 var Stack = require('../Stack/Stack.cjs');
+require('../Stack/types.cjs');
 var Button = require('../Button/Button.cjs');
 var index$1 = require('../TextField/index.cjs');
 

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

@@ -1 +1 @@
-{"version":3,"file":"styled.cjs","sources":["../../../src/components/Pagination/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../theme';\nimport { Stack } from '../Stack';\nimport { Button } from '../Button';\nimport { TextField } from '../TextField';\n\nexport const PageLimitContainer = styled(Stack)`\n  width: ${theme.sizes.lg};\n  height: 30px;\n  background-color: ${theme.colors.neutral.grey.light};\n\n  border: 1px solid ${theme.colors.neutral.grey.base};\n  border-radius: ${theme.sizes.xs};\n`;\n\nexport const PaginationButton = styled(Button)`\n  color: ${theme.colors.neutral.ink.base};\n  width: 32px;\n  height: 32px;\n\n  svg {\n    width: 24px;\n    height: 24px;\n  }\n`;\n\nexport const PageInput = styled(TextField)`\n  &[type='number'] {\n    width: 5.5ch;\n  }\n`;\n"],"names":["styled","Stack","theme","Button","TextField"],"mappings":";;;;;;;;;;;;AAMa,MAAA,kBAAkB,GAAGA,uBAAM,CAACC,WAAK,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,yBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EACpCC,WAAK,CAAC,KAAK,CAAC,EAAE,iCAEHA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,kBAAA,EAE/BA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,kBACjCA,WAAK,CAAC,KAAK,CAAC,EAAE;AAGpB,MAAA,gBAAgB,GAAGF,uBAAM,CAACG,aAAM,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EACnCD,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI;MAU3B,SAAS,GAAGF,uBAAM,CAACI,iBAAS,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,8BAAA;;;;;;"}
+{"version":3,"file":"styled.cjs","sources":["../../../src/components/Pagination/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../theme';\nimport { Stack } from '../Stack';\nimport { Button } from '../Button';\nimport { TextField } from '../TextField';\n\nexport const PageLimitContainer = styled(Stack)`\n  width: ${theme.sizes.lg};\n  height: 30px;\n  background-color: ${theme.colors.neutral.grey.light};\n\n  border: 1px solid ${theme.colors.neutral.grey.base};\n  border-radius: ${theme.sizes.xs};\n`;\n\nexport const PaginationButton = styled(Button)`\n  color: ${theme.colors.neutral.ink.base};\n  width: 32px;\n  height: 32px;\n\n  svg {\n    width: 24px;\n    height: 24px;\n  }\n`;\n\nexport const PageInput = styled(TextField)`\n  &[type='number'] {\n    width: 5.5ch;\n  }\n`;\n"],"names":["styled","Stack","theme","Button","TextField"],"mappings":";;;;;;;;;;;;;AAMa,MAAA,kBAAkB,GAAGA,uBAAM,CAACC,WAAK,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,yBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EACpCC,WAAK,CAAC,KAAK,CAAC,EAAE,iCAEHA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,kBAAA,EAE/BA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,kBACjCA,WAAK,CAAC,KAAK,CAAC,EAAE;AAGpB,MAAA,gBAAgB,GAAGF,uBAAM,CAACG,aAAM,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EACnCD,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI;MAU3B,SAAS,GAAGF,uBAAM,CAACI,iBAAS,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,8BAAA;;;;;;"}

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const PageLimitContainer: import("styled-components").StyledComponent<"div", any, import("../Stack/types").StackProps, never>;
+export declare const PageLimitContainer: import("styled-components").StyledComponent<"div", any, import("../Stack").StackProps, never>;
 export declare const PaginationButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
     children?: import("react").ReactNode;
     variant?: import("../Button/types").ButtonVariant | undefined;
@@ -305,7 +305,7 @@ export declare const PageInput: import("styled-components").StyledComponent<impo
     wrap?: string | undefined;
 } & {
     value?: string | undefined;
-    type?: import("../TextField/types").TextFieldType | undefined;
+    type?: import("../TextField").TextFieldType | undefined;
     onChange?: ((value: string) => void) | undefined;
     hasError?: boolean | undefined;
     size?: import("../types").ComponentSize | undefined;

package/dist/components/Pagination/styled.js

@@ -1,6 +1,7 @@
 import styled from 'styled-components';
 import { theme } from '../../theme/index.js';
 import { Stack } from '../Stack/Stack.js';
+import '../Stack/types.js';
 import { Button } from '../Button/Button.js';
 import { TextField } from '../TextField/index.js';
 

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

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../src/components/Pagination/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../theme';\nimport { Stack } from '../Stack';\nimport { Button } from '../Button';\nimport { TextField } from '../TextField';\n\nexport const PageLimitContainer = styled(Stack)`\n  width: ${theme.sizes.lg};\n  height: 30px;\n  background-color: ${theme.colors.neutral.grey.light};\n\n  border: 1px solid ${theme.colors.neutral.grey.base};\n  border-radius: ${theme.sizes.xs};\n`;\n\nexport const PaginationButton = styled(Button)`\n  color: ${theme.colors.neutral.ink.base};\n  width: 32px;\n  height: 32px;\n\n  svg {\n    width: 24px;\n    height: 24px;\n  }\n`;\n\nexport const PageInput = styled(TextField)`\n  &[type='number'] {\n    width: 5.5ch;\n  }\n`;\n"],"names":[],"mappings":";;;;;;AAMa,MAAA,kBAAkB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,yBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EACpC,KAAK,CAAC,KAAK,CAAC,EAAE,iCAEH,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,kBAAA,EAE/B,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,kBACjC,KAAK,CAAC,KAAK,CAAC,EAAE;AAGpB,MAAA,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EACnC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI;MAU3B,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,8BAAA;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../src/components/Pagination/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../theme';\nimport { Stack } from '../Stack';\nimport { Button } from '../Button';\nimport { TextField } from '../TextField';\n\nexport const PageLimitContainer = styled(Stack)`\n  width: ${theme.sizes.lg};\n  height: 30px;\n  background-color: ${theme.colors.neutral.grey.light};\n\n  border: 1px solid ${theme.colors.neutral.grey.base};\n  border-radius: ${theme.sizes.xs};\n`;\n\nexport const PaginationButton = styled(Button)`\n  color: ${theme.colors.neutral.ink.base};\n  width: 32px;\n  height: 32px;\n\n  svg {\n    width: 24px;\n    height: 24px;\n  }\n`;\n\nexport const PageInput = styled(TextField)`\n  &[type='number'] {\n    width: 5.5ch;\n  }\n`;\n"],"names":[],"mappings":";;;;;;;AAMa,MAAA,kBAAkB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,yBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EACpC,KAAK,CAAC,KAAK,CAAC,EAAE,iCAEH,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,kBAAA,EAE/B,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,kBACjC,KAAK,CAAC,KAAK,CAAC,EAAE;AAGpB,MAAA,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EACnC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI;MAU3B,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,8BAAA;;;;"}

package/dist/components/PriceInput/PriceInput.cjs

@@ -1,10 +1,9 @@
 'use strict';
 
 var React = require('react');
-var types = require('../types.cjs');
+var withLabels = require('../../hoc/withLabels/withLabels.cjs');
 var Stepper = require('../Stepper/Stepper.cjs');
 var InputAffix = require('../InputAffix/InputAffix.cjs');
-var withLabels = require('../../hoc/withLabels/withLabels.cjs');
 var index = require('../InputGroup/index.cjs');
 var index$1 = require('../TextField/index.cjs');
 
@@ -13,11 +12,12 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 const fractionDigits = 2;
+const flexStyle = { flex: 1 };
 function stringToFixed(price) {
     const floatPrice = parseFloat(price.replace(',', '.'));
     return floatPrice.toFixed(fractionDigits);
 }
-const PriceInput = withLabels.withLabels(({ className = '', hasError, currency, disabled = false, onChange, onPriceChange, priceValue, step = '0.1', size = types.ComponentSize.base, ...otherProps }) => {
+const PriceInput = withLabels.withLabels(({ className = '', hasError, currency, disabled = false, onChange, onPriceChange, priceValue, step = '0.1', size = 'base', ...otherProps }) => {
     const handleChange = (value) => onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));
     const handleBlur = (e) => {
         const target = e.target;
@@ -53,9 +53,9 @@ const PriceInput = withLabels.withLabels(({ className = '', hasError, currency,
             handleDecrement(onChange);
     };
     const compact = size === 'sm';
-    return (React__default.default.createElement(index.InputGroup, { className: className, hasError: hasError },
+    return (React__default.default.createElement(index.InputGroup, { hasError: hasError, style: flexStyle, className: className },
         React__default.default.createElement(InputAffix.InputAffix, { compact: compact, hasError: hasError }, currency),
-        React__default.default.createElement(index$1.TextField, { placeholder: "0.00", type: "currency", value: priceValue, step: step, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, disabled: disabled, size: size, hasError: hasError, ...otherProps }),
+        React__default.default.createElement(index$1.TextField, { placeholder: "0.00", value: priceValue, step: step, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, disabled: disabled, size: size, hasError: hasError, style: flexStyle, ...otherProps }),
         React__default.default.createElement(Stepper.Stepper, { onIncrement: () => handleIncrement(), onDecrement: () => handleDecrement(), disabled: disabled, hasError: hasError, size: size })));
 });
 PriceInput.displayName = 'PriceInput';

package/dist/components/PriceInput/PriceInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PriceInput.cjs","sources":["../../../src/components/PriceInput/PriceInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { ComponentSize } from '../types';\nimport { Stepper } from '../Stepper';\nimport type { TextFieldProps } from '../TextField/types';\nimport { InputAffix } from '../InputAffix';\nimport { withLabels } from '../../hoc';\n\nimport { PriceInputProps } from './types';\nimport { InputGroup } from '../InputGroup';\nimport { TextField } from '../TextField';\n\nconst fractionDigits = 2;\n\nfunction stringToFixed(price: string) {\n  const floatPrice = parseFloat(price.replace(',', '.'));\n  return floatPrice.toFixed(fractionDigits);\n}\n\nexport const PriceInput = withLabels<PriceInputProps>(\n  ({\n    className = '',\n    hasError,\n    currency,\n    disabled = false,\n    onChange,\n    onPriceChange,\n    priceValue,\n    step = '0.1',\n    size = ComponentSize.base,\n    ...otherProps\n  }) => {\n    const handleChange = (value: string) =>\n      onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));\n\n    const handleBlur: TextFieldProps['onBlur'] = (e) => {\n      const target = e.target as HTMLInputElement;\n      const { value } = target;\n\n      if (!value) {\n        onPriceChange('');\n\n        return;\n      }\n\n      const roundedValue = stringToFixed(value);\n\n      onPriceChange(roundedValue);\n    };\n\n    const handleIncrement = (callback = onPriceChange) => {\n      const currentPrice = parseFloat(priceValue) || 0;\n      const currentStep = parseFloat(step);\n\n      callback((currentPrice + currentStep).toFixed(fractionDigits));\n    };\n    const handleDecrement = (callback = onPriceChange) => {\n      const currentPrice = parseFloat(priceValue) || 0;\n      const currentStep = parseFloat(step);\n\n      callback((currentPrice - currentStep).toFixed(fractionDigits));\n    };\n\n    const handleKeyDown: TextFieldProps['onKeyDown'] = (e) => {\n      const { key } = e;\n      const target = e.target as HTMLInputElement;\n      const isInForm = target.form;\n\n      if (!isInForm) {\n        if (key === 'Enter') target.blur();\n      }\n      if (key === 'ArrowUp') handleIncrement(onChange);\n      if (key === 'ArrowDown') handleDecrement(onChange);\n    };\n\n    const compact = size === 'sm';\n\n    return (\n      <InputGroup className={className} hasError={hasError}>\n        <InputAffix compact={compact} hasError={hasError}>\n          {currency}\n        </InputAffix>\n        <TextField\n          placeholder=\"0.00\"\n          type=\"currency\"\n          value={priceValue}\n          step={step}\n          onChange={handleChange}\n          onBlur={handleBlur}\n          onKeyDown={handleKeyDown}\n          disabled={disabled}\n          size={size}\n          hasError={hasError}\n          {...otherProps}\n        />\n        <Stepper\n          onIncrement={() => handleIncrement()}\n          onDecrement={() => handleDecrement()}\n          disabled={disabled}\n          hasError={hasError}\n          size={size}\n        />\n      </InputGroup>\n    );\n  },\n);\n\nPriceInput.displayName = 'PriceInput';\n"],"names":["withLabels","ComponentSize","React","InputGroup","InputAffix","TextField","Stepper"],"mappings":";;;;;;;;;;;;;;AAYA,MAAM,cAAc,GAAG,CAAC;AAExB,SAAS,aAAa,CAAC,KAAa,EAAA;AAClC,IAAA,MAAM,UAAU,GAAG,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;AACtD,IAAA,OAAO,UAAU,CAAC,OAAO,CAAC,cAAc,CAAC;AAC3C;AAEa,MAAA,UAAU,GAAGA,qBAAU,CAClC,CAAC,EACC,SAAS,GAAG,EAAE,EACd,QAAQ,EACR,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,aAAa,EACb,UAAU,EACV,IAAI,GAAG,KAAK,EACZ,IAAI,GAAGC,mBAAa,CAAC,IAAI,EACzB,GAAG,UAAU,EACd,KAAI;IACH,MAAM,YAAY,GAAG,CAAC,KAAa,KACjC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;AAE5D,IAAA,MAAM,UAAU,GAA6B,CAAC,CAAC,KAAI;AACjD,QAAA,MAAM,MAAM,GAAG,CAAC,CAAC,MAA0B;AAC3C,QAAA,MAAM,EAAE,KAAK,EAAE,GAAG,MAAM;QAExB,IAAI,CAAC,KAAK,EAAE;YACV,aAAa,CAAC,EAAE,CAAC;YAEjB;AACD;AAED,QAAA,MAAM,YAAY,GAAG,aAAa,CAAC,KAAK,CAAC;QAEzC,aAAa,CAAC,YAAY,CAAC;AAC7B,KAAC;AAED,IAAA,MAAM,eAAe,GAAG,CAAC,QAAQ,GAAG,aAAa,KAAI;QACnD,MAAM,YAAY,GAAG,UAAU,CAAC,UAAU,CAAC,IAAI,CAAC;AAChD,QAAA,MAAM,WAAW,GAAG,UAAU,CAAC,IAAI,CAAC;AAEpC,QAAA,QAAQ,CAAC,CAAC,YAAY,GAAG,WAAW,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;AAChE,KAAC;AACD,IAAA,MAAM,eAAe,GAAG,CAAC,QAAQ,GAAG,aAAa,KAAI;QACnD,MAAM,YAAY,GAAG,UAAU,CAAC,UAAU,CAAC,IAAI,CAAC;AAChD,QAAA,MAAM,WAAW,GAAG,UAAU,CAAC,IAAI,CAAC;AAEpC,QAAA,QAAQ,CAAC,CAAC,YAAY,GAAG,WAAW,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;AAChE,KAAC;AAED,IAAA,MAAM,aAAa,GAAgC,CAAC,CAAC,KAAI;AACvD,QAAA,MAAM,EAAE,GAAG,EAAE,GAAG,CAAC;AACjB,QAAA,MAAM,MAAM,GAAG,CAAC,CAAC,MAA0B;AAC3C,QAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI;QAE5B,IAAI,CAAC,QAAQ,EAAE;YACb,IAAI,GAAG,KAAK,OAAO;gBAAE,MAAM,CAAC,IAAI,EAAE;AACnC;QACD,IAAI,GAAG,KAAK,SAAS;YAAE,eAAe,CAAC,QAAQ,CAAC;QAChD,IAAI,GAAG,KAAK,WAAW;YAAE,eAAe,CAAC,QAAQ,CAAC;AACpD,KAAC;AAED,IAAA,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI;IAE7B,QACEC,sBAAC,CAAA,aAAA,CAAAC,gBAAU,EAAC,EAAA,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAA;QAClDD,sBAAC,CAAA,aAAA,CAAAE,qBAAU,EAAC,EAAA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAC7C,EAAA,QAAQ,CACE;AACb,QAAAF,sBAAA,CAAA,aAAA,CAACG,iBAAS,EACR,EAAA,WAAW,EAAC,MAAM,EAClB,IAAI,EAAC,UAAU,EACf,KAAK,EAAE,UAAU,EACjB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAAA,GACd,UAAU,EACd,CAAA;AACF,QAAAH,sBAAA,CAAA,aAAA,CAACI,eAAO,EAAA,EACN,WAAW,EAAE,MAAM,eAAe,EAAE,EACpC,WAAW,EAAE,MAAM,eAAe,EAAE,EACpC,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,CAAA,CACS;AAEjB,CAAC;AAGH,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
+{"version":3,"file":"PriceInput.cjs","sources":["../../../src/components/PriceInput/PriceInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { PriceInputProps } from './types';\n\nimport { Stepper } from '../Stepper';\nimport { InputAffix } from '../InputAffix';\nimport { InputGroup } from '../InputGroup';\nimport { TextField, TextFieldProps } from '../TextField';\n\nconst fractionDigits = 2;\n\nconst flexStyle = { flex: 1 };\n\nfunction stringToFixed(price: string) {\n  const floatPrice = parseFloat(price.replace(',', '.'));\n  return floatPrice.toFixed(fractionDigits);\n}\n\nexport const PriceInput = withLabels<PriceInputProps>(\n  ({\n    className = '',\n    hasError,\n    currency,\n    disabled = false,\n    onChange,\n    onPriceChange,\n    priceValue,\n    step = '0.1',\n    size = 'base',\n    ...otherProps\n  }) => {\n    const handleChange = (value: string) =>\n      onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));\n\n    const handleBlur: TextFieldProps['onBlur'] = (e) => {\n      const target = e.target as HTMLInputElement;\n      const { value } = target;\n\n      if (!value) {\n        onPriceChange('');\n\n        return;\n      }\n\n      const roundedValue = stringToFixed(value);\n\n      onPriceChange(roundedValue);\n    };\n\n    const handleIncrement = (callback = onPriceChange) => {\n      const currentPrice = parseFloat(priceValue) || 0;\n      const currentStep = parseFloat(step);\n\n      callback((currentPrice + currentStep).toFixed(fractionDigits));\n    };\n    const handleDecrement = (callback = onPriceChange) => {\n      const currentPrice = parseFloat(priceValue) || 0;\n      const currentStep = parseFloat(step);\n\n      callback((currentPrice - currentStep).toFixed(fractionDigits));\n    };\n\n    const handleKeyDown: TextFieldProps['onKeyDown'] = (e) => {\n      const { key } = e;\n      const target = e.target as HTMLInputElement;\n      const isInForm = target.form;\n\n      if (!isInForm) {\n        if (key === 'Enter') target.blur();\n      }\n      if (key === 'ArrowUp') handleIncrement(onChange);\n      if (key === 'ArrowDown') handleDecrement(onChange);\n    };\n\n    const compact = size === 'sm';\n\n    return (\n      <InputGroup hasError={hasError} style={flexStyle} className={className}>\n        <InputAffix compact={compact} hasError={hasError}>\n          {currency}\n        </InputAffix>\n        <TextField\n          placeholder=\"0.00\"\n          value={priceValue}\n          step={step}\n          onChange={handleChange}\n          onBlur={handleBlur}\n          onKeyDown={handleKeyDown}\n          disabled={disabled}\n          size={size}\n          hasError={hasError}\n          style={flexStyle}\n          {...otherProps}\n        />\n        <Stepper\n          onIncrement={() => handleIncrement()}\n          onDecrement={() => handleDecrement()}\n          disabled={disabled}\n          hasError={hasError}\n          size={size}\n        />\n      </InputGroup>\n    );\n  },\n);\n\nPriceInput.displayName = 'PriceInput';\n"],"names":["withLabels","React","InputGroup","InputAffix","TextField","Stepper"],"mappings":"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"}

package/dist/components/PriceInput/PriceInput.js

@@ -1,17 +1,17 @@
 import React__default from 'react';
-import { ComponentSize } from '../types.js';
+import { withLabels } from '../../hoc/withLabels/withLabels.js';
 import { Stepper } from '../Stepper/Stepper.js';
 import { InputAffix } from '../InputAffix/InputAffix.js';
-import { withLabels } from '../../hoc/withLabels/withLabels.js';
 import { InputGroup } from '../InputGroup/index.js';
 import { TextField } from '../TextField/index.js';
 
 const fractionDigits = 2;
+const flexStyle = { flex: 1 };
 function stringToFixed(price) {
     const floatPrice = parseFloat(price.replace(',', '.'));
     return floatPrice.toFixed(fractionDigits);
 }
-const PriceInput = withLabels(({ className = '', hasError, currency, disabled = false, onChange, onPriceChange, priceValue, step = '0.1', size = ComponentSize.base, ...otherProps }) => {
+const PriceInput = withLabels(({ className = '', hasError, currency, disabled = false, onChange, onPriceChange, priceValue, step = '0.1', size = 'base', ...otherProps }) => {
     const handleChange = (value) => onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));
     const handleBlur = (e) => {
         const target = e.target;
@@ -47,9 +47,9 @@ const PriceInput = withLabels(({ className = '', hasError, currency, disabled =
             handleDecrement(onChange);
     };
     const compact = size === 'sm';
-    return (React__default.createElement(InputGroup, { className: className, hasError: hasError },
+    return (React__default.createElement(InputGroup, { hasError: hasError, style: flexStyle, className: className },
         React__default.createElement(InputAffix, { compact: compact, hasError: hasError }, currency),
-        React__default.createElement(TextField, { placeholder: "0.00", type: "currency", value: priceValue, step: step, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, disabled: disabled, size: size, hasError: hasError, ...otherProps }),
+        React__default.createElement(TextField, { placeholder: "0.00", value: priceValue, step: step, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, disabled: disabled, size: size, hasError: hasError, style: flexStyle, ...otherProps }),
         React__default.createElement(Stepper, { onIncrement: () => handleIncrement(), onDecrement: () => handleDecrement(), disabled: disabled, hasError: hasError, size: size })));
 });
 PriceInput.displayName = 'PriceInput';

package/dist/components/PriceInput/PriceInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"PriceInput.js","sources":["../../../src/components/PriceInput/PriceInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { ComponentSize } from '../types';\nimport { Stepper } from '../Stepper';\nimport type { TextFieldProps } from '../TextField/types';\nimport { InputAffix } from '../InputAffix';\nimport { withLabels } from '../../hoc';\n\nimport { PriceInputProps } from './types';\nimport { InputGroup } from '../InputGroup';\nimport { TextField } from '../TextField';\n\nconst fractionDigits = 2;\n\nfunction stringToFixed(price: string) {\n  const floatPrice = parseFloat(price.replace(',', '.'));\n  return floatPrice.toFixed(fractionDigits);\n}\n\nexport const PriceInput = withLabels<PriceInputProps>(\n  ({\n    className = '',\n    hasError,\n    currency,\n    disabled = false,\n    onChange,\n    onPriceChange,\n    priceValue,\n    step = '0.1',\n    size = ComponentSize.base,\n    ...otherProps\n  }) => {\n    const handleChange = (value: string) =>\n      onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));\n\n    const handleBlur: TextFieldProps['onBlur'] = (e) => {\n      const target = e.target as HTMLInputElement;\n      const { value } = target;\n\n      if (!value) {\n        onPriceChange('');\n\n        return;\n      }\n\n      const roundedValue = stringToFixed(value);\n\n      onPriceChange(roundedValue);\n    };\n\n    const handleIncrement = (callback = onPriceChange) => {\n      const currentPrice = parseFloat(priceValue) || 0;\n      const currentStep = parseFloat(step);\n\n      callback((currentPrice + currentStep).toFixed(fractionDigits));\n    };\n    const handleDecrement = (callback = onPriceChange) => {\n      const currentPrice = parseFloat(priceValue) || 0;\n      const currentStep = parseFloat(step);\n\n      callback((currentPrice - currentStep).toFixed(fractionDigits));\n    };\n\n    const handleKeyDown: TextFieldProps['onKeyDown'] = (e) => {\n      const { key } = e;\n      const target = e.target as HTMLInputElement;\n      const isInForm = target.form;\n\n      if (!isInForm) {\n        if (key === 'Enter') target.blur();\n      }\n      if (key === 'ArrowUp') handleIncrement(onChange);\n      if (key === 'ArrowDown') handleDecrement(onChange);\n    };\n\n    const compact = size === 'sm';\n\n    return (\n      <InputGroup className={className} hasError={hasError}>\n        <InputAffix compact={compact} hasError={hasError}>\n          {currency}\n        </InputAffix>\n        <TextField\n          placeholder=\"0.00\"\n          type=\"currency\"\n          value={priceValue}\n          step={step}\n          onChange={handleChange}\n          onBlur={handleBlur}\n          onKeyDown={handleKeyDown}\n          disabled={disabled}\n          size={size}\n          hasError={hasError}\n          {...otherProps}\n        />\n        <Stepper\n          onIncrement={() => handleIncrement()}\n          onDecrement={() => handleDecrement()}\n          disabled={disabled}\n          hasError={hasError}\n          size={size}\n        />\n      </InputGroup>\n    );\n  },\n);\n\nPriceInput.displayName = 'PriceInput';\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"PriceInput.js","sources":["../../../src/components/PriceInput/PriceInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { PriceInputProps } from './types';\n\nimport { Stepper } from '../Stepper';\nimport { InputAffix } from '../InputAffix';\nimport { InputGroup } from '../InputGroup';\nimport { TextField, TextFieldProps } from '../TextField';\n\nconst fractionDigits = 2;\n\nconst flexStyle = { flex: 1 };\n\nfunction stringToFixed(price: string) {\n  const floatPrice = parseFloat(price.replace(',', '.'));\n  return floatPrice.toFixed(fractionDigits);\n}\n\nexport const PriceInput = withLabels<PriceInputProps>(\n  ({\n    className = '',\n    hasError,\n    currency,\n    disabled = false,\n    onChange,\n    onPriceChange,\n    priceValue,\n    step = '0.1',\n    size = 'base',\n    ...otherProps\n  }) => {\n    const handleChange = (value: string) =>\n      onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));\n\n    const handleBlur: TextFieldProps['onBlur'] = (e) => {\n      const target = e.target as HTMLInputElement;\n      const { value } = target;\n\n      if (!value) {\n        onPriceChange('');\n\n        return;\n      }\n\n      const roundedValue = stringToFixed(value);\n\n      onPriceChange(roundedValue);\n    };\n\n    const handleIncrement = (callback = onPriceChange) => {\n      const currentPrice = parseFloat(priceValue) || 0;\n      const currentStep = parseFloat(step);\n\n      callback((currentPrice + currentStep).toFixed(fractionDigits));\n    };\n    const handleDecrement = (callback = onPriceChange) => {\n      const currentPrice = parseFloat(priceValue) || 0;\n      const currentStep = parseFloat(step);\n\n      callback((currentPrice - currentStep).toFixed(fractionDigits));\n    };\n\n    const handleKeyDown: TextFieldProps['onKeyDown'] = (e) => {\n      const { key } = e;\n      const target = e.target as HTMLInputElement;\n      const isInForm = target.form;\n\n      if (!isInForm) {\n        if (key === 'Enter') target.blur();\n      }\n      if (key === 'ArrowUp') handleIncrement(onChange);\n      if (key === 'ArrowDown') handleDecrement(onChange);\n    };\n\n    const compact = size === 'sm';\n\n    return (\n      <InputGroup hasError={hasError} style={flexStyle} className={className}>\n        <InputAffix compact={compact} hasError={hasError}>\n          {currency}\n        </InputAffix>\n        <TextField\n          placeholder=\"0.00\"\n          value={priceValue}\n          step={step}\n          onChange={handleChange}\n          onBlur={handleBlur}\n          onKeyDown={handleKeyDown}\n          disabled={disabled}\n          size={size}\n          hasError={hasError}\n          style={flexStyle}\n          {...otherProps}\n        />\n        <Stepper\n          onIncrement={() => handleIncrement()}\n          onDecrement={() => handleDecrement()}\n          disabled={disabled}\n          hasError={hasError}\n          size={size}\n        />\n      </InputGroup>\n    );\n  },\n);\n\nPriceInput.displayName = 'PriceInput';\n"],"names":["React"],"mappings":"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"}

package/dist/components/Search/Search.cjs

@@ -1,20 +1,24 @@
 'use strict';
 
 var React = require('react');
-var Button = require('../Button/Button.cjs');
 var index = require('../../theme/index.cjs');
-var styled = require('./styled.cjs');
+var withLabels = require('../../hoc/withLabels/withLabels.cjs');
+var sizes = require('../../theme/modules/sizes.cjs');
+var Button = require('../Button/Button.cjs');
 var CrossIcon = require('../../tempIcons/CrossIcon.cjs');
 var SearchIcon = require('../../tempIcons/SearchIcon.cjs');
-var sizes = require('../../theme/modules/sizes.cjs');
+var styled = require('./styled.cjs');
 var Loader = require('../Loader/Loader.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
-const Search = ({ type = 'text', disabled = false, onClearClick, onChange, onBlur, onFocus, onKeyUp, onKeyDown, onKeyPress, value = '', error, placeholder = '', className = '', name, isLoading = false, fill, reversed = false, autoComplete = 'on', size, }) => {
+const Search = withLabels.withLabels(({ type = 'text', disabled = false, onClearClick, onChange, onBlur, onFocus, onKeyUp, onKeyDown, onKeyPress, value = '', hasError, placeholder = '', className = '', name, isLoading = false, fill, reversed = false, autoComplete = 'on', size, }) => {
     const shouldShowClear = value && value.length > 0;
+    const onClickSearch = () => {
+        onChange === null || onChange === undefined ? undefined : onChange(value);
+    };
     const renderIcon = () => {
         if (isLoading) {
             return React__default.default.createElement(Loader.Loader, { height: 24, color: fill || index.theme.colors.secondary.blue.base });
@@ -23,13 +27,13 @@ const Search = ({ type = 'text', disabled = false, onClearClick, onChange, onBlu
             return (React__default.default.createElement(Button.Button, { variant: "unstyled", onClick: onClearClick, style: { display: 'flex' }, "aria-label": "Clear text", type: "button" },
                 React__default.default.createElement(CrossIcon.CrossIcon, { color: fill || index.theme.colors.neutral.ink.dark })));
         }
-        return (React__default.default.createElement(Button.Button, { variant: "unstyled", onClick: () => onChange(value), style: { display: 'flex' }, "aria-label": "Search", disabled: disabled, type: "button" },
+        return (React__default.default.createElement(Button.Button, { variant: "unstyled", onClick: onClickSearch, style: { display: 'flex' }, "aria-label": "Search", disabled: disabled, type: "button" },
             React__default.default.createElement(SearchIcon.SearchIcon, { color: fill || index.theme.colors.neutral.ink.dark, height: sizes.sizes.md, width: sizes.sizes.md })));
     };
     return (React__default.default.createElement(styled.Container, { className: className, iconPosition: reversed ? 'left' : 'right' },
-        React__default.default.createElement(styled.Input, { size: size, type: type, value: value, onChange: onChange, onBlur: onBlur, onFocus: onFocus, onKeyUp: onKeyUp, onKeyDown: onKeyDown, onKeyPress: onKeyPress, placeholder: placeholder, name: name, disabled: disabled, error: error, autoComplete: autoComplete }),
+        React__default.default.createElement(styled.Input, { size: size, type: type, value: value, onChange: onChange, onBlur: onBlur, onFocus: onFocus, onKeyUp: onKeyUp, onKeyDown: onKeyDown, onKeyPress: onKeyPress, placeholder: placeholder, name: name, disabled: disabled, hasError: hasError, autoComplete: autoComplete }),
         React__default.default.createElement(styled.IconContainer, null, renderIcon())));
-};
+});
 
 exports.Search = Search;
 //# sourceMappingURL=Search.cjs.map

package/dist/components/Search/Search.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Search.cjs","sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Button } from '../Button';\n\nimport { theme } from '../../theme';\n\nimport { Container, Input, IconContainer, Loader } from './styled';\nimport { SearchProps } from './types';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { SearchIcon } from '../../tempIcons/SearchIcon';\nimport { sizes } from '../../theme/modules/sizes';\n\nexport const Search = ({\n  type = 'text',\n  disabled = false,\n  onClearClick,\n  onChange,\n  onBlur,\n  onFocus,\n  onKeyUp,\n  onKeyDown,\n  onKeyPress,\n  value = '',\n  error,\n  placeholder = '',\n  className = '',\n  name,\n  isLoading = false,\n  fill,\n  reversed = false,\n  autoComplete = 'on',\n  size,\n}: SearchProps) => {\n  const shouldShowClear = value && value.length > 0;\n\n  const renderIcon = () => {\n    if (isLoading) {\n      return <Loader height={24} color={fill || theme.colors.secondary.blue.base} />;\n    }\n    if (shouldShowClear && onClearClick) {\n      return (\n        <Button\n          variant=\"unstyled\"\n          onClick={onClearClick}\n          style={{ display: 'flex' }}\n          aria-label=\"Clear text\"\n          type=\"button\"\n        >\n          <CrossIcon color={fill || theme.colors.neutral.ink.dark} />\n        </Button>\n      );\n    }\n    return (\n      <Button\n        variant=\"unstyled\"\n        onClick={() => onChange(value)}\n        style={{ display: 'flex' }}\n        aria-label=\"Search\"\n        disabled={disabled}\n        type=\"button\"\n      >\n        <SearchIcon\n          color={fill || theme.colors.neutral.ink.dark}\n          height={sizes.md}\n          width={sizes.md}\n        />\n      </Button>\n    );\n  };\n\n  return (\n    <Container className={className} iconPosition={reversed ? 'left' : 'right'}>\n      <Input\n        size={size}\n        type={type}\n        value={value}\n        onChange={onChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyUp={onKeyUp}\n        onKeyDown={onKeyDown}\n        onKeyPress={onKeyPress}\n        placeholder={placeholder}\n        name={name}\n        disabled={disabled}\n        error={error}\n        autoComplete={autoComplete}\n      />\n      <IconContainer>{renderIcon()}</IconContainer>\n    </Container>\n  );\n};\n"],"names":["React","Loader","theme","Button","CrossIcon","SearchIcon","sizes","Container","Input","IconContainer"],"mappings":";;;;;;;;;;;;;;;AAYO,MAAM,MAAM,GAAG,CAAC,EACrB,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,YAAY,EACZ,QAAQ,EACR,MAAM,EACN,OAAO,EACP,OAAO,EACP,SAAS,EACT,UAAU,EACV,KAAK,GAAG,EAAE,EACV,KAAK,EACL,WAAW,GAAG,EAAE,EAChB,SAAS,GAAG,EAAE,EACd,IAAI,EACJ,SAAS,GAAG,KAAK,EACjB,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,YAAY,GAAG,IAAI,EACnB,IAAI,GACQ,KAAI;IAChB,MAAM,eAAe,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC;IAEjD,MAAM,UAAU,GAAG,MAAK;AACtB,QAAA,IAAI,SAAS,EAAE;YACb,OAAOA,sBAAA,CAAA,aAAA,CAACC,aAAM,EAAC,EAAA,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,IAAIC,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAA,CAAI;AAC/E;QACD,IAAI,eAAe,IAAI,YAAY,EAAE;YACnC,QACEF,sBAAC,CAAA,aAAA,CAAAG,aAAM,EACL,EAAA,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,gBACf,YAAY,EACvB,IAAI,EAAC,QAAQ,EAAA;AAEb,gBAAAH,sBAAA,CAAA,aAAA,CAACI,mBAAS,EAAC,EAAA,KAAK,EAAE,IAAI,IAAIF,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAI,CAAA,CACpD;AAEZ;AACD,QAAA,QACEF,sBAAA,CAAA,aAAA,CAACG,aAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,MAAM,QAAQ,CAAC,KAAK,CAAC,EAC9B,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAA,YAAA,EACf,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,EAAA;AAEb,YAAAH,sBAAA,CAAA,aAAA,CAACK,qBAAU,EAAA,EACT,KAAK,EAAE,IAAI,IAAIH,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAC5C,MAAM,EAAEI,WAAK,CAAC,EAAE,EAChB,KAAK,EAAEA,WAAK,CAAC,EAAE,EACf,CAAA,CACK;AAEb,KAAC;AAED,IAAA,QACEN,sBAAC,CAAA,aAAA,CAAAO,gBAAS,IAAC,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAA;QACxEP,sBAAC,CAAA,aAAA,CAAAQ,YAAK,EACJ,EAAA,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,CAAA;AACF,QAAAR,sBAAA,CAAA,aAAA,CAACS,oBAAa,EAAE,IAAA,EAAA,UAAU,EAAE,CAAiB,CACnC;AAEhB;;;;"}
+{"version":3,"file":"Search.cjs","sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import React from 'react';\n\nimport { theme } from '../../theme';\nimport { withLabels } from '../../hoc';\nimport { SearchProps } from './types';\nimport { sizes } from '../../theme/modules/sizes';\n\nimport { Button } from '../Button';\nimport { CrossIcon } from '../../tempIcons/CrossIcon';\nimport { SearchIcon } from '../../tempIcons/SearchIcon';\n\nimport { Container, Input, IconContainer, Loader } from './styled';\n\nexport const Search = withLabels(\n  ({\n    type = 'text',\n    disabled = false,\n    onClearClick,\n    onChange,\n    onBlur,\n    onFocus,\n    onKeyUp,\n    onKeyDown,\n    onKeyPress,\n    value = '',\n    hasError,\n    placeholder = '',\n    className = '',\n    name,\n    isLoading = false,\n    fill,\n    reversed = false,\n    autoComplete = 'on',\n    size,\n  }: SearchProps) => {\n    const shouldShowClear = value && value.length > 0;\n\n    const onClickSearch = () => {\n      onChange?.(value);\n    };\n\n    const renderIcon = () => {\n      if (isLoading) {\n        return <Loader height={24} color={fill || theme.colors.secondary.blue.base} />;\n      }\n      if (shouldShowClear && onClearClick) {\n        return (\n          <Button\n            variant=\"unstyled\"\n            onClick={onClearClick}\n            style={{ display: 'flex' }}\n            aria-label=\"Clear text\"\n            type=\"button\"\n          >\n            <CrossIcon color={fill || theme.colors.neutral.ink.dark} />\n          </Button>\n        );\n      }\n      return (\n        <Button\n          variant=\"unstyled\"\n          onClick={onClickSearch}\n          style={{ display: 'flex' }}\n          aria-label=\"Search\"\n          disabled={disabled}\n          type=\"button\"\n        >\n          <SearchIcon\n            color={fill || theme.colors.neutral.ink.dark}\n            height={sizes.md}\n            width={sizes.md}\n          />\n        </Button>\n      );\n    };\n\n    return (\n      <Container className={className} iconPosition={reversed ? 'left' : 'right'}>\n        <Input\n          size={size}\n          type={type}\n          value={value}\n          onChange={onChange}\n          onBlur={onBlur}\n          onFocus={onFocus}\n          onKeyUp={onKeyUp}\n          onKeyDown={onKeyDown}\n          onKeyPress={onKeyPress}\n          placeholder={placeholder}\n          name={name}\n          disabled={disabled}\n          hasError={hasError}\n          autoComplete={autoComplete}\n        />\n        <IconContainer>{renderIcon()}</IconContainer>\n      </Container>\n    );\n  },\n);\n"],"names":["withLabels","React","Loader","theme","Button","CrossIcon","SearchIcon","sizes","Container","Input","IconContainer"],"mappings":";;;;;;;;;;;;;;;;AAaO,MAAM,MAAM,GAAGA,qBAAU,CAC9B,CAAC,EACC,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,YAAY,EACZ,QAAQ,EACR,MAAM,EACN,OAAO,EACP,OAAO,EACP,SAAS,EACT,UAAU,EACV,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,WAAW,GAAG,EAAE,EAChB,SAAS,GAAG,EAAE,EACd,IAAI,EACJ,SAAS,GAAG,KAAK,EACjB,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,YAAY,GAAG,IAAI,EACnB,IAAI,GACQ,KAAI;IAChB,MAAM,eAAe,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC;IAEjD,MAAM,aAAa,GAAG,MAAK;AACzB,QAAA,QAAQ,aAAR,QAAQ,KAAA,SAAA,GAAA,SAAA,GAAR,QAAQ,CAAG,KAAK,CAAC;AACnB,KAAC;IAED,MAAM,UAAU,GAAG,MAAK;AACtB,QAAA,IAAI,SAAS,EAAE;YACb,OAAOC,sBAAA,CAAA,aAAA,CAACC,aAAM,EAAC,EAAA,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,IAAIC,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAA,CAAI;AAC/E;QACD,IAAI,eAAe,IAAI,YAAY,EAAE;YACnC,QACEF,sBAAC,CAAA,aAAA,CAAAG,aAAM,EACL,EAAA,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,gBACf,YAAY,EACvB,IAAI,EAAC,QAAQ,EAAA;AAEb,gBAAAH,sBAAA,CAAA,aAAA,CAACI,mBAAS,EAAC,EAAA,KAAK,EAAE,IAAI,IAAIF,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAI,CAAA,CACpD;AAEZ;AACD,QAAA,QACEF,sBAAA,CAAA,aAAA,CAACG,aAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,aAAa,EACtB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAA,YAAA,EACf,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,EAAA;AAEb,YAAAH,sBAAA,CAAA,aAAA,CAACK,qBAAU,EAAA,EACT,KAAK,EAAE,IAAI,IAAIH,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAC5C,MAAM,EAAEI,WAAK,CAAC,EAAE,EAChB,KAAK,EAAEA,WAAK,CAAC,EAAE,EACf,CAAA,CACK;AAEb,KAAC;AAED,IAAA,QACEN,sBAAC,CAAA,aAAA,CAAAO,gBAAS,IAAC,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAA;QACxEP,sBAAC,CAAA,aAAA,CAAAQ,YAAK,EACJ,EAAA,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,CAAA;AACF,QAAAR,sBAAA,CAAA,aAAA,CAACS,oBAAa,EAAE,IAAA,EAAA,UAAU,EAAE,CAAiB,CACnC;AAEhB,CAAC;;;;"}