@transferwise/components 0.0.0-experimental-6e04f56 → 0.0.0-experimental-542ae69

package/build/Inputs/SelectInput/BottomSheet/SelectInputBottomSheet.mjs

@@ -89,10 +89,10 @@ function SelectInputBottomSheet({
                     }), /*#__PURE__*/jsxs("div", {
                       className: clsx('np-bottom-sheet-v2-content-inner', title && 'np-bottom-sheet-v2-content-inner--has-title', padding === 'md' && 'np-bottom-sheet-v2-content-inner--padding-md'),
                       children: [title ? /*#__PURE__*/jsx("h2", {
-                        className: "np-bottom-sheet-v2-title np-text-title-body",
+                        className: "np-bottom-sheet-v2-title wds-text-title-body",
                         children: title
                       }) : null, /*#__PURE__*/jsx("div", {
-                        className: "np-bottom-sheet-v2-body np-text-body-default",
+                        className: "np-bottom-sheet-v2-body wds-text-body-default",
                         children: children
                       })]
                     })]

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

@@ -1 +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      {/* eslint-disable react-hooks/refs -- setReference is a callback ref from floating-ui, safe to pass during render */}\n      {renderTrigger?.({\n        ref: refs.setReference,\n        getInteractionProps: getReferenceProps,\n      })}\n      {/* eslint-enable react-hooks/refs */}\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                    {/* eslint-disable react-hooks/refs -- setFloating is a callback ref from floating-ui, safe to pass during render */}\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                      {/* eslint-enable react-hooks/refs */}\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":";;;;;;;;;;;;AAmCM,SAAUA,sBAAsBA,CAAC;EACrCC,IAAI;EACJC,aAAa;EACbC,KAAK;EACLC,eAAe;AACfC,EAAAA,OAAO,GAAG,IAAI;EACdC,QAAQ;EACRC,OAAO;AACPC,EAAAA;AAAU,CACkB,EAAA;EAC5BC,kBAAkB,CAACR,IAAI,CAAC;EAExB,MAAM;IAAES,IAAI;AAAEC,IAAAA;GAAS,GAAGC,WAAW,CAAU;IAC7CX,IAAI;IACJY,YAAY,EAAGC,KAAK,IAAI;MACtB,IAAI,CAACA,KAAK,EAAE;AACVP,QAAAA,OAAO,IAAI;AACb,MAAA;AACF,IAAA;AACD,GAAA,CAAC;AAEF,EAAA,MAAMQ,OAAO,GAAGC,UAAU,CAACL,OAAO,CAAC;AACnC,EAAA,MAAMM,IAAI,GAAGC,OAAO,CAACP,OAAO,CAAC;EAC7B,MAAM;IAAEQ,iBAAiB;AAAEC,IAAAA;GAAkB,GAAGC,eAAe,CAAC,CAACN,OAAO,EAAEE,IAAI,CAAC,CAAC;EAEhF,MAAM,CAACK,WAAW,EAAEC,cAAc,CAAC,GAAGC,QAAQ,CAAC,CAAC,CAAC;EAEjD,MAAM;IAAEC,KAAK;AAAEC,IAAAA;GAAY,GAAGC,QAAQ,EAAE;EAExC,oBACEC,IAAA,CAAAC,QAAA,EAAA;AAAAvB,IAAAA,QAAA,EAAA,CACGL,IAAI,gBAAG6B,GAAA,CAACC,aAAa,EAAA,EAAA,CAAG,GAAG,IAAI,EAE/B7B,aAAa,GAAG;MACf8B,GAAG,EAAEtB,IAAI,CAACuB,YAAY;AACtBC,MAAAA,mBAAmB,EAAEf;AACtB,KAAA,CAAC,eAGFW,GAAA,CAACK,cAAc,EAAA;MAAA7B,QAAA,eACbwB,GAAA,CAACM,aAAa,EAAA;AAACX,QAAAA,KAAK,EAAC,UAAU;AAACC,QAAAA,UAAU,EAAED,KAAK,KAAK,UAAU,GAAGC,UAAU,GAAG,OAAQ;QAAApB,QAAA,eACtFsB,IAAA,CAACS,UAAU,EAAA;AACTC,UAAAA,EAAE,EAAC,KAAK;AACRC,UAAAA,IAAI,EAAEtC,IAAK;AACXuC,UAAAA,SAAS,EAAC,8BAA8B;UACxCC,WAAW,EAAEA,MAAK;AAChBlB,YAAAA,cAAc,CAAEmB,IAAI,IAAKA,IAAI,GAAG,CAAC,CAAC;UACpC,CAAE;AACFC,UAAAA,UAAU,EAAEnC,UAAW;UAAAF,QAAA,EAAA,cAEvBwB,GAAA,CAACc,eAAe,EAAA;AACdN,YAAAA,EAAE,EAAC,KAAK;AACRE,YAAAA,SAAS,EAAC,6BAA6B;AACvCK,YAAAA,SAAS,EAAC,qCAAqC;AAC/CC,YAAAA,OAAO,EAAC;WAAqC,CAG/C,eAAAhB,GAAA,CAAA,KAAA,EAAA;AAAKU,YAAAA,SAAS,EAAC,oBAAoB;YAAAlC,QAAA,eACjCwB,GAAA,CAACiB,UAAU,EAAA;cAAAzC,QAAA,eACTwB,GAAA,CAACkB,oBAAoB,EAAA;AAACrC,gBAAAA,OAAO,EAAEA,OAAQ;AAACsC,gBAAAA,YAAY,EAAE7C,eAAgB;gBAAAE,QAAA,eACpEwB,GAAA,CAACoB,UAAQ,EAAA;kBAAA5C,QAAA,eAIPsB,IAAA,CAACgB,eAAe,EAAA;oBACdZ,GAAG,EAAEtB,IAAI,CAACyC,WAAY;AACtBb,oBAAAA,EAAE,EAAC,KAAK;AACRE,oBAAAA,SAAS,EAAC,4BAA4B;AACtCK,oBAAAA,SAAS,EAAC,oCAAoC;AAC9CC,oBAAAA,OAAO,EAAC,oCAAoC;oBAAA,GACxC1B,gBAAgB,EAAE;AAAAd,oBAAAA,QAAA,gBAGtBwB,GAAA,CAAA,KAAA,EAAA;AAAKU,sBAAAA,SAAS,EAAC,2BAA2B;sBAAAlC,QAAA,eACxCwB,GAAA,CAACsB,WAAW,EAAA;wBACVC,IAAI,EAAEC,IAAI,CAACC,KAAM;wBACjBC,OAAO,EAAEA,MAAK;AACZjD,0BAAAA,OAAO,IAAI;AACb,wBAAA;uBAAE;qBAED,CACL,eAAAqB,IAAA,CAAA,KAAA,EAAA;AACEY,sBAAAA,SAAS,EAAEiB,IAAI,CACb,kCAAkC,EAClCtD,KAAK,IAAI,6CAA6C,EACtDE,OAAO,KAAK,IAAI,IAAI,8CAA8C,CAClE;sBAAAC,QAAA,EAAA,CAEDH,KAAK,gBACJ2B,GAAA,CAAA,IAAA,EAAA;AAAIU,wBAAAA,SAAS,EAAC,6CAA6C;AAAAlC,wBAAAA,QAAA,EAAEH;AAAK,uBAAK,CAAC,GACtE,IAAI,eACR2B,GAAA,CAAA,KAAA,EAAA;AAAKU,wBAAAA,SAAS,EAAC,8CAA8C;AAAAlC,wBAAAA,QAAA,EAC1DA;AAAQ,uBACN,CACP;AAAA,qBAAK,CACP;mBAAiB;AACnB,iBAAA,EAnCOgB,WAmCG;eACU;aACZ;AACd,WAAK,CACP;SAAY;OACC;AACjB,KAAgB,CAClB;AAAA,GAAA,CAAG;AAEP;;"}
+{"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      {/* eslint-disable react-hooks/refs -- setReference is a callback ref from floating-ui, safe to pass during render */}\n      {renderTrigger?.({\n        ref: refs.setReference,\n        getInteractionProps: getReferenceProps,\n      })}\n      {/* eslint-enable react-hooks/refs */}\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                    {/* eslint-disable react-hooks/refs -- setFloating is a callback ref from floating-ui, safe to pass during render */}\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                      {/* eslint-enable react-hooks/refs */}\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 wds-text-title-body\">{title}</h2>\n                        ) : null}\n                        <div className=\"np-bottom-sheet-v2-body wds-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/SelectInput/Option/SelectInputOption.js

@@ -23,7 +23,7 @@ function SelectInputOption({
     className: ({
       active,
       disabled: uiDisabled
-    }) => clsx.clsx('np-select-input-option-container np-text-body-large', active && 'np-select-input-option-container--active', uiDisabled && 'np-select-input-option-container--disabled'),
+    }) => clsx.clsx('np-select-input-option-container wds-text-body-large', active && 'np-select-input-option-container--active', uiDisabled && 'np-select-input-option-container--disabled'),
     children: ({
       selected
     }) => /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {

package/build/Inputs/SelectInput/Option/SelectInputOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInputOption.js","sources":["../../../../src/Inputs/SelectInput/Option/SelectInputOption.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useContext } from 'react';\nimport { ListboxOption } from '@headlessui/react';\nimport {\n  SelectInputItemsCountContext,\n  SelectInputItemPositionContext,\n} from '../SelectInput.contexts';\n\nexport interface SelectInputOptionProps<T = string> {\n  value: T;\n  disabled?: boolean;\n  children?: React.ReactNode;\n}\n\n/**\n * A selectable option in a SelectInput dropdown.\n * Includes accessibility support and styling for selected, active, and disabled states.\n */\nexport function SelectInputOption<T = string>({\n  value,\n  disabled,\n  children,\n}: SelectInputOptionProps<T>) {\n  const itemsCount = useContext(SelectInputItemsCountContext);\n  const itemPosition = useContext(SelectInputItemPositionContext);\n\n  return (\n    <ListboxOption\n      as=\"div\"\n      value={value}\n      aria-setsize={itemsCount}\n      aria-posinset={itemPosition}\n      disabled={disabled}\n      className={({ active, disabled: uiDisabled }) =>\n        clsx(\n          'np-select-input-option-container np-text-body-large',\n          active && 'np-select-input-option-container--active',\n          uiDisabled && 'np-select-input-option-container--disabled',\n        )\n      }\n    >\n      {({ selected }) => (\n        <>\n          <div className=\"np-select-input-option\">{children}</div>\n          <Check\n            size={16}\n            className={clsx(\n              'np-select-input-option-check',\n              !selected && 'np-select-input-option-check--not-selected',\n            )}\n          />\n        </>\n      )}\n    </ListboxOption>\n  );\n}\n"],"names":["SelectInputOption","value","disabled","children","itemsCount","useContext","SelectInputItemsCountContext","itemPosition","SelectInputItemPositionContext","_jsx","ListboxOption","as","className","active","uiDisabled","clsx","selected","_jsxs","_Fragment","Check","size"],"mappings":";;;;;;;;;AAmBM,SAAUA,iBAAiBA,CAAa;EAC5CC,KAAK;EACLC,QAAQ;AACRC,EAAAA;AAAQ,CACkB,EAAA;AAC1B,EAAA,MAAMC,UAAU,GAAGC,gBAAU,CAACC,iDAA4B,CAAC;AAC3D,EAAA,MAAMC,YAAY,GAAGF,gBAAU,CAACG,mDAA8B,CAAC;EAE/D,oBACEC,cAAA,CAACC,mBAAa,EAAA;AACZC,IAAAA,EAAE,EAAC,KAAK;AACRV,IAAAA,KAAK,EAAEA,KAAM;AACb,IAAA,cAAA,EAAcG,UAAW;AACzB,IAAA,eAAA,EAAeG,YAAa;AAC5BL,IAAAA,QAAQ,EAAEA,QAAS;AACnBU,IAAAA,SAAS,EAAEA,CAAC;MAAEC,MAAM;AAAEX,MAAAA,QAAQ,EAAEY;AAAU,KAAE,KAC1CC,SAAI,CACF,qDAAqD,EACrDF,MAAM,IAAI,0CAA0C,EACpDC,UAAU,IAAI,4CAA4C,CAE7D;AAAAX,IAAAA,QAAA,EAEAA,CAAC;AAAEa,MAAAA;KAAU,kBACZC,eAAA,CAAAC,mBAAA,EAAA;AAAAf,MAAAA,QAAA,gBACEM,cAAA,CAAA,KAAA,EAAA;AAAKG,QAAAA,SAAS,EAAC,wBAAwB;AAAAT,QAAAA,QAAA,EAAEA;AAAQ,OAAM,CACvD,eAAAM,cAAA,CAACU,WAAK,EAAA;AACJC,QAAAA,IAAI,EAAE,EAAG;QACTR,SAAS,EAAEG,SAAI,CACb,8BAA8B,EAC9B,CAACC,QAAQ,IAAI,4CAA4C;AACzD,OAAA,CAEN;KAAA;AACD,GACY,CAAC;AAEpB;;"}
+{"version":3,"file":"SelectInputOption.js","sources":["../../../../src/Inputs/SelectInput/Option/SelectInputOption.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useContext } from 'react';\nimport { ListboxOption } from '@headlessui/react';\nimport {\n  SelectInputItemsCountContext,\n  SelectInputItemPositionContext,\n} from '../SelectInput.contexts';\n\nexport interface SelectInputOptionProps<T = string> {\n  value: T;\n  disabled?: boolean;\n  children?: React.ReactNode;\n}\n\n/**\n * A selectable option in a SelectInput dropdown.\n * Includes accessibility support and styling for selected, active, and disabled states.\n */\nexport function SelectInputOption<T = string>({\n  value,\n  disabled,\n  children,\n}: SelectInputOptionProps<T>) {\n  const itemsCount = useContext(SelectInputItemsCountContext);\n  const itemPosition = useContext(SelectInputItemPositionContext);\n\n  return (\n    <ListboxOption\n      as=\"div\"\n      value={value}\n      aria-setsize={itemsCount}\n      aria-posinset={itemPosition}\n      disabled={disabled}\n      className={({ active, disabled: uiDisabled }) =>\n        clsx(\n          'np-select-input-option-container wds-text-body-large',\n          active && 'np-select-input-option-container--active',\n          uiDisabled && 'np-select-input-option-container--disabled',\n        )\n      }\n    >\n      {({ selected }) => (\n        <>\n          <div className=\"np-select-input-option\">{children}</div>\n          <Check\n            size={16}\n            className={clsx(\n              'np-select-input-option-check',\n              !selected && 'np-select-input-option-check--not-selected',\n            )}\n          />\n        </>\n      )}\n    </ListboxOption>\n  );\n}\n"],"names":["SelectInputOption","value","disabled","children","itemsCount","useContext","SelectInputItemsCountContext","itemPosition","SelectInputItemPositionContext","_jsx","ListboxOption","as","className","active","uiDisabled","clsx","selected","_jsxs","_Fragment","Check","size"],"mappings":";;;;;;;;;AAmBM,SAAUA,iBAAiBA,CAAa;EAC5CC,KAAK;EACLC,QAAQ;AACRC,EAAAA;AAAQ,CACkB,EAAA;AAC1B,EAAA,MAAMC,UAAU,GAAGC,gBAAU,CAACC,iDAA4B,CAAC;AAC3D,EAAA,MAAMC,YAAY,GAAGF,gBAAU,CAACG,mDAA8B,CAAC;EAE/D,oBACEC,cAAA,CAACC,mBAAa,EAAA;AACZC,IAAAA,EAAE,EAAC,KAAK;AACRV,IAAAA,KAAK,EAAEA,KAAM;AACb,IAAA,cAAA,EAAcG,UAAW;AACzB,IAAA,eAAA,EAAeG,YAAa;AAC5BL,IAAAA,QAAQ,EAAEA,QAAS;AACnBU,IAAAA,SAAS,EAAEA,CAAC;MAAEC,MAAM;AAAEX,MAAAA,QAAQ,EAAEY;AAAU,KAAE,KAC1CC,SAAI,CACF,sDAAsD,EACtDF,MAAM,IAAI,0CAA0C,EACpDC,UAAU,IAAI,4CAA4C,CAE7D;AAAAX,IAAAA,QAAA,EAEAA,CAAC;AAAEa,MAAAA;KAAU,kBACZC,eAAA,CAAAC,mBAAA,EAAA;AAAAf,MAAAA,QAAA,gBACEM,cAAA,CAAA,KAAA,EAAA;AAAKG,QAAAA,SAAS,EAAC,wBAAwB;AAAAT,QAAAA,QAAA,EAAEA;AAAQ,OAAM,CACvD,eAAAM,cAAA,CAACU,WAAK,EAAA;AACJC,QAAAA,IAAI,EAAE,EAAG;QACTR,SAAS,EAAEG,SAAI,CACb,8BAA8B,EAC9B,CAACC,QAAQ,IAAI,4CAA4C;AACzD,OAAA,CAEN;KAAA;AACD,GACY,CAAC;AAEpB;;"}

package/build/Inputs/SelectInput/Option/SelectInputOption.mjs

@@ -21,7 +21,7 @@ function SelectInputOption({
     className: ({
       active,
       disabled: uiDisabled
-    }) => clsx('np-select-input-option-container np-text-body-large', active && 'np-select-input-option-container--active', uiDisabled && 'np-select-input-option-container--disabled'),
+    }) => clsx('np-select-input-option-container wds-text-body-large', active && 'np-select-input-option-container--active', uiDisabled && 'np-select-input-option-container--disabled'),
     children: ({
       selected
     }) => /*#__PURE__*/jsxs(Fragment, {

package/build/Inputs/SelectInput/Option/SelectInputOption.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInputOption.mjs","sources":["../../../../src/Inputs/SelectInput/Option/SelectInputOption.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useContext } from 'react';\nimport { ListboxOption } from '@headlessui/react';\nimport {\n  SelectInputItemsCountContext,\n  SelectInputItemPositionContext,\n} from '../SelectInput.contexts';\n\nexport interface SelectInputOptionProps<T = string> {\n  value: T;\n  disabled?: boolean;\n  children?: React.ReactNode;\n}\n\n/**\n * A selectable option in a SelectInput dropdown.\n * Includes accessibility support and styling for selected, active, and disabled states.\n */\nexport function SelectInputOption<T = string>({\n  value,\n  disabled,\n  children,\n}: SelectInputOptionProps<T>) {\n  const itemsCount = useContext(SelectInputItemsCountContext);\n  const itemPosition = useContext(SelectInputItemPositionContext);\n\n  return (\n    <ListboxOption\n      as=\"div\"\n      value={value}\n      aria-setsize={itemsCount}\n      aria-posinset={itemPosition}\n      disabled={disabled}\n      className={({ active, disabled: uiDisabled }) =>\n        clsx(\n          'np-select-input-option-container np-text-body-large',\n          active && 'np-select-input-option-container--active',\n          uiDisabled && 'np-select-input-option-container--disabled',\n        )\n      }\n    >\n      {({ selected }) => (\n        <>\n          <div className=\"np-select-input-option\">{children}</div>\n          <Check\n            size={16}\n            className={clsx(\n              'np-select-input-option-check',\n              !selected && 'np-select-input-option-check--not-selected',\n            )}\n          />\n        </>\n      )}\n    </ListboxOption>\n  );\n}\n"],"names":["SelectInputOption","value","disabled","children","itemsCount","useContext","SelectInputItemsCountContext","itemPosition","SelectInputItemPositionContext","_jsx","ListboxOption","as","className","active","uiDisabled","clsx","selected","_jsxs","_Fragment","Check","size"],"mappings":";;;;;;;AAmBM,SAAUA,iBAAiBA,CAAa;EAC5CC,KAAK;EACLC,QAAQ;AACRC,EAAAA;AAAQ,CACkB,EAAA;AAC1B,EAAA,MAAMC,UAAU,GAAGC,UAAU,CAACC,4BAA4B,CAAC;AAC3D,EAAA,MAAMC,YAAY,GAAGF,UAAU,CAACG,8BAA8B,CAAC;EAE/D,oBACEC,GAAA,CAACC,aAAa,EAAA;AACZC,IAAAA,EAAE,EAAC,KAAK;AACRV,IAAAA,KAAK,EAAEA,KAAM;AACb,IAAA,cAAA,EAAcG,UAAW;AACzB,IAAA,eAAA,EAAeG,YAAa;AAC5BL,IAAAA,QAAQ,EAAEA,QAAS;AACnBU,IAAAA,SAAS,EAAEA,CAAC;MAAEC,MAAM;AAAEX,MAAAA,QAAQ,EAAEY;AAAU,KAAE,KAC1CC,IAAI,CACF,qDAAqD,EACrDF,MAAM,IAAI,0CAA0C,EACpDC,UAAU,IAAI,4CAA4C,CAE7D;AAAAX,IAAAA,QAAA,EAEAA,CAAC;AAAEa,MAAAA;KAAU,kBACZC,IAAA,CAAAC,QAAA,EAAA;AAAAf,MAAAA,QAAA,gBACEM,GAAA,CAAA,KAAA,EAAA;AAAKG,QAAAA,SAAS,EAAC,wBAAwB;AAAAT,QAAAA,QAAA,EAAEA;AAAQ,OAAM,CACvD,eAAAM,GAAA,CAACU,KAAK,EAAA;AACJC,QAAAA,IAAI,EAAE,EAAG;QACTR,SAAS,EAAEG,IAAI,CACb,8BAA8B,EAC9B,CAACC,QAAQ,IAAI,4CAA4C;AACzD,OAAA,CAEN;KAAA;AACD,GACY,CAAC;AAEpB;;"}
+{"version":3,"file":"SelectInputOption.mjs","sources":["../../../../src/Inputs/SelectInput/Option/SelectInputOption.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useContext } from 'react';\nimport { ListboxOption } from '@headlessui/react';\nimport {\n  SelectInputItemsCountContext,\n  SelectInputItemPositionContext,\n} from '../SelectInput.contexts';\n\nexport interface SelectInputOptionProps<T = string> {\n  value: T;\n  disabled?: boolean;\n  children?: React.ReactNode;\n}\n\n/**\n * A selectable option in a SelectInput dropdown.\n * Includes accessibility support and styling for selected, active, and disabled states.\n */\nexport function SelectInputOption<T = string>({\n  value,\n  disabled,\n  children,\n}: SelectInputOptionProps<T>) {\n  const itemsCount = useContext(SelectInputItemsCountContext);\n  const itemPosition = useContext(SelectInputItemPositionContext);\n\n  return (\n    <ListboxOption\n      as=\"div\"\n      value={value}\n      aria-setsize={itemsCount}\n      aria-posinset={itemPosition}\n      disabled={disabled}\n      className={({ active, disabled: uiDisabled }) =>\n        clsx(\n          'np-select-input-option-container wds-text-body-large',\n          active && 'np-select-input-option-container--active',\n          uiDisabled && 'np-select-input-option-container--disabled',\n        )\n      }\n    >\n      {({ selected }) => (\n        <>\n          <div className=\"np-select-input-option\">{children}</div>\n          <Check\n            size={16}\n            className={clsx(\n              'np-select-input-option-check',\n              !selected && 'np-select-input-option-check--not-selected',\n            )}\n          />\n        </>\n      )}\n    </ListboxOption>\n  );\n}\n"],"names":["SelectInputOption","value","disabled","children","itemsCount","useContext","SelectInputItemsCountContext","itemPosition","SelectInputItemPositionContext","_jsx","ListboxOption","as","className","active","uiDisabled","clsx","selected","_jsxs","_Fragment","Check","size"],"mappings":";;;;;;;AAmBM,SAAUA,iBAAiBA,CAAa;EAC5CC,KAAK;EACLC,QAAQ;AACRC,EAAAA;AAAQ,CACkB,EAAA;AAC1B,EAAA,MAAMC,UAAU,GAAGC,UAAU,CAACC,4BAA4B,CAAC;AAC3D,EAAA,MAAMC,YAAY,GAAGF,UAAU,CAACG,8BAA8B,CAAC;EAE/D,oBACEC,GAAA,CAACC,aAAa,EAAA;AACZC,IAAAA,EAAE,EAAC,KAAK;AACRV,IAAAA,KAAK,EAAEA,KAAM;AACb,IAAA,cAAA,EAAcG,UAAW;AACzB,IAAA,eAAA,EAAeG,YAAa;AAC5BL,IAAAA,QAAQ,EAAEA,QAAS;AACnBU,IAAAA,SAAS,EAAEA,CAAC;MAAEC,MAAM;AAAEX,MAAAA,QAAQ,EAAEY;AAAU,KAAE,KAC1CC,IAAI,CACF,sDAAsD,EACtDF,MAAM,IAAI,0CAA0C,EACpDC,UAAU,IAAI,4CAA4C,CAE7D;AAAAX,IAAAA,QAAA,EAEAA,CAAC;AAAEa,MAAAA;KAAU,kBACZC,IAAA,CAAAC,QAAA,EAAA;AAAAf,MAAAA,QAAA,gBACEM,GAAA,CAAA,KAAA,EAAA;AAAKG,QAAAA,SAAS,EAAC,wBAAwB;AAAAT,QAAAA,QAAA,EAAEA;AAAQ,OAAM,CACvD,eAAAM,GAAA,CAACU,KAAK,EAAA;AACJC,QAAAA,IAAI,EAAE,EAAG;QACTR,SAAS,EAAEG,IAAI,CACb,8BAA8B,EAC9B,CAACC,QAAQ,IAAI,4CAA4C;AACzD,OAAA,CAEN;KAAA;AACD,GACY,CAAC;AAEpB;;"}

package/build/Inputs/SelectInput/OptionContent/SelectInputOptionContent.js

@@ -14,7 +14,7 @@ function SelectInputOptionContent({
 }) {
   const withinTrigger = React.useContext(SelectInput_contexts.SelectInputOptionContentWithinTriggerContext);
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
-    className: clsx.clsx('np-select-input-option-content-container', (note || description) && 'np-text-body-large', className),
+    className: clsx.clsx('np-select-input-option-content-container', (note || description) && 'wds-text-body-large', className),
     children: [icon ? /*#__PURE__*/jsxRuntime.jsx("div", {
       className: clsx.clsx('np-select-input-option-content-icon', !withinTrigger && 'np-select-input-option-content-icon--not-within-trigger'),
       children: icon
@@ -26,11 +26,11 @@ function SelectInputOptionContent({
           className: "d-inline np-select-input-option-content-title",
           children: title
         }), note ? /*#__PURE__*/jsxRuntime.jsx("span", {
-          className: "np-select-input-option-content-text-secondary np-text-body-default",
+          className: "np-select-input-option-content-text-secondary wds-text-body-default",
           children: note
         }) : null]
       }), description ? /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: clsx.clsx('np-select-input-option-content-text-secondary np-text-body-default', withinTrigger && 'np-select-input-option-content-text-within-trigger np-select-input-option-description-in-trigger'),
+        className: clsx.clsx('np-select-input-option-content-text-secondary wds-text-body-default', withinTrigger && 'np-select-input-option-content-text-within-trigger np-select-input-option-description-in-trigger'),
         children: description
       }) : null]
     })]

