@transferwise/components 0.0.0-experimental-57e70f3 → 0.0.0-experimental-09066ec

package/build/index.js

@@ -58,7 +58,15 @@ var InputWithDisplayFormat = require('./inputWithDisplayFormat/InputWithDisplayF
 var Input = require('./inputs/Input.js');
 var InputGroup = require('./inputs/InputGroup.js');
 var SearchInput = require('./inputs/SearchInput.js');
-var SelectInput = require('./inputs/SelectInput.js');
+var SelectInput = require('./inputs/SelectInput/SelectInput.js');
+require('react-intl');
+require('./dateLookup/dateTrigger/DateTrigger.messages.js');
+require('@headlessui/react');
+var SelectInputOptionContent = require('./inputs/SelectInput/OptionContent/SelectInputOptionContent.js');
+var SelectInputTriggerButton = require('./inputs/SelectInput/TriggerButton/SelectInputTriggerButton.js');
+var Section = require('./section/Section.js');
+require('virtua');
+require('./inputs/SelectInput/SelectInput.messages.js');
 var TextArea = require('./inputs/TextArea.js');
 var InstructionsList = require('./instructionsList/InstructionsList.js');
 var Label = require('./label/Label.js');
@@ -90,7 +98,6 @@ var Radio = require('./radio/Radio.js');
 var RadioGroup = require('./radioGroup/RadioGroup.js');
 var RadioOption = require('./radioOption/RadioOption.js');
 var ResponsivePanel = require('./common/responsivePanel/ResponsivePanel.js');
-var Section = require('./section/Section.js');
 var SegmentedControl = require('./segmentedControl/SegmentedControl.js');
 var Select = require('./select/Select.js');
 var SentimentSurface = require('./sentimentSurface/SentimentSurface.js');
@@ -139,7 +146,6 @@ var markdownNodeType = require('./common/propsValues/markdownNodeType.js');
 var fileType = require('./common/fileType.js');
 var index = require('./common/locale/index.js');
 var colors = require('./common/colors.js');
-require('react-intl');
 require('./common/closeButton/CloseButton.messages.js');
 var index$1 = require('./i18n/index.js');
 var withId = require('./withId/withId.js');
@@ -220,9 +226,9 @@ exports.Input = Input.Input;
 exports.InputGroup = InputGroup.InputGroup;
 exports.SearchInput = SearchInput.SearchInput;
 exports.SelectInput = SelectInput.SelectInput;
-exports.SelectInputOptionContent = SelectInput.SelectInputOptionContent;
-exports.SelectInputTriggerButton = SelectInput.SelectInputTriggerButton;
-exports.sortByRelevance = SelectInput.sortByRelevance;
+exports.SelectInputOptionContent = SelectInputOptionContent.SelectInputOptionContent;
+exports.SelectInputTriggerButton = SelectInputTriggerButton.SelectInputTriggerButton;
+exports.Section = Section.default;
 exports.TextArea = TextArea.TextArea;
 exports.InstructionsList = InstructionsList.default;
 exports.Label = Label.Label;
@@ -258,7 +264,6 @@ exports.Radio = Radio.default;
 exports.RadioGroup = RadioGroup.default;
 exports.RadioOption = RadioOption.default;
 exports.ResponsivePanel = ResponsivePanel.default;
-exports.Section = Section.default;
 exports.SegmentedControl = SegmentedControl.default;
 exports.Select = Select.default;
 exports.SentimentSurface = SentimentSurface.default;

package/build/index.js.map

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

package/build/index.mjs

@@ -56,7 +56,15 @@ export { default as InputWithDisplayFormat } from './inputWithDisplayFormat/Inpu
 export { Input } from './inputs/Input.mjs';
 export { InputGroup } from './inputs/InputGroup.mjs';
 export { SearchInput } from './inputs/SearchInput.mjs';
-export { SelectInput, SelectInputOptionContent, SelectInputTriggerButton, sortByRelevance } from './inputs/SelectInput.mjs';
+export { SelectInput } from './inputs/SelectInput/SelectInput.mjs';
+import 'react-intl';
+import './dateLookup/dateTrigger/DateTrigger.messages.mjs';
+import '@headlessui/react';
+export { SelectInputOptionContent } from './inputs/SelectInput/OptionContent/SelectInputOptionContent.mjs';
+export { SelectInputTriggerButton } from './inputs/SelectInput/TriggerButton/SelectInputTriggerButton.mjs';
+export { default as Section } from './section/Section.mjs';
+import 'virtua';
+import './inputs/SelectInput/SelectInput.messages.mjs';
 export { TextArea } from './inputs/TextArea.mjs';
 export { default as InstructionsList } from './instructionsList/InstructionsList.mjs';
 export { Label } from './label/Label.mjs';
@@ -88,7 +96,6 @@ export { default as Radio } from './radio/Radio.mjs';
 export { default as RadioGroup } from './radioGroup/RadioGroup.mjs';
 export { default as RadioOption } from './radioOption/RadioOption.mjs';
 export { default as ResponsivePanel } from './common/responsivePanel/ResponsivePanel.mjs';
-export { default as Section } from './section/Section.mjs';
 export { default as SegmentedControl } from './segmentedControl/SegmentedControl.mjs';
 export { default as Select } from './select/Select.mjs';
 export { default as SentimentSurface } from './sentimentSurface/SentimentSurface.mjs';
@@ -137,7 +144,6 @@ export { MarkdownNodeType } from './common/propsValues/markdownNodeType.mjs';
 export { FileType } from './common/fileType.mjs';
 export { DEFAULT_LANG, DEFAULT_LOCALE, RTL_LANGUAGES, SUPPORTED_LANGUAGES, adjustLocale, getCountryFromLocale, getDirectionFromLocale, getLangFromLocale, getLocaleCurrencyName } from './common/locale/index.mjs';
 export { getBrandColorFromSeed } from './common/colors.mjs';
-import 'react-intl';
 import './common/closeButton/CloseButton.messages.mjs';
 export { default as translations } from './i18n/index.mjs';
 export { default as withId } from './withId/withId.mjs';

package/build/index.mjs.map

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

package/build/inputs/{_BottomSheet.js → SelectInput/BottomSheet/SelectInputBottomSheet.js}

@@ -6,13 +6,13 @@ var focus = require('@react-aria/focus');
 var componentsTheming = require('@wise/components-theming');
 var clsx = require('clsx');
 var React = require('react');
-var CloseButton = require('../common/closeButton/CloseButton.js');
-var useVirtualKeyboard = require('../common/hooks/useVirtualKeyboard.js');
-var PreventScroll = require('../common/preventScroll/PreventScroll.js');
-var size = require('../common/propsValues/size.js');
+var CloseButton = require('../../../common/closeButton/CloseButton.js');
+var useVirtualKeyboard = require('../../../common/hooks/useVirtualKeyboard.js');
+var PreventScroll = require('../../../common/preventScroll/PreventScroll.js');
+var size = require('../../../common/propsValues/size.js');
 var jsxRuntime = require('react/jsx-runtime');
 
-function BottomSheet({
+function SelectInputBottomSheet({
   open,
   renderTrigger,
   title,
@@ -109,5 +109,5 @@ function BottomSheet({
   });
 }
 
-exports.BottomSheet = BottomSheet;
-//# sourceMappingURL=_BottomSheet.js.map
+exports.SelectInputBottomSheet = SelectInputBottomSheet;
+//# sourceMappingURL=SelectInputBottomSheet.js.map

package/build/inputs/SelectInput/BottomSheet/SelectInputBottomSheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputBottomSheet.js","sources":["../../../../src/inputs/SelectInput/BottomSheet/SelectInputBottomSheet.tsx"],"sourcesContent":["import {\n  FloatingFocusManager,\n  FloatingPortal,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport { Transition, TransitionChild } from '@headlessui/react';\nimport { FocusScope } from '@react-aria/focus';\nimport { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { Fragment, useState } from 'react';\n\nimport { CloseButton } from '../../../common/closeButton';\nimport { useVirtualKeyboard } from '../../../common/hooks/useVirtualKeyboard';\nimport { PreventScroll } from '../../../common/preventScroll/PreventScroll';\nimport { Size } from '../../../common/propsValues/size';\n\nexport interface SelectInputBottomSheetProps {\n  open: boolean;\n  renderTrigger?: (args: {\n    ref: React.RefCallback<Element>;\n    getInteractionProps: (customEventHandlers?: React.HTMLProps<Element>) => {\n      [key: string]: unknown;\n    };\n  }) => React.ReactNode;\n  title?: string;\n  initialFocusRef?: React.MutableRefObject<HTMLElement | null>;\n  padding?: 'none' | 'md';\n  children?: React.ReactNode;\n  onClose?: () => void;\n  onCloseEnd?: () => void;\n}\n\nexport function SelectInputBottomSheet({\n  open,\n  renderTrigger,\n  title,\n  initialFocusRef,\n  padding = 'md',\n  children,\n  onClose,\n  onCloseEnd,\n}: SelectInputBottomSheetProps) {\n  useVirtualKeyboard(open);\n\n  const { refs, context } = useFloating<Element>({\n    open,\n    onOpenChange: (value) => {\n      if (!value) {\n        onClose?.();\n      }\n    },\n  });\n\n  const dismiss = useDismiss(context);\n  const role = useRole(context);\n  const { getReferenceProps, getFloatingProps } = useInteractions([dismiss, role]);\n\n  const [floatingKey, setFloatingKey] = useState(0);\n\n  const { theme, screenMode } = useTheme();\n\n  return (\n    <>\n      {open ? <PreventScroll /> : null}\n      {renderTrigger?.({\n        ref: refs.setReference,\n        getInteractionProps: getReferenceProps,\n      })}\n\n      <FloatingPortal>\n        <ThemeProvider theme=\"personal\" screenMode={theme === 'personal' ? screenMode : 'light'}>\n          <Transition\n            as=\"div\"\n            show={open}\n            className=\"np-bottom-sheet-v2-container\"\n            beforeEnter={() => {\n              setFloatingKey((prev) => prev + 1);\n            }}\n            afterLeave={onCloseEnd}\n          >\n            <TransitionChild\n              as=\"div\"\n              className=\"np-bottom-sheet-v2-backdrop\"\n              enterFrom=\"np-bottom-sheet-v2-backdrop--closed\"\n              leaveTo=\"np-bottom-sheet-v2-backdrop--closed\"\n            />\n\n            <div className=\"np-bottom-sheet-v2\">\n              <FocusScope>\n                <FloatingFocusManager context={context} initialFocus={initialFocusRef}>\n                  <Fragment\n                    key={floatingKey} // Force inner state invalidation on open\n                  >\n                    <TransitionChild\n                      ref={refs.setFloating}\n                      as=\"div\"\n                      className=\"np-bottom-sheet-v2-content\"\n                      enterFrom=\"np-bottom-sheet-v2-content--closed\"\n                      leaveTo=\"np-bottom-sheet-v2-content--closed\"\n                      {...getFloatingProps()}\n                    >\n                      <div className=\"np-bottom-sheet-v2-header\">\n                        <CloseButton\n                          size={Size.SMALL}\n                          onClick={() => {\n                            onClose?.();\n                          }}\n                        />\n                      </div>\n                      <div\n                        className={clsx(\n                          'np-bottom-sheet-v2-content-inner',\n                          title && 'np-bottom-sheet-v2-content-inner--has-title',\n                          padding === 'md' && 'np-bottom-sheet-v2-content-inner--padding-md',\n                        )}\n                      >\n                        {title ? (\n                          <h2 className=\"np-bottom-sheet-v2-title np-text-title-body\">{title}</h2>\n                        ) : null}\n                        <div className=\"np-bottom-sheet-v2-body np-text-body-default\">\n                          {children}\n                        </div>\n                      </div>\n                    </TransitionChild>\n                  </Fragment>\n                </FloatingFocusManager>\n              </FocusScope>\n            </div>\n          </Transition>\n        </ThemeProvider>\n      </FloatingPortal>\n    </>\n  );\n}\n"],"names":["SelectInputBottomSheet","open","renderTrigger","title","initialFocusRef","padding","children","onClose","onCloseEnd","useVirtualKeyboard","refs","context","useFloating","onOpenChange","value","dismiss","useDismiss","role","useRole","getReferenceProps","getFloatingProps","useInteractions","floatingKey","setFloatingKey","useState","theme","screenMode","useTheme","_jsxs","_Fragment","_jsx","PreventScroll","ref","setReference","getInteractionProps","FloatingPortal","ThemeProvider","Transition","as","show","className","beforeEnter","prev","afterLeave","TransitionChild","enterFrom","leaveTo","FocusScope","FloatingFocusManager","initialFocus","Fragment","setFloating","CloseButton","size","Size","SMALL","onClick","clsx"],"mappings":"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"}

package/build/inputs/{_BottomSheet.mjs → SelectInput/BottomSheet/SelectInputBottomSheet.mjs}

@@ -4,13 +4,13 @@ import { FocusScope } from '@react-aria/focus';
 import { useTheme, ThemeProvider } from '@wise/components-theming';
 import { clsx } from 'clsx';
 import { useState, Fragment as Fragment$1 } from 'react';
-import { CloseButton } from '../common/closeButton/CloseButton.mjs';
-import { useVirtualKeyboard } from '../common/hooks/useVirtualKeyboard.mjs';
-import { PreventScroll } from '../common/preventScroll/PreventScroll.mjs';
-import { Size } from '../common/propsValues/size.mjs';
+import { CloseButton } from '../../../common/closeButton/CloseButton.mjs';
+import { useVirtualKeyboard } from '../../../common/hooks/useVirtualKeyboard.mjs';
+import { PreventScroll } from '../../../common/preventScroll/PreventScroll.mjs';
+import { Size } from '../../../common/propsValues/size.mjs';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 
-function BottomSheet({
+function SelectInputBottomSheet({
   open,
   renderTrigger,
   title,
@@ -107,5 +107,5 @@ function BottomSheet({
   });
 }
 
-export { BottomSheet };
-//# sourceMappingURL=_BottomSheet.mjs.map
+export { SelectInputBottomSheet };
+//# sourceMappingURL=SelectInputBottomSheet.mjs.map

package/build/inputs/SelectInput/BottomSheet/SelectInputBottomSheet.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputBottomSheet.mjs","sources":["../../../../src/inputs/SelectInput/BottomSheet/SelectInputBottomSheet.tsx"],"sourcesContent":["import {\n  FloatingFocusManager,\n  FloatingPortal,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport { Transition, TransitionChild } from '@headlessui/react';\nimport { FocusScope } from '@react-aria/focus';\nimport { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { Fragment, useState } from 'react';\n\nimport { CloseButton } from '../../../common/closeButton';\nimport { useVirtualKeyboard } from '../../../common/hooks/useVirtualKeyboard';\nimport { PreventScroll } from '../../../common/preventScroll/PreventScroll';\nimport { Size } from '../../../common/propsValues/size';\n\nexport interface SelectInputBottomSheetProps {\n  open: boolean;\n  renderTrigger?: (args: {\n    ref: React.RefCallback<Element>;\n    getInteractionProps: (customEventHandlers?: React.HTMLProps<Element>) => {\n      [key: string]: unknown;\n    };\n  }) => React.ReactNode;\n  title?: string;\n  initialFocusRef?: React.MutableRefObject<HTMLElement | null>;\n  padding?: 'none' | 'md';\n  children?: React.ReactNode;\n  onClose?: () => void;\n  onCloseEnd?: () => void;\n}\n\nexport function SelectInputBottomSheet({\n  open,\n  renderTrigger,\n  title,\n  initialFocusRef,\n  padding = 'md',\n  children,\n  onClose,\n  onCloseEnd,\n}: SelectInputBottomSheetProps) {\n  useVirtualKeyboard(open);\n\n  const { refs, context } = useFloating<Element>({\n    open,\n    onOpenChange: (value) => {\n      if (!value) {\n        onClose?.();\n      }\n    },\n  });\n\n  const dismiss = useDismiss(context);\n  const role = useRole(context);\n  const { getReferenceProps, getFloatingProps } = useInteractions([dismiss, role]);\n\n  const [floatingKey, setFloatingKey] = useState(0);\n\n  const { theme, screenMode } = useTheme();\n\n  return (\n    <>\n      {open ? <PreventScroll /> : null}\n      {renderTrigger?.({\n        ref: refs.setReference,\n        getInteractionProps: getReferenceProps,\n      })}\n\n      <FloatingPortal>\n        <ThemeProvider theme=\"personal\" screenMode={theme === 'personal' ? screenMode : 'light'}>\n          <Transition\n            as=\"div\"\n            show={open}\n            className=\"np-bottom-sheet-v2-container\"\n            beforeEnter={() => {\n              setFloatingKey((prev) => prev + 1);\n            }}\n            afterLeave={onCloseEnd}\n          >\n            <TransitionChild\n              as=\"div\"\n              className=\"np-bottom-sheet-v2-backdrop\"\n              enterFrom=\"np-bottom-sheet-v2-backdrop--closed\"\n              leaveTo=\"np-bottom-sheet-v2-backdrop--closed\"\n            />\n\n            <div className=\"np-bottom-sheet-v2\">\n              <FocusScope>\n                <FloatingFocusManager context={context} initialFocus={initialFocusRef}>\n                  <Fragment\n                    key={floatingKey} // Force inner state invalidation on open\n                  >\n                    <TransitionChild\n                      ref={refs.setFloating}\n                      as=\"div\"\n                      className=\"np-bottom-sheet-v2-content\"\n                      enterFrom=\"np-bottom-sheet-v2-content--closed\"\n                      leaveTo=\"np-bottom-sheet-v2-content--closed\"\n                      {...getFloatingProps()}\n                    >\n                      <div className=\"np-bottom-sheet-v2-header\">\n                        <CloseButton\n                          size={Size.SMALL}\n                          onClick={() => {\n                            onClose?.();\n                          }}\n                        />\n                      </div>\n                      <div\n                        className={clsx(\n                          'np-bottom-sheet-v2-content-inner',\n                          title && 'np-bottom-sheet-v2-content-inner--has-title',\n                          padding === 'md' && 'np-bottom-sheet-v2-content-inner--padding-md',\n                        )}\n                      >\n                        {title ? (\n                          <h2 className=\"np-bottom-sheet-v2-title np-text-title-body\">{title}</h2>\n                        ) : null}\n                        <div className=\"np-bottom-sheet-v2-body np-text-body-default\">\n                          {children}\n                        </div>\n                      </div>\n                    </TransitionChild>\n                  </Fragment>\n                </FloatingFocusManager>\n              </FocusScope>\n            </div>\n          </Transition>\n        </ThemeProvider>\n      </FloatingPortal>\n    </>\n  );\n}\n"],"names":["SelectInputBottomSheet","open","renderTrigger","title","initialFocusRef","padding","children","onClose","onCloseEnd","useVirtualKeyboard","refs","context","useFloating","onOpenChange","value","dismiss","useDismiss","role","useRole","getReferenceProps","getFloatingProps","useInteractions","floatingKey","setFloatingKey","useState","theme","screenMode","useTheme","_jsxs","_Fragment","_jsx","PreventScroll","ref","setReference","getInteractionProps","FloatingPortal","ThemeProvider","Transition","as","show","className","beforeEnter","prev","afterLeave","TransitionChild","enterFrom","leaveTo","FocusScope","FloatingFocusManager","initialFocus","Fragment","setFloating","CloseButton","size","Size","SMALL","onClick","clsx"],"mappings":"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"}

package/build/inputs/{_ButtonInput.js → SelectInput/ButtonInput/SelectInputButtonInput.js}

@@ -2,11 +2,11 @@
 
 var clsx = require('clsx');
 var React = require('react');
-var InputGroup = require('./InputGroup.js');
-var _common = require('./_common.js');
+var InputGroup = require('../../InputGroup.js');
+var _common = require('../../_common.js');
 var jsxRuntime = require('react/jsx-runtime');
 
-const ButtonInput = /*#__PURE__*/React.forwardRef(function ButtonInput({
+const SelectInputButtonInput = /*#__PURE__*/React.forwardRef(function ButtonInput({
   size = 'md',
   className,
   style,
@@ -27,5 +27,5 @@ const ButtonInput = /*#__PURE__*/React.forwardRef(function ButtonInput({
   });
 });
 
-exports.ButtonInput = ButtonInput;
-//# sourceMappingURL=_ButtonInput.js.map
+exports.SelectInputButtonInput = SelectInputButtonInput;
+//# sourceMappingURL=SelectInputButtonInput.js.map

package/build/inputs/SelectInput/ButtonInput/SelectInputButtonInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputButtonInput.js","sources":["../../../../src/inputs/SelectInput/ButtonInput/SelectInputButtonInput.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { forwardRef } from 'react';\n\nimport { useInputPaddings } from '../../InputGroup';\nimport { inputClassNameBase } from '../../_common';\n\nexport interface SelectInputButtonInputProps extends React.ComponentPropsWithRef<'button'> {\n  size?: 'sm' | 'md' | 'lg';\n}\n\nexport const SelectInputButtonInput = forwardRef(function ButtonInput(\n  { size = 'md', className, style, ...restProps }: SelectInputButtonInputProps,\n  ref: React.ForwardedRef<HTMLButtonElement | null>,\n) {\n  const inputPaddings = useInputPaddings();\n\n  return (\n    <button\n      ref={ref}\n      type=\"button\"\n      className={clsx(inputClassNameBase({ size }), 'np-button-input', className)}\n      style={{ ...inputPaddings, ...style }}\n      {...restProps}\n    />\n  );\n});\n"],"names":["SelectInputButtonInput","forwardRef","ButtonInput","size","className","style","restProps","ref","inputPaddings","useInputPaddings","_jsx","type","clsx","inputClassNameBase"],"mappings":";;;;;;;;MAUaA,sBAAsB,gBAAGC,gBAAU,CAAC,SAASC,WAAWA,CACnE;AAAEC,EAAAA,IAAI,GAAG,IAAI;EAAEC,SAAS;EAAEC,KAAK;EAAE,GAAGC;AAAS,CAA+B,EAC5EC,GAAiD,EAAA;AAEjD,EAAA,MAAMC,aAAa,GAAGC,2BAAgB,EAAE;AAExC,EAAA,oBACEC,cAAA,CAAA,QAAA,EAAA;AACEH,IAAAA,GAAG,EAAEA,GAAI;AACTI,IAAAA,IAAI,EAAC,QAAQ;AACbP,IAAAA,SAAS,EAAEQ,SAAI,CAACC,0BAAkB,CAAC;AAAEV,MAAAA;AAAI,KAAE,CAAC,EAAE,iBAAiB,EAAEC,SAAS,CAAE;AAC5EC,IAAAA,KAAK,EAAE;AAAE,MAAA,GAAGG,aAAa;MAAE,GAAGH;KAAQ;IAAA,GAClCC;AAAS,GAAC,CACd;AAEN,CAAC;;;;"}

package/build/inputs/{_ButtonInput.mjs → SelectInput/ButtonInput/SelectInputButtonInput.mjs}

@@ -1,10 +1,10 @@
 import { clsx } from 'clsx';
 import { forwardRef } from 'react';
-import { useInputPaddings } from './InputGroup.mjs';
-import { inputClassNameBase } from './_common.mjs';
+import { useInputPaddings } from '../../InputGroup.mjs';
+import { inputClassNameBase } from '../../_common.mjs';
 import { jsx } from 'react/jsx-runtime';
 
-const ButtonInput = /*#__PURE__*/forwardRef(function ButtonInput({
+const SelectInputButtonInput = /*#__PURE__*/forwardRef(function ButtonInput({
   size = 'md',
   className,
   style,
@@ -25,5 +25,5 @@ const ButtonInput = /*#__PURE__*/forwardRef(function ButtonInput({
   });
 });
 
-export { ButtonInput };
-//# sourceMappingURL=_ButtonInput.mjs.map
+export { SelectInputButtonInput };
+//# sourceMappingURL=SelectInputButtonInput.mjs.map

package/build/inputs/SelectInput/ButtonInput/SelectInputButtonInput.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputButtonInput.mjs","sources":["../../../../src/inputs/SelectInput/ButtonInput/SelectInputButtonInput.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { forwardRef } from 'react';\n\nimport { useInputPaddings } from '../../InputGroup';\nimport { inputClassNameBase } from '../../_common';\n\nexport interface SelectInputButtonInputProps extends React.ComponentPropsWithRef<'button'> {\n  size?: 'sm' | 'md' | 'lg';\n}\n\nexport const SelectInputButtonInput = forwardRef(function ButtonInput(\n  { size = 'md', className, style, ...restProps }: SelectInputButtonInputProps,\n  ref: React.ForwardedRef<HTMLButtonElement | null>,\n) {\n  const inputPaddings = useInputPaddings();\n\n  return (\n    <button\n      ref={ref}\n      type=\"button\"\n      className={clsx(inputClassNameBase({ size }), 'np-button-input', className)}\n      style={{ ...inputPaddings, ...style }}\n      {...restProps}\n    />\n  );\n});\n"],"names":["SelectInputButtonInput","forwardRef","ButtonInput","size","className","style","restProps","ref","inputPaddings","useInputPaddings","_jsx","type","clsx","inputClassNameBase"],"mappings":";;;;;;MAUaA,sBAAsB,gBAAGC,UAAU,CAAC,SAASC,WAAWA,CACnE;AAAEC,EAAAA,IAAI,GAAG,IAAI;EAAEC,SAAS;EAAEC,KAAK;EAAE,GAAGC;AAAS,CAA+B,EAC5EC,GAAiD,EAAA;AAEjD,EAAA,MAAMC,aAAa,GAAGC,gBAAgB,EAAE;AAExC,EAAA,oBACEC,GAAA,CAAA,QAAA,EAAA;AACEH,IAAAA,GAAG,EAAEA,GAAI;AACTI,IAAAA,IAAI,EAAC,QAAQ;AACbP,IAAAA,SAAS,EAAEQ,IAAI,CAACC,kBAAkB,CAAC;AAAEV,MAAAA;AAAI,KAAE,CAAC,EAAE,iBAAiB,EAAEC,SAAS,CAAE;AAC5EC,IAAAA,KAAK,EAAE;AAAE,MAAA,GAAGG,aAAa;MAAE,GAAGH;KAAQ;IAAA,GAClCC;AAAS,GAAC,CACd;AAEN,CAAC;;;;"}

package/build/inputs/SelectInput/ClearButton/SelectInputClearButton.js

@@ -0,0 +1,26 @@
+'use strict';
+
+var icons = require('@transferwise/icons');
+var clsx = require('clsx');
+var reactIntl = require('react-intl');
+var DateTrigger_messages = require('../../../dateLookup/dateTrigger/DateTrigger.messages.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function SelectInputClearButton({
+  className,
+  onClick
+}) {
+  const intl = reactIntl.useIntl();
+  return /*#__PURE__*/jsxRuntime.jsx("button", {
+    type: "button",
+    "aria-label": intl.formatMessage(DateTrigger_messages.default.ariaLabel),
+    className: clsx.clsx(className, 'np-select-input-addon np-select-input-addon--interactive'),
+    onClick: onClick,
+    children: /*#__PURE__*/jsxRuntime.jsx(icons.Cross, {
+      size: 16
+    })
+  });
+}
+
+exports.SelectInputClearButton = SelectInputClearButton;
+//# sourceMappingURL=SelectInputClearButton.js.map

package/build/inputs/SelectInput/ClearButton/SelectInputClearButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputClearButton.js","sources":["../../../../src/inputs/SelectInput/ClearButton/SelectInputClearButton.tsx"],"sourcesContent":["import { Cross } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\nimport dateTriggerMessages from '../../../dateLookup/dateTrigger/DateTrigger.messages';\n\nexport interface SelectInputClearButtonProps extends Pick<\n  React.ComponentPropsWithoutRef<'button'>,\n  'className' | 'onClick'\n> {}\n\n/**\n * A button component used to clear the selected value in a SelectInput.\n */\nexport function SelectInputClearButton({ className, onClick }: SelectInputClearButtonProps) {\n  const intl = useIntl();\n\n  return (\n    <button\n      type=\"button\"\n      aria-label={intl.formatMessage(dateTriggerMessages.ariaLabel)}\n      className={clsx(className, 'np-select-input-addon np-select-input-addon--interactive')}\n      onClick={onClick}\n    >\n      <Cross size={16} />\n    </button>\n  );\n}\n"],"names":["SelectInputClearButton","className","onClick","intl","useIntl","_jsx","type","formatMessage","dateTriggerMessages","ariaLabel","clsx","children","Cross","size"],"mappings":";;;;;;;;SAagBA,sBAAsBA,CAAC;EAAEC,SAAS;AAAEC,EAAAA;AAAO,CAA+B,EAAA;AACxF,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE;AAEtB,EAAA,oBACEC,cAAA,CAAA,QAAA,EAAA;AACEC,IAAAA,IAAI,EAAC,QAAQ;AACb,IAAA,YAAA,EAAYH,IAAI,CAACI,aAAa,CAACC,4BAAmB,CAACC,SAAS,CAAE;AAC9DR,IAAAA,SAAS,EAAES,SAAI,CAACT,SAAS,EAAE,0DAA0D,CAAE;AACvFC,IAAAA,OAAO,EAAEA,OAAQ;IAAAS,QAAA,eAEjBN,cAAA,CAACO,WAAK,EAAA;AAACC,MAAAA,IAAI,EAAE;KAAG;AAClB,GAAQ,CAAC;AAEb;;;;"}

package/build/inputs/SelectInput/ClearButton/SelectInputClearButton.mjs

@@ -0,0 +1,24 @@
+import { Cross } from '@transferwise/icons';
+import { clsx } from 'clsx';
+import { useIntl } from 'react-intl';
+import messages from '../../../dateLookup/dateTrigger/DateTrigger.messages.mjs';
+import { jsx } from 'react/jsx-runtime';
+
+function SelectInputClearButton({
+  className,
+  onClick
+}) {
+  const intl = useIntl();
+  return /*#__PURE__*/jsx("button", {
+    type: "button",
+    "aria-label": intl.formatMessage(messages.ariaLabel),
+    className: clsx(className, 'np-select-input-addon np-select-input-addon--interactive'),
+    onClick: onClick,
+    children: /*#__PURE__*/jsx(Cross, {
+      size: 16
+    })
+  });
+}
+
+export { SelectInputClearButton };
+//# sourceMappingURL=SelectInputClearButton.mjs.map

package/build/inputs/SelectInput/ClearButton/SelectInputClearButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputClearButton.mjs","sources":["../../../../src/inputs/SelectInput/ClearButton/SelectInputClearButton.tsx"],"sourcesContent":["import { Cross } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\nimport dateTriggerMessages from '../../../dateLookup/dateTrigger/DateTrigger.messages';\n\nexport interface SelectInputClearButtonProps extends Pick<\n  React.ComponentPropsWithoutRef<'button'>,\n  'className' | 'onClick'\n> {}\n\n/**\n * A button component used to clear the selected value in a SelectInput.\n */\nexport function SelectInputClearButton({ className, onClick }: SelectInputClearButtonProps) {\n  const intl = useIntl();\n\n  return (\n    <button\n      type=\"button\"\n      aria-label={intl.formatMessage(dateTriggerMessages.ariaLabel)}\n      className={clsx(className, 'np-select-input-addon np-select-input-addon--interactive')}\n      onClick={onClick}\n    >\n      <Cross size={16} />\n    </button>\n  );\n}\n"],"names":["SelectInputClearButton","className","onClick","intl","useIntl","_jsx","type","formatMessage","dateTriggerMessages","ariaLabel","clsx","children","Cross","size"],"mappings":";;;;;;SAagBA,sBAAsBA,CAAC;EAAEC,SAAS;AAAEC,EAAAA;AAAO,CAA+B,EAAA;AACxF,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE;AAEtB,EAAA,oBACEC,GAAA,CAAA,QAAA,EAAA;AACEC,IAAAA,IAAI,EAAC,QAAQ;AACb,IAAA,YAAA,EAAYH,IAAI,CAACI,aAAa,CAACC,QAAmB,CAACC,SAAS,CAAE;AAC9DR,IAAAA,SAAS,EAAES,IAAI,CAACT,SAAS,EAAE,0DAA0D,CAAE;AACvFC,IAAAA,OAAO,EAAEA,OAAQ;IAAAS,QAAA,eAEjBN,GAAA,CAACO,KAAK,EAAA;AAACC,MAAAA,IAAI,EAAE;KAAG;AAClB,GAAQ,CAAC;AAEb;;;;"}

package/build/inputs/SelectInput/DefaultRenderTrigger/SelectInputDefaultRenderTrigger.js

@@ -0,0 +1,59 @@
+'use strict';
+
+var icons = require('@transferwise/icons');
+var clsx = require('clsx');
+require('react');
+var InputGroup = require('../../InputGroup.js');
+var SelectInputClearButton = require('../ClearButton/SelectInputClearButton.js');
+var SelectInputTriggerButton = require('../TriggerButton/SelectInputTriggerButton.js');
+var SelectInputButtonInput = require('../ButtonInput/SelectInputButtonInput.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function SelectInputDefaultRenderTrigger({
+  content,
+  placeholderShown,
+  clear,
+  disabled,
+  size,
+  className
+}) {
+  return /*#__PURE__*/jsxRuntime.jsx(InputGroup.InputGroup, {
+    addonEnd: {
+      content: /*#__PURE__*/jsxRuntime.jsxs("span", {
+        className: clsx.clsx('np-select-input-addon-container', disabled && 'disabled'),
+        children: [clear != null && !placeholderShown ? /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+          children: [/*#__PURE__*/jsxRuntime.jsx(SelectInputClearButton.SelectInputClearButton, {
+            onClick: event => {
+              event.preventDefault();
+              clear();
+            }
+          }), /*#__PURE__*/jsxRuntime.jsx("span", {
+            className: "np-select-input-addon-separator"
+          })]
+        }) : null, /*#__PURE__*/jsxRuntime.jsx("span", {
+          className: "np-select-input-addon",
+          children: /*#__PURE__*/jsxRuntime.jsx(icons.ChevronDown, {
+            size: 16
+          })
+        })]
+      }),
+      initialContentWidth: 24 + 4,
+      padding: 'sm'
+    },
+    disabled: disabled,
+    className: className,
+    children: /*#__PURE__*/jsxRuntime.jsx(SelectInputTriggerButton.SelectInputTriggerButton, {
+      as: SelectInputButtonInput.SelectInputButtonInput,
+      size: size,
+      children: /*#__PURE__*/jsxRuntime.jsx("span", {
+        className: clsx.clsx('np-select-input-content', placeholderShown && 'np-select-input-placeholder'),
+        children: content
+      })
+    })
+  });
+}
+const DefaultRenderTrigger = SelectInputDefaultRenderTrigger;
+
+exports.DefaultRenderTrigger = DefaultRenderTrigger;
+exports.SelectInputDefaultRenderTrigger = SelectInputDefaultRenderTrigger;
+//# sourceMappingURL=SelectInputDefaultRenderTrigger.js.map

package/build/inputs/SelectInput/DefaultRenderTrigger/SelectInputDefaultRenderTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputDefaultRenderTrigger.js","sources":["../../../../src/inputs/SelectInput/DefaultRenderTrigger/SelectInputDefaultRenderTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React from 'react';\n\nimport { InputGroup } from '../../InputGroup';\nimport { SelectInputClearButton } from '../ClearButton';\nimport { SelectInputTriggerButton } from '../TriggerButton';\nimport { SelectInputProps } from '../SelectInput.types';\nimport { SelectInputButtonInput } from '../ButtonInput';\n\nexport interface SelectInputDefaultRenderTriggerProps {\n  content: React.ReactNode;\n  placeholderShown: boolean;\n  clear: (() => void) | undefined;\n  disabled: boolean;\n  size: 'sm' | 'md' | 'lg';\n  className: string | undefined;\n}\n\n/**\n * Default render function for the SelectInput trigger.\n * Displays the selected value or placeholder with clear button and dropdown indicator.\n */\nexport function SelectInputDefaultRenderTrigger({\n  content,\n  placeholderShown,\n  clear,\n  disabled,\n  size,\n  className,\n}: SelectInputDefaultRenderTriggerProps) {\n  return (\n    <InputGroup\n      addonEnd={{\n        content: (\n          <span className={clsx('np-select-input-addon-container', disabled && 'disabled')}>\n            {clear != null && !placeholderShown ? (\n              <>\n                <SelectInputClearButton\n                  onClick={(event) => {\n                    event.preventDefault();\n                    clear();\n                  }}\n                />\n                <span className=\"np-select-input-addon-separator\" />\n              </>\n            ) : null}\n            <span className=\"np-select-input-addon\">\n              <ChevronDown size={16} />\n            </span>\n          </span>\n        ),\n        initialContentWidth: 24 + 4,\n        padding: 'sm',\n      }}\n      disabled={disabled}\n      className={className}\n    >\n      <SelectInputTriggerButton as={SelectInputButtonInput} size={size}>\n        <span\n          className={clsx(\n            'np-select-input-content',\n            placeholderShown && 'np-select-input-placeholder',\n          )}\n        >\n          {content}\n        </span>\n      </SelectInputTriggerButton>\n    </InputGroup>\n  );\n}\n\nexport const DefaultRenderTrigger =\n  SelectInputDefaultRenderTrigger satisfies SelectInputProps['renderTrigger'];\n"],"names":["SelectInputDefaultRenderTrigger","content","placeholderShown","clear","disabled","size","className","_jsx","InputGroup","addonEnd","_jsxs","clsx","children","_Fragment","SelectInputClearButton","onClick","event","preventDefault","ChevronDown","initialContentWidth","padding","SelectInputTriggerButton","as","SelectInputButtonInput","DefaultRenderTrigger"],"mappings":";;;;;;;;;;;AAuBM,SAAUA,+BAA+BA,CAAC;EAC9CC,OAAO;EACPC,gBAAgB;EAChBC,KAAK;EACLC,QAAQ;EACRC,IAAI;AACJC,EAAAA;AAAS,CAC4B,EAAA;EACrC,oBACEC,cAAA,CAACC,qBAAU,EAAA;AACTC,IAAAA,QAAQ,EAAE;AACRR,MAAAA,OAAO,eACLS,eAAA,CAAA,MAAA,EAAA;QAAMJ,SAAS,EAAEK,SAAI,CAAC,iCAAiC,EAAEP,QAAQ,IAAI,UAAU,CAAE;QAAAQ,QAAA,EAAA,CAC9ET,KAAK,IAAI,IAAI,IAAI,CAACD,gBAAgB,gBACjCQ,eAAA,CAAAG,mBAAA,EAAA;UAAAD,QAAA,EAAA,cACEL,cAAA,CAACO,6CAAsB,EAAA;YACrBC,OAAO,EAAGC,KAAK,IAAI;cACjBA,KAAK,CAACC,cAAc,EAAE;AACtBd,cAAAA,KAAK,EAAE;AACT,YAAA;WAAE,CAEJ,eAAAI,cAAA,CAAA,MAAA,EAAA;AAAMD,YAAAA,SAAS,EAAC;AAAiC,WAAA,CACnD;AAAA,SAAA,CAAG,GACD,IAAI,eACRC,cAAA,CAAA,MAAA,EAAA;AAAMD,UAAAA,SAAS,EAAC,uBAAuB;UAAAM,QAAA,eACrCL,cAAA,CAACW,iBAAW,EAAA;AAACb,YAAAA,IAAI,EAAE;WAAG;AACxB,SAAM,CACR;AAAA,OAAM,CACP;MACDc,mBAAmB,EAAE,EAAE,GAAG,CAAC;AAC3BC,MAAAA,OAAO,EAAE;KACT;AACFhB,IAAAA,QAAQ,EAAEA,QAAS;AACnBE,IAAAA,SAAS,EAAEA,SAAU;IAAAM,QAAA,eAErBL,cAAA,CAACc,iDAAwB,EAAA;AAACC,MAAAA,EAAE,EAAEC,6CAAuB;AAAClB,MAAAA,IAAI,EAAEA,IAAK;AAAAO,MAAAA,QAAA,eAC/DL,cAAA,CAAA,MAAA,EAAA;QACED,SAAS,EAAEK,SAAI,CACb,yBAAyB,EACzBT,gBAAgB,IAAI,6BAA6B,CACjD;AAAAU,QAAAA,QAAA,EAEDX;OACG;KACkB;AAC5B,GAAY,CAAC;AAEjB;AAEO,MAAMuB,oBAAoB,GAC/BxB;;;;;"}

package/build/inputs/SelectInput/DefaultRenderTrigger/SelectInputDefaultRenderTrigger.mjs

@@ -0,0 +1,56 @@
+import { ChevronDown } from '@transferwise/icons';
+import { clsx } from 'clsx';
+import 'react';
+import { InputGroup } from '../../InputGroup.mjs';
+import { SelectInputClearButton } from '../ClearButton/SelectInputClearButton.mjs';
+import { SelectInputTriggerButton } from '../TriggerButton/SelectInputTriggerButton.mjs';
+import { SelectInputButtonInput } from '../ButtonInput/SelectInputButtonInput.mjs';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+function SelectInputDefaultRenderTrigger({
+  content,
+  placeholderShown,
+  clear,
+  disabled,
+  size,
+  className
+}) {
+  return /*#__PURE__*/jsx(InputGroup, {
+    addonEnd: {
+      content: /*#__PURE__*/jsxs("span", {
+        className: clsx('np-select-input-addon-container', disabled && 'disabled'),
+        children: [clear != null && !placeholderShown ? /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx(SelectInputClearButton, {
+            onClick: event => {
+              event.preventDefault();
+              clear();
+            }
+          }), /*#__PURE__*/jsx("span", {
+            className: "np-select-input-addon-separator"
+          })]
+        }) : null, /*#__PURE__*/jsx("span", {
+          className: "np-select-input-addon",
+          children: /*#__PURE__*/jsx(ChevronDown, {
+            size: 16
+          })
+        })]
+      }),
+      initialContentWidth: 24 + 4,
+      padding: 'sm'
+    },
+    disabled: disabled,
+    className: className,
+    children: /*#__PURE__*/jsx(SelectInputTriggerButton, {
+      as: SelectInputButtonInput,
+      size: size,
+      children: /*#__PURE__*/jsx("span", {
+        className: clsx('np-select-input-content', placeholderShown && 'np-select-input-placeholder'),
+        children: content
+      })
+    })
+  });
+}
+const DefaultRenderTrigger = SelectInputDefaultRenderTrigger;
+
+export { DefaultRenderTrigger, SelectInputDefaultRenderTrigger };
+//# sourceMappingURL=SelectInputDefaultRenderTrigger.mjs.map

package/build/inputs/SelectInput/DefaultRenderTrigger/SelectInputDefaultRenderTrigger.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputDefaultRenderTrigger.mjs","sources":["../../../../src/inputs/SelectInput/DefaultRenderTrigger/SelectInputDefaultRenderTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React from 'react';\n\nimport { InputGroup } from '../../InputGroup';\nimport { SelectInputClearButton } from '../ClearButton';\nimport { SelectInputTriggerButton } from '../TriggerButton';\nimport { SelectInputProps } from '../SelectInput.types';\nimport { SelectInputButtonInput } from '../ButtonInput';\n\nexport interface SelectInputDefaultRenderTriggerProps {\n  content: React.ReactNode;\n  placeholderShown: boolean;\n  clear: (() => void) | undefined;\n  disabled: boolean;\n  size: 'sm' | 'md' | 'lg';\n  className: string | undefined;\n}\n\n/**\n * Default render function for the SelectInput trigger.\n * Displays the selected value or placeholder with clear button and dropdown indicator.\n */\nexport function SelectInputDefaultRenderTrigger({\n  content,\n  placeholderShown,\n  clear,\n  disabled,\n  size,\n  className,\n}: SelectInputDefaultRenderTriggerProps) {\n  return (\n    <InputGroup\n      addonEnd={{\n        content: (\n          <span className={clsx('np-select-input-addon-container', disabled && 'disabled')}>\n            {clear != null && !placeholderShown ? (\n              <>\n                <SelectInputClearButton\n                  onClick={(event) => {\n                    event.preventDefault();\n                    clear();\n                  }}\n                />\n                <span className=\"np-select-input-addon-separator\" />\n              </>\n            ) : null}\n            <span className=\"np-select-input-addon\">\n              <ChevronDown size={16} />\n            </span>\n          </span>\n        ),\n        initialContentWidth: 24 + 4,\n        padding: 'sm',\n      }}\n      disabled={disabled}\n      className={className}\n    >\n      <SelectInputTriggerButton as={SelectInputButtonInput} size={size}>\n        <span\n          className={clsx(\n            'np-select-input-content',\n            placeholderShown && 'np-select-input-placeholder',\n          )}\n        >\n          {content}\n        </span>\n      </SelectInputTriggerButton>\n    </InputGroup>\n  );\n}\n\nexport const DefaultRenderTrigger =\n  SelectInputDefaultRenderTrigger satisfies SelectInputProps['renderTrigger'];\n"],"names":["SelectInputDefaultRenderTrigger","content","placeholderShown","clear","disabled","size","className","_jsx","InputGroup","addonEnd","_jsxs","clsx","children","_Fragment","SelectInputClearButton","onClick","event","preventDefault","ChevronDown","initialContentWidth","padding","SelectInputTriggerButton","as","SelectInputButtonInput","DefaultRenderTrigger"],"mappings":";;;;;;;;;AAuBM,SAAUA,+BAA+BA,CAAC;EAC9CC,OAAO;EACPC,gBAAgB;EAChBC,KAAK;EACLC,QAAQ;EACRC,IAAI;AACJC,EAAAA;AAAS,CAC4B,EAAA;EACrC,oBACEC,GAAA,CAACC,UAAU,EAAA;AACTC,IAAAA,QAAQ,EAAE;AACRR,MAAAA,OAAO,eACLS,IAAA,CAAA,MAAA,EAAA;QAAMJ,SAAS,EAAEK,IAAI,CAAC,iCAAiC,EAAEP,QAAQ,IAAI,UAAU,CAAE;QAAAQ,QAAA,EAAA,CAC9ET,KAAK,IAAI,IAAI,IAAI,CAACD,gBAAgB,gBACjCQ,IAAA,CAAAG,QAAA,EAAA;UAAAD,QAAA,EAAA,cACEL,GAAA,CAACO,sBAAsB,EAAA;YACrBC,OAAO,EAAGC,KAAK,IAAI;cACjBA,KAAK,CAACC,cAAc,EAAE;AACtBd,cAAAA,KAAK,EAAE;AACT,YAAA;WAAE,CAEJ,eAAAI,GAAA,CAAA,MAAA,EAAA;AAAMD,YAAAA,SAAS,EAAC;AAAiC,WAAA,CACnD;AAAA,SAAA,CAAG,GACD,IAAI,eACRC,GAAA,CAAA,MAAA,EAAA;AAAMD,UAAAA,SAAS,EAAC,uBAAuB;UAAAM,QAAA,eACrCL,GAAA,CAACW,WAAW,EAAA;AAACb,YAAAA,IAAI,EAAE;WAAG;AACxB,SAAM,CACR;AAAA,OAAM,CACP;MACDc,mBAAmB,EAAE,EAAE,GAAG,CAAC;AAC3BC,MAAAA,OAAO,EAAE;KACT;AACFhB,IAAAA,QAAQ,EAAEA,QAAS;AACnBE,IAAAA,SAAS,EAAEA,SAAU;IAAAM,QAAA,eAErBL,GAAA,CAACc,wBAAwB,EAAA;AAACC,MAAAA,EAAE,EAAEC,sBAAuB;AAAClB,MAAAA,IAAI,EAAEA,IAAK;AAAAO,MAAAA,QAAA,eAC/DL,GAAA,CAAA,MAAA,EAAA;QACED,SAAS,EAAEK,IAAI,CACb,yBAAyB,EACzBT,gBAAgB,IAAI,6BAA6B,CACjD;AAAAU,QAAAA,QAAA,EAEDX;OACG;KACkB;AAC5B,GAAY,CAAC;AAEjB;AAEO,MAAMuB,oBAAoB,GAC/BxB;;;;"}

package/build/inputs/SelectInput/ItemView/GroupItemView/SelectInputGroupItemView.js

@@ -0,0 +1,50 @@
+'use strict';
+
+var clsx = require('clsx');
+var React = require('react');
+var Header = require('../../../../header/Header.js');
+var Section = require('../../../../section/Section.js');
+var SelectInputItemView = require('../SelectInputItemView.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function SelectInputGroupItemView({
+  item,
+  renderValue,
+  needle
+}) {
+  const headerId = React.useId();
+  const header = /*#__PURE__*/jsxRuntime.jsx(Header.default, {
+    as: "header",
+    role: "none",
+    id: headerId,
+    title: item.label
+    // @ts-expect-error when we migrate ActionButton to new Button this should be sorted
+    ,
+    action: item.action && {
+      text: item.action.label,
+      onClick: item.action.onClick
+    },
+    className: "np-select-input-group-item-header p-x-1"
+  });
+  return (
+    /*#__PURE__*/
+    // An empty container may be rendered when no options match `needle`
+    // However, pre-filtering would result in worse performance overall
+    jsxRuntime.jsxs(Section.default, {
+      as: "section",
+      role: "group",
+      "aria-labelledby": headerId,
+      className: clsx.clsx('m-y-0', needle === null && 'np-select-input-group-item--without-needle'),
+      children: [needle == null ? header : null, item.options.map((option, index) => /*#__PURE__*/jsxRuntime.jsx(SelectInputItemView.SelectInputItemView
+      // eslint-disable-next-line react/no-array-index-key
+      , {
+        item: option,
+        renderValue: renderValue,
+        needle: needle
+      }, index))]
+    })
+  );
+}
+
+exports.SelectInputGroupItemView = SelectInputGroupItemView;
+//# sourceMappingURL=SelectInputGroupItemView.js.map

package/build/inputs/SelectInput/ItemView/GroupItemView/SelectInputGroupItemView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputGroupItemView.js","sources":["../../../../../src/inputs/SelectInput/ItemView/GroupItemView/SelectInputGroupItemView.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useId } from 'react';\nimport Header from '../../../../header';\nimport Section from '../../../../section';\nimport { SelectInputGroupItem } from '../../SelectInput.types';\nimport { SelectInputItemView, SelectInputItemViewProps } from '..';\n\nexport interface SelectInputGroupItemViewProps<T = string> extends SelectInputItemViewProps<\n  T,\n  SelectInputGroupItem<T | undefined>\n> {}\n\n/**\n * Component that renders a group of SelectInput options with a header.\n */\nexport function SelectInputGroupItemView<T = string>({\n  item,\n  renderValue,\n  needle,\n}: SelectInputGroupItemViewProps<T>) {\n  const headerId = useId();\n\n  const header = (\n    <Header\n      as=\"header\"\n      role=\"none\"\n      id={headerId}\n      title={item.label}\n      // @ts-expect-error when we migrate ActionButton to new Button this should be sorted\n      action={\n        item.action && {\n          text: item.action.label,\n          onClick: item.action.onClick,\n        }\n      }\n      className=\"np-select-input-group-item-header p-x-1\"\n    />\n  );\n\n  return (\n    // An empty container may be rendered when no options match `needle`\n    // However, pre-filtering would result in worse performance overall\n    <Section\n      as=\"section\"\n      role=\"group\"\n      aria-labelledby={headerId}\n      className={clsx('m-y-0', needle === null && 'np-select-input-group-item--without-needle')}\n    >\n      {needle == null ? header : null}\n      {item.options.map((option, index) => (\n        <SelectInputItemView\n          // eslint-disable-next-line react/no-array-index-key\n          key={index}\n          item={option}\n          renderValue={renderValue}\n          needle={needle}\n        />\n      ))}\n    </Section>\n  );\n}\n"],"names":["SelectInputGroupItemView","item","renderValue","needle","headerId","useId","header","_jsx","Header","as","role","id","title","label","action","text","onClick","className","_jsxs","Section","clsx","children","options","map","option","index","SelectInputItemView"],"mappings":";;;;;;;;;AAeM,SAAUA,wBAAwBA,CAAa;EACnDC,IAAI;EACJC,WAAW;AACXC,EAAAA;AAAM,CAC2B,EAAA;AACjC,EAAA,MAAMC,QAAQ,GAAGC,WAAK,EAAE;AAExB,EAAA,MAAMC,MAAM,gBACVC,cAAA,CAACC,cAAM,EAAA;AACLC,IAAAA,EAAE,EAAC,QAAQ;AACXC,IAAAA,IAAI,EAAC,MAAM;AACXC,IAAAA,EAAE,EAAEP,QAAS;IACbQ,KAAK,EAAEX,IAAI,CAACY;AACZ;AAAA;AACAC,IAAAA,MAAM,EACJb,IAAI,CAACa,MAAM,IAAI;AACbC,MAAAA,IAAI,EAAEd,IAAI,CAACa,MAAM,CAACD,KAAK;AACvBG,MAAAA,OAAO,EAAEf,IAAI,CAACa,MAAM,CAACE;KAExB;AACDC,IAAAA,SAAS,EAAC;AAAyC,GAAA,CAEtD;AAED,EAAA;AAAA;AACE;AACA;AACAC,IAAAA,eAAA,CAACC,eAAO,EAAA;AACNV,MAAAA,EAAE,EAAC,SAAS;AACZC,MAAAA,IAAI,EAAC,OAAO;AACZ,MAAA,iBAAA,EAAiBN,QAAS;MAC1Ba,SAAS,EAAEG,SAAI,CAAC,OAAO,EAAEjB,MAAM,KAAK,IAAI,IAAI,4CAA4C,CAAE;MAAAkB,QAAA,EAAA,CAEzFlB,MAAM,IAAI,IAAI,GAAGG,MAAM,GAAG,IAAI,EAC9BL,IAAI,CAACqB,OAAO,CAACC,GAAG,CAAC,CAACC,MAAM,EAAEC,KAAK,kBAC9BlB,cAAA,CAACmB;AACC;AAAA,QAAA;AAEAzB,QAAAA,IAAI,EAAEuB,MAAO;AACbtB,QAAAA,WAAW,EAAEA,WAAY;AACzBC,QAAAA,MAAM,EAAEA;OAAO,EAHVsB,KAGU,CAElB,CAAC;KACK;AAAC;AAEd;;;;"}

package/build/inputs/SelectInput/ItemView/GroupItemView/SelectInputGroupItemView.mjs

@@ -0,0 +1,48 @@
+import { clsx } from 'clsx';
+import { useId } from 'react';
+import Header from '../../../../header/Header.mjs';
+import Section from '../../../../section/Section.mjs';
+import { SelectInputItemView } from '../SelectInputItemView.mjs';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function SelectInputGroupItemView({
+  item,
+  renderValue,
+  needle
+}) {
+  const headerId = useId();
+  const header = /*#__PURE__*/jsx(Header, {
+    as: "header",
+    role: "none",
+    id: headerId,
+    title: item.label
+    // @ts-expect-error when we migrate ActionButton to new Button this should be sorted
+    ,
+    action: item.action && {
+      text: item.action.label,
+      onClick: item.action.onClick
+    },
+    className: "np-select-input-group-item-header p-x-1"
+  });
+  return (
+    /*#__PURE__*/
+    // An empty container may be rendered when no options match `needle`
+    // However, pre-filtering would result in worse performance overall
+    jsxs(Section, {
+      as: "section",
+      role: "group",
+      "aria-labelledby": headerId,
+      className: clsx('m-y-0', needle === null && 'np-select-input-group-item--without-needle'),
+      children: [needle == null ? header : null, item.options.map((option, index) => /*#__PURE__*/jsx(SelectInputItemView
+      // eslint-disable-next-line react/no-array-index-key
+      , {
+        item: option,
+        renderValue: renderValue,
+        needle: needle
+      }, index))]
+    })
+  );
+}
+
+export { SelectInputGroupItemView };
+//# sourceMappingURL=SelectInputGroupItemView.mjs.map

package/build/inputs/SelectInput/ItemView/GroupItemView/SelectInputGroupItemView.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectInputGroupItemView.mjs","sources":["../../../../../src/inputs/SelectInput/ItemView/GroupItemView/SelectInputGroupItemView.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useId } from 'react';\nimport Header from '../../../../header';\nimport Section from '../../../../section';\nimport { SelectInputGroupItem } from '../../SelectInput.types';\nimport { SelectInputItemView, SelectInputItemViewProps } from '..';\n\nexport interface SelectInputGroupItemViewProps<T = string> extends SelectInputItemViewProps<\n  T,\n  SelectInputGroupItem<T | undefined>\n> {}\n\n/**\n * Component that renders a group of SelectInput options with a header.\n */\nexport function SelectInputGroupItemView<T = string>({\n  item,\n  renderValue,\n  needle,\n}: SelectInputGroupItemViewProps<T>) {\n  const headerId = useId();\n\n  const header = (\n    <Header\n      as=\"header\"\n      role=\"none\"\n      id={headerId}\n      title={item.label}\n      // @ts-expect-error when we migrate ActionButton to new Button this should be sorted\n      action={\n        item.action && {\n          text: item.action.label,\n          onClick: item.action.onClick,\n        }\n      }\n      className=\"np-select-input-group-item-header p-x-1\"\n    />\n  );\n\n  return (\n    // An empty container may be rendered when no options match `needle`\n    // However, pre-filtering would result in worse performance overall\n    <Section\n      as=\"section\"\n      role=\"group\"\n      aria-labelledby={headerId}\n      className={clsx('m-y-0', needle === null && 'np-select-input-group-item--without-needle')}\n    >\n      {needle == null ? header : null}\n      {item.options.map((option, index) => (\n        <SelectInputItemView\n          // eslint-disable-next-line react/no-array-index-key\n          key={index}\n          item={option}\n          renderValue={renderValue}\n          needle={needle}\n        />\n      ))}\n    </Section>\n  );\n}\n"],"names":["SelectInputGroupItemView","item","renderValue","needle","headerId","useId","header","_jsx","Header","as","role","id","title","label","action","text","onClick","className","_jsxs","Section","clsx","children","options","map","option","index","SelectInputItemView"],"mappings":";;;;;;;AAeM,SAAUA,wBAAwBA,CAAa;EACnDC,IAAI;EACJC,WAAW;AACXC,EAAAA;AAAM,CAC2B,EAAA;AACjC,EAAA,MAAMC,QAAQ,GAAGC,KAAK,EAAE;AAExB,EAAA,MAAMC,MAAM,gBACVC,GAAA,CAACC,MAAM,EAAA;AACLC,IAAAA,EAAE,EAAC,QAAQ;AACXC,IAAAA,IAAI,EAAC,MAAM;AACXC,IAAAA,EAAE,EAAEP,QAAS;IACbQ,KAAK,EAAEX,IAAI,CAACY;AACZ;AAAA;AACAC,IAAAA,MAAM,EACJb,IAAI,CAACa,MAAM,IAAI;AACbC,MAAAA,IAAI,EAAEd,IAAI,CAACa,MAAM,CAACD,KAAK;AACvBG,MAAAA,OAAO,EAAEf,IAAI,CAACa,MAAM,CAACE;KAExB;AACDC,IAAAA,SAAS,EAAC;AAAyC,GAAA,CAEtD;AAED,EAAA;AAAA;AACE;AACA;AACAC,IAAAA,IAAA,CAACC,OAAO,EAAA;AACNV,MAAAA,EAAE,EAAC,SAAS;AACZC,MAAAA,IAAI,EAAC,OAAO;AACZ,MAAA,iBAAA,EAAiBN,QAAS;MAC1Ba,SAAS,EAAEG,IAAI,CAAC,OAAO,EAAEjB,MAAM,KAAK,IAAI,IAAI,4CAA4C,CAAE;MAAAkB,QAAA,EAAA,CAEzFlB,MAAM,IAAI,IAAI,GAAGG,MAAM,GAAG,IAAI,EAC9BL,IAAI,CAACqB,OAAO,CAACC,GAAG,CAAC,CAACC,MAAM,EAAEC,KAAK,kBAC9BlB,GAAA,CAACmB;AACC;AAAA,QAAA;AAEAzB,QAAAA,IAAI,EAAEuB,MAAO;AACbtB,QAAAA,WAAW,EAAEA,WAAY;AACzBC,QAAAA,MAAM,EAAEA;OAAO,EAHVsB,KAGU,CAElB,CAAC;KACK;AAAC;AAEd;;;;"}