package/build/Inputs/SelectInput/OptionContent/SelectInputOptionContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInputOptionContent.js","sources":["../../../../src/Inputs/SelectInput/OptionContent/SelectInputOptionContent.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useContext } from 'react';\nimport { SelectInputOptionContentWithinTriggerContext } from '../SelectInput.contexts';\n\nexport interface SelectInputOptionContentProps {\n  title: React.ReactNode;\n  note?: string;\n  description?: string;\n  icon?: React.ReactNode;\n  className?: string;\n}\n\n/**\n * Component for rendering structured content within a SelectInput option.\n * Supports title, optional note, description, and icon with different styling\n * based on whether it's rendered within the trigger button or the dropdown.\n */\nexport function SelectInputOptionContent({\n  title,\n  note,\n  description,\n  icon,\n  className,\n}: SelectInputOptionContentProps) {\n  const withinTrigger = useContext(SelectInputOptionContentWithinTriggerContext);\n\n  return (\n    <div\n      className={clsx(\n        'np-select-input-option-content-container',\n        (note || description) && 'np-text-body-large',\n        className,\n      )}\n    >\n      {icon ? (\n        <div\n          className={clsx(\n            'np-select-input-option-content-icon',\n            !withinTrigger && 'np-select-input-option-content-icon--not-within-trigger',\n          )}\n        >\n          {icon}\n        </div>\n      ) : null}\n\n      <div className=\"np-select-input-option-content-text\">\n        <div\n          className={clsx(\n            'np-select-input-option-content-text-line-1',\n            withinTrigger && 'np-select-input-option-content-text-within-trigger',\n          )}\n        >\n          <div className=\"d-inline np-select-input-option-content-title\">{title}</div>\n          {note ? (\n            <span className=\"np-select-input-option-content-text-secondary np-text-body-default\">\n              {note}\n            </span>\n          ) : null}\n        </div>\n\n        {description ? (\n          <div\n            className={clsx(\n              'np-select-input-option-content-text-secondary np-text-body-default',\n              withinTrigger &&\n                'np-select-input-option-content-text-within-trigger np-select-input-option-description-in-trigger',\n            )}\n          >\n            {description}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  );\n}\n"],"names":["SelectInputOptionContent","title","note","description","icon","className","withinTrigger","useContext","SelectInputOptionContentWithinTriggerContext","_jsxs","clsx","children","_jsx"],"mappings":";;;;;;;AAiBM,SAAUA,wBAAwBA,CAAC;EACvCC,KAAK;EACLC,IAAI;EACJC,WAAW;EACXC,IAAI;AACJC,EAAAA;AAAS,CACqB,EAAA;AAC9B,EAAA,MAAMC,aAAa,GAAGC,gBAAU,CAACC,iEAA4C,CAAC;AAE9E,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AACEJ,IAAAA,SAAS,EAAEK,SAAI,CACb,0CAA0C,EAC1C,CAACR,IAAI,IAAIC,WAAW,KAAK,oBAAoB,EAC7CE,SAAS,CACT;IAAAM,QAAA,EAAA,CAEDP,IAAI,gBACHQ,cAAA,CAAA,KAAA,EAAA;MACEP,SAAS,EAAEK,SAAI,CACb,qCAAqC,EACrC,CAACJ,aAAa,IAAI,yDAAyD,CAC3E;AAAAK,MAAAA,QAAA,EAEDP;AAAI,KACF,CAAC,GACJ,IAAI,eAERK,eAAA,CAAA,KAAA,EAAA;AAAKJ,MAAAA,SAAS,EAAC,qCAAqC;AAAAM,MAAAA,QAAA,gBAClDF,eAAA,CAAA,KAAA,EAAA;QACEJ,SAAS,EAAEK,SAAI,CACb,4CAA4C,EAC5CJ,aAAa,IAAI,oDAAoD,CACrE;AAAAK,QAAAA,QAAA,gBAEFC,cAAA,CAAA,KAAA,EAAA;AAAKP,UAAAA,SAAS,EAAC,+CAA+C;AAAAM,UAAAA,QAAA,EAAEV;AAAK,SAAM,CAC3E,EAACC,IAAI,gBACHU,cAAA,CAAA,MAAA,EAAA;AAAMP,UAAAA,SAAS,EAAC,oEAAoE;AAAAM,UAAAA,QAAA,EACjFT;SACG,CAAC,GACL,IAAI;AAAA,OACL,CAEL,EAACC,WAAW,gBACVS,cAAA,CAAA,KAAA,EAAA;QACEP,SAAS,EAAEK,SAAI,CACb,oEAAoE,EACpEJ,aAAa,IACX,kGAAkG,CACpG;AAAAK,QAAAA,QAAA,EAEDR;OACE,CAAC,GACJ,IAAI;AAAA,KACL,CACP;AAAA,GAAK,CAAC;AAEV;;"}
+{"version":3,"file":"SelectInputOptionContent.js","sources":["../../../../src/Inputs/SelectInput/OptionContent/SelectInputOptionContent.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useContext } from 'react';\nimport { SelectInputOptionContentWithinTriggerContext } from '../SelectInput.contexts';\n\nexport interface SelectInputOptionContentProps {\n  title: React.ReactNode;\n  note?: string;\n  description?: string;\n  icon?: React.ReactNode;\n  className?: string;\n}\n\n/**\n * Component for rendering structured content within a SelectInput option.\n * Supports title, optional note, description, and icon with different styling\n * based on whether it's rendered within the trigger button or the dropdown.\n */\nexport function SelectInputOptionContent({\n  title,\n  note,\n  description,\n  icon,\n  className,\n}: SelectInputOptionContentProps) {\n  const withinTrigger = useContext(SelectInputOptionContentWithinTriggerContext);\n\n  return (\n    <div\n      className={clsx(\n        'np-select-input-option-content-container',\n        (note || description) && 'wds-text-body-large',\n        className,\n      )}\n    >\n      {icon ? (\n        <div\n          className={clsx(\n            'np-select-input-option-content-icon',\n            !withinTrigger && 'np-select-input-option-content-icon--not-within-trigger',\n          )}\n        >\n          {icon}\n        </div>\n      ) : null}\n\n      <div className=\"np-select-input-option-content-text\">\n        <div\n          className={clsx(\n            'np-select-input-option-content-text-line-1',\n            withinTrigger && 'np-select-input-option-content-text-within-trigger',\n          )}\n        >\n          <div className=\"d-inline np-select-input-option-content-title\">{title}</div>\n          {note ? (\n            <span className=\"np-select-input-option-content-text-secondary wds-text-body-default\">\n              {note}\n            </span>\n          ) : null}\n        </div>\n\n        {description ? (\n          <div\n            className={clsx(\n              'np-select-input-option-content-text-secondary wds-text-body-default',\n              withinTrigger &&\n                'np-select-input-option-content-text-within-trigger np-select-input-option-description-in-trigger',\n            )}\n          >\n            {description}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  );\n}\n"],"names":["SelectInputOptionContent","title","note","description","icon","className","withinTrigger","useContext","SelectInputOptionContentWithinTriggerContext","_jsxs","clsx","children","_jsx"],"mappings":";;;;;;;AAiBM,SAAUA,wBAAwBA,CAAC;EACvCC,KAAK;EACLC,IAAI;EACJC,WAAW;EACXC,IAAI;AACJC,EAAAA;AAAS,CACqB,EAAA;AAC9B,EAAA,MAAMC,aAAa,GAAGC,gBAAU,CAACC,iEAA4C,CAAC;AAE9E,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AACEJ,IAAAA,SAAS,EAAEK,SAAI,CACb,0CAA0C,EAC1C,CAACR,IAAI,IAAIC,WAAW,KAAK,qBAAqB,EAC9CE,SAAS,CACT;IAAAM,QAAA,EAAA,CAEDP,IAAI,gBACHQ,cAAA,CAAA,KAAA,EAAA;MACEP,SAAS,EAAEK,SAAI,CACb,qCAAqC,EACrC,CAACJ,aAAa,IAAI,yDAAyD,CAC3E;AAAAK,MAAAA,QAAA,EAEDP;AAAI,KACF,CAAC,GACJ,IAAI,eAERK,eAAA,CAAA,KAAA,EAAA;AAAKJ,MAAAA,SAAS,EAAC,qCAAqC;AAAAM,MAAAA,QAAA,gBAClDF,eAAA,CAAA,KAAA,EAAA;QACEJ,SAAS,EAAEK,SAAI,CACb,4CAA4C,EAC5CJ,aAAa,IAAI,oDAAoD,CACrE;AAAAK,QAAAA,QAAA,gBAEFC,cAAA,CAAA,KAAA,EAAA;AAAKP,UAAAA,SAAS,EAAC,+CAA+C;AAAAM,UAAAA,QAAA,EAAEV;AAAK,SAAM,CAC3E,EAACC,IAAI,gBACHU,cAAA,CAAA,MAAA,EAAA;AAAMP,UAAAA,SAAS,EAAC,qEAAqE;AAAAM,UAAAA,QAAA,EAClFT;SACG,CAAC,GACL,IAAI;AAAA,OACL,CAEL,EAACC,WAAW,gBACVS,cAAA,CAAA,KAAA,EAAA;QACEP,SAAS,EAAEK,SAAI,CACb,qEAAqE,EACrEJ,aAAa,IACX,kGAAkG,CACpG;AAAAK,QAAAA,QAAA,EAEDR;OACE,CAAC,GACJ,IAAI;AAAA,KACL,CACP;AAAA,GAAK,CAAC;AAEV;;"}

package/build/Inputs/SelectInput/OptionContent/SelectInputOptionContent.mjs

@@ -12,7 +12,7 @@ function SelectInputOptionContent({
 }) {
   const withinTrigger = useContext(SelectInputOptionContentWithinTriggerContext);
   return /*#__PURE__*/jsxs("div", {
-    className: clsx('np-select-input-option-content-container', (note || description) && 'np-text-body-large', className),
+    className: clsx('np-select-input-option-content-container', (note || description) && 'wds-text-body-large', className),
     children: [icon ? /*#__PURE__*/jsx("div", {
       className: clsx('np-select-input-option-content-icon', !withinTrigger && 'np-select-input-option-content-icon--not-within-trigger'),
       children: icon
@@ -24,11 +24,11 @@ function SelectInputOptionContent({
           className: "d-inline np-select-input-option-content-title",
           children: title
         }), note ? /*#__PURE__*/jsx("span", {
-          className: "np-select-input-option-content-text-secondary np-text-body-default",
+          className: "np-select-input-option-content-text-secondary wds-text-body-default",
           children: note
         }) : null]
       }), description ? /*#__PURE__*/jsx("div", {
-        className: clsx('np-select-input-option-content-text-secondary np-text-body-default', withinTrigger && 'np-select-input-option-content-text-within-trigger np-select-input-option-description-in-trigger'),
+        className: clsx('np-select-input-option-content-text-secondary wds-text-body-default', withinTrigger && 'np-select-input-option-content-text-within-trigger np-select-input-option-description-in-trigger'),
         children: description
       }) : null]
     })]

package/build/Inputs/SelectInput/OptionContent/SelectInputOptionContent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInputOptionContent.mjs","sources":["../../../../src/Inputs/SelectInput/OptionContent/SelectInputOptionContent.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useContext } from 'react';\nimport { SelectInputOptionContentWithinTriggerContext } from '../SelectInput.contexts';\n\nexport interface SelectInputOptionContentProps {\n  title: React.ReactNode;\n  note?: string;\n  description?: string;\n  icon?: React.ReactNode;\n  className?: string;\n}\n\n/**\n * Component for rendering structured content within a SelectInput option.\n * Supports title, optional note, description, and icon with different styling\n * based on whether it's rendered within the trigger button or the dropdown.\n */\nexport function SelectInputOptionContent({\n  title,\n  note,\n  description,\n  icon,\n  className,\n}: SelectInputOptionContentProps) {\n  const withinTrigger = useContext(SelectInputOptionContentWithinTriggerContext);\n\n  return (\n    <div\n      className={clsx(\n        'np-select-input-option-content-container',\n        (note || description) && 'np-text-body-large',\n        className,\n      )}\n    >\n      {icon ? (\n        <div\n          className={clsx(\n            'np-select-input-option-content-icon',\n            !withinTrigger && 'np-select-input-option-content-icon--not-within-trigger',\n          )}\n        >\n          {icon}\n        </div>\n      ) : null}\n\n      <div className=\"np-select-input-option-content-text\">\n        <div\n          className={clsx(\n            'np-select-input-option-content-text-line-1',\n            withinTrigger && 'np-select-input-option-content-text-within-trigger',\n          )}\n        >\n          <div className=\"d-inline np-select-input-option-content-title\">{title}</div>\n          {note ? (\n            <span className=\"np-select-input-option-content-text-secondary np-text-body-default\">\n              {note}\n            </span>\n          ) : null}\n        </div>\n\n        {description ? (\n          <div\n            className={clsx(\n              'np-select-input-option-content-text-secondary np-text-body-default',\n              withinTrigger &&\n                'np-select-input-option-content-text-within-trigger np-select-input-option-description-in-trigger',\n            )}\n          >\n            {description}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  );\n}\n"],"names":["SelectInputOptionContent","title","note","description","icon","className","withinTrigger","useContext","SelectInputOptionContentWithinTriggerContext","_jsxs","clsx","children","_jsx"],"mappings":";;;;;AAiBM,SAAUA,wBAAwBA,CAAC;EACvCC,KAAK;EACLC,IAAI;EACJC,WAAW;EACXC,IAAI;AACJC,EAAAA;AAAS,CACqB,EAAA;AAC9B,EAAA,MAAMC,aAAa,GAAGC,UAAU,CAACC,4CAA4C,CAAC;AAE9E,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AACEJ,IAAAA,SAAS,EAAEK,IAAI,CACb,0CAA0C,EAC1C,CAACR,IAAI,IAAIC,WAAW,KAAK,oBAAoB,EAC7CE,SAAS,CACT;IAAAM,QAAA,EAAA,CAEDP,IAAI,gBACHQ,GAAA,CAAA,KAAA,EAAA;MACEP,SAAS,EAAEK,IAAI,CACb,qCAAqC,EACrC,CAACJ,aAAa,IAAI,yDAAyD,CAC3E;AAAAK,MAAAA,QAAA,EAEDP;AAAI,KACF,CAAC,GACJ,IAAI,eAERK,IAAA,CAAA,KAAA,EAAA;AAAKJ,MAAAA,SAAS,EAAC,qCAAqC;AAAAM,MAAAA,QAAA,gBAClDF,IAAA,CAAA,KAAA,EAAA;QACEJ,SAAS,EAAEK,IAAI,CACb,4CAA4C,EAC5CJ,aAAa,IAAI,oDAAoD,CACrE;AAAAK,QAAAA,QAAA,gBAEFC,GAAA,CAAA,KAAA,EAAA;AAAKP,UAAAA,SAAS,EAAC,+CAA+C;AAAAM,UAAAA,QAAA,EAAEV;AAAK,SAAM,CAC3E,EAACC,IAAI,gBACHU,GAAA,CAAA,MAAA,EAAA;AAAMP,UAAAA,SAAS,EAAC,oEAAoE;AAAAM,UAAAA,QAAA,EACjFT;SACG,CAAC,GACL,IAAI;AAAA,OACL,CAEL,EAACC,WAAW,gBACVS,GAAA,CAAA,KAAA,EAAA;QACEP,SAAS,EAAEK,IAAI,CACb,oEAAoE,EACpEJ,aAAa,IACX,kGAAkG,CACpG;AAAAK,QAAAA,QAAA,EAEDR;OACE,CAAC,GACJ,IAAI;AAAA,KACL,CACP;AAAA,GAAK,CAAC;AAEV;;"}
+{"version":3,"file":"SelectInputOptionContent.mjs","sources":["../../../../src/Inputs/SelectInput/OptionContent/SelectInputOptionContent.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useContext } from 'react';\nimport { SelectInputOptionContentWithinTriggerContext } from '../SelectInput.contexts';\n\nexport interface SelectInputOptionContentProps {\n  title: React.ReactNode;\n  note?: string;\n  description?: string;\n  icon?: React.ReactNode;\n  className?: string;\n}\n\n/**\n * Component for rendering structured content within a SelectInput option.\n * Supports title, optional note, description, and icon with different styling\n * based on whether it's rendered within the trigger button or the dropdown.\n */\nexport function SelectInputOptionContent({\n  title,\n  note,\n  description,\n  icon,\n  className,\n}: SelectInputOptionContentProps) {\n  const withinTrigger = useContext(SelectInputOptionContentWithinTriggerContext);\n\n  return (\n    <div\n      className={clsx(\n        'np-select-input-option-content-container',\n        (note || description) && 'wds-text-body-large',\n        className,\n      )}\n    >\n      {icon ? (\n        <div\n          className={clsx(\n            'np-select-input-option-content-icon',\n            !withinTrigger && 'np-select-input-option-content-icon--not-within-trigger',\n          )}\n        >\n          {icon}\n        </div>\n      ) : null}\n\n      <div className=\"np-select-input-option-content-text\">\n        <div\n          className={clsx(\n            'np-select-input-option-content-text-line-1',\n            withinTrigger && 'np-select-input-option-content-text-within-trigger',\n          )}\n        >\n          <div className=\"d-inline np-select-input-option-content-title\">{title}</div>\n          {note ? (\n            <span className=\"np-select-input-option-content-text-secondary wds-text-body-default\">\n              {note}\n            </span>\n          ) : null}\n        </div>\n\n        {description ? (\n          <div\n            className={clsx(\n              'np-select-input-option-content-text-secondary wds-text-body-default',\n              withinTrigger &&\n                'np-select-input-option-content-text-within-trigger np-select-input-option-description-in-trigger',\n            )}\n          >\n            {description}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  );\n}\n"],"names":["SelectInputOptionContent","title","note","description","icon","className","withinTrigger","useContext","SelectInputOptionContentWithinTriggerContext","_jsxs","clsx","children","_jsx"],"mappings":";;;;;AAiBM,SAAUA,wBAAwBA,CAAC;EACvCC,KAAK;EACLC,IAAI;EACJC,WAAW;EACXC,IAAI;AACJC,EAAAA;AAAS,CACqB,EAAA;AAC9B,EAAA,MAAMC,aAAa,GAAGC,UAAU,CAACC,4CAA4C,CAAC;AAE9E,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AACEJ,IAAAA,SAAS,EAAEK,IAAI,CACb,0CAA0C,EAC1C,CAACR,IAAI,IAAIC,WAAW,KAAK,qBAAqB,EAC9CE,SAAS,CACT;IAAAM,QAAA,EAAA,CAEDP,IAAI,gBACHQ,GAAA,CAAA,KAAA,EAAA;MACEP,SAAS,EAAEK,IAAI,CACb,qCAAqC,EACrC,CAACJ,aAAa,IAAI,yDAAyD,CAC3E;AAAAK,MAAAA,QAAA,EAEDP;AAAI,KACF,CAAC,GACJ,IAAI,eAERK,IAAA,CAAA,KAAA,EAAA;AAAKJ,MAAAA,SAAS,EAAC,qCAAqC;AAAAM,MAAAA,QAAA,gBAClDF,IAAA,CAAA,KAAA,EAAA;QACEJ,SAAS,EAAEK,IAAI,CACb,4CAA4C,EAC5CJ,aAAa,IAAI,oDAAoD,CACrE;AAAAK,QAAAA,QAAA,gBAEFC,GAAA,CAAA,KAAA,EAAA;AAAKP,UAAAA,SAAS,EAAC,+CAA+C;AAAAM,UAAAA,QAAA,EAAEV;AAAK,SAAM,CAC3E,EAACC,IAAI,gBACHU,GAAA,CAAA,MAAA,EAAA;AAAMP,UAAAA,SAAS,EAAC,qEAAqE;AAAAM,UAAAA,QAAA,EAClFT;SACG,CAAC,GACL,IAAI;AAAA,OACL,CAEL,EAACC,WAAW,gBACVS,GAAA,CAAA,KAAA,EAAA;QACEP,SAAS,EAAEK,IAAI,CACb,qEAAqE,EACrEJ,aAAa,IACX,kGAAkG,CACpG;AAAAK,QAAAA,QAAA,EAEDR;OACE,CAAC,GACJ,IAAI;AAAA,KACL,CACP;AAAA,GAAK,CAAC;AAEV;;"}

package/build/Inputs/SelectInput/Popover/SelectInputPopover.js

@@ -95,10 +95,10 @@ function SelectInputPopover({
                     'np-popover-v2--padding-md': padding === 'md'
                   }),
                   children: [title ? /*#__PURE__*/jsxRuntime.jsx("h2", {
-                    className: "np-popover-v2-title np-text-title-body",
+                    className: "np-popover-v2-title wds-text-title-body",
                     children: title
                   }) : null, /*#__PURE__*/jsxRuntime.jsx("div", {
-                    className: "np-popover-v2-content np-text-body-default",
+                    className: "np-popover-v2-content wds-text-body-default",
                     children: children
                   })]
                 })

package/build/Inputs/SelectInput/Popover/SelectInputPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInputPopover.js","sources":["../../../../src/Inputs/SelectInput/Popover/SelectInputPopover.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingPortal,\n  offset,\n  type Placement,\n  shift,\n  size as floatingSize,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport { Transition } from '@headlessui/react';\nimport { FocusScope } from '@react-aria/focus';\nimport { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { useState } from 'react';\n\nimport { PreventScroll } from '../../../common/PreventScroll/PreventScroll';\n\nexport interface SelectInputPopoverProps {\n  placement?: Placement;\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  size?: 'md' | 'lg';\n  padding?: 'none' | 'md';\n  children?: React.ReactNode;\n  onClose?: () => void;\n  onCloseEnd?: () => void;\n}\n\nconst FLOATING_PADDING = 16;\n\nexport function SelectInputPopover({\n  placement,\n  open,\n  renderTrigger,\n  title,\n  size = 'md',\n  padding = 'md',\n  children,\n  onClose,\n  onCloseEnd,\n}: SelectInputPopoverProps) {\n  const { refs, floatingStyles, context } = useFloating<Element>({\n    strategy: 'fixed',\n    placement,\n    middleware: [\n      offset(8),\n      flip({ padding: FLOATING_PADDING, crossAxis: false }),\n      shift(),\n      floatingSize({\n        padding: FLOATING_PADDING,\n        apply: ({ elements, rects, availableHeight }) => {\n          elements.floating.style.setProperty('--max-height', `${availableHeight}px`);\n          elements.floating.style.setProperty('--width', `${rects.reference.width}px`);\n        },\n      }),\n    ],\n    whileElementsMounted: autoUpdate,\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([role, dismiss]);\n\n  const [floatingKey, setFloatingKey] = useState(0);\n\n  const { theme, screenMode } = useTheme();\n\n  return (\n    <>\n      {open ? <PreventScroll /> : null}\n      {/* eslint-disable react-hooks/refs -- setReference is a callback ref from floating-ui, safe to pass during render */}\n      {renderTrigger({\n        ref: refs.setReference,\n        getInteractionProps: getReferenceProps,\n      })}\n      {/* eslint-enable react-hooks/refs */}\n\n      <FloatingPortal>\n        <ThemeProvider theme=\"personal\" screenMode={theme === 'personal' ? screenMode : 'light'}>\n          <Transition\n            as=\"div\"\n            show={open}\n            leave=\"transition-opacity\"\n            leaveTo=\"opacity-0\"\n            beforeEnter={() => {\n              setFloatingKey((prev) => prev + 1);\n            }}\n            afterLeave={onCloseEnd}\n          >\n            <FocusScope>\n              <FloatingFocusManager context={context}>\n                {/* eslint-disable react-hooks/refs -- setFloating is a callback ref from floating-ui, safe to pass during render */}\n                <div\n                  key={floatingKey} // Force inner state invalidation on open\n                  ref={refs.setFloating}\n                  className={clsx('np-popover-v2-container', {\n                    'np-popover-v2-container--size-md': size === 'md',\n                    'np-popover-v2-container--size-lg': size === 'lg',\n                  })}\n                  style={floatingStyles}\n                  {...getFloatingProps()}\n                >\n                  {/* eslint-enable react-hooks/refs */}\n                  <div\n                    className={clsx('np-popover-v2', title && 'np-popover-v2--has-title', {\n                      'np-popover-v2--padding-md': padding === 'md',\n                    })}\n                  >\n                    {title ? (\n                      <h2 className=\"np-popover-v2-title np-text-title-body\">{title}</h2>\n                    ) : null}\n                    <div className=\"np-popover-v2-content np-text-body-default\">{children}</div>\n                  </div>\n                </div>\n              </FloatingFocusManager>\n            </FocusScope>\n          </Transition>\n        </ThemeProvider>\n      </FloatingPortal>\n    </>\n  );\n}\n"],"names":["FLOATING_PADDING","SelectInputPopover","placement","open","renderTrigger","title","size","padding","children","onClose","onCloseEnd","refs","floatingStyles","context","useFloating","strategy","middleware","offset","flip","crossAxis","shift","floatingSize","apply","elements","rects","availableHeight","floating","style","setProperty","reference","width","whileElementsMounted","autoUpdate","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","leave","leaveTo","beforeEnter","prev","afterLeave","FocusScope","FloatingFocusManager","setFloating","className","clsx"],"mappings":";;;;;;;;;;;AAuCA,MAAMA,gBAAgB,GAAG,EAAE;AAErB,SAAUC,kBAAkBA,CAAC;EACjCC,SAAS;EACTC,IAAI;EACJC,aAAa;EACbC,KAAK;AACLC,EAAAA,IAAI,GAAG,IAAI;AACXC,EAAAA,OAAO,GAAG,IAAI;EACdC,QAAQ;EACRC,OAAO;AACPC,EAAAA;AAAU,CACc,EAAA;EACxB,MAAM;IAAEC,IAAI;IAAEC,cAAc;AAAEC,IAAAA;GAAS,GAAGC,iBAAW,CAAU;AAC7DC,IAAAA,QAAQ,EAAE,OAAO;IACjBb,SAAS;IACTc,UAAU,EAAE,CACVC,YAAM,CAAC,CAAC,CAAC,EACTC,UAAI,CAAC;AAAEX,MAAAA,OAAO,EAAEP,gBAAgB;AAAEmB,MAAAA,SAAS,EAAE;AAAK,KAAE,CAAC,EACrDC,WAAK,EAAE,EACPC,UAAY,CAAC;AACXd,MAAAA,OAAO,EAAEP,gBAAgB;AACzBsB,MAAAA,KAAK,EAAEA,CAAC;QAAEC,QAAQ;QAAEC,KAAK;AAAEC,QAAAA;AAAe,OAAE,KAAI;AAC9CF,QAAAA,QAAQ,CAACG,QAAQ,CAACC,KAAK,CAACC,WAAW,CAAC,cAAc,EAAE,CAAA,EAAGH,eAAe,CAAA,EAAA,CAAI,CAAC;AAC3EF,QAAAA,QAAQ,CAACG,QAAQ,CAACC,KAAK,CAACC,WAAW,CAAC,SAAS,EAAE,CAAA,EAAGJ,KAAK,CAACK,SAAS,CAACC,KAAK,IAAI,CAAC;AAC9E,MAAA;KACD,CAAC,CACH;AACDC,IAAAA,oBAAoB,EAAEC,gBAAU;IAChC7B,IAAI;IACJ8B,YAAY,EAAGC,KAAK,IAAI;MACtB,IAAI,CAACA,KAAK,EAAE;AACVzB,QAAAA,OAAO,IAAI;AACb,MAAA;AACF,IAAA;AACD,GAAA,CAAC;AAEF,EAAA,MAAM0B,OAAO,GAAGC,gBAAU,CAACvB,OAAO,CAAC;AACnC,EAAA,MAAMwB,IAAI,GAAGC,aAAO,CAACzB,OAAO,CAAC;EAC7B,MAAM;IAAE0B,iBAAiB;AAAEC,IAAAA;GAAkB,GAAGC,qBAAe,CAAC,CAACJ,IAAI,EAAEF,OAAO,CAAC,CAAC;EAEhF,MAAM,CAACO,WAAW,EAAEC,cAAc,CAAC,GAAGC,cAAQ,CAAC,CAAC,CAAC;EAEjD,MAAM;IAAEC,KAAK;AAAEC,IAAAA;GAAY,GAAGC,0BAAQ,EAAE;EAExC,oBACEC,eAAA,CAAAC,mBAAA,EAAA;AAAAzC,IAAAA,QAAA,EAAA,CACGL,IAAI,gBAAG+C,cAAA,CAACC,2BAAa,EAAA,EAAA,CAAG,GAAG,IAAI,EAE/B/C,aAAa,CAAC;MACbgD,GAAG,EAAEzC,IAAI,CAAC0C,YAAY;AACtBC,MAAAA,mBAAmB,EAAEf;AACtB,KAAA,CAAC,eAGFW,cAAA,CAACK,oBAAc,EAAA;MAAA/C,QAAA,eACb0C,cAAA,CAACM,+BAAa,EAAA;AAACX,QAAAA,KAAK,EAAC,UAAU;AAACC,QAAAA,UAAU,EAAED,KAAK,KAAK,UAAU,GAAGC,UAAU,GAAG,OAAQ;QAAAtC,QAAA,eACtF0C,cAAA,CAACO,kBAAU,EAAA;AACTC,UAAAA,EAAE,EAAC,KAAK;AACRC,UAAAA,IAAI,EAAExD,IAAK;AACXyD,UAAAA,KAAK,EAAC,oBAAoB;AAC1BC,UAAAA,OAAO,EAAC,WAAW;UACnBC,WAAW,EAAEA,MAAK;AAChBnB,YAAAA,cAAc,CAAEoB,IAAI,IAAKA,IAAI,GAAG,CAAC,CAAC;UACpC,CAAE;AACFC,UAAAA,UAAU,EAAEtD,UAAW;UAAAF,QAAA,eAEvB0C,cAAA,CAACe,gBAAU,EAAA;YAAAzD,QAAA,eACT0C,cAAA,CAACgB,0BAAoB,EAAA;AAACrD,cAAAA,OAAO,EAAEA,OAAQ;AAAAL,cAAAA,QAAA,eAErC0C,cAAA,CAAA,KAAA,EAAA;AACoB;gBAClBE,GAAG,EAAEzC,IAAI,CAACwD,WAAY;AACtBC,gBAAAA,SAAS,EAAEC,SAAI,CAAC,yBAAyB,EAAE;kBACzC,kCAAkC,EAAE/D,IAAI,KAAK,IAAI;kBACjD,kCAAkC,EAAEA,IAAI,KAAK;AAC9C,iBAAA,CAAE;AACHqB,gBAAAA,KAAK,EAAEf,cAAe;gBAAA,GAClB4B,gBAAgB,EAAE;AAAAhC,gBAAAA,QAAA,eAGtBwC,eAAA,CAAA,KAAA,EAAA;kBACEoB,SAAS,EAAEC,SAAI,CAAC,eAAe,EAAEhE,KAAK,IAAI,0BAA0B,EAAE;oBACpE,2BAA2B,EAAEE,OAAO,KAAK;AAC1C,mBAAA,CAAE;kBAAAC,QAAA,EAAA,CAEFH,KAAK,gBACJ6C,cAAA,CAAA,IAAA,EAAA;AAAIkB,oBAAAA,SAAS,EAAC,wCAAwC;AAAA5D,oBAAAA,QAAA,EAAEH;AAAK,mBAAK,CAAC,GACjE,IAAI,eACR6C,cAAA,CAAA,KAAA,EAAA;AAAKkB,oBAAAA,SAAS,EAAC,4CAA4C;AAAA5D,oBAAAA,QAAA,EAAEA;AAAQ,mBAAM,CAC7E;iBAAK;AACP,eAAA,EApBOkC,WAoBF;aACe;WACZ;SACF;OACC;AACjB,KAAgB,CAClB;AAAA,GAAA,CAAG;AAEP;;"}
+{"version":3,"file":"SelectInputPopover.js","sources":["../../../../src/Inputs/SelectInput/Popover/SelectInputPopover.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingPortal,\n  offset,\n  type Placement,\n  shift,\n  size as floatingSize,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport { Transition } from '@headlessui/react';\nimport { FocusScope } from '@react-aria/focus';\nimport { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { useState } from 'react';\n\nimport { PreventScroll } from '../../../common/PreventScroll/PreventScroll';\n\nexport interface SelectInputPopoverProps {\n  placement?: Placement;\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  size?: 'md' | 'lg';\n  padding?: 'none' | 'md';\n  children?: React.ReactNode;\n  onClose?: () => void;\n  onCloseEnd?: () => void;\n}\n\nconst FLOATING_PADDING = 16;\n\nexport function SelectInputPopover({\n  placement,\n  open,\n  renderTrigger,\n  title,\n  size = 'md',\n  padding = 'md',\n  children,\n  onClose,\n  onCloseEnd,\n}: SelectInputPopoverProps) {\n  const { refs, floatingStyles, context } = useFloating<Element>({\n    strategy: 'fixed',\n    placement,\n    middleware: [\n      offset(8),\n      flip({ padding: FLOATING_PADDING, crossAxis: false }),\n      shift(),\n      floatingSize({\n        padding: FLOATING_PADDING,\n        apply: ({ elements, rects, availableHeight }) => {\n          elements.floating.style.setProperty('--max-height', `${availableHeight}px`);\n          elements.floating.style.setProperty('--width', `${rects.reference.width}px`);\n        },\n      }),\n    ],\n    whileElementsMounted: autoUpdate,\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([role, dismiss]);\n\n  const [floatingKey, setFloatingKey] = useState(0);\n\n  const { theme, screenMode } = useTheme();\n\n  return (\n    <>\n      {open ? <PreventScroll /> : null}\n      {/* eslint-disable react-hooks/refs -- setReference is a callback ref from floating-ui, safe to pass during render */}\n      {renderTrigger({\n        ref: refs.setReference,\n        getInteractionProps: getReferenceProps,\n      })}\n      {/* eslint-enable react-hooks/refs */}\n\n      <FloatingPortal>\n        <ThemeProvider theme=\"personal\" screenMode={theme === 'personal' ? screenMode : 'light'}>\n          <Transition\n            as=\"div\"\n            show={open}\n            leave=\"transition-opacity\"\n            leaveTo=\"opacity-0\"\n            beforeEnter={() => {\n              setFloatingKey((prev) => prev + 1);\n            }}\n            afterLeave={onCloseEnd}\n          >\n            <FocusScope>\n              <FloatingFocusManager context={context}>\n                {/* eslint-disable react-hooks/refs -- setFloating is a callback ref from floating-ui, safe to pass during render */}\n                <div\n                  key={floatingKey} // Force inner state invalidation on open\n                  ref={refs.setFloating}\n                  className={clsx('np-popover-v2-container', {\n                    'np-popover-v2-container--size-md': size === 'md',\n                    'np-popover-v2-container--size-lg': size === 'lg',\n                  })}\n                  style={floatingStyles}\n                  {...getFloatingProps()}\n                >\n                  {/* eslint-enable react-hooks/refs */}\n                  <div\n                    className={clsx('np-popover-v2', title && 'np-popover-v2--has-title', {\n                      'np-popover-v2--padding-md': padding === 'md',\n                    })}\n                  >\n                    {title ? (\n                      <h2 className=\"np-popover-v2-title wds-text-title-body\">{title}</h2>\n                    ) : null}\n                    <div className=\"np-popover-v2-content wds-text-body-default\">{children}</div>\n                  </div>\n                </div>\n              </FloatingFocusManager>\n            </FocusScope>\n          </Transition>\n        </ThemeProvider>\n      </FloatingPortal>\n    </>\n  );\n}\n"],"names":["FLOATING_PADDING","SelectInputPopover","placement","open","renderTrigger","title","size","padding","children","onClose","onCloseEnd","refs","floatingStyles","context","useFloating","strategy","middleware","offset","flip","crossAxis","shift","floatingSize","apply","elements","rects","availableHeight","floating","style","setProperty","reference","width","whileElementsMounted","autoUpdate","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","leave","leaveTo","beforeEnter","prev","afterLeave","FocusScope","FloatingFocusManager","setFloating","className","clsx"],"mappings":"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"}

package/build/Inputs/SelectInput/Popover/SelectInputPopover.mjs

@@ -93,10 +93,10 @@ function SelectInputPopover({
                     'np-popover-v2--padding-md': padding === 'md'
                   }),
                   children: [title ? /*#__PURE__*/jsx("h2", {
-                    className: "np-popover-v2-title np-text-title-body",
+                    className: "np-popover-v2-title wds-text-title-body",
                     children: title
                   }) : null, /*#__PURE__*/jsx("div", {
-                    className: "np-popover-v2-content np-text-body-default",
+                    className: "np-popover-v2-content wds-text-body-default",
                     children: children
                   })]
                 })

package/build/Inputs/SelectInput/Popover/SelectInputPopover.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInputPopover.mjs","sources":["../../../../src/Inputs/SelectInput/Popover/SelectInputPopover.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingPortal,\n  offset,\n  type Placement,\n  shift,\n  size as floatingSize,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport { Transition } from '@headlessui/react';\nimport { FocusScope } from '@react-aria/focus';\nimport { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { useState } from 'react';\n\nimport { PreventScroll } from '../../../common/PreventScroll/PreventScroll';\n\nexport interface SelectInputPopoverProps {\n  placement?: Placement;\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  size?: 'md' | 'lg';\n  padding?: 'none' | 'md';\n  children?: React.ReactNode;\n  onClose?: () => void;\n  onCloseEnd?: () => void;\n}\n\nconst FLOATING_PADDING = 16;\n\nexport function SelectInputPopover({\n  placement,\n  open,\n  renderTrigger,\n  title,\n  size = 'md',\n  padding = 'md',\n  children,\n  onClose,\n  onCloseEnd,\n}: SelectInputPopoverProps) {\n  const { refs, floatingStyles, context } = useFloating<Element>({\n    strategy: 'fixed',\n    placement,\n    middleware: [\n      offset(8),\n      flip({ padding: FLOATING_PADDING, crossAxis: false }),\n      shift(),\n      floatingSize({\n        padding: FLOATING_PADDING,\n        apply: ({ elements, rects, availableHeight }) => {\n          elements.floating.style.setProperty('--max-height', `${availableHeight}px`);\n          elements.floating.style.setProperty('--width', `${rects.reference.width}px`);\n        },\n      }),\n    ],\n    whileElementsMounted: autoUpdate,\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([role, dismiss]);\n\n  const [floatingKey, setFloatingKey] = useState(0);\n\n  const { theme, screenMode } = useTheme();\n\n  return (\n    <>\n      {open ? <PreventScroll /> : null}\n      {/* eslint-disable react-hooks/refs -- setReference is a callback ref from floating-ui, safe to pass during render */}\n      {renderTrigger({\n        ref: refs.setReference,\n        getInteractionProps: getReferenceProps,\n      })}\n      {/* eslint-enable react-hooks/refs */}\n\n      <FloatingPortal>\n        <ThemeProvider theme=\"personal\" screenMode={theme === 'personal' ? screenMode : 'light'}>\n          <Transition\n            as=\"div\"\n            show={open}\n            leave=\"transition-opacity\"\n            leaveTo=\"opacity-0\"\n            beforeEnter={() => {\n              setFloatingKey((prev) => prev + 1);\n            }}\n            afterLeave={onCloseEnd}\n          >\n            <FocusScope>\n              <FloatingFocusManager context={context}>\n                {/* eslint-disable react-hooks/refs -- setFloating is a callback ref from floating-ui, safe to pass during render */}\n                <div\n                  key={floatingKey} // Force inner state invalidation on open\n                  ref={refs.setFloating}\n                  className={clsx('np-popover-v2-container', {\n                    'np-popover-v2-container--size-md': size === 'md',\n                    'np-popover-v2-container--size-lg': size === 'lg',\n                  })}\n                  style={floatingStyles}\n                  {...getFloatingProps()}\n                >\n                  {/* eslint-enable react-hooks/refs */}\n                  <div\n                    className={clsx('np-popover-v2', title && 'np-popover-v2--has-title', {\n                      'np-popover-v2--padding-md': padding === 'md',\n                    })}\n                  >\n                    {title ? (\n                      <h2 className=\"np-popover-v2-title np-text-title-body\">{title}</h2>\n                    ) : null}\n                    <div className=\"np-popover-v2-content np-text-body-default\">{children}</div>\n                  </div>\n                </div>\n              </FloatingFocusManager>\n            </FocusScope>\n          </Transition>\n        </ThemeProvider>\n      </FloatingPortal>\n    </>\n  );\n}\n"],"names":["FLOATING_PADDING","SelectInputPopover","placement","open","renderTrigger","title","size","padding","children","onClose","onCloseEnd","refs","floatingStyles","context","useFloating","strategy","middleware","offset","flip","crossAxis","shift","floatingSize","apply","elements","rects","availableHeight","floating","style","setProperty","reference","width","whileElementsMounted","autoUpdate","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","leave","leaveTo","beforeEnter","prev","afterLeave","FocusScope","FloatingFocusManager","setFloating","className","clsx"],"mappings":"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"}
+{"version":3,"file":"SelectInputPopover.mjs","sources":["../../../../src/Inputs/SelectInput/Popover/SelectInputPopover.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingPortal,\n  offset,\n  type Placement,\n  shift,\n  size as floatingSize,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport { Transition } from '@headlessui/react';\nimport { FocusScope } from '@react-aria/focus';\nimport { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { useState } from 'react';\n\nimport { PreventScroll } from '../../../common/PreventScroll/PreventScroll';\n\nexport interface SelectInputPopoverProps {\n  placement?: Placement;\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  size?: 'md' | 'lg';\n  padding?: 'none' | 'md';\n  children?: React.ReactNode;\n  onClose?: () => void;\n  onCloseEnd?: () => void;\n}\n\nconst FLOATING_PADDING = 16;\n\nexport function SelectInputPopover({\n  placement,\n  open,\n  renderTrigger,\n  title,\n  size = 'md',\n  padding = 'md',\n  children,\n  onClose,\n  onCloseEnd,\n}: SelectInputPopoverProps) {\n  const { refs, floatingStyles, context } = useFloating<Element>({\n    strategy: 'fixed',\n    placement,\n    middleware: [\n      offset(8),\n      flip({ padding: FLOATING_PADDING, crossAxis: false }),\n      shift(),\n      floatingSize({\n        padding: FLOATING_PADDING,\n        apply: ({ elements, rects, availableHeight }) => {\n          elements.floating.style.setProperty('--max-height', `${availableHeight}px`);\n          elements.floating.style.setProperty('--width', `${rects.reference.width}px`);\n        },\n      }),\n    ],\n    whileElementsMounted: autoUpdate,\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([role, dismiss]);\n\n  const [floatingKey, setFloatingKey] = useState(0);\n\n  const { theme, screenMode } = useTheme();\n\n  return (\n    <>\n      {open ? <PreventScroll /> : null}\n      {/* eslint-disable react-hooks/refs -- setReference is a callback ref from floating-ui, safe to pass during render */}\n      {renderTrigger({\n        ref: refs.setReference,\n        getInteractionProps: getReferenceProps,\n      })}\n      {/* eslint-enable react-hooks/refs */}\n\n      <FloatingPortal>\n        <ThemeProvider theme=\"personal\" screenMode={theme === 'personal' ? screenMode : 'light'}>\n          <Transition\n            as=\"div\"\n            show={open}\n            leave=\"transition-opacity\"\n            leaveTo=\"opacity-0\"\n            beforeEnter={() => {\n              setFloatingKey((prev) => prev + 1);\n            }}\n            afterLeave={onCloseEnd}\n          >\n            <FocusScope>\n              <FloatingFocusManager context={context}>\n                {/* eslint-disable react-hooks/refs -- setFloating is a callback ref from floating-ui, safe to pass during render */}\n                <div\n                  key={floatingKey} // Force inner state invalidation on open\n                  ref={refs.setFloating}\n                  className={clsx('np-popover-v2-container', {\n                    'np-popover-v2-container--size-md': size === 'md',\n                    'np-popover-v2-container--size-lg': size === 'lg',\n                  })}\n                  style={floatingStyles}\n                  {...getFloatingProps()}\n                >\n                  {/* eslint-enable react-hooks/refs */}\n                  <div\n                    className={clsx('np-popover-v2', title && 'np-popover-v2--has-title', {\n                      'np-popover-v2--padding-md': padding === 'md',\n                    })}\n                  >\n                    {title ? (\n                      <h2 className=\"np-popover-v2-title wds-text-title-body\">{title}</h2>\n                    ) : null}\n                    <div className=\"np-popover-v2-content wds-text-body-default\">{children}</div>\n                  </div>\n                </div>\n              </FloatingFocusManager>\n            </FocusScope>\n          </Transition>\n        </ThemeProvider>\n      </FloatingPortal>\n    </>\n  );\n}\n"],"names":["FLOATING_PADDING","SelectInputPopover","placement","open","renderTrigger","title","size","padding","children","onClose","onCloseEnd","refs","floatingStyles","context","useFloating","strategy","middleware","offset","flip","crossAxis","shift","floatingSize","apply","elements","rects","availableHeight","floating","style","setProperty","reference","width","whileElementsMounted","autoUpdate","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","leave","leaveTo","beforeEnter","prev","afterLeave","FocusScope","FloatingFocusManager","setFloating","className","clsx"],"mappings":"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"}

package/build/Label/Label.js

@@ -19,7 +19,7 @@ const Label = /*#__PURE__*/React.forwardRef(({
     ref: ref,
     id: id,
     htmlFor: htmlFor,
-    className: clsx.clsx('np-label d-flex flex-column np-text-body-default-bold text-primary m-b-0', className),
+    className: clsx.clsx('np-label d-flex flex-column wds-text-body-default-bold text-primary m-b-0', className),
     children: children
   });
 });

package/build/Label/Label.js.map

@@ -1 +1 @@
-{"version":3,"file":"Label.js","sources":["../../src/Label/Label.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport messages from './Label.messages';\nimport { useIntl } from 'react-intl';\nimport Body from '../Body';\nimport { CommonProps } from '../common';\nimport { forwardRef, PropsWithChildren } from 'react';\n\nexport type LabelProps = {\n  id?: string;\n  htmlFor?: string;\n  className?: string;\n  children?: React.ReactNode;\n};\n\n/**\n * Avoid using `<Label>` component directly\n * it's for edge cases when `<Field />` isn't suitable for some reasons.\n *\n * Example:\n * ```\n * <Field label={..} description={..} required={..}>..</Field>\n * ```\n */\nconst Label = forwardRef<HTMLLabelElement, LabelProps>(\n  ({ className, children, htmlFor, id }: LabelProps, ref) => {\n    return (\n      <label\n        ref={ref}\n        id={id}\n        htmlFor={htmlFor}\n        className={clsx(\n          'np-label d-flex flex-column np-text-body-default-bold text-primary m-b-0',\n          className,\n        )}\n      >\n        {children}\n      </label>\n    );\n  },\n);\n\nexport type LabelOptionalProps = PropsWithChildren<CommonProps>;\n\nconst Optional = function Optional({ children, className }: LabelOptionalProps) {\n  const { formatMessage } = useIntl();\n  return (\n    <div>\n      {children}\n      <Body as=\"span\" className={clsx('text-secondary', 'm-l-1', className)}>\n        {formatMessage(messages.optionalLabel)}\n      </Body>\n    </div>\n  );\n};\n\nexport type LabelDescriptionProps = PropsWithChildren<CommonProps> & { id?: string };\n\nconst Description = function Description({ id, children, className }: LabelDescriptionProps) {\n  return children ? (\n    <Body id={id} className={clsx('text-secondary', className)}>\n      {children}\n    </Body>\n  ) : null;\n};\n\n// eslint-disable-next-line functional/immutable-data\nconst LabelNamespace = Object.assign(Label, { Optional, Description });\n\nLabelNamespace.displayName = 'Label';\nexport default LabelNamespace;\n"],"names":["Label","forwardRef","className","children","htmlFor","id","ref","_jsx","clsx","Optional","formatMessage","useIntl","_jsxs","Body","as","messages","optionalLabel","Description","LabelNamespace","Object","assign","displayName"],"mappings":";;;;;;;;;;;AAuBA,MAAMA,KAAK,gBAAGC,gBAAU,CACtB,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA;CAAgB,EAAEC,GAAG,KAAI;AACxD,EAAA,oBACEC,cAAA,CAAA,OAAA,EAAA;AACED,IAAAA,GAAG,EAAEA,GAAI;AACTD,IAAAA,EAAE,EAAEA,EAAG;AACPD,IAAAA,OAAO,EAAEA,OAAQ;AACjBF,IAAAA,SAAS,EAAEM,SAAI,CACb,0EAA0E,EAC1EN,SAAS,CACT;AAAAC,IAAAA,QAAA,EAEDA;AAAQ,GACJ,CAAC;AAEZ,CAAC,CACF;AAID,MAAMM,QAAQ,GAAG,SAASA,QAAQA,CAAC;EAAEN,QAAQ;AAAED,EAAAA;AAAS,CAAsB,EAAA;EAC5E,MAAM;AAAEQ,IAAAA;GAAe,GAAGC,iBAAO,EAAE;AACnC,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAAT,IAAAA,QAAA,EAAA,CACGA,QAAQ,eACTI,cAAA,CAACM,YAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACZ,SAAS,EAAEM,SAAI,CAAC,gBAAgB,EAAE,OAAO,EAAEN,SAAS,CAAE;AAAAC,MAAAA,QAAA,EACnEO,aAAa,CAACK,sBAAQ,CAACC,aAAa;AAAC,KAClC,CACR;AAAA,GAAK,CAAC;AAEV,CAAC;AAID,MAAMC,WAAW,GAAG,SAASA,WAAWA,CAAC;EAAEZ,EAAE;EAAEF,QAAQ;AAAED,EAAAA;AAAS,CAAyB,EAAA;AACzF,EAAA,OAAOC,QAAQ,gBACbI,cAAA,CAACM,YAAI,EAAA;AAACR,IAAAA,EAAE,EAAEA,EAAG;AAACH,IAAAA,SAAS,EAAEM,SAAI,CAAC,gBAAgB,EAAEN,SAAS,CAAE;AAAAC,IAAAA,QAAA,EACxDA;GACG,CAAC,GACL,IAAI;AACV,CAAC;AAED;AACA,MAAMe,cAAc,GAAGC,MAAM,CAACC,MAAM,CAACpB,KAAK,EAAE;EAAES,QAAQ;AAAEQ,EAAAA;AAAW,CAAE;AAErEC,cAAc,CAACG,WAAW,GAAG,OAAO;;"}
+{"version":3,"file":"Label.js","sources":["../../src/Label/Label.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport messages from './Label.messages';\nimport { useIntl } from 'react-intl';\nimport Body from '../Body';\nimport { CommonProps } from '../common';\nimport { forwardRef, PropsWithChildren } from 'react';\n\nexport type LabelProps = {\n  id?: string;\n  htmlFor?: string;\n  className?: string;\n  children?: React.ReactNode;\n};\n\n/**\n * Avoid using `<Label>` component directly\n * it's for edge cases when `<Field />` isn't suitable for some reasons.\n *\n * Example:\n * ```\n * <Field label={..} description={..} required={..}>..</Field>\n * ```\n */\nconst Label = forwardRef<HTMLLabelElement, LabelProps>(\n  ({ className, children, htmlFor, id }: LabelProps, ref) => {\n    return (\n      <label\n        ref={ref}\n        id={id}\n        htmlFor={htmlFor}\n        className={clsx(\n          'np-label d-flex flex-column wds-text-body-default-bold text-primary m-b-0',\n          className,\n        )}\n      >\n        {children}\n      </label>\n    );\n  },\n);\n\nexport type LabelOptionalProps = PropsWithChildren<CommonProps>;\n\nconst Optional = function Optional({ children, className }: LabelOptionalProps) {\n  const { formatMessage } = useIntl();\n  return (\n    <div>\n      {children}\n      <Body as=\"span\" className={clsx('text-secondary', 'm-l-1', className)}>\n        {formatMessage(messages.optionalLabel)}\n      </Body>\n    </div>\n  );\n};\n\nexport type LabelDescriptionProps = PropsWithChildren<CommonProps> & { id?: string };\n\nconst Description = function Description({ id, children, className }: LabelDescriptionProps) {\n  return children ? (\n    <Body id={id} className={clsx('text-secondary', className)}>\n      {children}\n    </Body>\n  ) : null;\n};\n\n// eslint-disable-next-line functional/immutable-data\nconst LabelNamespace = Object.assign(Label, { Optional, Description });\n\nLabelNamespace.displayName = 'Label';\nexport default LabelNamespace;\n"],"names":["Label","forwardRef","className","children","htmlFor","id","ref","_jsx","clsx","Optional","formatMessage","useIntl","_jsxs","Body","as","messages","optionalLabel","Description","LabelNamespace","Object","assign","displayName"],"mappings":";;;;;;;;;;;AAuBA,MAAMA,KAAK,gBAAGC,gBAAU,CACtB,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA;CAAgB,EAAEC,GAAG,KAAI;AACxD,EAAA,oBACEC,cAAA,CAAA,OAAA,EAAA;AACED,IAAAA,GAAG,EAAEA,GAAI;AACTD,IAAAA,EAAE,EAAEA,EAAG;AACPD,IAAAA,OAAO,EAAEA,OAAQ;AACjBF,IAAAA,SAAS,EAAEM,SAAI,CACb,2EAA2E,EAC3EN,SAAS,CACT;AAAAC,IAAAA,QAAA,EAEDA;AAAQ,GACJ,CAAC;AAEZ,CAAC,CACF;AAID,MAAMM,QAAQ,GAAG,SAASA,QAAQA,CAAC;EAAEN,QAAQ;AAAED,EAAAA;AAAS,CAAsB,EAAA;EAC5E,MAAM;AAAEQ,IAAAA;GAAe,GAAGC,iBAAO,EAAE;AACnC,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAAT,IAAAA,QAAA,EAAA,CACGA,QAAQ,eACTI,cAAA,CAACM,YAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACZ,SAAS,EAAEM,SAAI,CAAC,gBAAgB,EAAE,OAAO,EAAEN,SAAS,CAAE;AAAAC,MAAAA,QAAA,EACnEO,aAAa,CAACK,sBAAQ,CAACC,aAAa;AAAC,KAClC,CACR;AAAA,GAAK,CAAC;AAEV,CAAC;AAID,MAAMC,WAAW,GAAG,SAASA,WAAWA,CAAC;EAAEZ,EAAE;EAAEF,QAAQ;AAAED,EAAAA;AAAS,CAAyB,EAAA;AACzF,EAAA,OAAOC,QAAQ,gBACbI,cAAA,CAACM,YAAI,EAAA;AAACR,IAAAA,EAAE,EAAEA,EAAG;AAACH,IAAAA,SAAS,EAAEM,SAAI,CAAC,gBAAgB,EAAEN,SAAS,CAAE;AAAAC,IAAAA,QAAA,EACxDA;GACG,CAAC,GACL,IAAI;AACV,CAAC;AAED;AACA,MAAMe,cAAc,GAAGC,MAAM,CAACC,MAAM,CAACpB,KAAK,EAAE;EAAES,QAAQ;AAAEQ,EAAAA;AAAW,CAAE;AAErEC,cAAc,CAACG,WAAW,GAAG,OAAO;;"}

package/build/Label/Label.mjs

@@ -15,7 +15,7 @@ const Label = /*#__PURE__*/forwardRef(({
     ref: ref,
     id: id,
     htmlFor: htmlFor,
-    className: clsx('np-label d-flex flex-column np-text-body-default-bold text-primary m-b-0', className),
+    className: clsx('np-label d-flex flex-column wds-text-body-default-bold text-primary m-b-0', className),
     children: children
   });
 });

package/build/Label/Label.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Label.mjs","sources":["../../src/Label/Label.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport messages from './Label.messages';\nimport { useIntl } from 'react-intl';\nimport Body from '../Body';\nimport { CommonProps } from '../common';\nimport { forwardRef, PropsWithChildren } from 'react';\n\nexport type LabelProps = {\n  id?: string;\n  htmlFor?: string;\n  className?: string;\n  children?: React.ReactNode;\n};\n\n/**\n * Avoid using `<Label>` component directly\n * it's for edge cases when `<Field />` isn't suitable for some reasons.\n *\n * Example:\n * ```\n * <Field label={..} description={..} required={..}>..</Field>\n * ```\n */\nconst Label = forwardRef<HTMLLabelElement, LabelProps>(\n  ({ className, children, htmlFor, id }: LabelProps, ref) => {\n    return (\n      <label\n        ref={ref}\n        id={id}\n        htmlFor={htmlFor}\n        className={clsx(\n          'np-label d-flex flex-column np-text-body-default-bold text-primary m-b-0',\n          className,\n        )}\n      >\n        {children}\n      </label>\n    );\n  },\n);\n\nexport type LabelOptionalProps = PropsWithChildren<CommonProps>;\n\nconst Optional = function Optional({ children, className }: LabelOptionalProps) {\n  const { formatMessage } = useIntl();\n  return (\n    <div>\n      {children}\n      <Body as=\"span\" className={clsx('text-secondary', 'm-l-1', className)}>\n        {formatMessage(messages.optionalLabel)}\n      </Body>\n    </div>\n  );\n};\n\nexport type LabelDescriptionProps = PropsWithChildren<CommonProps> & { id?: string };\n\nconst Description = function Description({ id, children, className }: LabelDescriptionProps) {\n  return children ? (\n    <Body id={id} className={clsx('text-secondary', className)}>\n      {children}\n    </Body>\n  ) : null;\n};\n\n// eslint-disable-next-line functional/immutable-data\nconst LabelNamespace = Object.assign(Label, { Optional, Description });\n\nLabelNamespace.displayName = 'Label';\nexport default LabelNamespace;\n"],"names":["Label","forwardRef","className","children","htmlFor","id","ref","_jsx","clsx","Optional","formatMessage","useIntl","_jsxs","Body","as","messages","optionalLabel","Description","LabelNamespace","Object","assign","displayName"],"mappings":";;;;;;;AAuBA,MAAMA,KAAK,gBAAGC,UAAU,CACtB,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA;CAAgB,EAAEC,GAAG,KAAI;AACxD,EAAA,oBACEC,GAAA,CAAA,OAAA,EAAA;AACED,IAAAA,GAAG,EAAEA,GAAI;AACTD,IAAAA,EAAE,EAAEA,EAAG;AACPD,IAAAA,OAAO,EAAEA,OAAQ;AACjBF,IAAAA,SAAS,EAAEM,IAAI,CACb,0EAA0E,EAC1EN,SAAS,CACT;AAAAC,IAAAA,QAAA,EAEDA;AAAQ,GACJ,CAAC;AAEZ,CAAC,CACF;AAID,MAAMM,QAAQ,GAAG,SAASA,QAAQA,CAAC;EAAEN,QAAQ;AAAED,EAAAA;AAAS,CAAsB,EAAA;EAC5E,MAAM;AAAEQ,IAAAA;GAAe,GAAGC,OAAO,EAAE;AACnC,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AAAAT,IAAAA,QAAA,EAAA,CACGA,QAAQ,eACTI,GAAA,CAACM,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACZ,SAAS,EAAEM,IAAI,CAAC,gBAAgB,EAAE,OAAO,EAAEN,SAAS,CAAE;AAAAC,MAAAA,QAAA,EACnEO,aAAa,CAACK,QAAQ,CAACC,aAAa;AAAC,KAClC,CACR;AAAA,GAAK,CAAC;AAEV,CAAC;AAID,MAAMC,WAAW,GAAG,SAASA,WAAWA,CAAC;EAAEZ,EAAE;EAAEF,QAAQ;AAAED,EAAAA;AAAS,CAAyB,EAAA;AACzF,EAAA,OAAOC,QAAQ,gBACbI,GAAA,CAACM,IAAI,EAAA;AAACR,IAAAA,EAAE,EAAEA,EAAG;AAACH,IAAAA,SAAS,EAAEM,IAAI,CAAC,gBAAgB,EAAEN,SAAS,CAAE;AAAAC,IAAAA,QAAA,EACxDA;GACG,CAAC,GACL,IAAI;AACV,CAAC;AAED;AACA,MAAMe,cAAc,GAAGC,MAAM,CAACC,MAAM,CAACpB,KAAK,EAAE;EAAES,QAAQ;AAAEQ,EAAAA;AAAW,CAAE;AAErEC,cAAc,CAACG,WAAW,GAAG,OAAO;;"}
+{"version":3,"file":"Label.mjs","sources":["../../src/Label/Label.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport messages from './Label.messages';\nimport { useIntl } from 'react-intl';\nimport Body from '../Body';\nimport { CommonProps } from '../common';\nimport { forwardRef, PropsWithChildren } from 'react';\n\nexport type LabelProps = {\n  id?: string;\n  htmlFor?: string;\n  className?: string;\n  children?: React.ReactNode;\n};\n\n/**\n * Avoid using `<Label>` component directly\n * it's for edge cases when `<Field />` isn't suitable for some reasons.\n *\n * Example:\n * ```\n * <Field label={..} description={..} required={..}>..</Field>\n * ```\n */\nconst Label = forwardRef<HTMLLabelElement, LabelProps>(\n  ({ className, children, htmlFor, id }: LabelProps, ref) => {\n    return (\n      <label\n        ref={ref}\n        id={id}\n        htmlFor={htmlFor}\n        className={clsx(\n          'np-label d-flex flex-column wds-text-body-default-bold text-primary m-b-0',\n          className,\n        )}\n      >\n        {children}\n      </label>\n    );\n  },\n);\n\nexport type LabelOptionalProps = PropsWithChildren<CommonProps>;\n\nconst Optional = function Optional({ children, className }: LabelOptionalProps) {\n  const { formatMessage } = useIntl();\n  return (\n    <div>\n      {children}\n      <Body as=\"span\" className={clsx('text-secondary', 'm-l-1', className)}>\n        {formatMessage(messages.optionalLabel)}\n      </Body>\n    </div>\n  );\n};\n\nexport type LabelDescriptionProps = PropsWithChildren<CommonProps> & { id?: string };\n\nconst Description = function Description({ id, children, className }: LabelDescriptionProps) {\n  return children ? (\n    <Body id={id} className={clsx('text-secondary', className)}>\n      {children}\n    </Body>\n  ) : null;\n};\n\n// eslint-disable-next-line functional/immutable-data\nconst LabelNamespace = Object.assign(Label, { Optional, Description });\n\nLabelNamespace.displayName = 'Label';\nexport default LabelNamespace;\n"],"names":["Label","forwardRef","className","children","htmlFor","id","ref","_jsx","clsx","Optional","formatMessage","useIntl","_jsxs","Body","as","messages","optionalLabel","Description","LabelNamespace","Object","assign","displayName"],"mappings":";;;;;;;AAuBA,MAAMA,KAAK,gBAAGC,UAAU,CACtB,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,OAAO;AAAEC,EAAAA;CAAgB,EAAEC,GAAG,KAAI;AACxD,EAAA,oBACEC,GAAA,CAAA,OAAA,EAAA;AACED,IAAAA,GAAG,EAAEA,GAAI;AACTD,IAAAA,EAAE,EAAEA,EAAG;AACPD,IAAAA,OAAO,EAAEA,OAAQ;AACjBF,IAAAA,SAAS,EAAEM,IAAI,CACb,2EAA2E,EAC3EN,SAAS,CACT;AAAAC,IAAAA,QAAA,EAEDA;AAAQ,GACJ,CAAC;AAEZ,CAAC,CACF;AAID,MAAMM,QAAQ,GAAG,SAASA,QAAQA,CAAC;EAAEN,QAAQ;AAAED,EAAAA;AAAS,CAAsB,EAAA;EAC5E,MAAM;AAAEQ,IAAAA;GAAe,GAAGC,OAAO,EAAE;AACnC,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AAAAT,IAAAA,QAAA,EAAA,CACGA,QAAQ,eACTI,GAAA,CAACM,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACZ,SAAS,EAAEM,IAAI,CAAC,gBAAgB,EAAE,OAAO,EAAEN,SAAS,CAAE;AAAAC,MAAAA,QAAA,EACnEO,aAAa,CAACK,QAAQ,CAACC,aAAa;AAAC,KAClC,CACR;AAAA,GAAK,CAAC;AAEV,CAAC;AAID,MAAMC,WAAW,GAAG,SAASA,WAAWA,CAAC;EAAEZ,EAAE;EAAEF,QAAQ;AAAED,EAAAA;AAAS,CAAyB,EAAA;AACzF,EAAA,OAAOC,QAAQ,gBACbI,GAAA,CAACM,IAAI,EAAA;AAACR,IAAAA,EAAE,EAAEA,EAAG;AAACH,IAAAA,SAAS,EAAEM,IAAI,CAAC,gBAAgB,EAAEN,SAAS,CAAE;AAAAC,IAAAA,QAAA,EACxDA;GACG,CAAC,GACL,IAAI;AACV,CAAC;AAED;AACA,MAAMe,cAAc,GAAGC,MAAM,CAACC,MAAM,CAACpB,KAAK,EAAE;EAAES,QAAQ;AAAEQ,EAAAA;AAAW,CAAE;AAErEC,cAAc,CAACG,WAAW,GAAG,OAAO;;"}